Typix LogoTypix
Editor Toolbar

BlockquoteButton & CodeBlockButton

Toggle blockquote and code block nodes.

Install

npx typix ui add blockquote-button code-block-button

BlockquoteButton

import { BlockquoteButton } from "@/components/typix/main/blockquote-button";

<BlockquoteButton />
<BlockquoteButton hideWhenUnavailable />

CodeBlockButton

import { CodeBlockButton } from "@/components/typix/main/code-block-button";

<CodeBlockButton />
<CodeBlockButton hideWhenUnavailable />

Props (both)

PropTypeDefaultDescription
textstringOverride the button label.
hideWhenUnavailablebooleanfalseHide when unavailable.
showShortcutbooleantrueShow keyboard shortcut in tooltip.
onToggled(isActive: boolean) => voidCallback after toggle.
classNamestringAdditional CSS classes.

Hooks

import { useBlockquote } from "@/components/typix/main/blockquote-button";
import { useCodeBlock } from "@/components/typix/main/code-block-button";

On this page