{#if isLoading}

Loading collection...

{:else if rosterPiclets.length === 0 && storagePiclets.length === 0 && discoveredMonsters.length === 0}

No Piclets Yet

Take photos to discover new Piclets!

{:else}

Roster

{#each Array(6) as _, position} {#if rosterMap().has(position)} handleRosterClick(position)} /> {:else} handleRosterClick(position)} /> {/if} {/each}
{#if storagePiclets.length > 0}

Storage ({storagePiclets.length})

{#if storagePiclets.length > 10} {/if}
{#each storagePiclets.slice(0, 10) as piclet} handleStorageClick(piclet)} /> {/each}
{/if} {#if discoveredMonsters.length > 0}

Discovered ({discoveredMonsters.length})

{#if discoveredMonsters.length > 10} {/if}
{#each discoveredMonsters.slice(0, 10) as monster} handleDiscoveredClick(monster)} /> {/each}
{/if}
{/if}