code-block-base-kit

PreviousNext
Docs
platecomponent

Preview

Loading preview…
registry/components/editor/plugins/code-block-base-kit.tsx
import {
  BaseCodeBlockPlugin,
  BaseCodeLinePlugin,
  BaseCodeSyntaxPlugin,
} from '@platejs/code-block';
import { all, createLowlight } from 'lowlight';

import {
  CodeBlockElementStatic,
  CodeLineElementStatic,
  CodeSyntaxLeafStatic,
} from '@/registry/ui/code-block-node-static';

const lowlight = createLowlight(all);

export const BaseCodeBlockKit = [
  BaseCodeBlockPlugin.configure({
    node: { component: CodeBlockElementStatic },
    options: { lowlight },
  }),
  BaseCodeLinePlugin.withComponent(CodeLineElementStatic),
  BaseCodeSyntaxPlugin.withComponent(CodeSyntaxLeafStatic),
];

Installation

npx shadcn@latest add @plate/code-block-base-kit

Usage

import { CodeBlockBaseKit } from "@/components/code-block-base-kit"
<CodeBlockBaseKit />