Hey there!
This is a bit painful, but it is possible. I wrote a function you can use to move items between ribbons.
const moveItem = (toolName, fromRibbon, toRibbon) => {
instance.setHeaderItems((header) => {
const ribbon = header.getHeader(fromRibbon);
const tool = ribbon.get(toolName)
ribbon.delete(toolName);
const ribbon2 = header.getHeader(toRibbon);
ribbon2.push(tool);
return header;
})
}
You can use it like so:
// move the shape tool to from the "Annotate" ribbon to the "Shapes" ribbon
moveItem(
'shapeToolGroupButton',
'toolbarGroup-Annotate',
'toolbarGroup-Shapes'
);
The first parameter is the name of the tool, which you can get by hovering over it in the dev console and finding the ‘data-element’ attribute.
The second parameter is the name of the ribbon you want to move FROM, and the third parameter is the name of the ribbon you want to move TO. You can find these by hovering over the ribbons as well.
Thanks!
Logan