import React , { ComponentType , ReactElement , ReactNode } from 'react' ; import { EditorState } from 'draft-js' ; import { EditorPlugin } from '@draft-js-plugins/editor' ; import UndoButton from './UndoButton' ; import RedoButton from './RedoButton' ; import { defaultTheme , UndoPluginTheme } from './theme' ; export interface UndoPuginConfig { undoContent ? : ReactNode ; redoContent ? : ReactNode ; theme ? : UndoPluginTheme ; } export interface UndoPuginStore { getEditorState ? ( ) : EditorState ; setEditorState ? ( state ) : void ; } export interface UndoRedoButtonProps { className ? : string ; } export default ( config = { } ) : EditorPlugin & { UndoButton : ComponentType < UndoRedoButtonProps > ; RedoButton : ComponentType < UndoRedoButtonProps > ; } => { const undoContent = config . undoContent ? config . undoContent : '↺' ; const redoContent = config . redoContent ? config . redoContent : '↻' ; const store = { getEditorState : undefined , setEditorState : undefined , } ; const theme = config . theme ? config . theme : defaultTheme ; const DecoratedUndoButton = ( props ) : ReactElement => ( < UndoButton { ... props } theme = { theme } store = { store } > { undoContent } < /UndoButton>); const DecoratedRedoButton = ( props ) : ReactElement => ( < RedoButton { ... props } theme = { theme } store = { store } > { redoContent } < /RedoButton>); return { UndoButton : DecoratedUndoButton , RedoButton : DecoratedRedoButton , initialize : ( { getEditorState , setEditorState } ) => { store . getEditorState = getEditorState ; store . setEditorState = setEditorState ; } , } ; } ;