docs: use vue components for api-docs (#446)

4 files changed, 70 insertions, 0 deletions

diff --git a/docs/.vitepress/components/api-docs/method-parameters.vue b/docs/.vitepress/components/api-docs/method-parameters.vue
new file mode 100644
index 00000000..ca3aef37
--- /dev/null
+++ b/docs/.vitepress/components/api-docs/method-parameters.vue
@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import type { MethodParameter } from './method';
+
+const props = defineProps<{ parameters: MethodParameter[] }>();
+</script>
+
+<template>
+  <div>
+    <h3>Parameters</h3>
+
+    <table>
+      <thead>
+        <tr>
+          <th>Name</th>
+          <th>Type</th>
+          <th>Default</th>
+          <th>Description</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="parameter of props.parameters" :key="parameter.name">
+          <td>{{ parameter.name }}</td>
+          <td>{{ parameter.type }}</td>
+          <td>
+            <code v-if="parameter.default">{{ parameter.default }}</code>
+          </td>
+          <td v-html="parameter.description"></td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
diff --git a/docs/.vitepress/components/api-docs/method.ts b/docs/.vitepress/components/api-docs/method.ts
new file mode 100644
index 00000000..ac0deb96
--- /dev/null
+++ b/docs/.vitepress/components/api-docs/method.ts
@@ -0,0 +1,14 @@
+export interface Method {
+  readonly name: string;
+  readonly description: string; // HTML
+  readonly parameters: MethodParameter[];
+  readonly returns: string;
+  readonly examples: string; // HTML
+}
+
+export interface MethodParameter {
+  readonly name: string;
+  readonly type?: string;
+  readonly default?: string;
+  readonly description: string; // HTML
+}
diff --git a/docs/.vitepress/components/api-docs/method.vue b/docs/.vitepress/components/api-docs/method.vue
new file mode 100644
index 00000000..fb1145cb
--- /dev/null
+++ b/docs/.vitepress/components/api-docs/method.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import type { Method } from './method';
+import MethodParameters from './method-parameters.vue';
+
+const props = defineProps<{ method: Method }>();
+</script>
+
+<template>
+  <div>
+    <h2>{{ props.method.name }}</h2>
+
+    <div v-html="props.method.description"></div>
+
+    <MethodParameters
+      v-if="props.method.parameters.length > 0"
+      :parameters="props.method.parameters"
+    />
+
+    <p><strong>Returns:</strong> {{ props.method.returns }}</p>
+
+    <div v-html="props.method.examples" />
+  </div>
+</template>
diff --git a/docs/api/.gitignore b/docs/api/.gitignore
index 73d5e086..d77f28d2 100644
--- a/docs/api/.gitignore
+++ b/docs/api/.gitignore
@@ -1,3 +1,4 @@
 *.md
 !fake.md
 !localization.md
+*.ts