{#if $assetStore.timelineHeight > height}
(isHover = true)} on:mouseleave={() => { isHover = false; isDragging = false; }} on:mouseenter={({ clientY, buttons }) => handleMouseEvent({ clientY, isDragging: !!buttons })} on:mousemove={({ clientY }) => handleMouseEvent({ clientY })} on:mousedown={({ clientY }) => handleMouseEvent({ clientY, isDragging: true })} on:mouseup={({ clientY }) => handleMouseEvent({ clientY, isDragging: false })} > {#if isHover}
{hoverLabel}
{/if} {#if !isDragging}
{/if} {#each segments as segment, index (segment.timeGroup)} {@const date = new Date(segment.timeGroup)} {@const year = date.getFullYear()} {@const label = `${date.toLocaleString('default', { month: 'short' })} ${year}`}
(hoverLabel = label)} > {#if new Date(segments[index - 1]?.timeGroup).getFullYear() !== year} {#if segment.height > 8}
{year}
{/if} {:else if segment.height > 5}
{/if}
{/each}
{/if}