react-example-minimal

PreviousNext

Minimal editor setup with basic functionality.

Docs
prosekitblock

Preview

Loading preview…
registry/src/react/examples/minimal/editor.tsx
import 'prosekit/basic/style.css'
import 'prosekit/basic/typography.css'

import { defineBasicExtension } from 'prosekit/basic'
import { createEditor } from 'prosekit/core'
import { ProseKit } from 'prosekit/react'
import { useMemo } from 'react'

export default function Editor() {
  const editor = useMemo(() => {
    const extension = defineBasicExtension()
    return createEditor({ extension })
  }, [])

  return (
    <ProseKit editor={editor}>
      <div ref={editor.mount} className="outline-solid p-4"></div>
    </ProseKit>
  )
}

Installation

npx shadcn@latest add @prosekit/react-example-minimal

Usage

import { ReactExampleMinimal } from "@/components/react-example-minimal"
<ReactExampleMinimal />