Create a "smart component" that uses the <action-nav> and <action-item> components to create a more complex toolbar experience closer to what VS Code provides.

Features:

• list of items
  • support modifier-based alternate actions
  • rough item typing { icon: string; label: string; href?: string; modifiers: [{ key: 'ctrl' | 'alt'; icon: string; label: string; href?: string; }] }
• action item limit which then overflows remaining action-items into a ... menu

Example markup:

<gl-toolbar limit="3" items=${[ 
  { icon: 'request-changes', label: 'Open Pull Request Changes', href='command:gitlens.home.fetch' },
  { icon: 'globe', label: 'Open Pull Request on Remote', href='command:gitlens.home.openPullRequestOnRemote' },
  { icon: 'git-pull-request-create', label: 'Create Pull Request...', href='command:gitlens.home.createPullRequest' },
  { icon: 'gl-repo-fetch', label: 'Fetch', href='command:gitlens.home.fetch' } 
]}></gl-toolbar>