Allow modifying toolbar's viewportTopOffset in runtime

[Reinmar]

📝 Provide a description of the improvement

Currently, config.toolbar.viewportTopOffset can only be set when creating the editor.

The value then ends up in editor.ui.view.stickyPanel.viewportTopOffset that's readonly.

Could we make this property writable? Or, maybe even better, add a method/getter in the editor.ui.view or somewhere deeper? 

The problem I see is that the (in the runtime) viewportTopOffset is not a configuration of editor.ui.view.toolbar but editor.ui.view.stickyPanel which is rather poorly named (seems to have nothing to do with the toolbar). Even if we'll make it writable, discoverability will be relatively poor.

That might be an argument for adding a method to control this property somewhere up the chain (e.g. in editor.ui.view) but I dont' want to overcomplicate this so I have mixed feelings.

cc @oleq 

---

If you'd like to see this improvement implemented, add a 👍 reaction to this post.

[oleq]

I'm OK with making editor.ui.view.stickyPanel.viewportTopOffset for ClassicEditor:

• configurable first via config.toolbar.viewportTopOffset,
• then writable in runtime.

---

but editor.ui.view.stickyPanel which is rather poorly named (seems to have nothing to do with the toolbar). Even if we'll make it writable, discoverability will be relatively poor.

I agree that the name is not perfect (tells you what but not why). It should be renamed to (sticky)toolbarContainer or something similar. We can keep  stickyPanel for backward compatibility (and warn about deprecation).

---

Still, keep in mind that InlineEditor also uses config.toolbar.viewportTopOffset but does not have the sticky panel instance. So editor.ui.view.toolbarContainer.viewportTopOffset will not work as InlineEditorUIView uses BalloonPanelView available under editor.ui.view.panel. In this case, I'd also rename it to toolbarContainer to keep things similar across editor types and, similarly, have editor.ui.view.toolbarContainer.viewportTopOffset writable.

Proposal

• editor.ui.view.stickyPanel -> editor.ui.view.toolbarContainer (Classic)
  • + warn when using deprecated property
• editor.ui.view.panel -> editor.ui.view.toolbarContainer (Inline)
  • + warn when using deprecated property
• configure editor.ui.view.toolbarContainer.viewportTopOffset using config.toolbar.viewportTopOffset 
• make editor.ui.view.toolbarContainer.viewportTopOffset writable (and probably observable for the positioning logic to react to the change immediately)

[Reinmar]

@mlewand @mateuszzagorski There are some tips regarding the direction from Olek so you can consider giving it a try :)

[marcelvarela]

I would also like to see this implemented. I have an app with a different header size on mobile and desktop but this is a problem because ckeditor does not allow changing viewportTopOffset at runtime.