feat(ui): replace unicode icons with solid-icons

Swap emoji and unicode glyphs for Tabler components so icons inherit
currentColor and font-size and render consistently across platforms.

- add src/components/doc-icons.ts to resolve doc-entry frontmatter icon
  keys to components; frontmatter now stores semantic keys
- replace the align-*.png assets with TbOutlineAlign* icons
- render RevealManager action SVGs as components instead of injected
  innerHTML strings
- carry completion icons via an optional CompletionItem.icon field

src/components/RevealManager.tsx

@@ -15,8 +15,10 @@ import {
   onCleanup,
   Show,
 } from "solid-js";
-import { Portal } from "solid-js/web";
+import { Portal, Dynamic } from "solid-js/web";
 import { useLocation } from "@solidjs/router";
+import type { IconTypes } from "solid-icons";
+import { TbOutlineLink, TbOutlineSparkles } from "solid-icons/tb";
 import { useArticleDom } from "./Article";
 import { journalStreamState } from "./stores/journalStream";
 import { useJournalCompletions } from "./journal/completions";
@@ -27,25 +29,6 @@ import {
   normalizePath,
 } from "./stores/reveal";
 
-// ---------------------------------------------------------------------------
-// SVG icons
-// ---------------------------------------------------------------------------
-
-const LINK_SVG =
-  '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" ' +
-  'viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" ' +
-  'stroke-linecap="round" stroke-linejoin="round">' +
-  '<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/>' +
-  '<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>' +
-  "</svg>";
-
-const SPARK_SVG =
-  '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" ' +
-  'viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" ' +
-  'stroke-linecap="round" stroke-linejoin="round">' +
-  '<path d="M12 2l1.5 6.5L18 7l-4.5 4.5L16 16l-4-2.5L8 16l1.5-4.5L5 7l4.5-.5z"/>' +
-  "</svg>";
-
 // ---------------------------------------------------------------------------
 // Floating button state
 // ---------------------------------------------------------------------------
@@ -54,7 +37,7 @@ interface FloatingButton {
   rect: DOMRect;
   action: () => void;
   title: string;
-  svg: string;
+  icon: IconTypes;
   color: string;
 }
 
@@ -130,7 +113,7 @@ export const RevealManager: Component = () => {
                 text: combinedSlug,
               }),
             title: "Roll spark table",
-            svg: SPARK_SVG,
+            icon: TbOutlineSparkles,
             color: "text-purple-400 hover:text-purple-600 hover:bg-purple-50",
           });
           return;
@@ -150,7 +133,7 @@ export const RevealManager: Component = () => {
                 text: `${normalized}#${text}`,
               }),
             title: "Send /link to stream",
-            svg: LINK_SVG,
+            icon: TbOutlineLink,
             color: "text-blue-500 hover:bg-blue-50",
           });
         }
@@ -183,14 +166,15 @@ export const RevealManager: Component = () => {
               left: `${btn().rect.left - 20}px`,
             }}
             title={btn().title}
-            innerHTML={btn().svg}
             onClick={(e) => {
               e.stopPropagation();
               btn().action();
             }}
             onMouseEnter={() => clearTimeout(hideTimer)}
             onMouseLeave={hide}
-          />
+          >
+            <Dynamic component={btn().icon} size={12} />
+          </button>
         </Portal>
       )}
     </Show>