@ceed/cds 1.2.2-next.3 → 1.2.2-next.4

package/dist/components/Markdown/Markdown.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { Options } from "react-markdown";
+import { type Options } from "react-markdown";
 import { MotionProps } from "framer-motion";
 import { TypographyProps } from "@mui/joy";
 import { TypographySystem } from "@mui/joy";

package/dist/index.cjs

@@ -4235,7 +4235,6 @@ var import_joy41 = require("@mui/joy");
 
 // src/components/Markdown/Markdown.tsx
 var import_react31 = __toESM(require("react"));
-var import_react_markdown = __toESM(require("react-markdown"));
 var import_joy42 = require("@mui/joy");
 
 // src/libs/rehype-accent/index.ts
@@ -4276,6 +4275,7 @@ function rehypeAccent(options) {
 }
 
 // src/components/Markdown/Markdown.tsx
+var LazyReactMarkdown = (0, import_react31.lazy)(() => import("react-markdown"));
 var Markdown = (props) => {
   const {
     color,
@@ -4297,8 +4297,8 @@ var Markdown = (props) => {
       level: defaultLevel,
       ...innerProps
     },
-    /* @__PURE__ */ import_react31.default.createElement(
-      import_react_markdown.default,
+    /* @__PURE__ */ import_react31.default.createElement(import_react31.Suspense, { fallback: null }, /* @__PURE__ */ import_react31.default.createElement(
+      LazyReactMarkdown,
       {
         ...markdownOptions,
         children: content,
@@ -4308,18 +4308,16 @@ var Markdown = (props) => {
           h2: ({ children }) => /* @__PURE__ */ import_react31.default.createElement(Typography, { color, textColor, level: "h2" }, children),
           h3: ({ children }) => /* @__PURE__ */ import_react31.default.createElement(Typography, { color, textColor, level: "h3" }, children),
           h4: ({ children }) => /* @__PURE__ */ import_react31.default.createElement(Typography, { color, textColor, level: "h4" }, children),
-          p: ({ children, node }) => {
-            return /* @__PURE__ */ import_react31.default.createElement(
-              Typography,
-              {
-                color,
-                textColor,
-                level: defaultLevel,
-                ...node?.properties
-              },
-              children
-            );
-          },
+          p: ({ children, node }) => /* @__PURE__ */ import_react31.default.createElement(
+            Typography,
+            {
+              color,
+              textColor,
+              level: defaultLevel,
+              ...node?.properties
+            },
+            children
+          ),
           a: ({ children, href }) => /* @__PURE__ */ import_react31.default.createElement(import_joy42.Link, { href, target: defaultLinkAction }, children),
           hr: () => /* @__PURE__ */ import_react31.default.createElement(Divider, null),
           b: ({ children }) => /* @__PURE__ */ import_react31.default.createElement(Typography, { fontWeight: boldFontWeight }, children),
@@ -4327,7 +4325,7 @@ var Markdown = (props) => {
           ...markdownOptions?.components
         }
       }
-    )
+    ))
   );
 };
 Markdown.displayName = "Markdown";

package/dist/index.js

@@ -4202,8 +4202,7 @@ InsetDrawer.displayName = "InsetDrawer";
 import { Grid } from "@mui/joy";
 
 // src/components/Markdown/Markdown.tsx
-import React29 from "react";
-import ReactMarkdown from "react-markdown";
+import React29, { lazy, Suspense } from "react";
 import { Link as Link2 } from "@mui/joy";
 
 // src/libs/rehype-accent/index.ts
@@ -4244,6 +4243,7 @@ function rehypeAccent(options) {
 }
 
 // src/components/Markdown/Markdown.tsx
+var LazyReactMarkdown = lazy(() => import("react-markdown"));
 var Markdown = (props) => {
   const {
     color,
@@ -4265,8 +4265,8 @@ var Markdown = (props) => {
       level: defaultLevel,
       ...innerProps
     },
-    /* @__PURE__ */ React29.createElement(
-      ReactMarkdown,
+    /* @__PURE__ */ React29.createElement(Suspense, { fallback: null }, /* @__PURE__ */ React29.createElement(
+      LazyReactMarkdown,
       {
         ...markdownOptions,
         children: content,
@@ -4276,18 +4276,16 @@ var Markdown = (props) => {
           h2: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h2" }, children),
           h3: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h3" }, children),
           h4: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { color, textColor, level: "h4" }, children),
-          p: ({ children, node }) => {
-            return /* @__PURE__ */ React29.createElement(
-              Typography,
-              {
-                color,
-                textColor,
-                level: defaultLevel,
-                ...node?.properties
-              },
-              children
-            );
-          },
+          p: ({ children, node }) => /* @__PURE__ */ React29.createElement(
+            Typography,
+            {
+              color,
+              textColor,
+              level: defaultLevel,
+              ...node?.properties
+            },
+            children
+          ),
           a: ({ children, href }) => /* @__PURE__ */ React29.createElement(Link2, { href, target: defaultLinkAction }, children),
           hr: () => /* @__PURE__ */ React29.createElement(Divider, null),
           b: ({ children }) => /* @__PURE__ */ React29.createElement(Typography, { fontWeight: boldFontWeight }, children),
@@ -4295,7 +4293,7 @@ var Markdown = (props) => {
           ...markdownOptions?.components
         }
       }
-    )
+    ))
   );
 };
 Markdown.displayName = "Markdown";