Openapi plus swagger

docs/.vitepress/components/AposApiExplorer.vue

@@ -0,0 +1,29 @@
+<template>
+  <div id="swagger-ui"></div>
+</template>
+
+<script setup>
+import { onMounted } from 'vue'
+
+onMounted(async () => {
+  const SwaggerUI = (await import('swagger-ui-dist/swagger-ui-es-bundle.js')).default
+  await import('swagger-ui-dist/swagger-ui.css')
+
+  SwaggerUI({
+    dom_id: '#swagger-ui',
+    url: '/apostrophecms-openapi.yaml',
+    presets: [
+      SwaggerUI.presets.apis,
+      SwaggerUI.presets.standalone
+    ],
+    layout: "BaseLayout",
+    deepLinking: true,
+    showExtensions: true,
+    showCommonExtensions: true
+  })
+})
+</script>
+
+<style>
+@import 'swagger-ui-dist/swagger-ui.css';
+</style>

docs/.vitepress/theme/index.js

@@ -17,6 +17,7 @@ import { createEventBus } from './eventBus';
 import AposTutorialFilter from '../components/AposTutorialFilter.vue';
 import { setupUpdateChecker } from '../helpers/updateChecker';
 import { setupYouTubeTracking } from '../helpers/youtubeTracking';
+import AposApiExplorer from '../components/AposApiExplorer.vue'
 
 export const eventBus = createEventBus();
 export default {
@@ -40,6 +41,7 @@ export default {
     app.component('AposTwoColumns', AposTwoColumns);
     app.component('AposCtaButton', AposCtaButton);
     app.component('AposTutorialFilter', AposTutorialFilter);
+    app.component('AposApiExplorer', AposApiExplorer);
     if (typeof window !== 'undefined') {
       setupUpdateChecker();
     }

docs/.vitepress/theme/styles/index.styl

@@ -9,3 +9,4 @@
 @import 'sidebar.styl';
 @import 'aside.styl';
 @import 'youtube.styl';
+@import 'swagger.styl';