feat: cleaner api rendering

packages/website-ue/src/components/ApiGroup.astro

@@ -0,0 +1,34 @@
+---
+import type { CollectionEntry } from "astro:content";
+import { Code } from "./Code";
+import { Heading } from "./Heading";
+import { MarkdownCustom } from "./MarkdownCustom";
+
+interface Props {
+  apis: CollectionEntry<"api">[];
+}
+
+const { apis } = Astro.props;
+---
+
+<style>
+  .container {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-4);
+  }
+</style>
+
+{
+  apis
+    .sort((a, b) => a.id.localeCompare(b.id))
+    .map((api) => (
+      <div class="container">
+        <Heading size="3">
+          <Code>{api.id}</Code>
+        </Heading>
+
+        <MarkdownCustom body={api.data.docs ?? ""} />
+      </div>
+    ))
+}