How can I disable a custom toolbar button in CKEditor 5?

user_13710872 0
Viewed 1136

I implemented a version of the image insert Simple Plugin example from CKEditor 5's framework docs.

But the example doesn't cover how to disable the item when the editor's isReadOnly property is set (like it does by default for all the standard buttons). I found docs for an isEnabled prop as well as a bind method for ButtonView, but it quotes examples using a command item, rather than a view item. Problem is, the Simple Plugin example doesn't create a command to bind to.

So question is whether I need to create a command, or if there is some other way to make the view item's state sensitive to the readonly state of the editor instance.

Thanks, and my apologies if I've left out any needed context (new to posting here on SO). Feedback is welcome (and I know y'all will whip me into shape).

ckeditor5 ckeditor
1 Answers

D'oh, I think I figured it out:

view.bind('isEnabled').to(editor, 'isReadOnly', isReadOnly => !isReadOnly);

Just needed to bind to the observable property of the editor. Seems to be working as I desired/expected.

user_137108720
Related