A toolbar control for basic text formatting.
'use client';
import * as React from 'react';
import { useMarkToolbarButton, useMarkToolbarButtonState } from 'platejs/react';
import { ToolbarButton } from './toolbar';
export function MarkToolbarButton({
clear,
nodeType,
...props
}: React.ComponentProps<typeof ToolbarButton> & {
nodeType: string;
clear?: string[] | string;
}) {
const state = useMarkToolbarButtonState({ clear, nodeType });
const { props: buttonProps } = useMarkToolbarButton(state);
return <ToolbarButton {...props} {...buttonProps} />;
}
npx shadcn@latest add @plate/mark-toolbar-buttonimport { MarkToolbarButton } from "@/components/ui/mark-toolbar-button"<MarkToolbarButton />