Modularize UI, make it a bit more Lisp independent

src/ui/SpanChip.tsx

@@ -0,0 +1,21 @@
+import type { CodePointSpan } from 'source-region';
+import { spanLabel } from './format';
+import type { HoverTarget } from './types';
+
+export function SpanChip(props: {
+  label: string;
+  span: CodePointSpan;
+  onHover: (target: HoverTarget | undefined) => void;
+}) {
+  return (
+    <button
+      class="span-chip"
+      type="button"
+      onMouseEnter={() => props.onHover({ label: props.label, span: props.span })}
+      onMouseLeave={() => props.onHover(undefined)}
+    >
+      <span>{props.label}</span>
+      <span>{spanLabel(props.span)}</span>
+    </button>
+  );
+}