Ckeditor5: How to pass data to a plugin?

[ajaybushel]

I am implementing a dropdown which will display a list of items based on the array that I provide.

const DROPDOWN_ITEMS = [
  { value: "1", label: "First Name" },
  { value: "2", label: "Last Name" }
];

...

DROPDOWN_ITEMS.forEach(item => {
  return DropdownCollection.add({
    type: "button",
    model: new Model({
      withText: true,
      label: item.label,
      value: item.value
    })
  });
});

Now what if I wanted to pass the DROPDOWN_ITEMS array from outside the editor.

So probably <ReactCKEditor customData={ [...MYARRAY] } /> and then CKEditor passes the data to the other plugins and I can use it like DROPDOWN_ITEMS = editor.additionalData.MYARRAY or something like that.

Can this be done as of now? Using CKEditor 5 with a custom implemented plugin

[jodator]

You should be able to use editor.config object, like:

const editorConfiguration = {
    // other CKEditor5 configuration options,
    myDropdown: {
        items: [
            { value: "1", label: "First Name" },
            { value: "2", label: "Last Name" }
        ];
    }
}

<CKEditor
    editor={ ClassicEditor }
    data="<p>Hello from CKEditor 5!</p>"
    config={ editorConfiguration }
/>

then in your plugin just access it:

const items = editor.config.get( 'myDropdown.items' );

items.forEach( ... );