fix: add button override to handle transformerCopyButton onclick string
This commit is contained in:
@@ -105,5 +105,28 @@ export function getMDXComponents(components: MDXComponents): MDXComponents {
|
|||||||
// Collapsible sections
|
// Collapsible sections
|
||||||
details: (props) => <details className="my-4 rounded-lg border border-border p-4" {...props} />,
|
details: (props) => <details className="my-4 rounded-lg border border-border p-4" {...props} />,
|
||||||
summary: (props) => <summary className="cursor-pointer font-semibold" {...props} />,
|
summary: (props) => <summary className="cursor-pointer font-semibold" {...props} />,
|
||||||
|
|
||||||
|
// Buttons (handle onclick string from transformerCopyButton)
|
||||||
|
button: ({ children, onClick, ...props }: { children?: React.ReactNode; onClick?: string | (() => void); className?: string } & Record<string, unknown>) => {
|
||||||
|
if (typeof onClick === 'string') {
|
||||||
|
const className = (props.className as string) ?? '';
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
dangerouslySetInnerHTML={{
|
||||||
|
__html: `<button${className ? ` class="${className.replace(/"/g, '"')}"` : ''} onclick="${onClick}">${(children as string) ?? ''}</button>`
|
||||||
|
}}
|
||||||
|
suppressHydrationWarning
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
{...props}
|
||||||
|
onClick={typeof onClick === 'function' ? onClick : undefined}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user