refs:
  item*:
    eventListeners:
      click:
        handler: handleClickItem
styles:
  a:
    text-decoration: none
    color: inherit
template:
  - rtgl-view d=h av=c g=md ${containerAttrString}:
      - $for item, i in items:
          - $if item.isSeparator:
              - rtgl-svg wh=16 svg=${sep} c=mu-fg: null
            $elif item.isEllipsis:
              - rtgl-text s=sm c=mu-fg: ${item.label}
            $elif item.isInteractive && item.href:
              - a#item${i} href=${item.href} ${item.linkExtraAttrs} data-index=${item.index}:
                  - rtgl-text s=sm c=${item.c}: ${item.label}
            $elif item.isInteractive:
              - rtgl-view#item${i} data-index=${item.index} cur=pointer:
                  - rtgl-text s=sm c=${item.c}: ${item.label}
            $else:
              - rtgl-text s=sm c=${item.c}: ${item.label}