{#each timeMarkers as marker} {formatYear(marker.value)} {/each} {#each sorted as item, index} {@const yearValue = item.born || item.published || item.created || 0} {@const isItemBook = isBook(item)} {@const isItemArtwork = isArtwork(item)} {@const isItemDot = isItemBook || isItemArtwork} {@const displayName = isItemDot ? item.title : item.name} {#if isItemDot} {@const xPos = yearToX(yearValue)} {@const isTop = item.placement === 'top'} {@const rowOffset = (item.row - 1) * (BAR_HEIGHT + BAR_GAP)} {@const yPos = isTop ? TIMELINE_Y - BAR_OFFSET - rowOffset - BAR_HEIGHT / 2 : TIMELINE_Y + BAR_OFFSET + rowOffset + BAR_HEIGHT / 2} {@const dotColor = isItemArtwork ? '#FF6B9D' : '#4A9EFF'} {@const itemDescription = isItemArtwork ? `{displayName} by {item.artist}, created {formatYear(yearValue)}` : `{displayName} by {item.author}, published {formatYear(yearValue)}`} handleItemClick(item, e)} on:keydown={(e) => handleItemKeydown(item, e)} > {displayName} {:else} {@const deathYear = item.died || new Date().getFullYear()} {@const xStart = yearToX(yearValue)} {@const xEnd = yearToX(deathYear)} {@const barWidth = Math.max(xEnd - xStart, 5)} {@const isTop = item.placement === 'top'} {@const rowOffset = (item.row - 1) * (BAR_HEIGHT + BAR_GAP)} {@const yPos = isTop ? TIMELINE_Y - BAR_OFFSET - rowOffset - BAR_HEIGHT : TIMELINE_Y + BAR_OFFSET + rowOffset} handleItemClick(item, e)} on:keydown={(e) => handleItemKeydown(item, e)} > {displayName} {/if} {/each}
{#if selectedPerson}
{selectedPerson.name

{selectedPerson.name || selectedPerson.title}

{#if selectedPerson.created} {selectedPerson.artist}
{formatYear(selectedPerson.created)} {:else if selectedPerson.published} {selectedPerson.author}
{formatYear(selectedPerson.published)} {:else} {selectedPerson.born ? formatYear(selectedPerson.born) : ''} - {selectedPerson.died ? formatYear(selectedPerson.died) : 'present'} ({selectedPerson.died ? Math.abs(selectedPerson.died - selectedPerson.born) : Math.abs(new Date().getFullYear() - selectedPerson.born)} years) {/if}

{/if}