// Line-art icons + glyph rendering for category & UI affordances.
// Stroke-based, monocrome, 1.4px @ 24x24. Keep them sharp and minimal.
function CatIcon({ cat, size = 24, stroke = 1.5 }) {
const props = {
width: size,
height: size,
viewBox: '0 0 24 24',
fill: 'none',
stroke: 'currentColor',
strokeWidth: stroke,
strokeLinecap: 'round',
strokeLinejoin: 'round',
};
switch (cat) {
case 'game':
// Gamepad / controller silhouette
return (
);
case 'project':
// Window / app frame
return (
);
case 'mcp':
// Plug / socket
return (
);
case 'agent':
// Spark / orbit
return (
);
default:
return null;
}
}
function ChevronIcon({ size = 12, dir = 'right' }) {
const rot = { right: 0, left: 180, up: -90, down: 90 }[dir] || 0;
return (
);
}
function ArrowOutIcon({ size = 12 }) {
return (
);
}
function GithubIcon({ size = 14 }) {
return (
);
}
function SunIcon({ size = 14 }) {
return (
);
}
function MoonIcon({ size = 14 }) {
return (
);
}
function CloseIcon({ size = 14 }) {
return (
);
}
function SearchIcon({ size = 14 }) {
return (
);
}
function DotIcon({ size = 6, filled = true }) {
return (
);
}
// Project glyph — rendered as a serif monogram letterpress. Used in `glyph` icon mode.
function ProjectGlyph({ text, size = 40, accent }) {
return (
{text}
);
}
// Render the right icon for a project based on `iconMode` tweak.
function ProjectIcon({ project, iconMode, size = 28, accent }) {
if (iconMode === 'emoji') {
return (
{window.CATEGORIES[project.cat].legacyEmoji}
);
}
if (iconMode === 'glyph') {
return ;
}
// line (default)
return (
);
}
function MailIcon({ size = 14 }) {
return (
);
}
Object.assign(window, {
CatIcon,
ChevronIcon,
ArrowOutIcon,
GithubIcon,
MailIcon,
SunIcon,
MoonIcon,
CloseIcon,
SearchIcon,
DotIcon,
ProjectGlyph,
ProjectIcon,
});