feat: custom nav controls (#521)

slidevjs · Mar 21, 2022 · 182d04e · 182d04e
1 parent ebdfd9f
commit 182d04e
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 0 deletions.
diff --git a/packages/client/internals/NavControls.vue b/packages/client/internals/NavControls.vue
@@ -8,6 +8,8 @@ import { configs } from '../env'
 import Settings from './Settings.vue'
 import MenuButton from './MenuButton.vue'
 import VerticalDivider from './VerticalDivider.vue'
+// @ts-expect-error virtual module
+import CustomNavControls from '/@slidev/custom-nav-controls'
 
 const props = defineProps({
   persist: {
@@ -153,6 +155,8 @@ if (__SLIDEV_FEATURE_DRAWINGS__)
           <span class="opacity-50">/ {{ total }}</span>
         </div>
       </div>
+
+      <CustomNavControls />
     </div>
   </nav>
 </template>
diff --git a/packages/slidev/node/plugins/loaders.ts b/packages/slidev/node/plugins/loaders.ts
@@ -238,6 +238,10 @@ export function createSlidesLoader(
         if (id === '/@slidev/global-components/bottom')
           return generateGlobalComponents('bottom')
 
+        // custom nav controls
+        if (id === '/@slidev/custom-nav-controls')
+          return generateCustomNavControls()
+
         // pages
         if (id.startsWith(slidePrefix)) {
           const remaning = id.slice(slidePrefix.length)
@@ -483,6 +487,29 @@ export default {
     return [${render}]
   }
 }
+`
+  }
+  async function generateCustomNavControls() {
+    const components = roots
+      .flatMap((root) => {
+        return [
+          join(root, 'custom-nav-controls.vue'),
+          join(root, 'CustomNavControls.vue'),
+        ]
+      })
+      .filter(i => fs.existsSync(i))
+
+    const imports = components.map((i, idx) => `import __n${idx} from '${toAtFS(i)}'`).join('\n')
+    const render = components.map((i, idx) => `h(__n${idx})`).join(',')
+
+    return `
+${imports}
+import { h } from 'vue'
+export default {
+  render() {
+    return [${render}]
+  }
+}
 `
   }
 }