diff options
Diffstat (limited to 'apps/web/src/components')
| -rw-r--r-- | apps/web/src/components/ui/react-markdown-wrapper.tsx | 29 |
1 files changed, 28 insertions, 1 deletions
diff --git a/apps/web/src/components/ui/react-markdown-wrapper.tsx b/apps/web/src/components/ui/react-markdown-wrapper.tsx index 181ae8ac..68772b07 100644 --- a/apps/web/src/components/ui/react-markdown-wrapper.tsx +++ b/apps/web/src/components/ui/react-markdown-wrapper.tsx @@ -1,7 +1,13 @@ import ReactMarkdown from "react-markdown"; import { cn } from "@/utils/ui"; -export function ReactMarkdownWrapper({ children }: { children: string }) { +export function ReactMarkdownWrapper({ + children, + inline = false, +}: { + children: string; + inline?: boolean; +}) { return ( <ReactMarkdown components={{ @@ -18,6 +24,27 @@ export function ReactMarkdownWrapper({ children }: { children: string }) { strong: ({ children }) => ( <strong className="text-foreground font-semibold">{children}</strong> ), + code: ({ className: codeClassName, children, ...props }) => ( + <code + className={cn( + "rounded border border-destructive/20 bg-destructive/5 px-1.5 py-0.5 font-mono text-[0.85em] text-red-700 dark:text-red-300", + codeClassName, + )} + {...props} + > + {children} + </code> + ), + p: ({ className: paragraphClassName, children, ...props }) => + inline ? ( + <span className={cn("m-0", paragraphClassName)} {...props}> + {children} + </span> + ) : ( + <p className={cn("m-0", paragraphClassName)} {...props}> + {children} + </p> + ), }} > {children} |
