{#if layer.kind === 'image' && layer.src}
{#if zoomedMedia && naturalW > 0}
{:else}
{/if}
{#if selected && !readOnly && !passthrough}
{/if}
{:else if layer.kind === 'video' && layer.src}
{:else if layer.kind === 'text' || layer.kind === 'sticky'}
{#if editing}
{:else if layer.kind === 'rect' || layer.kind === 'roundRect' || layer.kind === 'border'}
{:else if layer.kind === 'ellipse'}
{:else if svgShape}
{:else if layer.kind === 'line'}
{@const vertical = pos.h > pos.w}
{@const sw = Math.max(2, layer.strokeWidth ?? 4)}
{:else if layer.kind === 'arrow'}
{@const vertical = pos.h > pos.w}
{@const sw = Math.max(2, layer.strokeWidth ?? 4)}
{@const bw = pos.w}
{@const bh = pos.h}
{@const len = vertical ? bh : bw}
{@const thick = vertical ? bw : bh}
{@const head = Math.min(Math.max(14, thick * 0.9), len * 0.35, 40)}
{:else if layer.kind === 'path' && layer.points?.length}
{@const bw = Math.max(1, pos.w)}
{@const bh = Math.max(1, pos.h)}
{@const d = layer.points
.map((p, i) => `${i === 0 ? 'M' : 'L'} ${p.x * bw} ${p.y * bh}`)
.join(' ')}
{:else if isPanel}
e.stopPropagation()}
onblur={() => {
if (textEl) ontextcommit?.(readEditableText(textEl));
}}
>
{layer.text ?? (layer.kind === 'sticky' ? 'Note' : 'Text')}
{:else}
{layer.text ?? (layer.kind === 'sticky' ? 'Note' : 'Text')}
{/if}
{#if layer.kind === 'namedSlot'}
{layer.slotName || layer.name || 'Slot'}
{/if}
{#if layer.kind === 'scrollBox'}
{/if}
{:else}
{/if}