pinafore/src/routes/_components/NavShortcuts.html

<Shortcut key="g t" on:pressed="goto('/federated')"/>
<Shortcut key="g f" on:pressed="goto('/favorites')"/>
<Shortcut key="g l" on:pressed="goto('/local')"/>
<Shortcut key="g h" on:pressed="goto('/')"/>
<Shortcut key="g n" on:pressed="goto('/notifications')"/>
<Shortcut key="g c" on:pressed="goto('/community')"/>
<Shortcut key="g d" on:pressed="goto('/direct')"/>
<Shortcut key="s" on:pressed="goto('/search')"/>
<Shortcut key="h|?" on:pressed="showShortcutHelpDialog()"/>
<Shortcut key="c" on:pressed="showComposeDialog()"/>
{#each $navPages as navPage, i}
  <Shortcut key={(i + 1).toString()} on:pressed="goto(navPage.href)" />
{/each}

<script>
  import Shortcut from './shortcut/Shortcut'
  import { goto } from '../../../__sapper__/client'
  import { importShowShortcutHelpDialog, importShowComposeDialog } from './dialog/asyncDialogs'
  import { store } from '../_store/store'

  export default {
    store: () => store,
    components: {
      Shortcut
    },
    methods: {
      oncreate () {
        console.log('nav shortcuts')
      },
      goto,
      async showShortcutHelpDialog () {
        const showShortcutHelpDialog = await importShowShortcutHelpDialog()
        showShortcutHelpDialog()
      },
      async showComposeDialog () {
        const showComposeDialog = await importShowComposeDialog()
        showComposeDialog()
      }
    }
  }
</script>