components / editor-toolbar
editor-toolbar.
the bar above a markdown editor: edit/preview/split toggle, format buttons, and an action cluster. with enableDrawing it owns the floating numbered drawing windows.
getting started
guides / getting-started
save: cmd/ctrl+s
mode: split · drawings saved: 0
click “new drawing” to open windows — open several; each is numbered and can be dragged and brought to front.
installation
bunx @justin06lee/chrome@latest add editor-toolbarprops
| name | type | default | description |
|---|---|---|---|
| title | ReactNode | - | |
| subtitle | ReactNode | - | |
| mode | string | - | current view mode; pass onModeChange to render the toggle. |
| onModeChange | (mode: string) => void | - | |
| modes | string[] | ['edit','preview','split'] | |
| actions | ReactNode | - | right-hand button cluster. |
| formatActions | EditorFormatAction[] | MARKDOWN_FORMAT_ACTIONS | |
| onFormat | (action: EditorFormatAction) => void | - | fired on a format button; omit to hide them. |
| status | ReactNode | - | right-aligned hint in the format row. |
| enableDrawing | boolean | false | show 'new drawing' and own the numbered drawing windows. |
| onSaveDrawing | (result: { dataUrl: string; darkDataUrl?: string }) => void | Promise<void> | - | fired when a drawing window saves; it then closes. |
| drawingSubtitle | string | - | subtitle under each window's 'drawing #N' title. |
| drawingDarkMapping | boolean | - | use the drawing window's light-to-dark mapping mode. |
| className | string | - |