Fix inline code highlight examples

mantinedev · May 6, 2024 · 389e917 · 389e917
1 parent bd73170
commit 389e917
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx
@@ -10,7 +10,8 @@ function Demo() {
   return (
     <Text>
       You can highlight code inline:{' '}
-      <InlineCodeHighlight code="" language="tsx" />. Is not that cool?
+      <InlineCodeHighlight code={'<InlineCodeHighlight code="" language="tsx" />'} language="tsx" />
+      . Is not that cool?
     </Text>
   );
 }
@@ -19,8 +20,9 @@ function Demo() {
 function Demo() {
   return (
     <Text>
-      You can highlight code inline: <InlineCodeHighlight code="" language="tsx" />. Is not that
-      cool?
+      You can highlight code inline:{' '}
+      <InlineCodeHighlight code={'<InlineCodeHighlight code="" language="tsx" />'} language="tsx" />
+      . Is not that cool?
     </Text>
   );
 }

diff --git a/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx b/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx
@@ -244,10 +244,14 @@ export function Inline() {
   return (
     <div style={{ padding: 40 }}>
       <p>
-        Hello there! this is <InlineCodeHighlight code="" language="tsx" /> some code Lorem ipsum
-        dolor sit amet consectetur adipisicing elit. Aliquid reiciendis, facilis repudiandae vero
-        mollitia non dolorum cupiditate assumenda odio unde quaerat beatae explicabo veritatis nam
-        temporibus! Quibusdam quod enim voluptatibus?
+        Hello there! this is{' '}
+        <InlineCodeHighlight
+          code={'<InlineCodeHighlight code="" language="tsx" />'}
+          language="tsx"
+        />{' '}
+        some code Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid reiciendis,
+        facilis repudiandae vero mollitia non dolorum cupiditate assumenda odio unde quaerat beatae
+        explicabo veritatis nam temporibus! Quibusdam quod enim voluptatibus?
       </p>
     </div>
   );