@opensite/ui 3.0.4 → 3.0.5

package/dist/article-breadcrumb-social.cjs

@@ -10,7 +10,7 @@ var icon = require('@page-speed/icon');
 var jsxRuntime = require('react/jsx-runtime');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
 var reactSlot = require('@radix-ui/react-slot');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 var socialShare = require('@page-speed/social-share');
 
 function _interopNamespace(e) {
@@ -572,6 +572,7 @@ function ArticleBreadcrumbSocialComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking,
   enableBackToTop,
   optixFlowConfig,
@@ -735,12 +736,13 @@ function ArticleBreadcrumbSocialComponent({
                   authorContent,
                   heroMediaContent,
                   renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                    markdownToJsx.Markdown,
+                    core.Markdown,
                     {
                       overrides: {
                         img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                         a: pressable.Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,

package/dist/article-breadcrumb-social.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -129,6 +130,11 @@ interface ArticleBreadcrumbSocialProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based TOC tracking
      */
@@ -162,6 +168,6 @@ interface ArticleBreadcrumbSocialProps {
      */
     patternClassName?: string;
 }
-declare function ArticleBreadcrumbSocialComponent({ className, breadcrumbClassName, articleClassName, sidebarClassName, titleClassName, authorClassName, heroImageClassName, tocClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, description, author, authorSlot, publishDate, readTime, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, enableTocTracking, enableBackToTop, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleBreadcrumbSocialProps): react_jsx_runtime.JSX.Element;
+declare function ArticleBreadcrumbSocialComponent({ className, breadcrumbClassName, articleClassName, sidebarClassName, titleClassName, authorClassName, heroImageClassName, tocClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, description, author, authorSlot, publishDate, readTime, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, enableBackToTop, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleBreadcrumbSocialProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleBreadcrumbSection, ArticleBreadcrumbSocialComponent as ArticleBreadcrumbSocial, type ArticleBreadcrumbSocialProps };

package/dist/article-breadcrumb-social.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -129,6 +130,11 @@ interface ArticleBreadcrumbSocialProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based TOC tracking
      */
@@ -162,6 +168,6 @@ interface ArticleBreadcrumbSocialProps {
      */
     patternClassName?: string;
 }
-declare function ArticleBreadcrumbSocialComponent({ className, breadcrumbClassName, articleClassName, sidebarClassName, titleClassName, authorClassName, heroImageClassName, tocClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, description, author, authorSlot, publishDate, readTime, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, enableTocTracking, enableBackToTop, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleBreadcrumbSocialProps): react_jsx_runtime.JSX.Element;
+declare function ArticleBreadcrumbSocialComponent({ className, breadcrumbClassName, articleClassName, sidebarClassName, titleClassName, authorClassName, heroImageClassName, tocClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, description, author, authorSlot, publishDate, readTime, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, enableBackToTop, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleBreadcrumbSocialProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleBreadcrumbSection, ArticleBreadcrumbSocialComponent as ArticleBreadcrumbSocial, type ArticleBreadcrumbSocialProps };

package/dist/article-breadcrumb-social.js

@@ -9,7 +9,7 @@ import { Icon } from '@page-speed/icon';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { Slot } from '@radix-ui/react-slot';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import { SocialShare } from '@page-speed/social-share';
 
 // components/blocks/article/article-breadcrumb-social.tsx
@@ -550,6 +550,7 @@ function ArticleBreadcrumbSocialComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking,
   enableBackToTop,
   optixFlowConfig,
@@ -719,6 +720,7 @@ function ArticleBreadcrumbSocialComponent({
                         img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                         a: Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,

package/dist/article-chapters-author.cjs

@@ -10,7 +10,7 @@ var icon = require('@page-speed/icon');
 var jsxRuntime = require('react/jsx-runtime');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
 var reactSlot = require('@radix-ui/react-slot');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 var usePlatformFromUrl = require('@opensite/hooks/usePlatformFromUrl');
 var socialShare = require('@page-speed/social-share');
 
@@ -666,6 +666,7 @@ function ArticleChaptersAuthorComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableChapterTracking = true,
   optixFlowConfig,
   background,
@@ -919,12 +920,13 @@ function ArticleChaptersAuthorComponent({
               children: [
                 heroMediaContent,
                 renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                  markdownToJsx.Markdown,
+                  core.Markdown,
                   {
                     overrides: {
                       img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                       a: pressable.Pressable
                     },
+                    markdownStyles,
                     children: markdownString
                   }
                 ) : children,

package/dist/article-chapters-author.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { j as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -157,6 +158,11 @@ interface ArticleChaptersAuthorProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based chapter tracking
      * @default true
@@ -187,6 +193,6 @@ interface ArticleChaptersAuthorProps {
      */
     patternClassName?: string;
 }
-declare function ArticleChaptersAuthorComponent({ className, breadcrumbClassName, headerClassName, titleClassName, subtitleClassName, sidebarClassName, articleClassName, chaptersClassName, authorClassName, conclusionClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, subtitle, chapters, chaptersSlot, renderChapterLink, author, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionSlot, children, renderMode, markdownString, enableChapterTracking, optixFlowConfig, background, containerClassName, spacing, patternClassName, pattern, patternOpacity, }: ArticleChaptersAuthorProps): react_jsx_runtime.JSX.Element;
+declare function ArticleChaptersAuthorComponent({ className, breadcrumbClassName, headerClassName, titleClassName, subtitleClassName, sidebarClassName, articleClassName, chaptersClassName, authorClassName, conclusionClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, subtitle, chapters, chaptersSlot, renderChapterLink, author, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionSlot, children, renderMode, markdownString, markdownStyles, enableChapterTracking, optixFlowConfig, background, containerClassName, spacing, patternClassName, pattern, patternOpacity, }: ArticleChaptersAuthorProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleAuthor, type ArticleChapter, ArticleChaptersAuthorComponent as ArticleChaptersAuthor, type ArticleChaptersAuthorProps };

package/dist/article-chapters-author.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { j as SocialLinkItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -157,6 +158,11 @@ interface ArticleChaptersAuthorProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based chapter tracking
      * @default true
@@ -187,6 +193,6 @@ interface ArticleChaptersAuthorProps {
      */
     patternClassName?: string;
 }
-declare function ArticleChaptersAuthorComponent({ className, breadcrumbClassName, headerClassName, titleClassName, subtitleClassName, sidebarClassName, articleClassName, chaptersClassName, authorClassName, conclusionClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, subtitle, chapters, chaptersSlot, renderChapterLink, author, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionSlot, children, renderMode, markdownString, enableChapterTracking, optixFlowConfig, background, containerClassName, spacing, patternClassName, pattern, patternOpacity, }: ArticleChaptersAuthorProps): react_jsx_runtime.JSX.Element;
+declare function ArticleChaptersAuthorComponent({ className, breadcrumbClassName, headerClassName, titleClassName, subtitleClassName, sidebarClassName, articleClassName, chaptersClassName, authorClassName, conclusionClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, subtitle, chapters, chaptersSlot, renderChapterLink, author, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, conclusionTitle, conclusionDescription, conclusionActions, conclusionSlot, children, renderMode, markdownString, markdownStyles, enableChapterTracking, optixFlowConfig, background, containerClassName, spacing, patternClassName, pattern, patternOpacity, }: ArticleChaptersAuthorProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleAuthor, type ArticleChapter, ArticleChaptersAuthorComponent as ArticleChaptersAuthor, type ArticleChaptersAuthorProps };

package/dist/article-chapters-author.js

@@ -9,7 +9,7 @@ import { Icon } from '@page-speed/icon';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { Slot } from '@radix-ui/react-slot';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import { usePlatformFromUrl } from '@opensite/hooks/usePlatformFromUrl';
 import { SocialShare } from '@page-speed/social-share';
 
@@ -644,6 +644,7 @@ function ArticleChaptersAuthorComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableChapterTracking = true,
   optixFlowConfig,
   background,
@@ -903,6 +904,7 @@ function ArticleChaptersAuthorComponent({
                       img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                       a: Pressable
                     },
+                    markdownStyles,
                     children: markdownString
                   }
                 ) : children,

package/dist/article-compact-toc.cjs

@@ -10,7 +10,7 @@ var icon = require('@page-speed/icon');
 var jsxRuntime = require('react/jsx-runtime');
 var reactSlot = require('@radix-ui/react-slot');
 var SeparatorPrimitive = require('@radix-ui/react-separator');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 var PopoverPrimitive = require('@radix-ui/react-popover');
 var socialShare = require('@page-speed/social-share');
 
@@ -579,6 +579,7 @@ function ArticleCompactTocComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -762,12 +763,13 @@ function ArticleCompactTocComponent({
                 children: [
                   heroMediaContent,
                   renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                    markdownToJsx.Markdown,
+                    core.Markdown,
                     {
                       overrides: {
                         img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                         a: pressable.Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,

package/dist/article-compact-toc.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -124,6 +125,11 @@ interface ArticleCompactTocProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based section tracking
      * @default true
@@ -154,6 +160,6 @@ interface ArticleCompactTocProps {
      */
     patternClassName?: string;
 }
-declare function ArticleCompactTocComponent({ className, breadcrumbClassName, contentClassName, titleClassName, metaClassName, tocClassName, articleClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, authorName, authorHref, publishDate, readTime, sections, tocSlot, renderSectionLink, description, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleCompactTocProps): react_jsx_runtime.JSX.Element;
+declare function ArticleCompactTocComponent({ className, breadcrumbClassName, contentClassName, titleClassName, metaClassName, tocClassName, articleClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, authorName, authorHref, publishDate, readTime, sections, tocSlot, renderSectionLink, description, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleCompactTocProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleCompactTocComponent as ArticleCompactToc, type ArticleCompactTocProps, type ArticleCompactTocSection };

package/dist/article-compact-toc.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -124,6 +125,11 @@ interface ArticleCompactTocProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based section tracking
      * @default true
@@ -154,6 +160,6 @@ interface ArticleCompactTocProps {
      */
     patternClassName?: string;
 }
-declare function ArticleCompactTocComponent({ className, breadcrumbClassName, contentClassName, titleClassName, metaClassName, tocClassName, articleClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, authorName, authorHref, publishDate, readTime, sections, tocSlot, renderSectionLink, description, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleCompactTocProps): react_jsx_runtime.JSX.Element;
+declare function ArticleCompactTocComponent({ className, breadcrumbClassName, contentClassName, titleClassName, metaClassName, tocClassName, articleClassName, heroImageClassName, breadcrumbs, breadcrumbsSlot, currentPage, title, authorName, authorHref, publishDate, readTime, sections, tocSlot, renderSectionLink, description, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleCompactTocProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleCompactTocComponent as ArticleCompactToc, type ArticleCompactTocProps, type ArticleCompactTocSection };

package/dist/article-compact-toc.js

@@ -9,7 +9,7 @@ import { Icon } from '@page-speed/icon';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { SocialShare } from '@page-speed/social-share';
 
@@ -556,6 +556,7 @@ function ArticleCompactTocComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -745,6 +746,7 @@ function ArticleCompactTocComponent({
                         img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                         a: Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,

package/dist/article-hero-prose.cjs

@@ -3,14 +3,14 @@
 
 var socialShare = require('@page-speed/social-share');
 var React3 = require('react');
-var dateFns = require('date-fns');
+var format = require('date-fns/format');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
 var pressable = require('@page-speed/pressable');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
 var jsxRuntime = require('react/jsx-runtime');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -479,6 +479,7 @@ function ArticleHeroProseComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   dateFormat = "MMMM d, yyyy",
   optixFlowConfig,
   background,
@@ -515,7 +516,7 @@ function ArticleHeroProseComponent({
             /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: authorHref || "#", className: "font-semibold", children: authorName }),
             pubDate && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1", children: [
               "on ",
-              dateFns.format(pubDate, dateFormat)
+              format.format(pubDate, dateFormat)
             ] })
           ] })
         ]
@@ -598,12 +599,13 @@ function ArticleHeroProseComponent({
               proseClassName
             ),
             children: renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-              markdownToJsx.Markdown,
+              core.Markdown,
               {
                 overrides: {
                   img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                   a: pressable.Pressable
                 },
+                markdownStyles,
                 children: markdownString
               }
             ) : children

package/dist/article-hero-prose.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -73,6 +74,11 @@ interface ArticleHeroProseProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Date format string (date-fns format)
      * @default "MMMM d, yyyy"
@@ -99,6 +105,6 @@ interface ArticleHeroProseProps {
      */
     patternOpacity?: number;
 }
-declare function ArticleHeroProseComponent({ post, className, headerClassName, titleClassName, descriptionClassName, authorClassName, heroImageClassName, proseClassName, heroMediaSlot, authorSlot, children, renderMode, markdownString, dateFormat, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: ArticleHeroProseProps): react_jsx_runtime.JSX.Element;
+declare function ArticleHeroProseComponent({ post, className, headerClassName, titleClassName, descriptionClassName, authorClassName, heroImageClassName, proseClassName, heroMediaSlot, authorSlot, children, renderMode, markdownString, markdownStyles, dateFormat, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: ArticleHeroProseProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleHeroProseComponent as ArticleHeroProse, type ArticleHeroProsePost, type ArticleHeroProseProps };

package/dist/article-hero-prose.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -73,6 +74,11 @@ interface ArticleHeroProseProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Date format string (date-fns format)
      * @default "MMMM d, yyyy"
@@ -99,6 +105,6 @@ interface ArticleHeroProseProps {
      */
     patternOpacity?: number;
 }
-declare function ArticleHeroProseComponent({ post, className, headerClassName, titleClassName, descriptionClassName, authorClassName, heroImageClassName, proseClassName, heroMediaSlot, authorSlot, children, renderMode, markdownString, dateFormat, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: ArticleHeroProseProps): react_jsx_runtime.JSX.Element;
+declare function ArticleHeroProseComponent({ post, className, headerClassName, titleClassName, descriptionClassName, authorClassName, heroImageClassName, proseClassName, heroMediaSlot, authorSlot, children, renderMode, markdownString, markdownStyles, dateFormat, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, }: ArticleHeroProseProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleHeroProseComponent as ArticleHeroProse, type ArticleHeroProsePost, type ArticleHeroProseProps };

package/dist/article-hero-prose.js

@@ -2,14 +2,14 @@
 import { SocialShare } from '@page-speed/social-share';
 import * as React3 from 'react';
 import React3__default from 'react';
-import { format } from 'date-fns';
+import { format } from 'date-fns/format';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { Img } from '@page-speed/img';
 import { Pressable } from '@page-speed/pressable';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 
 // components/blocks/article/article-hero-prose.tsx
 function cn(...inputs) {
@@ -457,6 +457,7 @@ function ArticleHeroProseComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   dateFormat = "MMMM d, yyyy",
   optixFlowConfig,
   background,
@@ -582,6 +583,7 @@ function ArticleHeroProseComponent({
                   img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                   a: Pressable
                 },
+                markdownStyles,
                 children: markdownString
               }
             ) : children

package/dist/article-sidebar-sticky.cjs

@@ -9,7 +9,7 @@ var pressable = require('@page-speed/pressable');
 var icon = require('@page-speed/icon');
 var jsxRuntime = require('react/jsx-runtime');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 var socialShare = require('@page-speed/social-share');
 
 function _interopNamespace(e) {
@@ -499,6 +499,7 @@ function ArticleSidebarStickyComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   optixFlowConfig,
   background,
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
@@ -620,12 +621,13 @@ function ArticleSidebarStickyComponent({
               sidebarContent ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "not-prose mt-4 lg:hidden", children: sidebarContent }) : null,
               heroMediaContent,
               renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                markdownToJsx.Markdown,
+                core.Markdown,
                 {
                   overrides: {
                     img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                     a: pressable.Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,

package/dist/article-sidebar-sticky.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -112,6 +113,11 @@ interface ArticleSidebarStickyProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Sidebar content
      */
@@ -137,6 +143,6 @@ interface ArticleSidebarStickyProps {
      */
     patternOpacity?: number;
 }
-declare function ArticleSidebarStickyComponent({ className, sidebarClassName, articleClassName, titleClassName, authorClassName, heroImageClassName, backLinkClassName, backHref, backText, backIcon, backLinkSlot, title, summary, summaryClassName, authorName, authorImage, authorHref, publishDate, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, sidebarContent, }: ArticleSidebarStickyProps): react_jsx_runtime.JSX.Element;
+declare function ArticleSidebarStickyComponent({ className, sidebarClassName, articleClassName, titleClassName, authorClassName, heroImageClassName, backLinkClassName, backHref, backText, backIcon, backLinkSlot, title, summary, summaryClassName, authorName, authorImage, authorHref, publishDate, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, sidebarContent, }: ArticleSidebarStickyProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleSidebarStickyComponent as ArticleSidebarSticky, type ArticleSidebarStickyProps };

package/dist/article-sidebar-sticky.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -112,6 +113,11 @@ interface ArticleSidebarStickyProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Sidebar content
      */
@@ -137,6 +143,6 @@ interface ArticleSidebarStickyProps {
      */
     patternOpacity?: number;
 }
-declare function ArticleSidebarStickyComponent({ className, sidebarClassName, articleClassName, titleClassName, authorClassName, heroImageClassName, backLinkClassName, backHref, backText, backIcon, backLinkSlot, title, summary, summaryClassName, authorName, authorImage, authorHref, publishDate, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, sidebarContent, }: ArticleSidebarStickyProps): react_jsx_runtime.JSX.Element;
+declare function ArticleSidebarStickyComponent({ className, sidebarClassName, articleClassName, titleClassName, authorClassName, heroImageClassName, backLinkClassName, backHref, backText, backIcon, backLinkSlot, title, summary, summaryClassName, authorName, authorImage, authorHref, publishDate, authorSlot, heroImageSrc, heroImageAlt, heroMediaSlot, children, renderMode, markdownString, markdownStyles, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, sidebarContent, }: ArticleSidebarStickyProps): react_jsx_runtime.JSX.Element;
 
 export { ArticleSidebarStickyComponent as ArticleSidebarSticky, type ArticleSidebarStickyProps };

package/dist/article-sidebar-sticky.js

@@ -8,7 +8,7 @@ import { Pressable } from '@page-speed/pressable';
 import { Icon } from '@page-speed/icon';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import { SocialShare } from '@page-speed/social-share';
 
 // components/blocks/article/article-sidebar-sticky.tsx
@@ -477,6 +477,7 @@ function ArticleSidebarStickyComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   optixFlowConfig,
   background,
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
@@ -604,6 +605,7 @@ function ArticleSidebarStickyComponent({
                     img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                     a: Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,

package/dist/article-toc-sidebar.cjs

@@ -10,7 +10,7 @@ var AvatarPrimitive = require('@radix-ui/react-avatar');
 var jsxRuntime = require('react/jsx-runtime');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var core = require('@page-speed/markdown-to-jsx/core');
 var socialShare = require('@page-speed/social-share');
 
 function _interopNamespace(e) {
@@ -532,6 +532,7 @@ function ArticleTocSidebarComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -718,12 +719,13 @@ function ArticleTocSidebarComponent({
               ] }),
               heroMediaContent,
               renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                markdownToJsx.Markdown,
+                core.Markdown,
                 {
                   overrides: {
                     img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                     a: pressable.Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,

package/dist/article-toc-sidebar.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
 import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
@@ -148,6 +149,11 @@ interface ArticleTocSidebarProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based section tracking
      * @default true
@@ -178,6 +184,6 @@ interface ArticleTocSidebarProps {
      */
     patternClassName?: string;
 }
-declare function ArticleTocSidebarComponent({ className, articleClassName, sidebarClassName, headerClassName, titleClassName, descriptionClassName, authorClassName, tocClassName, ctaClassName, heroImageClassName, title, description, authorName, authorImage, authorHref, publishDate, readTime, authorSlot, category, categorySlot, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, ctaTitle, ctaDescription, ctaActions, ctaSlot, children, renderMode, markdownString, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleTocSidebarProps): react_jsx_runtime.JSX.Element;
+declare function ArticleTocSidebarComponent({ className, articleClassName, sidebarClassName, headerClassName, titleClassName, descriptionClassName, authorClassName, tocClassName, ctaClassName, heroImageClassName, title, description, authorName, authorImage, authorHref, publishDate, readTime, authorSlot, category, categorySlot, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, ctaTitle, ctaDescription, ctaActions, ctaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleTocSidebarProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleTocSection, ArticleTocSidebarComponent as ArticleTocSidebar, type ArticleTocSidebarProps };

package/dist/article-toc-sidebar.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
+import { MarkdownStylesMap } from '@page-speed/markdown-to-jsx';
 import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
 import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
@@ -148,6 +149,11 @@ interface ArticleTocSidebarProps {
      * Markdown string to render (when renderMode is "markdown")
      */
     markdownString?: string;
+    /**
+     * Custom className mappings for markdown elements
+     * @example { h2: 'text-3xl font-bold', img: 'rounded-lg shadow-md' }
+     */
+    markdownStyles?: MarkdownStylesMap;
     /**
      * Enable scroll-based section tracking
      * @default true
@@ -178,6 +184,6 @@ interface ArticleTocSidebarProps {
      */
     patternClassName?: string;
 }
-declare function ArticleTocSidebarComponent({ className, articleClassName, sidebarClassName, headerClassName, titleClassName, descriptionClassName, authorClassName, tocClassName, ctaClassName, heroImageClassName, title, description, authorName, authorImage, authorHref, publishDate, readTime, authorSlot, category, categorySlot, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, ctaTitle, ctaDescription, ctaActions, ctaSlot, children, renderMode, markdownString, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleTocSidebarProps): react_jsx_runtime.JSX.Element;
+declare function ArticleTocSidebarComponent({ className, articleClassName, sidebarClassName, headerClassName, titleClassName, descriptionClassName, authorClassName, tocClassName, ctaClassName, heroImageClassName, title, description, authorName, authorImage, authorHref, publishDate, readTime, authorSlot, category, categorySlot, sections, tocSlot, renderSectionLink, heroImageSrc, heroImageAlt, heroMediaSlot, ctaTitle, ctaDescription, ctaActions, ctaSlot, children, renderMode, markdownString, markdownStyles, enableTocTracking, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: ArticleTocSidebarProps): react_jsx_runtime.JSX.Element;
 
 export { type ArticleTocSection, ArticleTocSidebarComponent as ArticleTocSidebar, type ArticleTocSidebarProps };

package/dist/article-toc-sidebar.js

@@ -9,7 +9,7 @@ import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import { SocialShare } from '@page-speed/social-share';
 
 // components/blocks/article/article-toc-sidebar.tsx
@@ -510,6 +510,7 @@ function ArticleTocSidebarComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -702,6 +703,7 @@ function ArticleTocSidebarComponent({
                     img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                     a: Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,

package/dist/registry.cjs

@@ -28,8 +28,8 @@ var AspectRatioPrimitive = require('@radix-ui/react-aspect-ratio');
 var CheckboxPrimitive = require('@radix-ui/react-checkbox');
 var LabelPrimitive = require('@radix-ui/react-label');
 var socialShare = require('@page-speed/social-share');
-var dateFns = require('date-fns');
-var markdownToJsx = require('@page-speed/markdown-to-jsx');
+var format = require('date-fns/format');
+var core = require('@page-speed/markdown-to-jsx/core');
 var DialogPrimitive = require('@radix-ui/react-dialog');
 var forms = require('@page-speed/forms');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
@@ -37317,6 +37317,7 @@ function ArticleHeroProseComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   dateFormat = "MMMM d, yyyy",
   optixFlowConfig,
   background,
@@ -37353,7 +37354,7 @@ function ArticleHeroProseComponent({
             /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: authorHref || "#", className: "font-semibold", children: authorName }),
             pubDate && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1", children: [
               "on ",
-              dateFns.format(pubDate, dateFormat)
+              format.format(pubDate, dateFormat)
             ] })
           ] })
         ]
@@ -37436,12 +37437,13 @@ function ArticleHeroProseComponent({
               proseClassName
             ),
             children: renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-              markdownToJsx.Markdown,
+              core.Markdown,
               {
                 overrides: {
                   img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                   a: pressable.Pressable
                 },
+                markdownStyles,
                 children: markdownString
               }
             ) : children
@@ -37487,6 +37489,7 @@ function ArticleSidebarStickyComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   optixFlowConfig,
   background,
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
@@ -37608,12 +37611,13 @@ function ArticleSidebarStickyComponent({
               sidebarContent ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "not-prose mt-4 lg:hidden", children: sidebarContent }) : null,
               heroMediaContent,
               renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                markdownToJsx.Markdown,
+                core.Markdown,
                 {
                   overrides: {
                     img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                     a: pressable.Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,
@@ -37668,6 +37672,7 @@ function ArticleTocSidebarComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -37854,12 +37859,13 @@ function ArticleTocSidebarComponent({
               ] }),
               heroMediaContent,
               renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                markdownToJsx.Markdown,
+                core.Markdown,
                 {
                   overrides: {
                     img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                     a: pressable.Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,
@@ -37911,6 +37917,7 @@ function ArticleBreadcrumbSocialComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking,
   enableBackToTop,
   optixFlowConfig,
@@ -38074,12 +38081,13 @@ function ArticleBreadcrumbSocialComponent({
                   authorContent,
                   heroMediaContent,
                   renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                    markdownToJsx.Markdown,
+                    core.Markdown,
                     {
                       overrides: {
                         img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                         a: pressable.Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,
@@ -38139,6 +38147,7 @@ function ArticleCompactTocComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -38322,12 +38331,13 @@ function ArticleCompactTocComponent({
                 children: [
                   heroMediaContent,
                   renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                    markdownToJsx.Markdown,
+                    core.Markdown,
                     {
                       overrides: {
                         img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                         a: pressable.Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,
@@ -38383,6 +38393,7 @@ function ArticleChaptersAuthorComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableChapterTracking = true,
   optixFlowConfig,
   background,
@@ -38636,12 +38647,13 @@ function ArticleChaptersAuthorComponent({
               children: [
                 heroMediaContent,
                 renderMode === "markdown" && markdownString ? /* @__PURE__ */ jsxRuntime.jsx(
-                  markdownToJsx.Markdown,
+                  core.Markdown,
                   {
                     overrides: {
                       img: (props) => /* @__PURE__ */ jsxRuntime.jsx(img.Img, { ...props, optixFlowConfig }),
                       a: pressable.Pressable
                     },
+                    markdownStyles,
                     children: markdownString
                   }
                 ) : children,

package/dist/registry.js

@@ -27,8 +27,8 @@ import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { SocialShare } from '@page-speed/social-share';
-import { format } from 'date-fns';
-import { Markdown } from '@page-speed/markdown-to-jsx';
+import { format } from 'date-fns/format';
+import { Markdown } from '@page-speed/markdown-to-jsx/core';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { Form, useForm, Field } from '@page-speed/forms';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
@@ -37277,6 +37277,7 @@ function ArticleHeroProseComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   dateFormat = "MMMM d, yyyy",
   optixFlowConfig,
   background,
@@ -37402,6 +37403,7 @@ function ArticleHeroProseComponent({
                   img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                   a: Pressable
                 },
+                markdownStyles,
                 children: markdownString
               }
             ) : children
@@ -37447,6 +37449,7 @@ function ArticleSidebarStickyComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   optixFlowConfig,
   background,
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
@@ -37574,6 +37577,7 @@ function ArticleSidebarStickyComponent({
                     img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                     a: Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,
@@ -37628,6 +37632,7 @@ function ArticleTocSidebarComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -37820,6 +37825,7 @@ function ArticleTocSidebarComponent({
                     img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                     a: Pressable
                   },
+                  markdownStyles,
                   children: markdownString
                 }
               ) : children,
@@ -37871,6 +37877,7 @@ function ArticleBreadcrumbSocialComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking,
   enableBackToTop,
   optixFlowConfig,
@@ -38040,6 +38047,7 @@ function ArticleBreadcrumbSocialComponent({
                         img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                         a: Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,
@@ -38099,6 +38107,7 @@ function ArticleCompactTocComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableTocTracking = true,
   optixFlowConfig,
   background,
@@ -38288,6 +38297,7 @@ function ArticleCompactTocComponent({
                         img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                         a: Pressable
                       },
+                      markdownStyles,
                       children: markdownString
                     }
                   ) : children,
@@ -38343,6 +38353,7 @@ function ArticleChaptersAuthorComponent({
   children,
   renderMode = "jsx",
   markdownString,
+  markdownStyles,
   enableChapterTracking = true,
   optixFlowConfig,
   background,
@@ -38602,6 +38613,7 @@ function ArticleChaptersAuthorComponent({
                       img: (props) => /* @__PURE__ */ jsx(Img, { ...props, optixFlowConfig }),
                       a: Pressable
                     },
+                    markdownStyles,
                     children: markdownString
                   }
                 ) : children,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opensite/ui",
-  "version": "3.0.4",
+  "version": "3.0.5",
   "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
   "keywords": [
     "react",
@@ -3414,7 +3414,7 @@
     "@page-speed/img": "0.4.6",
     "@page-speed/lightbox": "0.2.1",
     "@page-speed/maps": "0.2.4",
-    "@page-speed/markdown-to-jsx": "^0.0.2",
+    "@page-speed/markdown-to-jsx": "0.0.4",
     "@page-speed/pdf-viewer": "0.1.9",
     "@page-speed/pressable": "^0.0.1",
     "@page-speed/social-share": "0.1.5",