Extract the Tailwind classes for common markdown elements (paragraph, blockquote, lists, inline code, link, hr, headings) into a single markdownStyles.ts consumed by both the read-only MemoContent components and the WYSIWYG editor, replacing the duplicated per-element strings and the .memo-wysiwyg CSS block. Heading classes are precomputed per level so the hot renderHTML path is a lookup, not a cn() merge. Also require at least one character after `#` before opening the tag suggestion menu so a bare `#` (or `# ` heading) no longer conflicts with markdown headings.
19 lines
697 B
TypeScript
19 lines
697 B
TypeScript
import { markdownStyles } from "@/lib/markdownStyles";
|
|
import { cn } from "@/lib/utils";
|
|
import { NestedMarkdownRenderContext } from "../MarkdownRenderContext";
|
|
import type { ReactMarkdownProps } from "./types";
|
|
|
|
interface BlockquoteProps extends React.BlockquoteHTMLAttributes<HTMLQuoteElement>, ReactMarkdownProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
/**
|
|
* Blockquote component with left border accent
|
|
*/
|
|
export const Blockquote = ({ children, className, node: _node, ...props }: BlockquoteProps) => {
|
|
return (
|
|
<blockquote className={cn(markdownStyles.blockquote, className)} {...props}>
|
|
<NestedMarkdownRenderContext>{children}</NestedMarkdownRenderContext>
|
|
</blockquote>
|
|
);
|
|
};
|