undocs 0.4.7 → 0.4.9

package/app/assets/main.css

@@ -1,8 +1,3 @@
-@import 'tailwindcss';
-@import '@nuxt/ui';
-
-@source '../**/*.vue';
-
 @theme static {
   --font-sans: 'Inter', sans-serif;
 }

package/app/components/page/PageContributors.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+const docsConfig = useAppConfig().docs
+const { data: contributors } = await useAsyncData(() => useContributors())
+</script>
+
+<template>
+  <UPageSection v-if="contributors?.length" id="contributors" title="Contributors">
+    <div class="flex flex-wrap justify-center gap-2">
+      <UTooltip v-for="c in contributors" :key="c.username" :text="c.name" :delay-duration="0">
+        <a :href="c.profile" target="_blank" class="opacity-80 hover:opacity-100">
+          <UAvatar :alt="c.name" :src="c.avatar" size="3xl" />
+        </a>
+      </UTooltip>
+    </div>
+    <div class="text-center">
+      <UButton
+        v-if="docsConfig.github"
+        :to="`https://github.com/${docsConfig.github}`"
+        target="_blank"
+        color="neutral"
+        icon="i-lucide-git-pull-request"
+      >
+        Contribute on GitHub
+      </UButton>
+    </div>
+  </UPageSection>
+</template>

package/app/components/page/PageSponsors.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+const { data: sponsors } = await useAsyncData(() => useSponsors())
+</script>
+
+<template>
+  <UPageSection v-if="sponsors?.sponsors.length" title="Sponsors" class="bg-muted/30 border-y border-default">
+    <div id="sponsors" class="flex flex-col items-center gap-8">
+      <div
+        v-for="(tier, i) of sponsors.sponsors.slice(0, 2)"
+        :key="i"
+        class="flex flex-wrap justify-center gap-8 max-w-4xl"
+      >
+        <div v-for="s in tier" :key="s.name" class="flex items-center gap-6 max-w-[300px]">
+          <a
+            :href="s.website"
+            target="_blank"
+            class="flex items-center gap-2 opacity-80 hover:opacity-100"
+            :class="`font-size-${i === 0 ? '3xl' : i === 1 ? 'xl' : 'lg'}`"
+          >
+            <img
+              v-if="s.image"
+              :src="s.image"
+              :alt="s.name"
+              class="object-contain rounded-lg"
+              :style="{
+                width: i === 0 ? '80px' : '48px',
+                height: i === 0 ? '80px' : '48px',
+              }"
+            />
+            <span v-if="i < 2" class="font-semibold" :class="`text-${i === 0 ? '2xl' : 'xl'}`">{{ s.name }}</span>
+          </a>
+        </div>
+      </div>
+      <div class="flex flex-wrap justify-center gap-2">
+        <UTooltip v-for="s in sponsors.sponsors[2]" :key="s.name" :text="s.name" :delay-duration="0">
+          <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
+            <UAvatar :alt="s.name" :src="s.image" size="2xl" />
+          </a>
+        </UTooltip>
+      </div>
+      <div class="flex flex-wrap justify-center gap-1">
+        <UTooltip v-for="s in sponsors.sponsors[3]" :key="s.name" :text="s.name" :delay-duration="0">
+          <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
+            <UAvatar :alt="s.name" :src="s.image" />
+          </a>
+        </UTooltip>
+      </div>
+    </div>
+    <div class="text-center">
+      <UButton
+        v-if="sponsors.username"
+        icon="i-lucide-heart-handshake"
+        :to="`https://github.com/sponsors/${sponsors.username}`"
+        target="_blank"
+        color="neutral"
+      >
+        Become a Sponsor
+      </UButton>
+    </div>
+  </UPageSection>
+</template>

package/app/composables/useContributors.ts

