Add copy button

This commit is contained in:
DefectingCat
2022-10-24 11:20:02 +08:00
parent 9781e31a23
commit 5b5338647b
4 changed files with 107 additions and 0 deletions

26
components/mdx/Pre.tsx Normal file
View File

@ -0,0 +1,26 @@
import classNames from 'classnames';
import { DetailedHTMLProps, HTMLAttributes, lazy, Suspense } from 'react';
const CopyButton = lazy(() => import('components/post/CopyButton'));
type Props = {} & DetailedHTMLProps<
HTMLAttributes<HTMLPreElement>,
HTMLPreElement
>;
const Pre = ({ ...rest }: Props) => {
const { children, className, ...props } = rest;
return (
<>
<pre className={classNames(className, 'relative group')} {...props}>
{children}
<Suspense fallback>
<CopyButton />
</Suspense>
</pre>
</>
);
};
export default Pre;

View File

@ -4,10 +4,12 @@ import Image from 'components/mdx/Image';
import Tab from 'components/RUA/tab';
import TabItem from 'components/RUA/tab/TabItem';
import RUACodeSandbox from 'components/RUA/RUACodeSandbox';
import Pre from 'components/mdx/Pre';
const components = {
RUASandpack,
a: Anchor,
pre: Pre,
Image,
Tab,
TabItem,