hermium 0.1.2 → 0.1.4

package/dist/web-server/_ssr/index-DSIu0x-q.mjs

@@ -0,0 +1,449 @@
+import { r as reactExports, j as jsxRuntimeExports } from "../_libs/react.mjs";
+import { a as cn, g as get, p as post } from "./router-59cN5lqo.mjs";
+import { S as Switch } from "./switch-Bim4kX8N.mjs";
+import { G as IconLoader2, H as IconAlertCircle, F as IconRefresh, p as IconPuzzle, I as IconSearch, a as IconX, m as IconChevronDown, J as IconVersions, K as IconTag, L as IconLink } from "../_libs/tabler__icons-react.mjs";
+import { M as Markdown } from "../_libs/react-markdown.mjs";
+import { r as remarkGfm } from "../_libs/remark-gfm.mjs";
+import "../_libs/tanstack__react-router.mjs";
+import "../_libs/tanstack__router-core.mjs";
+import "../_libs/tanstack__history.mjs";
+import "../_libs/cookie-es.mjs";
+import "../_libs/seroval.mjs";
+import "../_libs/seroval-plugins.mjs";
+import "node:stream/web";
+import "node:stream";
+import "../_libs/react-dom.mjs";
+import "util";
+import "crypto";
+import "async_hooks";
+import "stream";
+import "../_libs/isbot.mjs";
+import "../_libs/tanstack__query-core.mjs";
+import "../_libs/tanstack__react-query.mjs";
+import "../_libs/clsx.mjs";
+import "../_libs/class-variance-authority.mjs";
+import "../_libs/zustand.mjs";
+import "../_libs/base-ui__react.mjs";
+import "../_libs/base-ui__utils.mjs";
+import "../_libs/use-sync-external-store.mjs";
+import "../_libs/floating-ui__utils.mjs";
+import "../_libs/floating-ui__react-dom.mjs";
+import "../_libs/floating-ui__dom.mjs";
+import "../_libs/floating-ui__core.mjs";
+import "../_libs/zod.mjs";
+import "../_libs/devlop.mjs";
+import "../_libs/unified.mjs";
+import "../_libs/bail.mjs";
+import "../_libs/extend.mjs";
+import "../_libs/is-plain-obj.mjs";
+import "../_libs/trough.mjs";
+import "../_libs/vfile.mjs";
+import "../_libs/vfile-message.mjs";
+import "../_libs/unist-util-stringify-position.mjs";
+import "node:process";
+import "node:path";
+import "node:url";
+import "../_libs/remark-parse.mjs";
+import "../_libs/mdast-util-from-markdown.mjs";
+import "../_libs/micromark-util-decode-numeric-character-reference+[...].mjs";
+import "../_libs/micromark-util-decode-string.mjs";
+import "../_libs/decode-named-character-reference+[...].mjs";
+import "../_libs/character-entities.mjs";
+import "../_libs/micromark-util-normalize-identifier+[...].mjs";
+import "../_libs/micromark.mjs";
+import "../_libs/micromark-util-combine-extensions+[...].mjs";
+import "../_libs/micromark-util-chunked.mjs";
+import "../_libs/micromark-factory-space.mjs";
+import "../_libs/micromark-util-character.mjs";
+import "../_libs/micromark-core-commonmark.mjs";
+import "../_libs/micromark-util-classify-character+[...].mjs";
+import "../_libs/micromark-util-resolve-all.mjs";
+import "../_libs/micromark-util-subtokenize.mjs";
+import "../_libs/micromark-factory-destination.mjs";
+import "../_libs/micromark-factory-label.mjs";
+import "../_libs/micromark-factory-title.mjs";
+import "../_libs/micromark-factory-whitespace.mjs";
+import "../_libs/micromark-util-html-tag-name.mjs";
+import "../_libs/mdast-util-to-string.mjs";
+import "../_libs/remark-rehype.mjs";
+import "../_libs/mdast-util-to-hast.mjs";
+import "../_libs/ungap__structured-clone.mjs";
+import "../_libs/micromark-util-sanitize-uri.mjs";
+import "../_libs/unist-util-position.mjs";
+import "../_libs/trim-lines.mjs";
+import "../_libs/unist-util-visit.mjs";
+import "../_libs/unist-util-visit-parents.mjs";
+import "../_libs/unist-util-is.mjs";
+import "../_libs/hast-util-to-jsx-runtime.mjs";
+import "../_libs/comma-separated-tokens.mjs";
+import "../_libs/property-information.mjs";
+import "../_libs/space-separated-tokens.mjs";
+import "../_libs/style-to-js.mjs";
+import "../_libs/style-to-object.mjs";
+import "../_libs/inline-style-parser.mjs";
+import "../_libs/hast-util-whitespace.mjs";
+import "../_libs/estree-util-is-identifier-name.mjs";
+import "../_libs/html-url-attributes.mjs";
+import "../_libs/micromark-extension-gfm.mjs";
+import "../_libs/micromark-extension-gfm-autolink-literal+[...].mjs";
+import "../_libs/micromark-extension-gfm-footnote+[...].mjs";
+import "../_libs/micromark-extension-gfm-strikethrough+[...].mjs";
+import "../_libs/micromark-extension-gfm-table.mjs";
+import "../_libs/micromark-extension-gfm-task-list-item+[...].mjs";
+import "../_libs/mdast-util-gfm.mjs";
+import "../_libs/mdast-util-gfm-autolink-literal+[...].mjs";
+import "../_libs/ccount.mjs";
+import "../_libs/mdast-util-find-and-replace.mjs";
+import "../_libs/escape-string-regexp.mjs";
+import "../_libs/mdast-util-gfm-footnote.mjs";
+import "../_libs/mdast-util-gfm-strikethrough.mjs";
+import "../_libs/mdast-util-gfm-table.mjs";
+import "../_libs/markdown-table.mjs";
+import "../_libs/mdast-util-to-markdown.mjs";
+import "../_libs/longest-streak.mjs";
+import "../_libs/mdast-util-phrasing.mjs";
+import "../_libs/mdast-util-gfm-task-list-item.mjs";
+async function fetchSkills() {
+  return get("/api/hermes/skills");
+}
+async function fetchSkillContent(category, skill) {
+  return get(`/api/hermes/skills/${category}/${skill}/SKILL.md`);
+}
+async function toggleSkill(category, skill) {
+  return post(`/api/hermes/skills/${category}/${skill}/toggle`);
+}
+const markdownComponents = {
+  a({ href, children }) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "a",
+      {
+        href,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "text-blue-600 dark:text-blue-400 underline underline-offset-2 decoration-blue-400/30 hover:decoration-blue-600/60 transition-colors",
+        children
+      }
+    );
+  },
+  img({ src, alt }) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src, alt, className: "rounded-xl max-w-full my-4", loading: "lazy" });
+  },
+  pre({ children }) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "my-5 rounded-xl bg-muted/50 border border-border/60 px-5 py-4 text-[13px] leading-relaxed overflow-x-auto font-mono whitespace-pre-wrap", children });
+  },
+  code({ children, className }) {
+    const isInline = !className;
+    if (isInline) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx("code", { className: "rounded-md bg-muted/70 px-1.5 py-0.5 text-[13px] font-mono text-foreground/90 border border-border/50", children });
+    }
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("code", { className, children });
+  }
+};
+function SkillsPage() {
+  const [categories, setCategories] = reactExports.useState([]);
+  const [total, setTotal] = reactExports.useState(0);
+  const [loading, setLoading] = reactExports.useState(true);
+  const [error, setError] = reactExports.useState(null);
+  const [searchQuery, setSearchQuery] = reactExports.useState("");
+  const [selectedCategory, setSelectedCategory] = reactExports.useState(null);
+  const [selectedSkill, setSelectedSkill] = reactExports.useState(null);
+  const [selectedSkillName, setSelectedSkillName] = reactExports.useState(null);
+  const [skillContent, setSkillContent] = reactExports.useState("");
+  const [skillLoading, setSkillLoading] = reactExports.useState(false);
+  const [collapsedCategories, setCollapsedCategories] = reactExports.useState(/* @__PURE__ */ new Set());
+  const load = reactExports.useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await fetchSkills();
+      setCategories(result.categories);
+      setTotal(result.total);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to load skills");
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+  reactExports.useEffect(() => {
+    load();
+  }, [load]);
+  reactExports.useEffect(() => {
+    if (!selectedCategory || !selectedSkill) {
+      setSkillContent("");
+      return;
+    }
+    let cancelled = false;
+    setSkillLoading(true);
+    fetchSkillContent(selectedCategory, selectedSkill).then((res) => {
+      if (!cancelled) {
+        const content = res.content;
+        if (content.startsWith("---")) {
+          const endIdx = content.indexOf("\n---", 3);
+          if (endIdx !== -1) {
+            setSkillContent(content.slice(endIdx + 4).trim());
+          } else {
+            setSkillContent(content);
+          }
+        } else {
+          setSkillContent(content);
+        }
+        setSkillLoading(false);
+      }
+    }).catch((e) => {
+      if (!cancelled) {
+        setSkillContent(e instanceof Error ? e.message : "Failed to load skill");
+        setSkillLoading(false);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [selectedCategory, selectedSkill]);
+  const q = searchQuery.toLowerCase().trim();
+  const filteredCategories = q ? categories.map((cat) => ({
+    ...cat,
+    skills: (cat.skills ?? []).filter(
+      (s) => s.name.toLowerCase().includes(q) || s.description.toLowerCase().includes(q) || (s.tags ?? []).some((t) => t.toLowerCase().includes(q))
+    )
+  })).filter((cat) => cat.skills.length > 0 || cat.name.toLowerCase().includes(q)) : categories;
+  const toggleCategory = (name) => {
+    setCollapsedCategories((prev) => {
+      const next = new Set(prev);
+      if (next.has(name)) next.delete(name);
+      else next.add(name);
+      return next;
+    });
+  };
+  const selectSkill = (catName, skillName, displayName) => {
+    setSelectedCategory(catName);
+    setSelectedSkill(skillName);
+    setSelectedSkillName(displayName);
+  };
+  const handleToggle = async (catName, skillName) => {
+    setCategories(
+      (prev) => prev.map(
+        (cat) => cat.name === catName ? {
+          ...cat,
+          skills: cat.skills.map(
+            (s) => s.name === skillName ? { ...s, disabled: !s.disabled } : s
+          )
+        } : cat
+      )
+    );
+    try {
+      await toggleSkill(catName, skillName);
+    } catch {
+      load();
+    }
+  };
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3 text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(IconLoader2, { className: "size-6 animate-spin" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm", children: "Loading skills..." })
+    ] }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-3 text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(IconAlertCircle, { className: "size-8 text-red-500" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm", children: error }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "button",
+        {
+          onClick: load,
+          className: "inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-xs font-medium bg-muted hover:bg-muted/80 transition-colors",
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(IconRefresh, { className: "size-3.5" }),
+            "Retry"
+          ]
+        }
+      )
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 overflow-hidden", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("aside", { className: "flex w-64 shrink-0 flex-col border-r border-border", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2.5 px-3 py-3.5 shrink-0", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(IconPuzzle, { className: "size-5 text-muted-foreground" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-sm font-semibold text-foreground", children: [
+          "Skills",
+          total > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ml-1.5 text-[11px] font-normal text-muted-foreground", children: [
+            "(",
+            total,
+            ")"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 pb-2 shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(IconSearch, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 size-3.5 text-muted-foreground/50" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            value: searchQuery,
+            onChange: (e) => setSearchQuery(e.target.value),
+            placeholder: "Search skills...",
+            className: "w-full rounded-md border border-border/60 bg-muted/30 pl-8 pr-8 py-1.5 text-xs text-foreground placeholder:text-muted-foreground/40 outline-none focus:ring-1 focus:ring-primary/20 focus:border-primary/30"
+          }
+        ),
+        searchQuery && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            onClick: () => setSearchQuery(""),
+            className: "absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground/40 hover:text-muted-foreground",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(IconX, { className: "size-3" })
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-y-auto min-h-0", children: filteredCategories.length === 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-4 py-8 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground", children: searchQuery ? "No skills match your search" : "No skills found" }) }) : filteredCategories.map((cat) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-1", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: () => toggleCategory(cat.name),
+            className: "flex w-full items-center gap-1.5 px-3 py-1.5 text-left hover:bg-muted/40 transition-colors",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                IconChevronDown,
+                {
+                  className: cn(
+                    "size-3 shrink-0 text-muted-foreground/50 transition-transform",
+                    collapsedCategories.has(cat.name) && "-rotate-90"
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-muted-foreground truncate", children: cat.name.replace(/-/g, " ") }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] text-muted-foreground/50 ml-auto shrink-0", children: cat.skills.length })
+            ]
+          }
+        ),
+        !collapsedCategories.has(cat.name) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "pb-1", children: (cat.skills ?? []).map((skill) => {
+          const isActive = selectedCategory === cat.name && selectedSkill === skill.name;
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "button",
+            {
+              onClick: () => selectSkill(cat.name, skill.name, skill.name),
+              className: cn(
+                "flex w-full items-start gap-2 px-3 py-1.5 pl-8 text-left transition-colors",
+                isActive ? "bg-muted text-foreground" : skill.disabled ? "text-muted-foreground/40 hover:bg-muted/20" : "text-muted-foreground hover:bg-muted/30 hover:text-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("min-w-0 flex-1", skill.disabled && "opacity-50"), children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("truncate text-xs font-medium", skill.disabled && "line-through"), children: skill.name }),
+                  skill.description && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "truncate text-[10px] text-muted-foreground/60 mt-0.5", children: skill.description })
+                ] }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "shrink-0", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  Switch,
+                  {
+                    checked: !skill.disabled,
+                    onCheckedChange: () => handleToggle(cat.name, skill.name)
+                  }
+                ) })
+              ]
+            },
+            skill.name
+          );
+        }) })
+      ] }, cat.name)) })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 flex-col min-w-0 overflow-y-auto", children: !selectedSkill ? (
+      /* Empty state */
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-4 text-muted-foreground max-w-sm text-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex size-16 items-center justify-center rounded-2xl bg-muted/50 border border-border/50", children: /* @__PURE__ */ jsxRuntimeExports.jsx(IconPuzzle, { className: "size-7 text-muted-foreground/25" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium text-foreground/60", children: "Select a skill to view details" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-muted-foreground/50 mt-1", children: "Browse skills from your Hermes agent library. Each skill provides instructions and context for specific tasks." })
+        ] })
+      ] }) })
+    ) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "shrink-0 border-b border-border px-6 py-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex size-8 items-center justify-center rounded-lg bg-muted/50 border border-border/50", children: /* @__PURE__ */ jsxRuntimeExports.jsx(IconPuzzle, { className: "size-4 text-muted-foreground" }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-base font-semibold text-foreground truncate", children: selectedSkillName }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xs text-muted-foreground/60 mt-0.5 flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground/40", children: selectedCategory?.replace(/-/g, " ") }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground/30", children: "/" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: selectedSkillName })
+            ] })
+          ] })
+        ] }),
+        (() => {
+          const cat = categories.find((c) => c.name === selectedCategory);
+          const skill = cat?.skills.find((s) => s.name === selectedSkill);
+          if (!skill) return null;
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap items-center gap-2 mt-3", children: [
+            skill.version && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1 text-[10px] text-muted-foreground/60 bg-muted/40 rounded-full px-2 py-0.5", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(IconVersions, { className: "size-3" }),
+              "v",
+              skill.version
+            ] }),
+            (skill.tags ?? []).map((tag) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              "span",
+              {
+                className: "inline-flex items-center gap-1 text-[10px] text-muted-foreground/60 bg-muted/40 rounded-full px-2 py-0.5",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(IconTag, { className: "size-3" }),
+                  tag
+                ]
+              },
+              tag
+            ))
+          ] });
+        })()
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-y-auto min-h-0 px-6 py-6", children: skillLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsxRuntimeExports.jsx(IconLoader2, { className: "size-5 animate-spin text-muted-foreground" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "max-w-3xl mx-auto", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: cn(
+              "prose-sm max-w-none",
+              // Headings
+              "[&_h1]:mt-8 [&_h1]:mb-4 [&_h1]:text-2xl [&_h1]:font-bold [&_h1]:tracking-tight [&_h1]:text-foreground",
+              "[&_h2]:mt-7 [&_h2]:mb-3 [&_h2]:text-xl [&_h2]:font-semibold [&_h2]:tracking-tight [&_h2]:text-foreground",
+              "[&_h3]:mt-6 [&_h3]:mb-2.5 [&_h3]:text-lg [&_h3]:font-semibold [&_h3]:text-foreground",
+              "[&_h4]:mt-5 [&_h4]:mb-2 [&_h4]:text-base [&_h4]:font-medium [&_h4]:text-foreground",
+              // Paragraphs
+              "[&_p]:my-4 [&_p]:leading-[1.75] [&_p]:text-foreground/85",
+              // Lists
+              "[&_ul]:my-4 [&_ul]:pl-6 [&_ul]:list-disc [&_ul]:space-y-1.5 [&_ul]:marker:text-muted-foreground/40",
+              "[&_ol]:my-4 [&_ol]:pl-6 [&_ol]:list-decimal [&_ol]:space-y-1.5 [&_ol]:marker:text-muted-foreground/40",
+              "[&_li]:leading-relaxed [&_li]:text-foreground/85",
+              // Blockquotes
+              "[&_blockquote]:my-5 [&_blockquote]:border-l-[3px] [&_blockquote]:border-amber-400 dark:[&_blockquote]:border-amber-500 [&_blockquote]:pl-4 [&_blockquote]:text-muted-foreground [&_blockquote]:italic [&_blockquote]:leading-relaxed",
+              // Horizontal rules
+              "[&_hr]:my-8 [&_hr]:border-border/40",
+              // Tables
+              "[&_table]:w-full [&_table]:my-4 [&_table]:text-sm",
+              "[&_th]:border [&_th]:border-border [&_th]:bg-muted/60 [&_th]:px-4 [&_th]:py-2.5 [&_th]:text-left [&_th]:font-medium [&_th]:text-foreground/80 [&_th]:text-xs [&_th]:uppercase [&_th]:tracking-wider",
+              "[&_td]:border [&_td]:border-border [&_td]:px-4 [&_td]:py-2.5 [&_td]:text-foreground/80",
+              // First/last margin reset
+              "[&>*:first-child]:mt-0 [&>*:last-child]:mb-0"
+            ),
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Markdown, { remarkPlugins: [remarkGfm], components: markdownComponents, children: skillContent })
+          }
+        ),
+        (() => {
+          const cat = categories.find((c) => c.name === selectedCategory);
+          const skill = cat?.skills.find((s) => s.name === selectedSkill);
+          const relatedSkills = skill?.related_skills ?? [];
+          if (!relatedSkills.length) return null;
+          return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-8 pt-6 border-t border-border", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("h4", { className: "flex items-center gap-1.5 text-xs font-semibold text-muted-foreground uppercase tracking-wide mb-3", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(IconLink, { className: "size-3" }),
+              "Related Skills"
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-1.5", children: relatedSkills.map((related) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "span",
+              {
+                className: "rounded-md bg-muted/40 px-2.5 py-1 text-xs text-muted-foreground border border-border/40",
+                children: related
+              },
+              related
+            )) })
+          ] });
+        })()
+      ] }) })
+    ] }) })
+  ] });
+}
+const SplitComponent = SkillsPage;
+export {
+  SplitComponent as component
+};