Add a external componente to toolbar

Hello, Andre!
 
Thank you for reaching out to us.
 
Kindly note that it is possible to add extra functionality to the Toolbar by modifying the Toolbar source code.
You can find details about this approach in our customization guide: https://www.flexmonster.com/doc/customizing-toolbar/#further-customization.
 
Please review it and don't hesitate to reach out to us if any further questions arise.
 
Kind regards,
Solomiia

Hello, Andre!
 
Thank you for your swift response.

We kindly provide the main steps to adding your HTML elements by overriding source code from the JS file:
1.Add the function to the beforetoolbarcreated event:

let pivot = new Flexmonster({
  //other Flexmonster properties
  beforetoolbarcreated: customizeToolbar
});

As we can see from the screenshot, you already have this step done.

2. In the customizeToolbar function, add a new tab:

function customizeToolbar(toolbar) {
  let tabs = toolbar.getTabs();
  tabs.unshift({
    id: "custom-tab"
  });
}

3. In the same function, save the createTab function in a new variable, and override default createTab:

  var baseCreateTab = toolbar.createTab;
  toolbar.createTab = function(data, parent) {
  }

 
4. inside the createTab function, add the condition for creating the new tab, and run the saved baseCreateTab function with the correct context for all default tabs:

toolbar.createTab = function(data, parent) {

    if (data.id == "custom-tab") {
      //your own code for the new tab
    }

    return baseCreateTab.call(toolbar, data, parent);
  }

We have prepared a JSFiddle example for illustration: https://jsfiddle.net/flexmonster/4qxwbo3a/.
 
Hope you will find our answer helpful.
Please let us know if the suggested approach works for your case.
 
Regards,
Solomiia

Hello, Andre!

Hope you are doing well.

Our team is wondering if you had some time to try the suggested approach and add the select component to the Toolbar.
Could you please let us know if the suggested approach works well for your case?

Looking forward to hearing from you.

Regards,
Solomiia

Hello, Andre!

Thank you for your feedback.

We are glad to hear that our solution was helpful.

Feel free to contact us in case of any other questions.

Kind regards,
Solomiia