import { onMount, splitProps, type ComponentProps } from "solid-js"
const icons = {
"align-right": ``,
"arrow-up": ``,
"arrow-left": ``,
"arrow-right": ``,
archive: ``,
"bubble-5": ``,
prompt: ``,
brain: ``,
fork: ``,
"bullet-list": ``,
"check-small": ``,
"chevron-down": ``,
"chevron-left": ``,
"chevron-right": ``,
"chevron-grabber-vertical": ``,
"chevron-double-right": ``,
"circle-x": ``,
close: ``,
"close-small": ``,
checklist: ``,
console: ``,
terminal: ``,
"terminal-active": `
`,
review: ``,
"review-active": `
`,
expand: ``,
collapse: ``,
code: ``,
"code-lines": ``,
"circle-ban-sign": ``,
"edit-small-2": ``,
eye: ``,
enter: ``,
folder: ``,
"file-tree": ``,
"file-tree-active": `
`,
"magnifying-glass": ``,
"plus-small": ``,
plus: ``,
"new-session": ``,
"new-session-active": `
`,
"pencil-line": ``,
mcp: ``,
glasses: ``,
"magnifying-glass-menu": ``,
"window-cursor": ``,
task: ``,
stop: ``,
status: ``,
"status-active": `
`,
sidebar: ``,
"sidebar-active": `
`,
"layout-left": ``,
"layout-left-partial": ``,
"layout-left-full": ``,
"layout-right": ``,
"layout-right-partial": ``,
"layout-right-full": ``,
"square-arrow-top-right": ``,
"open-file": ``,
"speech-bubble": ``,
comment: ``,
"folder-add-left": ``,
github: ``,
discord: ``,
"layout-bottom": ``,
"layout-bottom-partial": ``,
"layout-bottom-full": ``,
"dot-grid": ``,
"circle-check": ``,
copy: ``,
check: ``,
photo: ``,
share: ``,
shield: ``,
download: ``,
menu: ``,
server: ``,
branch: ``,
edit: ``,
help: ``,
"settings-gear": ``,
dash: ``,
"cloud-upload": ``,
trash: ``,
sliders: ``,
keyboard: ``,
selector: ``,
"arrow-down-to-line": ``,
warning: ``,
reset: ``,
link: ``,
providers: ``,
models: ``,
"arrow-undo-down": ``,
}
const spriteID = "opencode-icon-sprite"
const symbol = (name: keyof typeof icons) => `opencode-icon-${name}`
let spriteInserted = false
function viewBox(name: keyof typeof icons) {
return name === "magnifying-glass" || name === "arrow-undo-down" ? "0 0 16 16" : "0 0 20 20"
}
function ensureSprite() {
if (spriteInserted) return
if (typeof document === "undefined") return
if (document.getElementById(spriteID)) {
spriteInserted = true
return
}
const body = document.body as HTMLElement | null
if (!body) return
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg")
svg.id = spriteID
svg.setAttribute("aria-hidden", "true")
svg.setAttribute("width", "0")
svg.setAttribute("height", "0")
svg.style.position = "absolute"
svg.style.overflow = "hidden"
svg.innerHTML = Object.entries(icons)
.map(([name, path]) => {
const key = name as keyof typeof icons
return `${path}`
})
.join("")
body.insertBefore(svg, body.firstChild)
spriteInserted = true
}
export interface IconProps extends ComponentProps<"svg"> {
name: keyof typeof icons
size?: "small" | "normal" | "medium" | "large"
}
export function Icon(props: IconProps) {
const [local, others] = splitProps(props, ["name", "size", "class", "classList"])
onMount(ensureSprite)
return (
)
}