@@ -7,7 +7,7 @@ export interface Contributor {
 
 export async function useContributors(): Promise<Contributor[] | undefined> {
   const { docs: docsConfig } = useAppConfig()
-  if (!docsConfig.github || !docsConfig.landing?.contributors) {
+  if (!docsConfig.github) {
     return
   }
   const { contributors = [] } = await await $fetch<{ contributors: { username: string }[] }>(

package/app/composables/useDocsNav.ts

@@ -27,7 +27,7 @@ export function useDocsNav() {
         to: item.path,
         originalPath,
         hasIndex: item.path === originalPath,
-        label: titleCase(originalPath),
+        label: item.title || titleCase(originalPath),
         active: isActive(originalPath),
       }
     })

package/app/modules/css.ts

@@ -0,0 +1,32 @@
+import { defineNuxtModule, addTemplate, createResolver } from '@nuxt/kit'
+import { joinURL } from 'ufo'
+import { resolveModulePath } from 'exsolve'
+
+export default defineNuxtModule({
+  meta: {
+    name: 'css',
+  },
+  async setup(_options, nuxt) {
+    const dir = nuxt.options.rootDir
+    const resolver = createResolver(import.meta.url)
+
+    const contentDir = joinURL(dir, '../')
+    const uiPath = resolveModulePath('@nuxt/ui', { from: import.meta.url, conditions: ['style'] })
+    const tailwindPath = resolveModulePath('tailwindcss', { from: import.meta.url, conditions: ['style'] })
+    const layerDir = resolver.resolve('../')
+
+    const cssTemplate = addTemplate({
+      filename: 'undocs.css',
+      getContents: () => {
+        return `@import ${JSON.stringify(tailwindPath)};
+@import ${JSON.stringify(uiPath)};
+
+@source "${contentDir.replace(/\\/g, '/')}/**/*.md";
+@source "${layerDir.replace(/\\/g, '/')}/**/*";
+@source "../../app.config.ts";`
+      },
+    })
+
+    nuxt.options.css.unshift(cssTemplate.dst)
+  },
+})

package/app/pages/[...slug].vue

@@ -66,7 +66,7 @@ usePageSEO({
       </template>
     </UPageHeader>
 
-    <template #right>
+    <template v-if="page.body?.toc?.links?.length" #right>
       <UContentToc title="On this page" :links="page.body?.toc?.links || []" highlight />
     </template>
 

package/app/pages/index.vue

@@ -96,9 +96,6 @@ const { data: latest } = await useAsyncData(() =>
     .first()
     .then((res) => res),
 )
-
-const { data: sponsors } = await useAsyncData(() => useSponsors())
-const { data: contributors } = await useAsyncData(() => useContributors())
 </script>
 
 <template>
@@ -177,81 +174,7 @@ const { data: contributors } = await useAsyncData(() => useContributors())
       </template>
     </UPageSection>
 
-    <UPageSection v-if="sponsors?.sponsors.length" title="Sponsors" class="bg-muted/30 border-y border-default">
-      <div id="sponsors" class="flex flex-col items-center gap-8">
-        <div
-          v-for="(tier, i) of sponsors.sponsors.slice(0, 2)"
-          :key="i"
-          class="flex flex-wrap justify-center gap-8 max-w-4xl"
-        >
-          <div v-for="s in tier" :key="s.name" class="flex items-center gap-6 max-w-[300px]">
-            <a
-              :href="s.website"
-              target="_blank"
-              class="flex items-center gap-2 opacity-80 hover:opacity-100"
-              :class="`font-size-${i === 0 ? '3xl' : i === 1 ? 'xl' : 'lg'}`"
-            >
-              <img
-                v-if="s.image"
-                :src="s.image"
-                :alt="s.name"
-                class="object-contain rounded-lg"
-                :style="{
-                  width: i === 0 ? '80px' : '48px',
-                  height: i === 0 ? '80px' : '48px',
-                }"
-              />
-              <span v-if="i < 2" class="font-semibold" :class="`text-${i === 0 ? '2xl' : 'xl'}`">{{ s.name }}</span>
-            </a>
-          </div>
-        </div>
-        <div class="flex flex-wrap justify-center gap-2">
-          <UTooltip v-for="s in sponsors.sponsors[2]" :key="s.name" :text="s.name" :delay-duration="0">
-            <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
-              <UAvatar :alt="s.name" :src="s.image" size="2xl" />
-            </a>
-          </UTooltip>
-        </div>
-        <div class="flex flex-wrap justify-center gap-1">
-          <UTooltip v-for="s in sponsors.sponsors[3]" :key="s.name" :text="s.name" :delay-duration="0">
-            <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
-              <UAvatar :alt="s.name" :src="s.image" />
-            </a>
-          </UTooltip>
-        </div>
-      </div>
-      <div class="text-center">
-        <UButton
-          v-if="sponsors.username"
-          icon="i-lucide-heart-handshake"
-          :to="`https://github.com/sponsors/${sponsors.username}`"
-          target="_blank"
-          color="neutral"
-        >
-          Become a Sponsor
-        </UButton>
-      </div>
-    </UPageSection>
-
-    <UPageSection v-if="contributors?.length" id="contributors" title="Contributors">
-      <div class="flex flex-wrap justify-center gap-2">
-        <UTooltip v-for="c in contributors" :key="c.username" :text="c.name" :delay-duration="0">
-          <a :href="c.profile" target="_blank" class="opacity-80 hover:opacity-100">
-            <UAvatar :alt="c.name" :src="c.avatar" size="3xl" />
-          </a>
-        </UTooltip>
-      </div>
-      <div class="text-center">
-        <UButton
-          v-if="landing._github"
-          :to="`https://github.com/${landing._github}`"
-          target="_blank"
-          color="neutral"
-          icon="i-lucide-git-pull-request"
-        >
-          Contribute on GitHub
-        </UButton>
-      </div>
-    </UPageSection>
+    <PageSponsors v-if="docsConfig.sponsors?.api" />
+    <PageContributors v-if="docsConfig.landing?.contributors" />
   </div>
 </template>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "undocs",
-  "version": "0.4.7",
+  "version": "0.4.9",
   "repository": "unjs/undocs",
   "license": "MIT",
   "type": "module",