---
import { iconSpecs } from "../lib/nav";
import { DESKBAR_ICONS } from "../lib/deskbar";
import { symbol } from "../lib/icons";
const sprite = [...new Set([...iconSpecs(), ...DESKBAR_ICONS])].map(symbol).join("");
// a crisp 1px border around each icon's shape, so the dark outlines keep a silhouette on dark
// chrome. its colour is --icon-rim-colour, clear on the light side
const rim = `<filter id="icon-rim" x="-20%" y="-20%" width="140%" height="140%" color-interpolation-filters="sRGB">
<feMorphology in="SourceAlpha" operator="dilate" radius="1" result="grown"/>
<feFlood style="flood-color: var(--icon-rim-colour)"/>
<feComposite in2="grown" operator="in" result="rim"/>
<feMerge><feMergeNode in="rim"/><feMergeNode in="SourceGraphic"/></feMerge>
</filter>`;
---
<svg class="sprite" aria-hidden="true" focusable="false" set:html={rim + sprite} />