Question : Layer labels

You can extend the model of your component/s and overwrite the getName function

In case this is useful for anyone, I found an easy/alternative way of doing this when a component is created.

editor.on('component:create', function(component) {

  // filter the tag types you're interested in
  if( component.attributes.tagName === 'div' ) {

    // Get some information you want to use as the replacement text
    // In my case, the component element's id attribute, which is stored in component.ccid
    const idParts = component.ccid.split('-')
    if( idParts.length > 0 && idParts[0] === 'cbt') {
      // This is specific to my case, but 'component.attributes.name' is the field that appears in the layer manager
      component.attributes.name = ''
      for( let i=1; i < idParts.length; i++ ) {
        component.attributes.name += idParts[i].charAt(0).toUpperCase() + idParts[i].slice(1) + ' '
      }
    }
    else {
      component.attributes.name = 'Div'
    }
  }
})

This is how I did it:

  grapesInstance.on('component:create', (component) => {
    component.getName = () => component.attributes['custom-name'] || `${component.attributes.tagName}#${component.ccid}`;
  });

The benefit is that if the components id or tag change later it will still be updated in the layer manager and you can also rename individual components.