ji-devs / ji-wysiwyg-editor

Jewish Interactive Wysiwyg Editor
https://jewish-interactive.github.io/ji-wysiwyg-editor/
MIT License
0 stars 0 forks source link

Ability to add new toolbar items #7

Closed dakom closed 5 years ago

dakom commented 5 years ago

@jpuri - I'm not sure how we want to specify this so that it's as extensible as possible.

I think the toolbar button should follow something we could describe on the type level. For example, using typescript syntax, it could accept a function with something like the following signature:

type ButtonCallback = () => DraftEditorState => ButtonResponse

Where DraftEditorState has data about the current state of the editor (maybe the builtin type of the same name - or something else, with selected text? all text?) and ButtonResponse is whatever the button needs to do its job.

ButtonResponse could itself be a function with something like the following signature (ts syntax too):

type ButtonResponse = (state:DraftEditorState) => void;

In other words, summarizing the above, the button will call a function with the DraftEditorState (which the callback can use to determine a course of action) and the button will return a function which, when called, also gets passed the DraftEditorState in order to perform an action.

That function doesn't return anything (it is for side-effects only)

Please feel free to be in touch if anything is unclear or you have more comments :)

jpuri commented 5 years ago

Hey @dakom , toolbar options are react components with props defined. I added 2 here: https://github.com/jewish-interactive/ji-wysiwyg-editor/tree/master/src/components/ToolbarButton