Ability to set a label for each root when using the MultiRootEditor when calling addRoot.

[lnmp4000]

I need the ability to set the label on an rich text editable element when using the multi root editor.

I think I have a setup that is slightly more complicated than normal uses cases that I will describe here.

At the point the multi root editor is configured, I do not have information about which rich text editors will be on the page. So the editor root is setup and the editor and editableElements (empty at this point) are loaded into a react context

 const { editableElements, toolbarElement, editor } = useMultiRootEditor({
   // -- config here -- //
})

Later I use the editor from the context to call addRoot to setup each rich text element.

  editor.addRoot(id, {
                data: getIn(getFieldMeta.current().value, id),
                isUndoable: false,
                config:{ label:'My Label'} //something like this
            });

At the point addRoot is called, I have all the information about the rich text editor, including the label. I would like to be able to pass in additional config at this point to set the label.

The editableElements updates which updates the context, and finally this is rendered inside my application along with the toolbarElement.

Without this, the rich text element is labelled in an unhelpful way:

<div id="Ge8adcd9f-b109-4e5a-9de0-297cdaf71ace.0.C73bf4fba-21dc-4e5d-8544-6683fdfdf226" class="ck ck-content ck-editor__editable ck-rounded-corners ck-editor__editable_inline ck-blurred" lang="en-gb" dir="ltr" role="textbox" aria-label="Rich Text Editor. Editing area: Ge8adcd9f-b109-4e5a-9de0-297cdaf71ace.0.C73bf4fba-21dc-4e5d-8544-6683fdfdf226" contenteditable="true"><p><br data-cke-filler="true"></p></div>