Variable NoteEditor`Const`

NoteEditor: ForwardRefExoticComponent<
NoteEditorProps & RefAttributes<NoteEditorRef>,
> = ...

Rich text note editor component with TipTap.

Remarks

The NoteEditor provides a full-featured rich text editing interface using TipTap with support for tables, task lists, and auto-save to S3.

Features:

Rich text formatting (bold, italic, strikethrough, highlight)
Headings (H1, H2, H3)
Lists (bullet, numbered, task)
Tables with full editing support
Blockquotes and horizontal rules
Auto-save to S3 with debouncing
PDF export
Full customization (labels, icons, colors, styles)

Param: props

Component props

Returns

NoteEditor React element

Example

Basic usage inside HiyveProvider:

import { NoteEditor } from '@hiyve/react-notes';

function NotesSidebar() {
  return <NoteEditor title="Notes" maxHeight={500} enableAutoSave />;
}

Example

With customization:

<NoteEditor
  title="Meeting Notes"
  initialTitle="Sprint Planning"
  placeholder="Take notes here..."
  enableAutoSave
  autoSaveInterval={5000}
  labels={{ saving: 'Saving...', saved: 'All changes saved' }}
  onSave={(note) => console.log('Saved:', note.id)}
/>