EditBar interaction sub bar

[ThingEngineer]

I would like to add a sub bar to the native 'Point' and 'LineString' interaction controls on an EditBar. The purpose is to set a subType variable for the parent interactions. The subType is used to apply a conditional style. ie interaction='DrawPoint' subType='Purple Hexagon'.

Currently I am using an external radio button group to set the subType but I would like the UX to be consistent. I can disable the DrawPoint interaction on the EditBar and then add my own Toggle Draw interaction with my custom sub bar. However, this messes up the order of the EditBar icons.

I would prefer to add the sub bar to the native EditBar interaction control but have been successful in doing so.

Show is a custom 'Point' interaction control with a submenu on the main control bar, added after the EditBar. I would like the native EditBar 'Point' control (to the right of select control) to have this submenu.

[Viglino]

Hello,
You just have to create a subbar and add it to the control.
NB: the LineString button allready has a subbar, you can reuse it if you need it.

// Add a sub bar to the Point  button
var sbar = new ol.control.Bar()
edit.getControls()[1].setSubBar(sbar)
// Add new controls
sbar.addControl(new ol.control.Toggle({html: 'T' }))
// Add a sub bar to the LineString nutton
sbar = edit.getControls()[2].getSubBar()
// Add new controls
sbar.addControl(new ol.control.Toggle({html: 'T' }))

You can retreave the button using it's place in the bar or with it's name:

// Get draw point interaction in the bar (indice 1)
edit.getControls()[1]
// or get draw point interaction button by name
edit.getControlsByName('DrawPoint')[0]