Add sublevel functionality in new icon similar to Export with its types

Hello,
 
Thank you for contacting us.
 
Our team suggests referring to our Toolbar customization guide to learn more about adjusting the Toolbar to fit your needs.
 
We have also prepared the JSFiddle that demonstrates adding the "Export+" tab with a dropdown menu.
 
We want to provide some additional explanations about the following code snippets used in the example:
The code block below demonstrates subscription on the beforetoolbarcreated event. It is triggered before the creation of the Toolbar.

var pivot = new Flexmonster({
  ...
  beforetoolbarcreated: customizeToolbar
});

 
Next, the handler is created:

function customizeToolbar(toolbar) {
  var tabs = toolbar.getTabs(); //get all existing tabs of the Toolbar
  toolbar.getTabs = function() {
    tabs.unshift({ //add an additional tab to the first position
      title: "Export+", //title of the created tab
      icon: tabs[3].icon, //currently, the icon is taken from the existing tab, it can be replaced with a custom one
      menu: [{ //creation of the submenu. Elements of the submanu have the same structure as described above.
          title: "Excel XLSX",
          handler: xlsxHandler, //function that is going to be invoked after user clicks the button
          icon: tabs[3].menu[3].icon
        },
        {
          title: "Excel XLSB",
          handler: xlsbHandler,
          icon: tabs[3].menu[3].icon
        }
      ]
    })
    return tabs;
  }
}

 
Also, it is possible to customize or complement existing tabs of the Toolbar in a similar way: overwrite their properties or add additional elements to menus.
 
Please let us know if it helps.
Feel free to contact us in case further assistance is needed on this point.
 
Kind regards,
Illia