Perplexica/ui/components/Markdown/renderer/thematicBreak.tsx
2024-07-10 16:17:23 +08:00

35 lines
833 B
TypeScript

import { css, cx } from "@emotion/css";
import type { ThematicBreak } from "@yozora/ast";
import React from "react";
import { astClasses } from "../context";
/**
* Render `thematicBreak`.
*
* @see https://www.npmjs.com/package/@yozora/ast#thematicBreak
* @see https://www.npmjs.com/package/@yozora/tokenizer-thematic-break
*/
export class ThematicBreakRenderer extends React.Component<ThematicBreak> {
public override shouldComponentUpdate(): boolean {
return false;
}
public override render(): React.ReactElement {
return <hr className={cls} />;
}
}
const cls = cx(
astClasses.thematicBreak,
css({
boxSizing: "content-box",
display: "block",
height: 0,
width: "100%",
padding: 0,
border: 0,
borderBottom: `1px solid #dadada`,
outline: 0,
margin: "1.5em 0px",
}),
);