feat(isac): support deferred item icons

src/lib/components/BuilderPicker.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+	import ItemIcon from './ItemIcon.svelte';
+
 	let {
 		items,
 		value = $bindable(''),
@@ -24,7 +26,7 @@
 <div class="builder-picker">
 	<span>{label}</span>
 	<button type="button" class="builder-picker-current" aria-expanded={open} onclick={() => open = !open}>
-		{#if selected?.iconUrl}<img src={selected.iconUrl} alt=""/>{:else}<i>◇</i>{/if}
+		<ItemIcon src={selected?.iconUrl} alt=""/>
 		<b>{selected?.name ?? 'SELECT ITEM'}</b><small>{selected?.category ?? (selected ? 'EQUIPPED' : 'UNASSIGNED')}</small><em>{open ? '×' : '＋'}</em>
 	</button>
 	{#if open}
@@ -34,7 +36,7 @@
 				{#if selected}<button type="button" class="builder-picker-clear" onclick={() => choose('')}><i>×</i><span><b>CLEAR SLOT</b><small>REMOVE CURRENT SELECTION</small></span><em>CLEAR</em></button>{/if}
 				{#each results as item}
 					<button type="button" class:selected={item.id === value} disabled={disabledIds.includes(item.id)} onclick={() => choose(item.id)}>
-						{#if item.iconUrl}<img src={item.iconUrl} alt=""/>{:else}<i>◇</i>{/if}
+						<ItemIcon src={item.iconUrl} alt=""/>
 						<span><b>{item.name}</b><small>{item.category ?? 'AVAILABLE'}</small></span><em>{item.id === value ? 'EQUIPPED' : disabledIds.includes(item.id) ? 'CONFLICT' : 'SELECT'}</em>
 					</button>
 				{:else}<p>NO MATCHING ITEMS</p>{/each}