react-intlayer 8.0.0-canary.2 → 8.0.0-canary.4

package/dist/cjs/html/HTMLProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HTMLProvider.cjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\n\ntype HTMLContextValue = {\n  components?: Record<string, any>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n  /**\n   * Component overrides for HTML tags.\n   */\n  components?: Record<string, any>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n  children,\n  components,\n}) => (\n  <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":";;;;;;;AAoBA,MAAM,uCAA0D,OAAU;AAE1E,MAAa,6CAAkC,YAAY;AAE3D,MAAa,gBAAuC,EAClD,UACA,iBAEA,2CAAC,YAAY;CAAS,OAAO,EAAE,YAAY;CAAG;EAAgC"}
+{"version":3,"file":"HTMLProvider.cjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\n\ntype HTMLContextValue = {\n  components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n  /**\n   * Component overrides for HTML tags.\n   */\n  components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n  children,\n  components,\n}) => (\n  <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":";;;;;;;AAqBA,MAAM,uCAA0D,OAAU;AAE1E,MAAa,6CAAkC,YAAY;AAE3D,MAAa,gBAAuC,EAClD,UACA,iBAEA,2CAAC,YAAY;CAAS,OAAO,EAAE,YAAY;CAAG;EAAgC"}

package/dist/cjs/html/HTMLRenderer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HTMLRenderer.cjs","names":["HTML_TAGS","Fragment","useHTMLContext"],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML, HTML_TAGS } from '@intlayer/core';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport { useHTMLContext } from './HTMLProvider';\nimport type { ReactHTMLComponent } from './types';\n\n/**\n * Type for React HTML tag components.\n */\ntype HTMLTagComponent = ReactHTMLComponent;\n\nconst createDefaultHTMLComponents = (): Record<string, HTMLTagComponent> => {\n  const components: Record<string, HTMLTagComponent> = {};\n\n  for (const tag of HTML_TAGS) {\n    components[tag] = ({ children, ...props }) =>\n      createElement(tag, props, children);\n  }\n\n  return components;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   */\n  components?: Record<string, any>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n  content: string,\n  { components }: RenderHTMLProps = {}\n): JSX.Element => {\n  const mergedComponents = {\n    ...defaultHTMLComponents,\n    ...components,\n  };\n\n  // Wrap all components to ensure they are rendered via React.createElement\n  const wrappedComponents = Object.fromEntries(\n    Object.entries(mergedComponents)\n      .filter(([, Component]) => Component)\n      .map(([key, Component]) => [\n        key,\n        (props: any) => createElement(Component as any, props),\n      ])\n  );\n\n  return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n  const context = useHTMLContext();\n\n  return (content: string) => {\n    return renderHTML(content, {\n      components: {\n        ...context?.components,\n        ...components,\n      },\n    });\n  };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n  /**\n   * The HTML content to render as a string.\n   */\n  children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n  children = '',\n  components,\n}) => {\n  const render = useHTMLRenderer({ components });\n\n  return render(children);\n};\n"],"mappings":";;;;;;;;;AAYA,MAAM,oCAAsE;CAC1E,MAAM,aAA+C,EAAE;AAEvD,MAAK,MAAM,OAAOA,yBAChB,YAAW,QAAQ,EAAE,UAAU,GAAG,qCAClB,KAAK,OAAO,SAAS;AAGvC,QAAO;;AAGT,MAAa,wBAAwB,6BAA6B;;;;;;;AAgBlE,MAAa,cACX,SACA,EAAE,eAAgC,EAAE,KACpB;CAChB,MAAM,mBAAmB;EACvB,GAAG;EACH,GAAG;EACJ;AAYD,QAAO,2CAACC,wDAAkB,SATA,OAAO,YAC/B,OAAO,QAAQ,iBAAiB,CAC7B,QAAQ,GAAG,eAAe,UAAU,CACpC,KAAK,CAAC,KAAK,eAAe,CACzB,MACC,mCAA6B,WAAkB,MAAM,CACvD,CAAC,CACL,CAEoD,GAAY;;;;;;;;AASnE,MAAa,mBAAmB,EAAE,eAAgC,EAAE,KAAK;CACvE,MAAM,UAAUC,0CAAgB;AAEhC,SAAQ,YAAoB;AAC1B,SAAO,WAAW,SAAS,EACzB,YAAY;GACV,GAAG,SAAS;GACZ,GAAG;GACJ,EACF,CAAC;;;;;;;;;AAiBN,MAAa,gBAAuC,EAClD,WAAW,IACX,iBACI;AAGJ,QAFe,gBAAgB,EAAE,YAAY,CAAC,CAEhC,SAAS"}
+{"version":3,"file":"HTMLRenderer.cjs","names":["HTML_TAGS","Fragment","useHTMLContext"],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML, HTML_TAGS } from '@intlayer/core';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n  const components: HTMLComponents = {};\n\n  for (const tag of HTML_TAGS) {\n    components[tag] = ({ children, ...props }) =>\n      createElement(tag, props as any, children);\n  }\n\n  return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   */\n  components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n  content: string,\n  { components }: RenderHTMLProps = {}\n): JSX.Element => {\n  const mergedComponents = {\n    ...defaultHTMLComponents,\n    ...components,\n  };\n\n  // Wrap all components to ensure they are rendered via React.createElement\n  const wrappedComponents = Object.fromEntries(\n    Object.entries(mergedComponents)\n      .filter(([, Component]) => Component)\n      .map(([key, Component]) => [\n        key,\n        (props: any) => createElement(Component as any, props),\n      ])\n  );\n\n  return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n  const context = useHTMLContext();\n\n  return (content: string) => {\n    return renderHTML(content, {\n      components: {\n        ...context?.components,\n        ...components,\n      },\n    });\n  };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n  /**\n   * The HTML content to render as a string.\n   */\n  children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n  children = '',\n  components,\n}) => {\n  const render = useHTMLRenderer({ components });\n\n  return render(children);\n};\n"],"mappings":";;;;;;;;;AAOA,MAAM,oCAAsE;CAC1E,MAAM,aAA6B,EAAE;AAErC,MAAK,MAAM,OAAOA,yBAChB,YAAW,QAAQ,EAAE,UAAU,GAAG,qCAClB,KAAK,OAAc,SAAS;AAG9C,QAAO;;AAGT,MAAa,wBAAwB,6BAA6B;;;;;;;AAgBlE,MAAa,cACX,SACA,EAAE,eAAgC,EAAE,KACpB;CAChB,MAAM,mBAAmB;EACvB,GAAG;EACH,GAAG;EACJ;AAYD,QAAO,2CAACC,wDAAkB,SATA,OAAO,YAC/B,OAAO,QAAQ,iBAAiB,CAC7B,QAAQ,GAAG,eAAe,UAAU,CACpC,KAAK,CAAC,KAAK,eAAe,CACzB,MACC,mCAA6B,WAAkB,MAAM,CACvD,CAAC,CACL,CAEoD,GAAY;;;;;;;;AASnE,MAAa,mBAAmB,EAAE,eAAgC,EAAE,KAAK;CACvE,MAAM,UAAUC,0CAAgB;AAEhC,SAAQ,YAAoB;AAC1B,SAAO,WAAW,SAAS,EACzB,YAAY;GACV,GAAG,SAAS;GACZ,GAAG;GACJ,EACF,CAAC;;;;;;;;;AAiBN,MAAa,gBAAuC,EAClD,WAAW,IACX,iBACI;AAGJ,QAFe,gBAAgB,EAAE,YAAY,CAAC,CAEhC,SAAS"}

package/dist/cjs/markdown/MarkdownProvider.cjs

@@ -8,26 +8,14 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/markdown/MarkdownProvider.tsx
 const MarkdownContext = (0, react.createContext)(void 0);
 const useMarkdownContext = () => (0, react.useContext)(MarkdownContext);
-const isRenderMarkdownOptions = (override) => {
-	return override && typeof override === "object" && ("components" in override || "wrapper" in override || "forceBlock" in override || "forceInline" in override || "preserveFrontmatter" in override || "tagfilter" in override);
-};
-const mergeOptions = (baseOptions, overrides) => {
-	if (!overrides) return baseOptions;
-	if (!isRenderMarkdownOptions(overrides)) return {
-		...baseOptions,
-		components: {
-			...baseOptions.components,
-			...overrides
-		}
-	};
-	const { components: overrideComponents, wrapper, forceBlock, forceInline, preserveFrontmatter, tagfilter, ...componentsFromRest } = overrides;
-	const components = overrideComponents || componentsFromRest;
+const mergeOptions = (baseOptions, options = {}, components = {}, wrapper) => {
 	return {
 		...baseOptions,
-		forceBlock: forceBlock ?? baseOptions.forceBlock,
-		forceInline: forceInline ?? baseOptions.forceInline,
-		preserveFrontmatter: preserveFrontmatter ?? baseOptions.preserveFrontmatter,
-		tagfilter: tagfilter ?? baseOptions.tagfilter,
+		...options,
+		forceBlock: options.forceBlock ?? baseOptions.forceBlock,
+		forceInline: options.forceInline ?? baseOptions.forceInline,
+		preserveFrontmatter: options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,
+		tagfilter: options.tagfilter ?? baseOptions.tagfilter,
 		wrapper: wrapper || baseOptions.wrapper,
 		forceWrapper: !!(wrapper || baseOptions.wrapper),
 		components: {
@@ -70,12 +58,12 @@ const MarkdownProvider = ({ children, components, wrapper, forceBlock, forceInli
 		preserveFrontmatter,
 		tagfilter
 	};
-	const defaultRenderMarkdown = (markdown, overrides) => {
-		return require_markdown_processor.compiler(markdown, mergeOptions(baseOptions, overrides));
+	const defaultRenderMarkdown = (markdown, options, components, wrapper) => {
+		return require_markdown_processor.compiler(markdown, mergeOptions(baseOptions, options, components, wrapper));
 	};
-	const customRenderMarkdownWrapper = (markdown, overrides) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkdownContext.Provider, {
+	const customRenderMarkdownWrapper = (markdown, options, components, wrapper) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkdownContext.Provider, {
 		value: void 0,
-		children: customRenderFn?.(markdown, overrides)
+		children: customRenderFn?.(markdown, options, components, wrapper)
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkdownContext.Provider, {
 		value: { renderMarkdown: customRenderFn ? customRenderMarkdownWrapper : defaultRenderMarkdown },

package/dist/cjs/markdown/MarkdownProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownProvider.cjs","names":["compiler"],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport type { Overrides } from '@intlayer/core';\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  type ReactNode,\n  useContext,\n} from 'react';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n  /** Forces the compiler to always output content with a block-level wrapper. */\n  forceBlock?: boolean;\n  /** Forces the compiler to always output content with an inline wrapper. */\n  forceInline?: boolean;\n  /** Whether to preserve frontmatter in the markdown content. */\n  preserveFrontmatter?: boolean;\n  /** Whether to use the GitHub Tag Filter for security. */\n  tagfilter?: boolean;\n};\n\ntype RenderMarkdownOptions = MarkdownProviderOptions & {\n  components?: Overrides;\n  wrapper?: FC<any>;\n};\n\ntype MarkdownContextValue = {\n  renderMarkdown: (\n    markdown: string,\n    components?: Overrides | RenderMarkdownOptions\n  ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n  MarkdownProviderOptions & {\n    components?: Overrides;\n    wrapper?: any;\n    renderMarkdown?: (\n      markdown: string,\n      overrides?: Overrides | RenderMarkdownOptions\n    ) => ReactNode;\n  }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n  undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\n// Pure functions defined outside the component are easier for React Compiler to track\n// and don't need to be recreated on every render.\n\nconst isRenderMarkdownOptions = (\n  override: any\n): override is RenderMarkdownOptions => {\n  return (\n    override &&\n    typeof override === 'object' &&\n    ('components' in override ||\n      'wrapper' in override ||\n      'forceBlock' in override ||\n      'forceInline' in override ||\n      'preserveFrontmatter' in override ||\n      'tagfilter' in override)\n  );\n};\n\nconst mergeOptions = (\n  baseOptions: MarkdownRendererOptions,\n  overrides?: Overrides | RenderMarkdownOptions\n): MarkdownRendererOptions => {\n  if (!overrides) return baseOptions;\n\n  if (!isRenderMarkdownOptions(overrides)) {\n    // Overrides is just a component map\n    return {\n      ...baseOptions,\n      components: { ...baseOptions.components, ...overrides },\n    };\n  }\n\n  // Overrides is a full options object\n  const {\n    components: overrideComponents,\n    wrapper,\n    forceBlock,\n    forceInline,\n    preserveFrontmatter,\n    tagfilter,\n    ...componentsFromRest\n  } = overrides;\n\n  const components = overrideComponents || componentsFromRest;\n\n  return {\n    ...baseOptions,\n    forceBlock: forceBlock ?? baseOptions.forceBlock,\n    forceInline: forceInline ?? baseOptions.forceInline,\n    preserveFrontmatter: preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n    tagfilter: tagfilter ?? baseOptions.tagfilter,\n    wrapper: wrapper || baseOptions.wrapper,\n\n    forceWrapper: !!(wrapper || baseOptions.wrapper),\n    components: { ...baseOptions.components, ...components },\n  };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n *   <div>\n *     {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n *   </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n *   <MarkdownRenderer>\n *     {markdownContent}\n *   </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n  children,\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown: customRenderFn,\n}) => {\n  const baseOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  // Standard internal renderer\n  const defaultRenderMarkdown = (\n    markdown: string,\n    overrides?: Overrides | RenderMarkdownOptions\n  ) => {\n    const mergedOptions = mergeOptions(baseOptions, overrides);\n    return compiler(markdown, mergedOptions);\n  };\n\n  // Wrapper for user-provided custom renderer\n  // Note: We wrap in a clean Provider to prevent infinite recursion\n  const customRenderMarkdownWrapper = (\n    markdown: string,\n    overrides?: Overrides | RenderMarkdownOptions\n  ) => (\n    <MarkdownContext.Provider value={undefined}>\n      {customRenderFn?.(markdown, overrides)}\n    </MarkdownContext.Provider>\n  );\n\n  return (\n    <MarkdownContext.Provider\n      value={{\n        renderMarkdown: customRenderFn\n          ? customRenderMarkdownWrapper\n          : defaultRenderMarkdown,\n      }}\n    >\n      {children}\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;AA8CA,MAAM,2CACJ,OACD;AAED,MAAa,iDAAsC,gBAAgB;AAKnE,MAAM,2BACJ,aACsC;AACtC,QACE,YACA,OAAO,aAAa,aACnB,gBAAgB,YACf,aAAa,YACb,gBAAgB,YAChB,iBAAiB,YACjB,yBAAyB,YACzB,eAAe;;AAIrB,MAAM,gBACJ,aACA,cAC4B;AAC5B,KAAI,CAAC,UAAW,QAAO;AAEvB,KAAI,CAAC,wBAAwB,UAAU,CAErC,QAAO;EACL,GAAG;EACH,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAW;EACxD;CAIH,MAAM,EACJ,YAAY,oBACZ,SACA,YACA,aACA,qBACA,WACA,GAAG,uBACD;CAEJ,MAAM,aAAa,sBAAsB;AAEzC,QAAO;EACL,GAAG;EACH,YAAY,cAAc,YAAY;EACtC,aAAa,eAAe,YAAY;EACxC,qBAAqB,uBAAuB,YAAY;EACxD,WAAW,aAAa,YAAY;EACpC,SAAS,WAAW,YAAY;EAEhC,cAAc,CAAC,EAAE,WAAW,YAAY;EACxC,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAY;EACzD;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BH,MAAa,oBAA+C,EAC1D,UACA,YACA,SACA,YACA,aACA,qBACA,WACA,gBAAgB,qBACZ;CACJ,MAAM,cAAuC;EAC3C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD;CAGD,MAAM,yBACJ,UACA,cACG;AAEH,SAAOA,oCAAS,UADM,aAAa,aAAa,UAAU,CAClB;;CAK1C,MAAM,+BACJ,UACA,cAEA,2CAAC,gBAAgB;EAAS,OAAO;YAC9B,iBAAiB,UAAU,UAAU;GACb;AAG7B,QACE,2CAAC,gBAAgB;EACf,OAAO,EACL,gBAAgB,iBACZ,8BACA,uBACL;EAEA;GACwB"}
+{"version":3,"file":"MarkdownProvider.cjs","names":["compiler"],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type HTMLAttributes,\n  type PropsWithChildren,\n  type ReactNode,\n  useContext,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n  /** Forces the compiler to always output content with a block-level wrapper. */\n  forceBlock?: boolean;\n  /** Forces the compiler to always output content with an inline wrapper. */\n  forceInline?: boolean;\n  /** Whether to preserve frontmatter in the markdown content. */\n  preserveFrontmatter?: boolean;\n  /** Whether to use the GitHub Tag Filter for security. */\n  tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n  renderMarkdown: (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n  MarkdownProviderOptions & {\n    components?: HTMLComponents<'permissive', {}>;\n    wrapper?: FC<HTMLAttributes<HTMLElement>>;\n    renderMarkdown?: (\n      markdown: string,\n      options?: MarkdownProviderOptions,\n      components?: HTMLComponents<'permissive', {}>,\n      wrapper?: FC<HTMLAttributes<HTMLElement>>\n    ) => ReactNode;\n  }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n  undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n  baseOptions: MarkdownRendererOptions,\n  options: MarkdownProviderOptions = {},\n  components: HTMLComponents<'permissive', {}> = {},\n  wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n  return {\n    ...baseOptions,\n    ...options,\n    forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n    forceInline: options.forceInline ?? baseOptions.forceInline,\n    preserveFrontmatter:\n      options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n    tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n    wrapper: wrapper || baseOptions.wrapper,\n\n    forceWrapper: !!(wrapper || baseOptions.wrapper),\n    components: { ...baseOptions.components, ...components },\n  };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n *   <div>\n *     {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n *   </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n *   <MarkdownRenderer>\n *     {markdownContent}\n *   </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n  children,\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown: customRenderFn,\n}) => {\n  const baseOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  // Standard internal renderer\n  const defaultRenderMarkdown = (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => {\n    const mergedOptions = mergeOptions(\n      baseOptions,\n      options,\n      components,\n      wrapper\n    );\n\n    return compiler(markdown, mergedOptions);\n  };\n\n  // Wrapper for user-provided custom renderer\n  // Note: We wrap in a clean Provider to prevent infinite recursion\n  const customRenderMarkdownWrapper = (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => (\n    <MarkdownContext.Provider value={undefined}>\n      {customRenderFn?.(markdown, options, components, wrapper)}\n    </MarkdownContext.Provider>\n  );\n\n  return (\n    <MarkdownContext.Provider\n      value={{\n        renderMarkdown: customRenderFn\n          ? customRenderMarkdownWrapper\n          : defaultRenderMarkdown,\n      }}\n    >\n      {children}\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;;AA8CA,MAAM,2CACJ,OACD;AAED,MAAa,iDAAsC,gBAAgB;AAEnE,MAAM,gBACJ,aACA,UAAmC,EAAE,EACrC,aAA+C,EAAE,EACjD,YAC4B;AAC5B,QAAO;EACL,GAAG;EACH,GAAG;EACH,YAAY,QAAQ,cAAc,YAAY;EAC9C,aAAa,QAAQ,eAAe,YAAY;EAChD,qBACE,QAAQ,uBAAuB,YAAY;EAC7C,WAAW,QAAQ,aAAa,YAAY;EAC5C,SAAS,WAAW,YAAY;EAEhC,cAAc,CAAC,EAAE,WAAW,YAAY;EACxC,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAY;EACzD;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BH,MAAa,oBAA+C,EAC1D,UACA,YACA,SACA,YACA,aACA,qBACA,WACA,gBAAgB,qBACZ;CACJ,MAAM,cAAuC;EAC3C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD;CAGD,MAAM,yBACJ,UACA,SACA,YACA,YACG;AAQH,SAAOA,oCAAS,UAPM,aACpB,aACA,SACA,YACA,QACD,CAEuC;;CAK1C,MAAM,+BACJ,UACA,SACA,YACA,YAEA,2CAAC,gBAAgB;EAAS,OAAO;YAC9B,iBAAiB,UAAU,SAAS,YAAY,QAAQ;GAChC;AAG7B,QACE,2CAAC,gBAAgB;EACf,OAAO,EACL,gBAAgB,iBACZ,8BACA,uBACL;EAEA;GACwB"}

package/dist/cjs/markdown/MarkdownRenderer.cjs

@@ -89,13 +89,11 @@ const useMarkdownRenderer = ({ components, wrapper, forceBlock, forceInline, pre
 	const context = require_markdown_MarkdownProvider.useMarkdownContext();
 	return (content) => {
 		if (context) return context.renderMarkdown(content, {
-			components,
-			wrapper,
 			forceBlock,
 			forceInline,
 			preserveFrontmatter,
 			tagfilter
-		});
+		}, components, wrapper);
 		return renderMarkdown(content, {
 			components,
 			wrapper,
@@ -178,13 +176,11 @@ const MarkdownRenderer = ({ children = "", components, wrapper, forceBlock, forc
 		tagfilter
 	}) });
 	if (context) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: context.renderMarkdown(children, {
-		components,
-		wrapper,
 		forceBlock,
 		forceInline,
 		preserveFrontmatter,
 		tagfilter
-	}) });
+	}, components, wrapper) });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: require_markdown_processor.compiler(children, {
 		components,
 		forceBlock,

package/dist/cjs/markdown/MarkdownRenderer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownRenderer.cjs","names":["compiler","useMarkdownContext"],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { Overrides } from '@intlayer/core';\nimport type { FC, JSX, ReactNode } from 'react';\nimport {\n  type MarkdownProviderOptions,\n  useMarkdownContext,\n} from './MarkdownProvider';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\n/**\n * Props for rendering markdown content.\n *\n * @example\n * ```tsx\n * const props: RenderMarkdownProps = {\n *   components: {\n *     h1: ({ children }) => <h1 className=\"text-3xl\">{children}</h1>,\n *     p: ({ children }) => <p className=\"text-gray-700\">{children}</p>,\n *   },\n *   wrapper: ({ children }) => <article>{children}</article>,\n *   options: {\n *     forceBlock: true,\n *     preserveFrontmatter: false,\n *     tagfilter: true,\n *   },\n * };\n * ```\n */\nexport type RenderMarkdownProps = MarkdownProviderOptions & {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   * Only used if not wrapped in a MarkdownProvider.\n   *\n   * @example\n   * ```tsx\n   * components={{\n   *   h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n   *   a: ({ href, children }) => <Link to={href}>{children}</Link>,\n   * }}\n   * ```\n   */\n  components?: Overrides;\n  /**\n   * Wrapper element or component to be used when there are multiple children.\n   * Only used if not wrapped in a MarkdownProvider.\n   *\n   * @example\n   * ```tsx\n   * wrapper={({ children }) => <div className=\"markdown-content\">{children}</div>}\n   * ```\n   */\n  wrapper?: FC;\n};\n\n/**\n * Renders markdown content to JSX with the provided components and options.\n *\n * This function does not use context from MarkdownProvider. Use `useMarkdownRenderer`\n * hook if you want to leverage provider context.\n *\n * @param content - The markdown string to render\n * @param props - Configuration options for rendering\n * @param props.components - Component overrides for HTML tags\n * @param props.wrapper - Wrapper component for multiple children\n * @returns JSX element representing the rendered markdown\n *\n * @example\n * ```tsx\n * import { renderMarkdown } from '@intlayer/react-intlayer/markdown';\n *\n * const markdown = '# Hello World\\n\\nThis is **bold** text.';\n * const jsx = renderMarkdown(markdown, {\n *   components: {\n *     h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n *   },\n *   forceBlock: true,\n * });\n * ```\n */\nexport const renderMarkdown = (\n  content: string,\n  {\n    components,\n    wrapper,\n    forceBlock,\n    forceInline,\n    preserveFrontmatter,\n    tagfilter,\n  }: RenderMarkdownProps = {}\n): JSX.Element => {\n  // Map public options to internal processor options\n  const internalOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return compiler(content, internalOptions);\n};\n\n/**\n * Hook that returns a function to render markdown content.\n *\n * This hook considers the configuration from the `MarkdownProvider` context if available,\n * falling back to the provided props or default behavior.\n *\n * @param props - Optional configuration that will override context values\n * @param props.components - Component overrides for HTML tags (overrides context)\n * @param props.wrapper - Wrapper component (overrides context)\n * @returns A function that takes markdown content and returns JSX\n *\n * @example\n * ```tsx\n * import { useMarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n *   const renderMarkdown = useMarkdownRenderer({\n *     components: {\n *       h1: ({ children }) => <h1 className=\"custom\">{children}</h1>,\n *     },\n *   });\n *\n *   return (\n *     <div>\n *       {renderMarkdown('# Hello\\n\\nThis is **markdown**')}\n *     </div>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n *   return (\n *     <MarkdownProvider\n *       components={{ h1: CustomHeading }}\n *       forceBlock={true}\n *     >\n *       <MyComponent />\n *     </MarkdownProvider>\n *   );\n * }\n * ```\n */\nexport const useMarkdownRenderer = ({\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n}: RenderMarkdownProps = {}) => {\n  const context = useMarkdownContext();\n\n  return (content: string) => {\n    if (context) {\n      return context.renderMarkdown(content, {\n        components,\n        wrapper,\n        forceBlock,\n        forceInline,\n        preserveFrontmatter,\n        tagfilter,\n      });\n    }\n\n    return renderMarkdown(content, {\n      components,\n      wrapper,\n      forceBlock,\n      forceInline,\n      preserveFrontmatter,\n      tagfilter,\n    });\n  };\n};\n\n/**\n * Props for the MarkdownRenderer component.\n *\n * @example\n * ```tsx\n * const props: MarkdownRendererProps = {\n *   children: '# Hello World\\n\\nThis is **bold** text.',\n *   components: {\n *     h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n *   },\n *   wrapper: ({ children }) => <article>{children}</article>,\n *   forceBlock: true,\n * };\n * ```\n */\nexport type MarkdownRendererProps = RenderMarkdownProps & {\n  /**\n   * The markdown content to render as a string.\n   *\n   * @example\n   * ```tsx\n   * <MarkdownRenderer>\n   *   {`# Title\\n\\nParagraph with **bold** text.`}\n   * </MarkdownRenderer>\n   * ```\n   */\n  children: string;\n  /**\n   * Custom render function for markdown.\n   * If provided, it will overwrite context and default rendering.\n   *\n   * @param markdown - The markdown string to render\n   * @param options - Optional rendering options\n   * @returns React node representing the rendered markdown\n   *\n   * @example\n   * ```tsx\n   * <MarkdownRenderer\n   *   renderMarkdown={(md, opts) => {\n   *     // Custom rendering logic\n   *     return <div dangerouslySetInnerHTML={{ __html: customParser(md) }} />;\n   *   }}\n   * >\n   *   {markdownContent}\n   * </MarkdownRenderer>\n   * ```\n   */\n  renderMarkdown?: (\n    markdown: string,\n    options?: {\n      components?: Overrides;\n      wrapper?: FC;\n      forceBlock?: boolean;\n      forceInline?: boolean;\n      preserveFrontmatter?: boolean;\n      tagfilter?: boolean;\n    }\n  ) => ReactNode;\n};\n\n/**\n * React component that renders markdown content to JSX.\n *\n * This component uses the `renderMarkdown` function from the `MarkdownProvider` context\n * if available. Otherwise, it falls back to the default compiler with provided components\n * and options. You can also provide a custom `renderMarkdown` function prop to override\n * all rendering behavior.\n *\n * @example\n * ```tsx\n * import { MarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n *   return (\n *     <MarkdownRenderer>\n *       {`# Hello World\n *\n * This is a paragraph with **bold** and *italic* text.\n *\n * - List item 1\n * - List item 2`}\n *     </MarkdownRenderer>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With custom components\n * <MarkdownRenderer\n *   components={{\n *     h1: ({ children }) => <h1 className=\"text-4xl font-bold\">{children}</h1>,\n *     a: ({ href, children }) => (\n *       <a href={href} className=\"text-blue-500 hover:underline\">\n *         {children}\n *       </a>\n *     ),\n *   }}\n *   forceBlock={true}\n * >\n *   {markdownContent}\n * </MarkdownRenderer>\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n *   return (\n *     <MarkdownProvider\n *       components={{ h1: CustomHeading }}\n *       forceBlock={true}\n *     >\n *       <MarkdownRenderer>\n *         {markdownContent}\n *       </MarkdownRenderer>\n *     </MarkdownProvider>\n *   );\n * }\n * ```\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n  children = '',\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown,\n}) => {\n  const context = useMarkdownContext();\n\n  if (renderMarkdown) {\n    return (\n      <>\n        {renderMarkdown(children, {\n          components,\n          wrapper,\n          forceBlock,\n          forceInline,\n          preserveFrontmatter,\n          tagfilter,\n        })}\n      </>\n    );\n  }\n\n  if (context) {\n    return (\n      <>\n        {context.renderMarkdown(children, {\n          components,\n          wrapper,\n          forceBlock,\n          forceInline,\n          preserveFrontmatter,\n          tagfilter,\n        })}\n      </>\n    );\n  }\n\n  // Map public options to internal processor options\n  const internalOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return <>{compiler(children, internalOptions)}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+EA,MAAa,kBACX,SACA,EACE,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KACX;AAYhB,QAAOA,oCAAS,SAViC;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAEwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgD3C,MAAa,uBAAuB,EAClC,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KAAK;CAC9B,MAAM,UAAUC,sDAAoB;AAEpC,SAAQ,YAAoB;AAC1B,MAAI,QACF,QAAO,QAAQ,eAAe,SAAS;GACrC;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;AAGJ,SAAO,eAAe,SAAS;GAC7B;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HN,MAAa,oBAA+C,EAC1D,WAAW,IACX,YACA,SACA,YACA,aACA,qBACA,WACA,qBACI;CACJ,MAAM,UAAUA,sDAAoB;AAEpC,KAAI,eACF,QACE,mFACG,eAAe,UAAU;EACxB;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAIP,KAAI,QACF,QACE,mFACG,QAAQ,eAAe,UAAU;EAChC;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAeP,QAAO,mFAAGD,oCAAS,UAV8B;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAE4C,GAAI"}
+{"version":3,"file":"MarkdownRenderer.cjs","names":["compiler","useMarkdownContext"],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { FC, HTMLAttributes, JSX, ReactNode } from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport {\n  type MarkdownProviderOptions,\n  useMarkdownContext,\n} from './MarkdownProvider';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\n/**\n * Props for rendering markdown content.\n *\n * @example\n * ```tsx\n * const props: RenderMarkdownProps = {\n *   components: {\n *     h1: ({ children }) => <h1 className=\"text-3xl\">{children}</h1>,\n *     p: ({ children }) => <p className=\"text-gray-700\">{children}</p>,\n *   },\n *   wrapper: ({ children }) => <article>{children}</article>,\n *   options: {\n *     forceBlock: true,\n *     preserveFrontmatter: false,\n *     tagfilter: true,\n *   },\n * };\n * ```\n */\nexport type RenderMarkdownProps = MarkdownProviderOptions & {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   * Only used if not wrapped in a MarkdownProvider.\n   *\n   * @example\n   * ```tsx\n   * components={{\n   *   h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n   *   a: ({ href, children }) => <Link to={href}>{children}</Link>,\n   * }}\n   * ```\n   */\n  components?: HTMLComponents<'permissive', {}>;\n  /**\n   * Wrapper element or component to be used when there are multiple children.\n   * Only used if not wrapped in a MarkdownProvider.\n   *\n   * @example\n   * ```tsx\n   * wrapper={({ children }) => <div className=\"markdown-content\">{children}</div>}\n   * ```\n   */\n  wrapper?: FC<HTMLAttributes<HTMLElement>>;\n};\n\n/**\n * Renders markdown content to JSX with the provided components and options.\n *\n * This function does not use context from MarkdownProvider. Use `useMarkdownRenderer`\n * hook if you want to leverage provider context.\n *\n * @param content - The markdown string to render\n * @param props - Configuration options for rendering\n * @param props.components - Component overrides for HTML tags\n * @param props.wrapper - Wrapper component for multiple children\n * @returns JSX element representing the rendered markdown\n *\n * @example\n * ```tsx\n * import { renderMarkdown } from '@intlayer/react-intlayer/markdown';\n *\n * const markdown = '# Hello World\\n\\nThis is **bold** text.';\n * const jsx = renderMarkdown(markdown, {\n *   components: {\n *     h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n *   },\n *   forceBlock: true,\n * });\n * ```\n */\nexport const renderMarkdown = (\n  content: string,\n  {\n    components,\n    wrapper,\n    forceBlock,\n    forceInline,\n    preserveFrontmatter,\n    tagfilter,\n  }: RenderMarkdownProps = {}\n): JSX.Element => {\n  // Map public options to internal processor options\n  const internalOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return compiler(content, internalOptions);\n};\n\n/**\n * Hook that returns a function to render markdown content.\n *\n * This hook considers the configuration from the `MarkdownProvider` context if available,\n * falling back to the provided props or default behavior.\n *\n * @param props - Optional configuration that will override context values\n * @param props.components - Component overrides for HTML tags (overrides context)\n * @param props.wrapper - Wrapper component (overrides context)\n * @returns A function that takes markdown content and returns JSX\n *\n * @example\n * ```tsx\n * import { useMarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n *   const renderMarkdown = useMarkdownRenderer({\n *     components: {\n *       h1: ({ children }) => <h1 className=\"custom\">{children}</h1>,\n *     },\n *   });\n *\n *   return (\n *     <div>\n *       {renderMarkdown('# Hello\\n\\nThis is **markdown**')}\n *     </div>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n *   return (\n *     <MarkdownProvider\n *       components={{ h1: CustomHeading }}\n *       forceBlock={true}\n *     >\n *       <MyComponent />\n *     </MarkdownProvider>\n *   );\n * }\n * ```\n */\nexport const useMarkdownRenderer = ({\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n}: RenderMarkdownProps = {}) => {\n  const context = useMarkdownContext();\n\n  return (content: string) => {\n    if (context) {\n      return context.renderMarkdown(\n        content,\n        {\n          forceBlock,\n          forceInline,\n          preserveFrontmatter,\n          tagfilter,\n        },\n        components,\n        wrapper\n      );\n    }\n\n    return renderMarkdown(content, {\n      components,\n      wrapper,\n      forceBlock,\n      forceInline,\n      preserveFrontmatter,\n      tagfilter,\n    });\n  };\n};\n\n/**\n * Props for the MarkdownRenderer component.\n *\n * @example\n * ```tsx\n * const props: MarkdownRendererProps = {\n *   children: '# Hello World\\n\\nThis is **bold** text.',\n *   components: {\n *     h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n *   },\n *   wrapper: ({ children }) => <article>{children}</article>,\n *   forceBlock: true,\n * };\n * ```\n */\nexport type MarkdownRendererProps = RenderMarkdownProps & {\n  /**\n   * The markdown content to render as a string.\n   *\n   * @example\n   * ```tsx\n   * <MarkdownRenderer>\n   *   {`# Title\\n\\nParagraph with **bold** text.`}\n   * </MarkdownRenderer>\n   * ```\n   */\n  children: string;\n  /**\n   * Custom render function for markdown.\n   * If provided, it will overwrite context and default rendering.\n   *\n   * @param markdown - The markdown string to render\n   * @param options - Optional rendering options\n   * @returns React node representing the rendered markdown\n   *\n   * @example\n   * ```tsx\n   * <MarkdownRenderer\n   *   renderMarkdown={(md, opts) => {\n   *     // Custom rendering logic\n   *     return <div dangerouslySetInnerHTML={{ __html: customParser(md) }} />;\n   *   }}\n   * >\n   *   {markdownContent}\n   * </MarkdownRenderer>\n   * ```\n   */\n  renderMarkdown?: (\n    markdown: string,\n    options?: {\n      components?: HTMLComponents<'permissive', {}>;\n      wrapper?: FC;\n      forceBlock?: boolean;\n      forceInline?: boolean;\n      preserveFrontmatter?: boolean;\n      tagfilter?: boolean;\n    }\n  ) => ReactNode;\n};\n\n/**\n * React component that renders markdown content to JSX.\n *\n * This component uses the `renderMarkdown` function from the `MarkdownProvider` context\n * if available. Otherwise, it falls back to the default compiler with provided components\n * and options. You can also provide a custom `renderMarkdown` function prop to override\n * all rendering behavior.\n *\n * @example\n * ```tsx\n * import { MarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n *   return (\n *     <MarkdownRenderer>\n *       {`# Hello World\n *\n * This is a paragraph with **bold** and *italic* text.\n *\n * - List item 1\n * - List item 2`}\n *     </MarkdownRenderer>\n *   );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With custom components\n * <MarkdownRenderer\n *   components={{\n *     h1: ({ children }) => <h1 className=\"text-4xl font-bold\">{children}</h1>,\n *     a: ({ href, children }) => (\n *       <a href={href} className=\"text-blue-500 hover:underline\">\n *         {children}\n *       </a>\n *     ),\n *   }}\n *   forceBlock={true}\n * >\n *   {markdownContent}\n * </MarkdownRenderer>\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n *   return (\n *     <MarkdownProvider\n *       components={{ h1: CustomHeading }}\n *       forceBlock={true}\n *     >\n *       <MarkdownRenderer>\n *         {markdownContent}\n *       </MarkdownRenderer>\n *     </MarkdownProvider>\n *   );\n * }\n * ```\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n  children = '',\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown,\n}) => {\n  const context = useMarkdownContext();\n\n  if (renderMarkdown) {\n    return (\n      <>\n        {renderMarkdown(children, {\n          components,\n          wrapper,\n          forceBlock,\n          forceInline,\n          preserveFrontmatter,\n          tagfilter,\n        })}\n      </>\n    );\n  }\n\n  if (context) {\n    return (\n      <>\n        {context.renderMarkdown(\n          children,\n          {\n            forceBlock,\n            forceInline,\n            preserveFrontmatter,\n            tagfilter,\n          },\n          components,\n          wrapper\n        )}\n      </>\n    );\n  }\n\n  // Map public options to internal processor options\n  const internalOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return <>{compiler(children, internalOptions)}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+EA,MAAa,kBACX,SACA,EACE,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KACX;AAYhB,QAAOA,oCAAS,SAViC;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAEwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgD3C,MAAa,uBAAuB,EAClC,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KAAK;CAC9B,MAAM,UAAUC,sDAAoB;AAEpC,SAAQ,YAAoB;AAC1B,MAAI,QACF,QAAO,QAAQ,eACb,SACA;GACE;GACA;GACA;GACA;GACD,EACD,YACA,QACD;AAGH,SAAO,eAAe,SAAS;GAC7B;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HN,MAAa,oBAA+C,EAC1D,WAAW,IACX,YACA,SACA,YACA,aACA,qBACA,WACA,qBACI;CACJ,MAAM,UAAUA,sDAAoB;AAEpC,KAAI,eACF,QACE,mFACG,eAAe,UAAU;EACxB;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAIP,KAAI,QACF,QACE,mFACG,QAAQ,eACP,UACA;EACE;EACA;EACA;EACA;EACD,EACD,YACA,QACD,GACA;AAeP,QAAO,mFAAGD,oCAAS,UAV8B;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAE4C,GAAI"}

package/dist/cjs/markdown/processor.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"processor.cjs","names":["createElement"],"sources":["../../../src/markdown/processor.tsx"],"sourcesContent":["import {\n  type Overrides as CoreOverrides,\n  compile as coreCompile,\n  sanitizer as defaultSanitizer,\n  slugify as defaultSlugify,\n  type MarkdownContext,\n  type MarkdownOptions,\n  type MarkdownRuntime,\n  type ParserResult,\n  type ParseState,\n  type RenderRuleHook,\n  type RuleOutput,\n  RuleType,\n} from '@intlayer/core';\nimport {\n  cloneElement,\n  createElement,\n  type FC,\n  Fragment,\n  type HTMLAttributes,\n  type JSX,\n  type ReactNode,\n} from 'react';\n\n// Re-export RuleType for compatibility\nexport { RuleType };\n\n// Re-export utilities for compatibility\nexport { defaultSlugify as slugify, defaultSanitizer as sanitizer };\n\ntype HTMLTags = keyof JSX.IntrinsicElements;\n\ntype State = ParseState;\n\n/**\n * Refined MarkdownRendererOptions type.\n */\nexport type MarkdownRendererOptions = Partial<{\n  /**\n   * Ultimate control over the output of all rendered JSX.\n   */\n  createElement: (\n    tag: Parameters<typeof createElement>[0],\n    props: JSX.IntrinsicAttributes,\n    ...children: ReactNode[]\n  ) => ReactNode;\n\n  /**\n   * The library automatically generates an anchor tag for bare URLs included in the markdown\n   * document, but this behavior can be disabled if desired.\n   */\n  disableAutoLink: boolean;\n\n  /**\n   * Disable the compiler's best-effort transcription of provided raw HTML\n   * into JSX-equivalent.\n   */\n  disableParsingRawHTML: boolean;\n\n  /**\n   * Forces the compiler to have space between hash sign and the header text.\n   */\n  enforceAtxHeadings: boolean;\n\n  /**\n   * Forces the compiler to always output content with a block-level wrapper.\n   */\n  forceBlock: boolean;\n\n  /**\n   * Forces the compiler to always output content with an inline wrapper.\n   */\n  forceInline: boolean;\n\n  /**\n   * Forces the compiler to wrap results, even if there is only a single child.\n   */\n  forceWrapper: boolean;\n\n  /**\n   * Supply additional HTML entity: unicode replacement mappings.\n   */\n  namedCodesToUnicode: {\n    [key: string]: string;\n  };\n\n  /**\n   * Selectively control the output of particular HTML tags.\n   */\n  components: CoreOverrides;\n\n  /**\n   * Allows for full control over rendering of particular rules.\n   */\n  renderRule: RenderRuleHook;\n\n  /**\n   * Override the built-in sanitizer function for URLs.\n   */\n  sanitizer: (value: string, tag: HTMLTags, attribute: string) => string | null;\n\n  /**\n   * Override normalization of non-URI-safe characters for anchor linking.\n   */\n  slugify: (input: string) => string;\n\n  /**\n   * Declare the type of the wrapper to be used when there are multiple children.\n   */\n  wrapper: any | null;\n\n  /**\n   * Whether to preserve frontmatter in the markdown content.\n   */\n  preserveFrontmatter: boolean;\n\n  /**\n   * Whether to use the GitHub Tag Filter.\n   */\n  tagfilter: boolean;\n}>;\n\n/**\n * Default React runtime for markdown rendering.\n */\nconst DEFAULT_RUNTIME: MarkdownRuntime = {\n  createElement: createElement as any,\n  cloneElement,\n  Fragment,\n  normalizeProps: (_tag, props) => props,\n};\n\n/**\n * Compile markdown to React elements.\n * This is the primary export - use this for new code.\n */\nexport const compileMarkdown = (\n  markdown: string = '',\n  options: MarkdownRendererOptions = {}\n): JSX.Element => {\n  const {\n    createElement: customCreateElement,\n    disableAutoLink,\n    disableParsingRawHTML,\n    enforceAtxHeadings,\n    forceBlock,\n    forceInline,\n    forceWrapper,\n    namedCodesToUnicode,\n    components,\n    renderRule,\n    sanitizer,\n    slugify,\n    wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  } = options;\n\n  const runtime = customCreateElement\n    ? { ...DEFAULT_RUNTIME, createElement: customCreateElement as any }\n    : DEFAULT_RUNTIME;\n\n  const ctx: MarkdownContext = {\n    runtime,\n    components,\n    namedCodesToUnicode,\n    sanitizer: sanitizer as any,\n    slugify,\n  };\n\n  const compilerOptions: MarkdownOptions = {\n    disableAutoLink,\n    disableParsingRawHTML,\n    enforceAtxHeadings,\n    forceBlock,\n    forceInline,\n    forceWrapper,\n    renderRule,\n    wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return coreCompile(markdown, ctx, compilerOptions) as JSX.Element;\n};\n\n// Backward compatibility aliases\nexport const compiler = compileMarkdown;\nexport const compile = compileMarkdown;\n\n/**\n * React component that renders markdown to JSX (legacy).\n */\nexport const LegacyMarkdownRenderer: FC<\n  Omit<HTMLAttributes<Element>, 'children'> & {\n    children: string;\n    options?: MarkdownRendererOptions;\n  }\n> = ({ children = '', options, ...props }) => {\n  if (process.env.NODE_ENV !== 'production' && typeof children !== 'string') {\n    console.error(\n      'intlayer: <Markdown> component only accepts a single string as a child, received:',\n      children\n    );\n  }\n\n  return cloneElement(\n    compiler(children, options),\n    props as JSX.IntrinsicAttributes\n  );\n};\n\nexport type {\n  State,\n  ParseState,\n  ParserResult,\n  RuleOutput,\n  CoreOverrides as Overrides,\n};\n"],"mappings":";;;;;;;;AA6HA,MAAM,kBAAmC;CACvC,eAAeA;CACf;CACA;CACA,iBAAiB,MAAM,UAAU;CAClC;;;;;AAMD,MAAa,mBACX,WAAmB,IACnB,UAAmC,EAAE,KACrB;CAChB,MAAM,EACJ,eAAe,qBACf,iBACA,uBACA,oBACA,YACA,aACA,cACA,qBACA,YACA,YACA,WACA,SACA,SACA,qBACA,cACE;AA2BJ,oCAAmB,UArBU;EAC3B,SALc,sBACZ;GAAE,GAAG;GAAiB,eAAe;GAA4B,GACjE;EAIF;EACA;EACW;EACX;EACD,EAEwC;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAEiD;;AAIpD,MAAa,WAAW;AACxB,MAAa,UAAU;;;;AAKvB,MAAa,0BAKR,EAAE,WAAW,IAAI,SAAS,GAAG,YAAY;AAC5C,KAAI,QAAQ,IAAI,aAAa,gBAAgB,OAAO,aAAa,SAC/D,SAAQ,MACN,qFACA,SACD;AAGH,gCACE,SAAS,UAAU,QAAQ,EAC3B,MACD"}
+{"version":3,"file":"processor.cjs","names":["createElement"],"sources":["../../../src/markdown/processor.tsx"],"sourcesContent":["import {\n  compile as coreCompile,\n  sanitizer as defaultSanitizer,\n  slugify as defaultSlugify,\n  type MarkdownContext,\n  type MarkdownOptions,\n  type MarkdownRuntime,\n  type ParseState,\n  type RenderRuleHook,\n  RuleType,\n} from '@intlayer/core';\nimport {\n  cloneElement,\n  createElement,\n  type FC,\n  Fragment,\n  type HTMLAttributes,\n  type JSX,\n  type ReactNode,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\n\n// Re-export RuleType for compatibility\nexport { RuleType };\n\n// Re-export utilities for compatibility\nexport { defaultSlugify as slugify, defaultSanitizer as sanitizer };\n\ntype HTMLTags = keyof JSX.IntrinsicElements;\n\n/**\n * Refined MarkdownRendererOptions type.\n */\nexport type MarkdownRendererOptions = Partial<{\n  /**\n   * Ultimate control over the output of all rendered JSX.\n   */\n  createElement: (\n    tag: Parameters<typeof createElement>[0],\n    props: JSX.IntrinsicAttributes,\n    ...children: ReactNode[]\n  ) => ReactNode;\n\n  /**\n   * The library automatically generates an anchor tag for bare URLs included in the markdown\n   * document, but this behavior can be disabled if desired.\n   */\n  disableAutoLink: boolean;\n\n  /**\n   * Disable the compiler's best-effort transcription of provided raw HTML\n   * into JSX-equivalent.\n   */\n  disableParsingRawHTML: boolean;\n\n  /**\n   * Forces the compiler to have space between hash sign and the header text.\n   */\n  enforceAtxHeadings: boolean;\n\n  /**\n   * Forces the compiler to always output content with a block-level wrapper.\n   */\n  forceBlock: boolean;\n\n  /**\n   * Forces the compiler to always output content with an inline wrapper.\n   */\n  forceInline: boolean;\n\n  /**\n   * Forces the compiler to wrap results, even if there is only a single child.\n   */\n  forceWrapper: boolean;\n\n  /**\n   * Supply additional HTML entity: unicode replacement mappings.\n   */\n  namedCodesToUnicode: {\n    [key: string]: string;\n  };\n\n  /**\n   * Selectively control the output of particular HTML tags.\n   */\n  components: HTMLComponents;\n\n  /**\n   * Allows for full control over rendering of particular rules.\n   */\n  renderRule: RenderRuleHook;\n\n  /**\n   * Override the built-in sanitizer function for URLs.\n   */\n  sanitizer: (value: string, tag: HTMLTags, attribute: string) => string | null;\n\n  /**\n   * Override normalization of non-URI-safe characters for anchor linking.\n   */\n  slugify: (input: string) => string;\n\n  /**\n   * Declare the type of the wrapper to be used when there are multiple children.\n   */\n  wrapper: any | null;\n\n  /**\n   * Whether to preserve frontmatter in the markdown content.\n   */\n  preserveFrontmatter: boolean;\n\n  /**\n   * Whether to use the GitHub Tag Filter.\n   */\n  tagfilter: boolean;\n}>;\n\n/**\n * Default React runtime for markdown rendering.\n */\nconst DEFAULT_RUNTIME: MarkdownRuntime = {\n  createElement: createElement as any,\n  cloneElement,\n  Fragment,\n  normalizeProps: (_tag, props) => props,\n};\n\n/**\n * Compile markdown to React elements.\n * This is the primary export - use this for new code.\n */\nexport const compileMarkdown = (\n  markdown: string = '',\n  options: MarkdownRendererOptions = {}\n): JSX.Element => {\n  const {\n    createElement: customCreateElement,\n    disableAutoLink,\n    disableParsingRawHTML,\n    enforceAtxHeadings,\n    forceBlock,\n    forceInline,\n    forceWrapper,\n    namedCodesToUnicode,\n    components,\n    renderRule,\n    sanitizer,\n    slugify,\n    wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  } = options;\n\n  const runtime = customCreateElement\n    ? { ...DEFAULT_RUNTIME, createElement: customCreateElement as any }\n    : DEFAULT_RUNTIME;\n\n  const ctx: MarkdownContext<HTMLComponents> = {\n    runtime,\n    components,\n    namedCodesToUnicode,\n    sanitizer: sanitizer as any,\n    slugify,\n  };\n\n  const compilerOptions: MarkdownOptions = {\n    disableAutoLink,\n    disableParsingRawHTML,\n    enforceAtxHeadings,\n    forceBlock,\n    forceInline,\n    forceWrapper,\n    renderRule,\n    wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  return coreCompile(markdown, ctx, compilerOptions) as JSX.Element;\n};\n\n// Backward compatibility aliases\nexport const compiler = compileMarkdown;\nexport const compile = compileMarkdown;\n\n/**\n * React component that renders markdown to JSX (legacy).\n */\nexport const LegacyMarkdownRenderer: FC<\n  Omit<HTMLAttributes<Element>, 'children'> & {\n    children: string;\n    options?: MarkdownRendererOptions;\n  }\n> = ({ children = '', options, ...props }) => {\n  if (process.env.NODE_ENV !== 'production' && typeof children !== 'string') {\n    console.error(\n      'intlayer: <Markdown> component only accepts a single string as a child, received:',\n      children\n    );\n  }\n\n  return cloneElement(\n    compiler(children, options),\n    props as JSX.IntrinsicAttributes\n  );\n};\n"],"mappings":";;;;;;;;AAyHA,MAAM,kBAAmC;CACvC,eAAeA;CACf;CACA;CACA,iBAAiB,MAAM,UAAU;CAClC;;;;;AAMD,MAAa,mBACX,WAAmB,IACnB,UAAmC,EAAE,KACrB;CAChB,MAAM,EACJ,eAAe,qBACf,iBACA,uBACA,oBACA,YACA,aACA,cACA,qBACA,YACA,YACA,WACA,SACA,SACA,qBACA,cACE;AA2BJ,oCAAmB,UArB0B;EAC3C,SALc,sBACZ;GAAE,GAAG;GAAiB,eAAe;GAA4B,GACjE;EAIF;EACA;EACW;EACX;EACD,EAEwC;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAEiD;;AAIpD,MAAa,WAAW;AACxB,MAAa,UAAU;;;;AAKvB,MAAa,0BAKR,EAAE,WAAW,IAAI,SAAS,GAAG,YAAY;AAC5C,KAAI,QAAQ,IAAI,aAAa,gBAAgB,OAAO,aAAa,SAC/D,SAAQ,MACN,qFACA,SACD;AAGH,gCACE,SAAS,UAAU,QAAQ,EAC3B,MACD"}

package/dist/cjs/plugins.cjs

@@ -113,7 +113,7 @@ const markdownStringPlugin = {
 				...rest,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_markdown_MarkdownRendererPlugin.MarkdownRendererPlugin, {
 					...rest,
-					...components,
+					...components ?? {},
 					children: node
 				})
 			}),
@@ -148,7 +148,6 @@ const htmlPlugin = {
 	canHandle: (node) => typeof node === "object" && node?.nodeType === _intlayer_types.NodeType.HTML,
 	transform: (node, props) => {
 		const html = node[_intlayer_types.NodeType.HTML];
-		node.tags;
 		const { plugins, ...rest } = props;
 		const render = (userComponents) => (0, react.createElement)(require_html_HTMLRendererPlugin.HTMLRendererPlugin, {
 			...rest,

package/dist/cjs/plugins.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"plugins.cjs","names":["renderIntlayerNode","EditedContentRenderer","ContentSelectorRenderer","renderReactElement","Fragment","NodeType","MarkdownMetadataRenderer","MarkdownRendererPlugin","HTMLRendererPlugin"],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n  type DeepTransformContent as DeepTransformContentCore,\n  getMarkdownMetadata,\n  type HTMLCond,\n  type HTMLContent,\n  type IInterpreterPluginState as IInterpreterPluginStateCore,\n  type InsertionContent,\n  type MarkdownContent,\n  type Plugins,\n  splitInsertionTemplate,\n} from '@intlayer/core';\nimport {\n  type DeclaredLocales,\n  type KeyPath,\n  type LocalesValues,\n  NodeType,\n} from '@intlayer/types';\nimport {\n  type ComponentType,\n  createElement,\n  type ElementType,\n  Fragment,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { ContentSelectorRenderer } from './editor';\nimport { EditedContentRenderer } from './editor/useEditedContentRenderer';\nimport { HTMLRendererPlugin } from './html';\nimport type { ReactHTMLComponentMap } from './html/types';\nimport { type IntlayerNode, renderIntlayerNode } from './IntlayerNode';\nimport { MarkdownMetadataRenderer, MarkdownRendererPlugin } from './markdown';\nimport { renderReactElement } from './reactElement/renderReactElement';\n\n/** ---------------------------------------------\n *  INTLAYER NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n  ? IntlayerNode<T>\n  : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n  id: 'intlayer-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'bigint' ||\n    typeof node === 'string' ||\n    typeof node === 'number',\n  transform: (\n    _node,\n    {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    }\n  ) =>\n    renderIntlayerNode({\n      ...rest,\n      value: rest.children,\n      children: (\n        <EditedContentRenderer {...rest}>{rest.children}</EditedContentRenderer>\n      ),\n    }),\n};\n\n/** ---------------------------------------------\n *  REACT NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type ReactNodeCond<T> = T extends {\n  props: any;\n  key: any;\n}\n  ? ReactNode\n  : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const reactNodePlugins: Plugins = {\n  id: 'react-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' &&\n    typeof node?.props !== 'undefined' &&\n    typeof node.key !== 'undefined',\n\n  transform: (\n    node,\n    {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    }\n  ) =>\n    renderIntlayerNode({\n      ...rest,\n      value: '[[react-element]]',\n      children: (\n        <ContentSelectorRenderer {...rest}>\n          {renderReactElement(node)}\n        </ContentSelectorRenderer>\n      ),\n    }),\n};\n\n/** ---------------------------------------------\n *  INSERTION PLUGIN\n *  --------------------------------------------- */\n\nexport type InsertionCond<T, S, L> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Insertion]: string;\n  fields: readonly string[];\n}\n  ? (\n      values: {\n        [K in T['fields'][number]]: ReactNode;\n      }\n    ) => ReactNode\n  : never;\n\n/**\n * Split insertion string and join with React nodes using shared core logic\n */\nconst splitAndJoinInsertion = (\n  template: string,\n  values: Record<string, string | number | ReactNode>\n): ReactNode => {\n  const result = splitInsertionTemplate(template, values);\n\n  if (result.isSimple) {\n    // Simple string replacement\n    return result.parts as string;\n  }\n\n  // Return as Fragment with proper keys\n  return createElement(\n    Fragment,\n    null,\n    ...(result.parts as any[]).map((part, index) =>\n      createElement(Fragment, { key: index }, part)\n    )\n  );\n};\n\n/** Insertion plugin for React. Handles component/node insertion. */\nexport const insertionPlugin: Plugins = {\n  id: 'insertion-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Insertion,\n  transform: (node: InsertionContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Insertion,\n      },\n    ];\n\n    const children = node[NodeType.Insertion];\n\n    /** Insertion string plugin. Replaces string node with a component that render the insertion. */\n    const insertionStringPlugin: Plugins = {\n      id: 'insertion-string-plugin',\n      canHandle: (node) => typeof node === 'string',\n      transform: (node: string, subProps, deepTransformNode) => {\n        const transformedResult = deepTransformNode(node, {\n          ...subProps,\n          children: node,\n          plugins: [\n            ...(props.plugins ?? ([] as Plugins[])).filter(\n              (plugin) => plugin.id !== 'intlayer-node-plugin'\n            ),\n          ],\n        });\n\n        return (\n          values: {\n            [K in InsertionContent['fields'][number]]:\n              | string\n              | number\n              | ReactNode;\n          }\n        ) => {\n          const result = splitAndJoinInsertion(transformedResult, values);\n\n          return deepTransformNode(result, {\n            ...subProps,\n            plugins: props.plugins,\n            children: result,\n          });\n        };\n      },\n    };\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n  ? IntlayerNode<\n      string,\n      { metadata: DeepTransformContent<string>; use: (components: any) => any }\n    >\n  : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n  id: 'markdown-string-plugin',\n  canHandle: (node) => typeof node === 'string',\n  transform: (node: string, props, deepTransformNode) => {\n    const {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    } = props;\n\n    const metadata = getMarkdownMetadata(node);\n\n    const metadataPlugins: Plugins = {\n      id: 'markdown-metadata-plugin',\n      canHandle: (metadataNode) =>\n        typeof metadataNode === 'string' ||\n        typeof metadataNode === 'number' ||\n        typeof metadataNode === 'boolean' ||\n        !metadataNode,\n      transform: (metadataNode, props) =>\n        renderIntlayerNode({\n          ...props,\n          value: metadataNode,\n          children: (\n            <ContentSelectorRenderer {...rest}>\n              <MarkdownMetadataRenderer\n                {...rest}\n                metadataKeyPath={props.keyPath}\n              >\n                {node}\n              </MarkdownMetadataRenderer>\n            </ContentSelectorRenderer>\n          ),\n        }),\n    };\n\n    // Transform metadata while keeping the same structure\n    const metadataNodes = deepTransformNode(metadata, {\n      plugins: [metadataPlugins],\n      dictionaryKey: rest.dictionaryKey,\n      keyPath: [],\n    });\n\n    const render = (components?: any) =>\n      renderIntlayerNode({\n        ...props,\n        value: node,\n        children: (\n          <ContentSelectorRenderer {...rest}>\n            <MarkdownRendererPlugin {...rest} {...components}>\n              {node}\n            </MarkdownRendererPlugin>\n          </ContentSelectorRenderer>\n        ),\n        additionalProps: {\n          metadata: metadataNodes,\n        },\n      });\n\n    const element = render() as ReactElement;\n\n    return new Proxy(element, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return node;\n        }\n        if (prop === 'metadata') {\n          return metadataNodes;\n        }\n\n        if (prop === 'use') {\n          return (components?: any) => render(components);\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as any;\n  },\n};\n\ntype MarkdownComponentMap = Record<string, ComponentType<any> | ElementType>;\n\nexport type MarkdownCond<T, S, L extends LocalesValues> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Markdown]: infer M;\n  metadata?: infer U;\n}\n  ? {\n      use: (components?: MarkdownComponentMap) => ReactNode;\n      metadata: DeepTransformContent<U, L>;\n    } & any\n  : never;\n\nexport const markdownPlugin: Plugins = {\n  id: 'markdown-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n  transform: (node: MarkdownContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Markdown,\n      },\n    ];\n\n    const children = node[NodeType.Markdown];\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/** ---------------------------------------------\n *  HTML PLUGIN\n *  --------------------------------------------- */\n\nexport type HTMLPluginCond<T, S, L> = HTMLCond<T, S, L>;\n\n/** HTML plugin. Replaces node with a function that takes components => ReactNode. */\nexport const htmlPlugin: Plugins = {\n  id: 'html-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.HTML,\n\n  transform: (node: HTMLContent<string>, props) => {\n    const html = node[NodeType.HTML];\n    const tags = node.tags ?? [];\n    const { plugins, ...rest } = props;\n\n    // Type-safe render function that accepts properly typed components\n    const render = <\n      T = typeof tags extends readonly (infer U extends string)[]\n        ? U\n        : typeof tags,\n    >(\n      userComponents?: ReactHTMLComponentMap<T>\n    ): ReactNode =>\n      createElement(HTMLRendererPlugin, { ...rest, html, userComponents });\n\n    const element = render() as ReactElement;\n\n    return new Proxy(element, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return html;\n        }\n\n        if (prop === 'use') {\n          // Return a properly typed function based on custom components\n          return <\n            T = typeof tags extends readonly (infer U extends string)[]\n              ? U\n              : typeof tags,\n          >(\n            userComponents?: ReactHTMLComponentMap<T>\n          ) => render(userComponents);\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as any;\n  },\n};\n\n/** ---------------------------------------------\n *  PLUGINS RESULT\n *  --------------------------------------------- */\n\nexport interface IInterpreterPluginReact<T, S, L extends LocalesValues> {\n  reactNode: ReactNodeCond<T>;\n  reactIntlayerNode: IntlayerNodeCond<T>;\n  reactInsertion: InsertionCond<T, S, L>;\n  reactMarkdown: MarkdownCond<T, S, L>;\n  reactHtml: HTMLPluginCond<T, S, L>;\n}\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `react-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n  reactNode: true;\n  reactIntlayerNode: true;\n  reactInsertion: true;\n  reactMarkdown: true;\n  reactHtml: true;\n};\n\nexport type DeepTransformContent<\n  T,\n  L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":";;;;;;;;;;;;;;AA0CA,MAAa,sBAA+B;CAC1C,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAChB,OAAO,SAAS,YAChB,OAAO,SAAS;CAClB,YACE,OACA,EACE,SACA,GAAG,WAGLA,wCAAmB;EACjB,GAAG;EACH,OAAO,KAAK;EACZ,UACE,2CAACC;GAAsB,GAAI;aAAO,KAAK;IAAiC;EAE3E,CAAC;CACL;;AAcD,MAAa,mBAA4B;CACvC,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAChB,OAAO,MAAM,UAAU,eACvB,OAAO,KAAK,QAAQ;CAEtB,YACE,MACA,EACE,SACA,GAAG,WAGLD,wCAAmB;EACjB,GAAG;EACH,OAAO;EACP,UACE,2CAACE;GAAwB,GAAI;aAC1BC,2DAAmB,KAAK;IACD;EAE7B,CAAC;CACL;;;;AAqBD,MAAM,yBACJ,UACA,WACc;CACd,MAAM,oDAAgC,UAAU,OAAO;AAEvD,KAAI,OAAO,SAET,QAAO,OAAO;AAIhB,iCACEC,gBACA,MACA,GAAI,OAAO,MAAgB,KAAK,MAAM,mCACtBA,gBAAU,EAAE,KAAK,OAAO,EAAE,KAAK,CAC9C,CACF;;;AAIH,MAAa,kBAA2B;CACtC,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAAY,MAAM,aAAaC,yBAAS;CAC1D,YAAY,MAAwB,OAAO,sBAAsB;EAC/D,MAAM,aAAwB,CAC5B,GAAG,MAAM,SACT,EACE,MAAMA,yBAAS,WAChB,CACF;EAED,MAAM,WAAW,KAAKA,yBAAS;;EAG/B,MAAM,wBAAiC;GACrC,IAAI;GACJ,YAAY,SAAS,OAAO,SAAS;GACrC,YAAY,MAAc,UAAU,sBAAsB;IACxD,MAAM,oBAAoB,kBAAkB,MAAM;KAChD,GAAG;KACH,UAAU;KACV,SAAS,CACP,IAAI,MAAM,WAAY,EAAE,EAAgB,QACrC,WAAW,OAAO,OAAO,uBAC3B,CACF;KACF,CAAC;AAEF,YACE,WAMG;KACH,MAAM,SAAS,sBAAsB,mBAAmB,OAAO;AAE/D,YAAO,kBAAkB,QAAQ;MAC/B,GAAG;MACH,SAAS,MAAM;MACf,UAAU;MACX,CAAC;;;GAGP;AAED,SAAO,kBAAkB,UAAU;GACjC,GAAG;GACH;GACA,SAAS;GACT,SAAS,CAAC,uBAAuB,GAAI,MAAM,WAAW,EAAE,CAAE;GAC3D,CAAC;;CAEL;;AAcD,MAAa,uBAAgC;CAC3C,IAAI;CACJ,YAAY,SAAS,OAAO,SAAS;CACrC,YAAY,MAAc,OAAO,sBAAsB;EACrD,MAAM,EACJ,SACA,GAAG,SACD;EA6BJ,MAAM,gBAAgB,0DA3Be,KAAK,EA2BQ;GAChD,SAAS,CA1BsB;IAC/B,IAAI;IACJ,YAAY,iBACV,OAAO,iBAAiB,YACxB,OAAO,iBAAiB,YACxB,OAAO,iBAAiB,aACxB,CAAC;IACH,YAAY,cAAc,UACxBL,wCAAmB;KACjB,GAAG;KACH,OAAO;KACP,UACE,2CAACE;MAAwB,GAAI;gBAC3B,2CAACI;OACC,GAAI;OACJ,iBAAiB,MAAM;iBAEtB;QACwB;OACH;KAE7B,CAAC;IACL,CAI2B;GAC1B,eAAe,KAAK;GACpB,SAAS,EAAE;GACZ,CAAC;EAEF,MAAM,UAAU,eACdN,wCAAmB;GACjB,GAAG;GACH,OAAO;GACP,UACE,2CAACE;IAAwB,GAAI;cAC3B,2CAACK;KAAuB,GAAI;KAAM,GAAI;eACnC;MACsB;KACD;GAE5B,iBAAiB,EACf,UAAU,eACX;GACF,CAAC;EAEJ,MAAM,UAAU,QAAQ;AAExB,SAAO,IAAI,MAAM,SAAS,EACxB,IAAI,QAAQ,MAAM,UAAU;AAC1B,OAAI,SAAS,QACX,QAAO;AAET,OAAI,SAAS,WACX,QAAO;AAGT,OAAI,SAAS,MACX,SAAQ,eAAqB,OAAO,WAAW;AAGjD,UAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;KAE7C,CAAC;;CAEL;AAeD,MAAa,iBAA0B;CACrC,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAAY,MAAM,aAAaF,yBAAS;CAC1D,YAAY,MAAuB,OAAO,sBAAsB;EAC9D,MAAM,aAAwB,CAC5B,GAAG,MAAM,SACT,EACE,MAAMA,yBAAS,UAChB,CACF;EAED,MAAM,WAAW,KAAKA,yBAAS;AAE/B,SAAO,kBAAkB,UAAU;GACjC,GAAG;GACH;GACA,SAAS;GACT,SAAS,CAAC,sBAAsB,GAAI,MAAM,WAAW,EAAE,CAAE;GAC1D,CAAC;;CAEL;;AASD,MAAa,aAAsB;CACjC,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAAY,MAAM,aAAaA,yBAAS;CAE1D,YAAY,MAA2B,UAAU;EAC/C,MAAM,OAAO,KAAKA,yBAAS;AACd,OAAK;EAClB,MAAM,EAAE,SAAS,GAAG,SAAS;EAG7B,MAAM,UAKJ,4CAEcG,oDAAoB;GAAE,GAAG;GAAM;GAAM;GAAgB,CAAC;EAEtE,MAAM,UAAU,QAAQ;AAExB,SAAO,IAAI,MAAM,SAAS,EACxB,IAAI,QAAQ,MAAM,UAAU;AAC1B,OAAI,SAAS,QACX,QAAO;AAGT,OAAI,SAAS,MAEX,SAKE,mBACG,OAAO,eAAe;AAG7B,UAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;KAE7C,CAAC;;CAEL"}
+{"version":3,"file":"plugins.cjs","names":["renderIntlayerNode","EditedContentRenderer","ContentSelectorRenderer","renderReactElement","Fragment","NodeType","MarkdownMetadataRenderer","MarkdownRendererPlugin","HTMLRendererPlugin"],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n  type DeepTransformContent as DeepTransformContentCore,\n  getMarkdownMetadata,\n  type HTMLContent,\n  type IInterpreterPluginState as IInterpreterPluginStateCore,\n  type InsertionContent,\n  type MarkdownContent,\n  type Plugins,\n  splitInsertionTemplate,\n} from '@intlayer/core';\nimport {\n  type DeclaredLocales,\n  type KeyPath,\n  type LocalesValues,\n  NodeType,\n} from '@intlayer/types';\nimport {\n  createElement,\n  Fragment,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { ContentSelectorRenderer } from './editor';\nimport { EditedContentRenderer } from './editor/useEditedContentRenderer';\nimport { HTMLRendererPlugin } from './html';\nimport { type IntlayerNode, renderIntlayerNode } from './IntlayerNode';\nimport { MarkdownMetadataRenderer, MarkdownRendererPlugin } from './markdown';\nimport { renderReactElement } from './reactElement/renderReactElement';\nimport type { HTMLComponents } from './utils/HTMLComponentTypes';\n\n/** ---------------------------------------------\n *  INTLAYER NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n  ? IntlayerNode<T>\n  : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n  id: 'intlayer-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'bigint' ||\n    typeof node === 'string' ||\n    typeof node === 'number',\n  transform: (\n    _node,\n    {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    }\n  ) =>\n    renderIntlayerNode({\n      ...rest,\n      value: rest.children,\n      children: (\n        <EditedContentRenderer {...rest}>{rest.children}</EditedContentRenderer>\n      ),\n    }),\n};\n\n/** ---------------------------------------------\n *  REACT NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type ReactNodeCond<T> = T extends {\n  props: any;\n  key: any;\n}\n  ? ReactNode\n  : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const reactNodePlugins: Plugins = {\n  id: 'react-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' &&\n    typeof node?.props !== 'undefined' &&\n    typeof node.key !== 'undefined',\n\n  transform: (\n    node,\n    {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    }\n  ) =>\n    renderIntlayerNode({\n      ...rest,\n      value: '[[react-element]]',\n      children: (\n        <ContentSelectorRenderer {...rest}>\n          {renderReactElement(node)}\n        </ContentSelectorRenderer>\n      ),\n    }),\n};\n\n/** ---------------------------------------------\n *  INSERTION PLUGIN\n *  --------------------------------------------- */\n\nexport type InsertionCond<T> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Insertion]: string;\n  fields: readonly string[];\n}\n  ? (\n      values: {\n        [K in T['fields'][number]]: ReactNode;\n      }\n    ) => ReactNode\n  : never;\n\n/**\n * Split insertion string and join with React nodes using shared core logic\n */\nconst splitAndJoinInsertion = (\n  template: string,\n  values: Record<string, string | number | ReactNode>\n): ReactNode => {\n  const result = splitInsertionTemplate(template, values);\n\n  if (result.isSimple) {\n    // Simple string replacement\n    return result.parts as string;\n  }\n\n  // Return as Fragment with proper keys\n  return createElement(\n    Fragment,\n    null,\n    ...(result.parts as any[]).map((part, index) =>\n      createElement(Fragment, { key: index }, part)\n    )\n  );\n};\n\n/** Insertion plugin for React. Handles component/node insertion. */\nexport const insertionPlugin: Plugins = {\n  id: 'insertion-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Insertion,\n  transform: (node: InsertionContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Insertion,\n      },\n    ];\n\n    const children = node[NodeType.Insertion];\n\n    /** Insertion string plugin. Replaces string node with a component that render the insertion. */\n    const insertionStringPlugin: Plugins = {\n      id: 'insertion-string-plugin',\n      canHandle: (node) => typeof node === 'string',\n      transform: (node: string, subProps, deepTransformNode) => {\n        const transformedResult = deepTransformNode(node, {\n          ...subProps,\n          children: node,\n          plugins: [\n            ...(props.plugins ?? ([] as Plugins[])).filter(\n              (plugin) => plugin.id !== 'intlayer-node-plugin'\n            ),\n          ],\n        });\n\n        return (\n          values: {\n            [K in InsertionContent['fields'][number]]:\n              | string\n              | number\n              | ReactNode;\n          }\n        ) => {\n          const result = splitAndJoinInsertion(transformedResult, values);\n\n          return deepTransformNode(result, {\n            ...subProps,\n            plugins: props.plugins,\n            children: result,\n          });\n        };\n      },\n    };\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n  ? IntlayerNode<\n      string,\n      {\n        metadata: DeepTransformContent<string>;\n        use: (components: HTMLComponents<'permissive', {}>) => ReactNode;\n      }\n    >\n  : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n  id: 'markdown-string-plugin',\n  canHandle: (node) => typeof node === 'string',\n  transform: (node: string, props, deepTransformNode) => {\n    const {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    } = props;\n\n    const metadata = getMarkdownMetadata(node);\n\n    const metadataPlugins: Plugins = {\n      id: 'markdown-metadata-plugin',\n      canHandle: (metadataNode) =>\n        typeof metadataNode === 'string' ||\n        typeof metadataNode === 'number' ||\n        typeof metadataNode === 'boolean' ||\n        !metadataNode,\n      transform: (metadataNode, props) =>\n        renderIntlayerNode({\n          ...props,\n          value: metadataNode,\n          children: (\n            <ContentSelectorRenderer {...rest}>\n              <MarkdownMetadataRenderer\n                {...rest}\n                metadataKeyPath={props.keyPath}\n              >\n                {node}\n              </MarkdownMetadataRenderer>\n            </ContentSelectorRenderer>\n          ),\n        }),\n    };\n\n    // Transform metadata while keeping the same structure\n    const metadataNodes = deepTransformNode(metadata, {\n      plugins: [metadataPlugins],\n      dictionaryKey: rest.dictionaryKey,\n      keyPath: [],\n    });\n\n    const render = (components?: HTMLComponents) =>\n      renderIntlayerNode({\n        ...props,\n        value: node,\n        children: (\n          <ContentSelectorRenderer {...rest}>\n            <MarkdownRendererPlugin {...rest} {...(components ?? {})}>\n              {node}\n            </MarkdownRendererPlugin>\n          </ContentSelectorRenderer>\n        ),\n        additionalProps: {\n          metadata: metadataNodes,\n        },\n      });\n\n    const element = render() as ReactElement;\n\n    return new Proxy(element, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return node;\n        }\n        if (prop === 'metadata') {\n          return metadataNodes;\n        }\n\n        if (prop === 'use') {\n          return (components?: HTMLComponents) => render(components);\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as any;\n  },\n};\n\nexport type MarkdownCond<T> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Markdown]: infer M;\n  metadata?: infer U;\n  tags?: infer U;\n}\n  ? {\n      use: (components?: HTMLComponents<'permissive', U>) => IntlayerNode<M>;\n      metadata: DeepTransformContent<U>;\n    }\n  : never;\n\nexport const markdownPlugin: Plugins = {\n  id: 'markdown-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n  transform: (node: MarkdownContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Markdown,\n      },\n    ];\n\n    const children = node[NodeType.Markdown];\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/** ---------------------------------------------\n *  HTML PLUGIN\n *  --------------------------------------------- */\n\n/**\n * HTML conditional type that enforces:\n * - All components (Standard or Custom) are OPTIONAL in the `use()` method.\n * - Custom components props are strictly inferred from the dictionary definition.\n *\n * This ensures type safety:\n * - `html('<div>Hello <CustomComponent /></div>').use({ CustomComponent: ... })` - optional but typed\n */\nexport type HTMLPluginCond<T> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.HTML]: infer I;\n  tags?: infer U;\n}\n  ? {\n      use: (components?: HTMLComponents<'permissive', U>) => IntlayerNode<I>;\n    }\n  : never;\n\n/** HTML plugin. Replaces node with a function that takes components => ReactNode. */\nexport const htmlPlugin: Plugins = {\n  id: 'html-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.HTML,\n\n  transform: (node: HTMLContent<string>, props) => {\n    const html = node[NodeType.HTML];\n    const { plugins, ...rest } = props;\n\n    // Type-safe render function that accepts properly typed components\n    const render = (userComponents?: HTMLComponents): ReactNode =>\n      createElement(HTMLRendererPlugin, { ...rest, html, userComponents });\n\n    const element = render() as ReactElement;\n\n    return new Proxy(element, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return html;\n        }\n\n        if (prop === 'use') {\n          // Return a properly typed function based on custom components\n          return (userComponents?: HTMLComponents) => render(userComponents);\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as any;\n  },\n};\n\n/** ---------------------------------------------\n *  PLUGINS RESULT\n *  --------------------------------------------- */\n\nexport type IInterpreterPluginReact<T, _S, _L extends LocalesValues> = {\n  reactNode: ReactNodeCond<T>;\n  reactIntlayerNode: IntlayerNodeCond<T>;\n  reactInsertion: InsertionCond<T>;\n  reactMarkdown: MarkdownCond<T>;\n  reactHtml: HTMLPluginCond<T>;\n};\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `react-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n  reactNode: true;\n  reactIntlayerNode: true;\n  reactInsertion: true;\n  reactMarkdown: true;\n  reactHtml: true;\n};\n\nexport type DeepTransformContent<\n  T,\n  L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":"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"}

package/dist/cjs/reactElement/renderReactElement.cjs

@@ -3,18 +3,20 @@ let react = require("react");
 
 //#region src/reactElement/renderReactElement.ts
 const renderReactElement = (element) => {
-	if (typeof element === "string") return element;
+	if (element === null || typeof element !== "object") return element;
 	const convertChildrenAsArray = (element) => {
-		if (element?.props && typeof element.props.children === "object") {
-			const childrenResult = [];
-			const { children } = element.props;
-			Object.keys(children ?? {}).forEach((key) => {
-				const childElement = renderReactElement(children?.[key]);
-				if (typeof childElement === "object" && childElement !== null && "type" in childElement) childrenResult.push((0, react.createElement)(childElement.type, {
-					...childElement.props,
-					key
-				}, ...Array.isArray(childElement.props?.children) ? childElement.props.children : [childElement.props?.children]));
-				else childrenResult.push(childElement);
+		const children = element.props?.children;
+		if (Array.isArray(children)) {
+			const childrenResult = children.map((child, index) => {
+				const renderedChild = renderReactElement(child);
+				if (typeof renderedChild === "object" && renderedChild !== null && "type" in renderedChild) {
+					const childElement = renderedChild;
+					return (0, react.createElement)(childElement.type, {
+						...childElement.props,
+						key: index
+					}, ...Array.isArray(childElement.props?.children) ? childElement.props.children : typeof childElement.props?.children !== "undefined" ? [childElement.props.children] : []);
+				}
+				return renderedChild;
 			});
 			return {
 				...element,
@@ -23,12 +25,21 @@ const renderReactElement = (element) => {
 					children: childrenResult
 				}
 			};
+		} else if (typeof children !== "undefined" && children !== null) {
+			const renderedChild = renderReactElement(children);
+			return {
+				...element,
+				props: {
+					...element.props,
+					children: [renderedChild]
+				}
+			};
 		}
 		return {
 			...element,
 			props: {
 				...element.props,
-				children: element.props?.children ?? []
+				children: []
 			}
 		};
 	};

package/dist/cjs/reactElement/renderReactElement.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"renderReactElement.cjs","names":[],"sources":["../../../src/reactElement/renderReactElement.ts"],"sourcesContent":["import { createElement, type ReactElement, type ReactNode } from 'react';\n\n// This function recursively creates React elements from a given JSON-like structure\nexport const renderReactElement = (element: ReactElement<any>) => {\n  if (typeof element === 'string') {\n    // If it's a string, simply return it (used for text content)\n    return element;\n  }\n\n  const convertChildrenAsArray = (\n    element: ReactElement<{ children?: ReactNode }>\n  ): ReactElement<{ children?: ReactNode }> => {\n    if (element?.props && typeof element.props.children === 'object') {\n      const childrenResult: ReactNode[] = [];\n      const { children } = element.props;\n\n      // Create the children elements recursively, if any\n      Object.keys(children ?? {}).forEach((key) => {\n        const childElement = renderReactElement(\n          children?.[\n            key as keyof typeof children\n          ] as unknown as ReactElement<any>\n        );\n\n        // Add key prop if the child is a React element\n        if (\n          typeof childElement === 'object' &&\n          childElement !== null &&\n          'type' in childElement\n        ) {\n          childrenResult.push(\n            createElement(\n              childElement.type,\n              { ...childElement.props, key },\n              ...(Array.isArray(childElement.props?.children)\n                ? childElement.props.children\n                : [childElement.props?.children])\n            )\n          );\n        } else {\n          childrenResult.push(childElement);\n        }\n      });\n\n      return {\n        ...element,\n        props: { ...element.props, children: childrenResult },\n      };\n    }\n\n    return {\n      ...element,\n      props: { ...element.props, children: element.props?.children ?? [] },\n    };\n  };\n\n  const fixedElement = convertChildrenAsArray(\n    element as ReactElement<{ children?: ReactNode }>\n  );\n\n  const { type, props } = fixedElement;\n\n  // Create and return the React element\n  return createElement(\n    type ?? 'span',\n    props,\n    ...(props.children as ReactNode[])\n  );\n};\n"],"mappings":";;;;AAGA,MAAa,sBAAsB,YAA+B;AAChE,KAAI,OAAO,YAAY,SAErB,QAAO;CAGT,MAAM,0BACJ,YAC2C;AAC3C,MAAI,SAAS,SAAS,OAAO,QAAQ,MAAM,aAAa,UAAU;GAChE,MAAM,iBAA8B,EAAE;GACtC,MAAM,EAAE,aAAa,QAAQ;AAG7B,UAAO,KAAK,YAAY,EAAE,CAAC,CAAC,SAAS,QAAQ;IAC3C,MAAM,eAAe,mBACnB,WACE,KAEH;AAGD,QACE,OAAO,iBAAiB,YACxB,iBAAiB,QACjB,UAAU,aAEV,gBAAe,8BAEX,aAAa,MACb;KAAE,GAAG,aAAa;KAAO;KAAK,EAC9B,GAAI,MAAM,QAAQ,aAAa,OAAO,SAAS,GAC3C,aAAa,MAAM,WACnB,CAAC,aAAa,OAAO,SAAS,CACnC,CACF;QAED,gBAAe,KAAK,aAAa;KAEnC;AAEF,UAAO;IACL,GAAG;IACH,OAAO;KAAE,GAAG,QAAQ;KAAO,UAAU;KAAgB;IACtD;;AAGH,SAAO;GACL,GAAG;GACH,OAAO;IAAE,GAAG,QAAQ;IAAO,UAAU,QAAQ,OAAO,YAAY,EAAE;IAAE;GACrE;;CAOH,MAAM,EAAE,MAAM,UAJO,uBACnB,QACD;AAKD,iCACE,QAAQ,QACR,OACA,GAAI,MAAM,SACX"}
+{"version":3,"file":"renderReactElement.cjs","names":[],"sources":["../../../src/reactElement/renderReactElement.ts"],"sourcesContent":["import { createElement, type ReactElement, type ReactNode } from 'react';\n\n// This function recursively creates React elements from a given JSON-like structure\nexport const renderReactElement = (element: ReactElement<any>): any => {\n  if (element === null || typeof element !== 'object') {\n    return element;\n  }\n\n  const convertChildrenAsArray = (\n    element: ReactElement<{ children?: ReactNode }>\n  ): ReactElement<{ children?: ReactNode }> => {\n    const children = element.props?.children;\n\n    if (Array.isArray(children)) {\n      const childrenResult: ReactNode[] = children.map((child, index) => {\n        const renderedChild = renderReactElement(child as ReactElement<any>);\n\n        if (\n          typeof renderedChild === 'object' &&\n          renderedChild !== null &&\n          'type' in renderedChild\n        ) {\n          const childElement = renderedChild as ReactElement<any>;\n          return createElement(\n            childElement.type,\n            { ...childElement.props, key: index },\n            ...(Array.isArray(childElement.props?.children)\n              ? childElement.props.children\n              : typeof childElement.props?.children !== 'undefined'\n                ? [childElement.props.children]\n                : [])\n          );\n        }\n        return renderedChild;\n      });\n\n      return {\n        ...element,\n        props: { ...element.props, children: childrenResult },\n      };\n    } else if (typeof children !== 'undefined' && children !== null) {\n      const renderedChild = renderReactElement(children as ReactElement<any>);\n      return {\n        ...element,\n        props: { ...element.props, children: [renderedChild] },\n      };\n    }\n\n    return {\n      ...element,\n      props: { ...element.props, children: [] },\n    };\n  };\n\n  const fixedElement = convertChildrenAsArray(\n    element as ReactElement<{ children?: ReactNode }>\n  );\n\n  const { type, props } = fixedElement;\n\n  // Create and return the React element\n  return createElement(\n    type ?? 'span',\n    props,\n    ...(props.children as ReactNode[])\n  );\n};\n"],"mappings":";;;;AAGA,MAAa,sBAAsB,YAAoC;AACrE,KAAI,YAAY,QAAQ,OAAO,YAAY,SACzC,QAAO;CAGT,MAAM,0BACJ,YAC2C;EAC3C,MAAM,WAAW,QAAQ,OAAO;AAEhC,MAAI,MAAM,QAAQ,SAAS,EAAE;GAC3B,MAAM,iBAA8B,SAAS,KAAK,OAAO,UAAU;IACjE,MAAM,gBAAgB,mBAAmB,MAA2B;AAEpE,QACE,OAAO,kBAAkB,YACzB,kBAAkB,QAClB,UAAU,eACV;KACA,MAAM,eAAe;AACrB,qCACE,aAAa,MACb;MAAE,GAAG,aAAa;MAAO,KAAK;MAAO,EACrC,GAAI,MAAM,QAAQ,aAAa,OAAO,SAAS,GAC3C,aAAa,MAAM,WACnB,OAAO,aAAa,OAAO,aAAa,cACtC,CAAC,aAAa,MAAM,SAAS,GAC7B,EAAE,CACT;;AAEH,WAAO;KACP;AAEF,UAAO;IACL,GAAG;IACH,OAAO;KAAE,GAAG,QAAQ;KAAO,UAAU;KAAgB;IACtD;aACQ,OAAO,aAAa,eAAe,aAAa,MAAM;GAC/D,MAAM,gBAAgB,mBAAmB,SAA8B;AACvE,UAAO;IACL,GAAG;IACH,OAAO;KAAE,GAAG,QAAQ;KAAO,UAAU,CAAC,cAAc;KAAE;IACvD;;AAGH,SAAO;GACL,GAAG;GACH,OAAO;IAAE,GAAG,QAAQ;IAAO,UAAU,EAAE;IAAE;GAC1C;;CAOH,MAAM,EAAE,MAAM,UAJO,uBACnB,QACD;AAKD,iCACE,QAAQ,QACR,OACA,GAAI,MAAM,SACX"}

package/dist/esm/html/HTMLProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HTMLProvider.mjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\n\ntype HTMLContextValue = {\n  components?: Record<string, any>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n  /**\n   * Component overrides for HTML tags.\n   */\n  components?: Record<string, any>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n  children,\n  components,\n}) => (\n  <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":";;;;;;AAoBA,MAAM,cAAc,cAA4C,OAAU;AAE1E,MAAa,uBAAuB,WAAW,YAAY;AAE3D,MAAa,gBAAuC,EAClD,UACA,iBAEA,oBAAC,YAAY;CAAS,OAAO,EAAE,YAAY;CAAG;EAAgC"}
+{"version":3,"file":"HTMLProvider.mjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\n\ntype HTMLContextValue = {\n  components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n  /**\n   * Component overrides for HTML tags.\n   */\n  components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n  children,\n  components,\n}) => (\n  <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":";;;;;;AAqBA,MAAM,cAAc,cAA4C,OAAU;AAE1E,MAAa,uBAAuB,WAAW,YAAY;AAE3D,MAAa,gBAAuC,EAClD,UACA,iBAEA,oBAAC,YAAY;CAAS,OAAO,EAAE,YAAY;CAAG;EAAgC"}

package/dist/esm/html/HTMLRenderer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HTMLRenderer.mjs","names":[],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML, HTML_TAGS } from '@intlayer/core';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport { useHTMLContext } from './HTMLProvider';\nimport type { ReactHTMLComponent } from './types';\n\n/**\n * Type for React HTML tag components.\n */\ntype HTMLTagComponent = ReactHTMLComponent;\n\nconst createDefaultHTMLComponents = (): Record<string, HTMLTagComponent> => {\n  const components: Record<string, HTMLTagComponent> = {};\n\n  for (const tag of HTML_TAGS) {\n    components[tag] = ({ children, ...props }) =>\n      createElement(tag, props, children);\n  }\n\n  return components;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   */\n  components?: Record<string, any>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n  content: string,\n  { components }: RenderHTMLProps = {}\n): JSX.Element => {\n  const mergedComponents = {\n    ...defaultHTMLComponents,\n    ...components,\n  };\n\n  // Wrap all components to ensure they are rendered via React.createElement\n  const wrappedComponents = Object.fromEntries(\n    Object.entries(mergedComponents)\n      .filter(([, Component]) => Component)\n      .map(([key, Component]) => [\n        key,\n        (props: any) => createElement(Component as any, props),\n      ])\n  );\n\n  return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n  const context = useHTMLContext();\n\n  return (content: string) => {\n    return renderHTML(content, {\n      components: {\n        ...context?.components,\n        ...components,\n      },\n    });\n  };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n  /**\n   * The HTML content to render as a string.\n   */\n  children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n  children = '',\n  components,\n}) => {\n  const render = useHTMLRenderer({ components });\n\n  return render(children);\n};\n"],"mappings":";;;;;;;;AAYA,MAAM,oCAAsE;CAC1E,MAAM,aAA+C,EAAE;AAEvD,MAAK,MAAM,OAAO,UAChB,YAAW,QAAQ,EAAE,UAAU,GAAG,YAChC,cAAc,KAAK,OAAO,SAAS;AAGvC,QAAO;;AAGT,MAAa,wBAAwB,6BAA6B;;;;;;;AAgBlE,MAAa,cACX,SACA,EAAE,eAAgC,EAAE,KACpB;CAChB,MAAM,mBAAmB;EACvB,GAAG;EACH,GAAG;EACJ;AAYD,QAAO,oBAAC,sBAAU,QAAQ,SATA,OAAO,YAC/B,OAAO,QAAQ,iBAAiB,CAC7B,QAAQ,GAAG,eAAe,UAAU,CACpC,KAAK,CAAC,KAAK,eAAe,CACzB,MACC,UAAe,cAAc,WAAkB,MAAM,CACvD,CAAC,CACL,CAEoD,GAAY;;;;;;;;AASnE,MAAa,mBAAmB,EAAE,eAAgC,EAAE,KAAK;CACvE,MAAM,UAAU,gBAAgB;AAEhC,SAAQ,YAAoB;AAC1B,SAAO,WAAW,SAAS,EACzB,YAAY;GACV,GAAG,SAAS;GACZ,GAAG;GACJ,EACF,CAAC;;;;;;;;;AAiBN,MAAa,gBAAuC,EAClD,WAAW,IACX,iBACI;AAGJ,QAFe,gBAAgB,EAAE,YAAY,CAAC,CAEhC,SAAS"}
+{"version":3,"file":"HTMLRenderer.mjs","names":[],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML, HTML_TAGS } from '@intlayer/core';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n  const components: HTMLComponents = {};\n\n  for (const tag of HTML_TAGS) {\n    components[tag] = ({ children, ...props }) =>\n      createElement(tag, props as any, children);\n  }\n\n  return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n  /**\n   * Component overrides for HTML tags.\n   * Allows you to customize how specific HTML elements are rendered.\n   */\n  components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n  content: string,\n  { components }: RenderHTMLProps = {}\n): JSX.Element => {\n  const mergedComponents = {\n    ...defaultHTMLComponents,\n    ...components,\n  };\n\n  // Wrap all components to ensure they are rendered via React.createElement\n  const wrappedComponents = Object.fromEntries(\n    Object.entries(mergedComponents)\n      .filter(([, Component]) => Component)\n      .map(([key, Component]) => [\n        key,\n        (props: any) => createElement(Component as any, props),\n      ])\n  );\n\n  return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n  const context = useHTMLContext();\n\n  return (content: string) => {\n    return renderHTML(content, {\n      components: {\n        ...context?.components,\n        ...components,\n      },\n    });\n  };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n  /**\n   * The HTML content to render as a string.\n   */\n  children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n  children = '',\n  components,\n}) => {\n  const render = useHTMLRenderer({ components });\n\n  return render(children);\n};\n"],"mappings":";;;;;;;;AAOA,MAAM,oCAAsE;CAC1E,MAAM,aAA6B,EAAE;AAErC,MAAK,MAAM,OAAO,UAChB,YAAW,QAAQ,EAAE,UAAU,GAAG,YAChC,cAAc,KAAK,OAAc,SAAS;AAG9C,QAAO;;AAGT,MAAa,wBAAwB,6BAA6B;;;;;;;AAgBlE,MAAa,cACX,SACA,EAAE,eAAgC,EAAE,KACpB;CAChB,MAAM,mBAAmB;EACvB,GAAG;EACH,GAAG;EACJ;AAYD,QAAO,oBAAC,sBAAU,QAAQ,SATA,OAAO,YAC/B,OAAO,QAAQ,iBAAiB,CAC7B,QAAQ,GAAG,eAAe,UAAU,CACpC,KAAK,CAAC,KAAK,eAAe,CACzB,MACC,UAAe,cAAc,WAAkB,MAAM,CACvD,CAAC,CACL,CAEoD,GAAY;;;;;;;;AASnE,MAAa,mBAAmB,EAAE,eAAgC,EAAE,KAAK;CACvE,MAAM,UAAU,gBAAgB;AAEhC,SAAQ,YAAoB;AAC1B,SAAO,WAAW,SAAS,EACzB,YAAY;GACV,GAAG,SAAS;GACZ,GAAG;GACJ,EACF,CAAC;;;;;;;;;AAiBN,MAAa,gBAAuC,EAClD,WAAW,IACX,iBACI;AAGJ,QAFe,gBAAgB,EAAE,YAAY,CAAC,CAEhC,SAAS"}

package/dist/esm/markdown/MarkdownProvider.mjs

@@ -7,26 +7,14 @@ import { jsx } from "react/jsx-runtime";
 //#region src/markdown/MarkdownProvider.tsx
 const MarkdownContext = createContext(void 0);
 const useMarkdownContext = () => useContext(MarkdownContext);
-const isRenderMarkdownOptions = (override) => {
-	return override && typeof override === "object" && ("components" in override || "wrapper" in override || "forceBlock" in override || "forceInline" in override || "preserveFrontmatter" in override || "tagfilter" in override);
-};
-const mergeOptions = (baseOptions, overrides) => {
-	if (!overrides) return baseOptions;
-	if (!isRenderMarkdownOptions(overrides)) return {
-		...baseOptions,
-		components: {
-			...baseOptions.components,
-			...overrides
-		}
-	};
-	const { components: overrideComponents, wrapper, forceBlock, forceInline, preserveFrontmatter, tagfilter, ...componentsFromRest } = overrides;
-	const components = overrideComponents || componentsFromRest;
+const mergeOptions = (baseOptions, options = {}, components = {}, wrapper) => {
 	return {
 		...baseOptions,
-		forceBlock: forceBlock ?? baseOptions.forceBlock,
-		forceInline: forceInline ?? baseOptions.forceInline,
-		preserveFrontmatter: preserveFrontmatter ?? baseOptions.preserveFrontmatter,
-		tagfilter: tagfilter ?? baseOptions.tagfilter,
+		...options,
+		forceBlock: options.forceBlock ?? baseOptions.forceBlock,
+		forceInline: options.forceInline ?? baseOptions.forceInline,
+		preserveFrontmatter: options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,
+		tagfilter: options.tagfilter ?? baseOptions.tagfilter,
 		wrapper: wrapper || baseOptions.wrapper,
 		forceWrapper: !!(wrapper || baseOptions.wrapper),
 		components: {
@@ -69,12 +57,12 @@ const MarkdownProvider = ({ children, components, wrapper, forceBlock, forceInli
 		preserveFrontmatter,
 		tagfilter
 	};
-	const defaultRenderMarkdown = (markdown, overrides) => {
-		return compiler(markdown, mergeOptions(baseOptions, overrides));
+	const defaultRenderMarkdown = (markdown, options, components, wrapper) => {
+		return compiler(markdown, mergeOptions(baseOptions, options, components, wrapper));
 	};
-	const customRenderMarkdownWrapper = (markdown, overrides) => /* @__PURE__ */ jsx(MarkdownContext.Provider, {
+	const customRenderMarkdownWrapper = (markdown, options, components, wrapper) => /* @__PURE__ */ jsx(MarkdownContext.Provider, {
 		value: void 0,
-		children: customRenderFn?.(markdown, overrides)
+		children: customRenderFn?.(markdown, options, components, wrapper)
 	});
 	return /* @__PURE__ */ jsx(MarkdownContext.Provider, {
 		value: { renderMarkdown: customRenderFn ? customRenderMarkdownWrapper : defaultRenderMarkdown },

package/dist/esm/markdown/MarkdownProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownProvider.mjs","names":[],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport type { Overrides } from '@intlayer/core';\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  type ReactNode,\n  useContext,\n} from 'react';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n  /** Forces the compiler to always output content with a block-level wrapper. */\n  forceBlock?: boolean;\n  /** Forces the compiler to always output content with an inline wrapper. */\n  forceInline?: boolean;\n  /** Whether to preserve frontmatter in the markdown content. */\n  preserveFrontmatter?: boolean;\n  /** Whether to use the GitHub Tag Filter for security. */\n  tagfilter?: boolean;\n};\n\ntype RenderMarkdownOptions = MarkdownProviderOptions & {\n  components?: Overrides;\n  wrapper?: FC<any>;\n};\n\ntype MarkdownContextValue = {\n  renderMarkdown: (\n    markdown: string,\n    components?: Overrides | RenderMarkdownOptions\n  ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n  MarkdownProviderOptions & {\n    components?: Overrides;\n    wrapper?: any;\n    renderMarkdown?: (\n      markdown: string,\n      overrides?: Overrides | RenderMarkdownOptions\n    ) => ReactNode;\n  }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n  undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\n// Pure functions defined outside the component are easier for React Compiler to track\n// and don't need to be recreated on every render.\n\nconst isRenderMarkdownOptions = (\n  override: any\n): override is RenderMarkdownOptions => {\n  return (\n    override &&\n    typeof override === 'object' &&\n    ('components' in override ||\n      'wrapper' in override ||\n      'forceBlock' in override ||\n      'forceInline' in override ||\n      'preserveFrontmatter' in override ||\n      'tagfilter' in override)\n  );\n};\n\nconst mergeOptions = (\n  baseOptions: MarkdownRendererOptions,\n  overrides?: Overrides | RenderMarkdownOptions\n): MarkdownRendererOptions => {\n  if (!overrides) return baseOptions;\n\n  if (!isRenderMarkdownOptions(overrides)) {\n    // Overrides is just a component map\n    return {\n      ...baseOptions,\n      components: { ...baseOptions.components, ...overrides },\n    };\n  }\n\n  // Overrides is a full options object\n  const {\n    components: overrideComponents,\n    wrapper,\n    forceBlock,\n    forceInline,\n    preserveFrontmatter,\n    tagfilter,\n    ...componentsFromRest\n  } = overrides;\n\n  const components = overrideComponents || componentsFromRest;\n\n  return {\n    ...baseOptions,\n    forceBlock: forceBlock ?? baseOptions.forceBlock,\n    forceInline: forceInline ?? baseOptions.forceInline,\n    preserveFrontmatter: preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n    tagfilter: tagfilter ?? baseOptions.tagfilter,\n    wrapper: wrapper || baseOptions.wrapper,\n\n    forceWrapper: !!(wrapper || baseOptions.wrapper),\n    components: { ...baseOptions.components, ...components },\n  };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n *   <div>\n *     {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n *   </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n *   <MarkdownRenderer>\n *     {markdownContent}\n *   </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n  children,\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown: customRenderFn,\n}) => {\n  const baseOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  // Standard internal renderer\n  const defaultRenderMarkdown = (\n    markdown: string,\n    overrides?: Overrides | RenderMarkdownOptions\n  ) => {\n    const mergedOptions = mergeOptions(baseOptions, overrides);\n    return compiler(markdown, mergedOptions);\n  };\n\n  // Wrapper for user-provided custom renderer\n  // Note: We wrap in a clean Provider to prevent infinite recursion\n  const customRenderMarkdownWrapper = (\n    markdown: string,\n    overrides?: Overrides | RenderMarkdownOptions\n  ) => (\n    <MarkdownContext.Provider value={undefined}>\n      {customRenderFn?.(markdown, overrides)}\n    </MarkdownContext.Provider>\n  );\n\n  return (\n    <MarkdownContext.Provider\n      value={{\n        renderMarkdown: customRenderFn\n          ? customRenderMarkdownWrapper\n          : defaultRenderMarkdown,\n      }}\n    >\n      {children}\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;AA8CA,MAAM,kBAAkB,cACtB,OACD;AAED,MAAa,2BAA2B,WAAW,gBAAgB;AAKnE,MAAM,2BACJ,aACsC;AACtC,QACE,YACA,OAAO,aAAa,aACnB,gBAAgB,YACf,aAAa,YACb,gBAAgB,YAChB,iBAAiB,YACjB,yBAAyB,YACzB,eAAe;;AAIrB,MAAM,gBACJ,aACA,cAC4B;AAC5B,KAAI,CAAC,UAAW,QAAO;AAEvB,KAAI,CAAC,wBAAwB,UAAU,CAErC,QAAO;EACL,GAAG;EACH,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAW;EACxD;CAIH,MAAM,EACJ,YAAY,oBACZ,SACA,YACA,aACA,qBACA,WACA,GAAG,uBACD;CAEJ,MAAM,aAAa,sBAAsB;AAEzC,QAAO;EACL,GAAG;EACH,YAAY,cAAc,YAAY;EACtC,aAAa,eAAe,YAAY;EACxC,qBAAqB,uBAAuB,YAAY;EACxD,WAAW,aAAa,YAAY;EACpC,SAAS,WAAW,YAAY;EAEhC,cAAc,CAAC,EAAE,WAAW,YAAY;EACxC,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAY;EACzD;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BH,MAAa,oBAA+C,EAC1D,UACA,YACA,SACA,YACA,aACA,qBACA,WACA,gBAAgB,qBACZ;CACJ,MAAM,cAAuC;EAC3C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD;CAGD,MAAM,yBACJ,UACA,cACG;AAEH,SAAO,SAAS,UADM,aAAa,aAAa,UAAU,CAClB;;CAK1C,MAAM,+BACJ,UACA,cAEA,oBAAC,gBAAgB;EAAS,OAAO;YAC9B,iBAAiB,UAAU,UAAU;GACb;AAG7B,QACE,oBAAC,gBAAgB;EACf,OAAO,EACL,gBAAgB,iBACZ,8BACA,uBACL;EAEA;GACwB"}
+{"version":3,"file":"MarkdownProvider.mjs","names":[],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type FC,\n  type HTMLAttributes,\n  type PropsWithChildren,\n  type ReactNode,\n  useContext,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n  /** Forces the compiler to always output content with a block-level wrapper. */\n  forceBlock?: boolean;\n  /** Forces the compiler to always output content with an inline wrapper. */\n  forceInline?: boolean;\n  /** Whether to preserve frontmatter in the markdown content. */\n  preserveFrontmatter?: boolean;\n  /** Whether to use the GitHub Tag Filter for security. */\n  tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n  renderMarkdown: (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n  MarkdownProviderOptions & {\n    components?: HTMLComponents<'permissive', {}>;\n    wrapper?: FC<HTMLAttributes<HTMLElement>>;\n    renderMarkdown?: (\n      markdown: string,\n      options?: MarkdownProviderOptions,\n      components?: HTMLComponents<'permissive', {}>,\n      wrapper?: FC<HTMLAttributes<HTMLElement>>\n    ) => ReactNode;\n  }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n  undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n  baseOptions: MarkdownRendererOptions,\n  options: MarkdownProviderOptions = {},\n  components: HTMLComponents<'permissive', {}> = {},\n  wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n  return {\n    ...baseOptions,\n    ...options,\n    forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n    forceInline: options.forceInline ?? baseOptions.forceInline,\n    preserveFrontmatter:\n      options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n    tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n    wrapper: wrapper || baseOptions.wrapper,\n\n    forceWrapper: !!(wrapper || baseOptions.wrapper),\n    components: { ...baseOptions.components, ...components },\n  };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n *   <div>\n *     {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n *   </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n *   <MarkdownRenderer>\n *     {markdownContent}\n *   </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n  children,\n  components,\n  wrapper,\n  forceBlock,\n  forceInline,\n  preserveFrontmatter,\n  tagfilter,\n  renderMarkdown: customRenderFn,\n}) => {\n  const baseOptions: MarkdownRendererOptions = {\n    components,\n    forceBlock,\n    forceInline,\n    wrapper,\n    forceWrapper: !!wrapper,\n    preserveFrontmatter,\n    tagfilter,\n  };\n\n  // Standard internal renderer\n  const defaultRenderMarkdown = (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => {\n    const mergedOptions = mergeOptions(\n      baseOptions,\n      options,\n      components,\n      wrapper\n    );\n\n    return compiler(markdown, mergedOptions);\n  };\n\n  // Wrapper for user-provided custom renderer\n  // Note: We wrap in a clean Provider to prevent infinite recursion\n  const customRenderMarkdownWrapper = (\n    markdown: string,\n    options?: MarkdownProviderOptions,\n    components?: HTMLComponents<'permissive', {}>,\n    wrapper?: FC<HTMLAttributes<HTMLElement>>\n  ) => (\n    <MarkdownContext.Provider value={undefined}>\n      {customRenderFn?.(markdown, options, components, wrapper)}\n    </MarkdownContext.Provider>\n  );\n\n  return (\n    <MarkdownContext.Provider\n      value={{\n        renderMarkdown: customRenderFn\n          ? customRenderMarkdownWrapper\n          : defaultRenderMarkdown,\n      }}\n    >\n      {children}\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;AA8CA,MAAM,kBAAkB,cACtB,OACD;AAED,MAAa,2BAA2B,WAAW,gBAAgB;AAEnE,MAAM,gBACJ,aACA,UAAmC,EAAE,EACrC,aAA+C,EAAE,EACjD,YAC4B;AAC5B,QAAO;EACL,GAAG;EACH,GAAG;EACH,YAAY,QAAQ,cAAc,YAAY;EAC9C,aAAa,QAAQ,eAAe,YAAY;EAChD,qBACE,QAAQ,uBAAuB,YAAY;EAC7C,WAAW,QAAQ,aAAa,YAAY;EAC5C,SAAS,WAAW,YAAY;EAEhC,cAAc,CAAC,EAAE,WAAW,YAAY;EACxC,YAAY;GAAE,GAAG,YAAY;GAAY,GAAG;GAAY;EACzD;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BH,MAAa,oBAA+C,EAC1D,UACA,YACA,SACA,YACA,aACA,qBACA,WACA,gBAAgB,qBACZ;CACJ,MAAM,cAAuC;EAC3C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD;CAGD,MAAM,yBACJ,UACA,SACA,YACA,YACG;AAQH,SAAO,SAAS,UAPM,aACpB,aACA,SACA,YACA,QACD,CAEuC;;CAK1C,MAAM,+BACJ,UACA,SACA,YACA,YAEA,oBAAC,gBAAgB;EAAS,OAAO;YAC9B,iBAAiB,UAAU,SAAS,YAAY,QAAQ;GAChC;AAG7B,QACE,oBAAC,gBAAgB;EACf,OAAO,EACL,gBAAgB,iBACZ,8BACA,uBACL;EAEA;GACwB"}

package/dist/esm/markdown/MarkdownRenderer.mjs

@@ -88,13 +88,11 @@ const useMarkdownRenderer = ({ components, wrapper, forceBlock, forceInline, pre
 	const context = useMarkdownContext();
 	return (content) => {
 		if (context) return context.renderMarkdown(content, {
-			components,
-			wrapper,
 			forceBlock,
 			forceInline,
 			preserveFrontmatter,
 			tagfilter
-		});
+		}, components, wrapper);
 		return renderMarkdown(content, {
 			components,
 			wrapper,
@@ -177,13 +175,11 @@ const MarkdownRenderer = ({ children = "", components, wrapper, forceBlock, forc
 		tagfilter
 	}) });
 	if (context) return /* @__PURE__ */ jsx(Fragment, { children: context.renderMarkdown(children, {
-		components,
-		wrapper,
 		forceBlock,
 		forceInline,
 		preserveFrontmatter,
 		tagfilter
-	}) });
+	}, components, wrapper) });
 	return /* @__PURE__ */ jsx(Fragment, { children: compiler(children, {
 		components,
 		forceBlock,