jjj 0.2.1

A modal interface for Jujutsu.
---
import { Icons, type StarlightIcon } from '../components/Icons';

interface Props {
	name: StarlightIcon;
	label?: string;
	color?: string;
	size?: string;
	class?: string;
}

const { name, label, size = '1em', color } = Astro.props;
const a11yAttrs = label ? ({ 'aria-label': label } as const) : ({ 'aria-hidden': 'true' } as const);
---

<svg
	{...a11yAttrs}
	class={Astro.props.class}
	width="16"
	height="16"
	viewBox="0 0 24 24"
	fill="currentColor"
	set:html={Icons[name]}
/>

<style define:vars={{ 'sl-icon-color': color, 'sl-icon-size': size }}>
	svg {
		color: var(--sl-icon-color);
		font-size: var(--sl-icon-size, 1em);
		width: 1em;
		height: 1em;
	}
</style>