mirror of
https://github.com/DefectingCat/DefectingCat.github.io
synced 2025-07-15 16:51:37 +00:00
Add copy button
This commit is contained in:
26
components/mdx/Pre.tsx
Normal file
26
components/mdx/Pre.tsx
Normal 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;
|
@ -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,
|
||||
|
Reference in New Issue
Block a user