<script>
  import { _ } from "svelte-i18n";
  export let runner;
</script>

{#if !runner}
  {$_("non-blanko")}
{:else}
  <a class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full border border-current bg-blue-100 text-blue-800" href={`/runners/${runner.id}`}>
    {#if runner.middlename}
      {runner.firstname} {runner.middlename} {runner.lastname}
    {:else}
      {runner.firstname} {runner.lastname}
    {/if}
  </a>
{/if}
