undocs 0.2.2 → 0.2.4

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) UnJS
+Copyright (c) Pooya Parsa <pooya@pi0.io>
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -6,8 +6,38 @@ Made with [Nuxt](https://nuxt.com/), [Nuxt Content](https://content.nuxt.com), [
 
 👉 Docs: https://undocs.pages.dev/
 
+## Contribution
+
+<details>
+  <summary>Local development</summary>
+
+- Clone this repository
+- Install the latest LTS version of [Node.js](https://nodejs.org/en/)
+- Enable [Corepack](https://github.com/nodejs/corepack) using `corepack enable`
+- Install dependencies using `pnpm install`
+- Run tests using `pnpm dev` or `pnpm test`
+
+</details>
+
+<!-- /automd -->
+
 ## License
 
-Thanks to [@loklaan](https://github.com/loklaan) for donating `undocs` npm package name.
+<!-- automd:contributors license=MIT author="pi0,atinux" -->
+
+Published under the [MIT](https://github.com/unjs/undocs/blob/main/LICENSE) license.
+Made by [@pi0](https://github.com/pi0), [@atinux](https://github.com/atinux) and [community](https://github.com/unjs/undocs/graphs/contributors) 💛
+<br><br>
+<a href="https://github.com/unjs/undocs/graphs/contributors">
+<img src="https://contrib.rocks/image?repo=unjs/undocs" />
+</a>
+
+<!-- /automd -->
+
+<!-- automd:with-automd -->
+
+---
+
+_🤖 auto updated with [automd](https://automd.unjs.io) (last updated: Wed Feb 21 2024)_
 
-[MIT](./LICENSE)
+<!-- /automd -->

package/bin/cli.mjs

@@ -1,4 +1,2 @@
 #!/usr/bin/env node
-import jiti from 'jiti'
-
-jiti(import.meta.url, { esmResolve: true })('../layers/unjs/cli/main.ts')
+import '../layers/unjs/cli/main.mjs'

package/layers/core/app/app.vue

@@ -20,21 +20,19 @@ provide('navigation', navigation)
 </script>
 
 <template>
-  <div>
-    <AppHeader />
+  <AppHeader />
 
-    <UMain>
-      <NuxtLayout>
-        <NuxtPage />
-      </NuxtLayout>
-    </UMain>
+  <UMain class="min-h-[calc(100vh-var(--header-height)-78px)]">
+    <NuxtLayout>
+      <NuxtPage />
+    </NuxtLayout>
+  </UMain>
 
-    <AppFooter />
+  <AppFooter />
 
-    <ClientOnly>
-      <LazyUDocsSearch :files="files" :navigation="navigation" />
-    </ClientOnly>
+  <ClientOnly>
+    <LazyUDocsSearch :files="files" :navigation="navigation" />
+  </ClientOnly>
 
-    <UNotifications />
-  </div>
+  <UNotifications />
 </template>

package/layers/core/app/components/AppFooter.vue

@@ -1,14 +1,12 @@
 <script lang="ts" setup>
-import { AppFooterNotes } from '#components'
+import { AppFooterNotes, UDivider } from '#components'
 </script>
 
 <template>
-  <div class="w-full h-px bg-gray-200 dark:bg-gray-800 flex items-center justify-center">
-    <div class="bg-white dark:bg-gray-900 px-4">
-      <OrgLogo class="w-5 h-5" />
-    </div>
-  </div>
-  <UFooter :links="[]">
+  <UDivider class="-mb-[10px]">
+    <OrgLogo class="w-5 h-5 z-10" />
+  </UDivider>
+  <UFooter :links="[]" class="bg-background/75 backdrop-blur">
     <template #left>
       <AppFooterNotes />
     </template>

package/layers/core/app/components/LandingBackground.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+const points = useState(() => new Array(16).fill(0).map(() => [Math.random(), Math.random()]))
+
+const poly = computed(() => points.value.map(([x, y]) => `${x * 100}% ${y * 100}%`).join(', '))
+
+function jumpVal(val: number) {
+  return Math.random() > 0.5 ? val + (Math.random() - 0.5) / 2 : Math.random()
+}
+
+let timeout
+function jumpPoints() {
+  for (let i = 0; i < points.value.length; i++) {
+    points.value[i] = [jumpVal(points.value[i][0]), jumpVal(points.value[i][1])]
+  }
+  timeout = setTimeout(jumpPoints, 2000 + Math.random() * 1000)
+}
+
+onMounted(() => {
+  jumpPoints()
+  onUnmounted(() => clearTimeout(timeout))
+})
+</script>
+
+<template>
+  <div
+    class="bg absolute left-0 right-0 top-0 bottom-0 -z-10 transform-gpu blur-3xl overflow-hidden"
+    aria-hidden="true"
+  >
+    <div
+      class="aspect-[1.7] w-full bg-gradient-to-r from-[rgb(var(--color-primary-DEFAULT))] to-white/10 lg:opacity-30 xs:opacity-50"
+      :style="{ 'clip-path': `polygon(${poly})` }"
+    />
+  </div>
+</template>
+
+<style scoped>
+.bg > div {
+  clip-path: circle(75%);
+  transition: clip-path 3s;
+}
+
+.light .bg > div {
+  opacity: 1 !important;
+}
+</style>

package/layers/core/app/modules/content/index.ts

@@ -1,10 +1,10 @@
 import { fileURLToPath } from 'node:url'
 import { defineNuxtModule } from 'nuxt/kit'
 import type { ModuleOptions as ContentOptions } from '@nuxt/content'
-import type { DocsConfig } from '../../../schema'
+import type { DocsConfig } from '../../../../../schema/config'
 
 export default defineNuxtModule({
-  setup(_, nuxt) {
+  async setup(_, nuxt) {
     if (nuxt.options._prepare) {
       return
     }
@@ -12,6 +12,22 @@ export default defineNuxtModule({
     const contentConfig = (nuxt.options as any).content as ContentOptions
     const docsConfig = (nuxt.options as any).docs as DocsConfig
 
+    if (docsConfig.landing === false) {
+      nuxt.hooks.hook('pages:extend', (pages) => {
+        const index = pages.findIndex((page) => page.path === '/')
+        if (index !== -1) {
+          pages.splice(index, 1)
+        }
+      })
+    }
+
+    if (docsConfig.automd) {
+      const { loadConfig } = await import('automd')
+      docsConfig.automd = loadConfig(docsConfig.dir, {
+        ...docsConfig.automd,
+      })
+    }
+
     contentConfig.sources = {
       ...contentConfig.sources,
       content: {

package/layers/core/app/modules/content/landing.mjs

@@ -1,6 +1,9 @@
 import defu from 'defu'
 
 export function genLanding(docsConfig) {
+  if (docsConfig.landing === false) {
+    return undefined
+  }
   const landing = defu(docsConfig.landing || {}, {
     // Meta
     navigation: false,
@@ -35,6 +38,8 @@ export function genLanding(docsConfig) {
     // Features
     featuresTitle: '',
     features: [],
+
+    _github: docsConfig.github,
   })
 
   landing._heroMdTitle =

package/layers/core/app/modules/content/source.mjs

@@ -1,5 +1,6 @@
 import { defineDriver } from 'unstorage'
 import fsDriver from 'unstorage/drivers/fs'
+import { transform } from 'automd'
 
 export default (opts) => {
   const _fs = fsDriver({
@@ -11,19 +12,40 @@ export default (opts) => {
     name: 'content',
     async getItem(key) {
       const val = await _fs.getItem(key)
-      if (!val && key === 'index.json') {
-        return await import('./landing.mjs').then(({ genLanding }) => genLanding(opts.docsConfig))
+
+      // Landing
+      if (opts.docsConfig.landing !== false) {
+        if (!val && key === 'index.json') {
+          return await import('./landing.mjs').then(({ genLanding }) => genLanding(opts.docsConfig))
+        }
+        if (!val && key === 'index.json$') {
+          return { mtime: new Date() }
+        }
       }
-      if (!val && key === 'index.json$') {
-        return { mtime: new Date() }
+
+      // Automd transform
+      if (opts.docsConfig.automd) {
+        if (key.endsWith('.md') && typeof val === 'string') {
+          const res = await transform(val, opts.docsConfig.automd)
+          if (res.hasChanged) {
+            _fs.setItem(key, res.contents).catch(console.error)
+          }
+          return res.contents
+        } else if (key.endsWith('.md$')) {
+          return { mtime: new Date() }
+        }
       }
+
       return val
     },
     async getKeys(prefix) {
       const keys = await _fs.getKeys(prefix)
-      if (!keys.some((key) => /^index\.\w+$/.test(key))) {
+
+      // Landing
+      if (opts.docsConfig.landing !== false && !keys.some((key) => /^index\.\w+$/.test(key))) {
         keys.push('index.json')
       }
+
       return keys
     },
   })

package/layers/core/app/nuxt.config.ts

@@ -15,7 +15,6 @@ export default defineNuxtConfig({
   ssr,
   modules: [
     '@nuxt/content',
-    '@nuxthq/studio',
     '@nuxtjs/fontaine',
     !isPrepare && '@nuxtjs/google-fonts',
     '@nuxtjs/seo',
@@ -112,4 +111,8 @@ export default defineNuxtConfig({
     strict: false,
     includeWorkspace: true,
   },
+  colorMode: {
+    preference: 'dark',
+    fallback: 'dark',
+  },
 })

package/layers/core/app/pages/index.vue

@@ -63,32 +63,45 @@ const hero = computed(() => {
     return
   }
   const code = formatHeroCode(page.value!.heroCode)
+  const withFeatures = !code && page.value.featuresLayout === 'hero' && page.value.features?.length > 0
   return {
     title: page.value!._heroMdTitle,
     description: page.value!.heroDescription,
     links: nornalizeHeroLinks(page.value!.heroLinks),
-    orientation: code ? 'horizontal' : 'vertical',
+    withFeatures,
+    orientation: code || withFeatures ? 'horizontal' : 'vertical',
     code,
   } as const
 })
 </script>
 
 <template>
-  <div>
-    <ULandingHero v-if="hero" v-bind="hero">
-      <template #title>
-        <MDC :value="hero.title" />
-      </template>
+  <ULandingHero v-if="hero" v-bind="hero" :orientation="hero.orientation">
+    <template #top>
+      <LandingBackground />
+    </template>
+    <template #title>
+      <MDC :value="hero.title" />
+    </template>
 
-      <MDC v-if="hero.code" :value="hero.code" tag="pre" class="prose prose-primary dark:prose-invert mx-auto" />
-    </ULandingHero>
+    <MDC v-if="hero.code" :value="hero.code" tag="pre" class="prose prose-primary dark:prose-invert mx-auto" />
+    <div v-else-if="hero.withFeatures" class="flex flex-col gap-6">
+      <ULandingCard v-for="(item, index) of page.features" :key="index" v-bind="item" />
+    </div>
+  </ULandingHero>
+  <template v-if="page.features?.length > 0 && !hero.withFeatures">
+    <ULandingSection :title="page.featuresTitle">
+      <UPageGrid>
+        <ULandingCard v-for="(item, index) of page.features" :key="index" v-bind="item" />
+      </UPageGrid>
+    </ULandingSection>
+  </template>
 
-    <template v-if="page.features">
-      <ULandingSection :title="page.featuresTitle">
-        <UPageGrid>
-          <ULandingCard v-for="(item, index) of page.features" :key="index" v-bind="item" />
-        </UPageGrid>
-      </ULandingSection>
-    </template>
-  </div>
+  <ULandingSection v-if="page.contributors && page._github" title="Made by community">
+    <UContainer>
+      <a :href="`https://github.com/${page._github}/graphs/contributors`" target="_blank">
+        <img :src="`https://contrib.rocks/image?repo=${page._github}`" />
+      </a>
+    </UContainer>
+  </ULandingSection>
 </template>

package/layers/core/app/server/plugins/content.ts

@@ -6,15 +6,18 @@ export default defineNitroPlugin((nitroApp) => {
     }
 
     // Remove first h1 from markdown files as it is added to front-matter as title
-    if (file.body?.children?.[0]?.tag === 'h1' && file.title === file.body.children[0].children?.[0]?.value) {
-      file.body.children.shift()
+    if (file.body?.children?.[0]?.tag === 'h1') {
+      const text = getTextContents(file.body.children[0].children)
+      if (file.title === text) {
+        file.body.children.shift()
+      }
     }
 
     // Only use the first blockquote as the description
     const firstChild = file.body.children?.[0]
-    const firstChildContent = firstChild?.children?.[0]?.children?.[0]?.value
-    if (firstChild.tag === 'blockquote' && firstChildContent) {
-      file.description = firstChildContent
+    const firstChildText = getTextContents(firstChild?.children)
+    if (firstChild?.tag === 'blockquote' && firstChildText && !firstChildText.startsWith('!')) {
+      file.description = firstChildText
       file.body.children.shift()
     } else {
       file.description = '' // Avoid duplication
@@ -36,3 +39,14 @@ export default defineNitroPlugin((nitroApp) => {
     }
   })
 })
+
+function getTextContents(children) {
+  return (children || [])
+    .map((child) => {
+      if (child.type === 'element') {
+        return getTextContents(child.children)
+      }
+      return child.value
+    })
+    .join('')
+}

package/layers/core/cli/{cli.ts → cli.mjs}

@@ -1,14 +1,14 @@
-#!/usr/bin/env node
 import { defineCommand, runMain } from 'citty'
-import { setupDocs, type SetupDocsOptions } from './setup'
+import { setupDocs } from './setup.mjs'
+// import type { SetupDocsOptions } from './setup.mjs'
 
-export interface DocsCLIOptions {
-  name?: string
-  description?: string
-  setup?: SetupDocsOptions
-}
+// export interface DocsCLIOptions {
+//   name?: string
+//   description?: string
+//   setup?: SetupDocsOptions
+// }
 
-export function createCLI(opts: DocsCLIOptions = {}) {
+export function createCLI(opts) {
   const sharedArgs = {
     dir: {
       type: 'positional',
@@ -16,7 +16,7 @@ export function createCLI(opts: DocsCLIOptions = {}) {
       required: true,
       default: '.',
     },
-  } as const
+  }
 
   const dev = defineCommand({
     meta: {

package/layers/core/cli/{setup.ts → setup.mjs}

@@ -1,22 +1,22 @@
 import { fileURLToPath } from 'node:url'
 import { resolve } from 'node:path'
-import type { NuxtConfig } from 'nuxt/schema'
+// import type { NuxtConfig } from 'nuxt/schema'
 import { getColors } from 'theme-colors'
 import { loadConfig } from 'c12'
-import type { DocsConfig } from '../../../schema/config'
+// import type { DocsConfig } from '../../../schema/config'
 
 const appDir = fileURLToPath(new URL('../app', import.meta.url))
 const pkgDir = fileURLToPath(new URL('../../..', import.meta.url))
 
-export interface SetupDocsOptions {
-  defaults?: DocsConfig
-  dev?: boolean
-  extends?: string[]
-}
+// export interface SetupDocsOptions {
+//   defaults?: DocsConfig
+//   dev?: boolean
+//   extends?: string[]
+// }
 
-export async function setupDocs(docsDir: string, opts: SetupDocsOptions = {}) {
+export async function setupDocs(docsDir, opts = {}) {
   // Try to load docs config
-  const docsconfig = (await loadDocsConfig(docsDir, opts.defaults)) || ({} as DocsConfig)
+  const docsconfig = (await loadDocsConfig(docsDir, opts.defaults)) || {}
 
   // Normalize dir
   docsconfig.dir = docsDir = resolve(docsconfig.dir || docsDir)
@@ -27,7 +27,7 @@ export async function setupDocs(docsDir: string, opts: SetupDocsOptions = {}) {
   }
 
   // Prepare loadNuxt overrides
-  const nuxtConfig: NuxtConfig = {
+  const nuxtConfig = {
     rootDir: resolve(docsDir, '.docs'),
     srcDir: resolve(docsDir, '.docs'),
 
@@ -85,8 +85,8 @@ export async function setupDocs(docsDir: string, opts: SetupDocsOptions = {}) {
   }
 }
 
-async function loadDocsConfig(dir: string, defaults: DocsConfig = {}) {
-  const { config } = await loadConfig<DocsConfig>({
+async function loadDocsConfig(dir, defaults = {}) {
+  const { config } = await loadConfig({
     name: 'docs',
     cwd: dir,
     defaults: {

package/layers/unjs/cli/{main.ts → main.mjs}

@@ -1,5 +1,5 @@
 import { fileURLToPath } from 'node:url'
-import { createCLI } from '../../core/cli/cli'
+import { createCLI } from '../../core/cli/cli.mjs'
 
 const appDir = fileURLToPath(new URL('../app', import.meta.url))
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "undocs",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "repository": "unjs/undocs",
   "license": "MIT",
   "type": "module",
@@ -17,32 +17,35 @@
   "scripts": {
     "build": "true",
     "dev": "bun run docs:dev",
-    "docs:dev": "NUXT_DOCS_DEV=1 bun run undocs dev docs",
     "docs:build": "bun run undocs build docs",
-    "template:dev": "bun run undocs dev template",
+    "docs:dev": "NUXT_DOCS_DEV=1 bun run undocs dev docs",
     "lint": "eslint --cache --ext .ts,.js,.mjs,.cjs . && prettier -c layers",
     "lint:fix": "eslint --cache --ext .ts,.js,.mjs,.cjs . --fix && prettier -c -w layers",
     "prepack": "bun run build",
+    "profile:0x": "bunx 0x -o bin/cli.mjs dev docs",
+    "profile:0x-kernel": "bun run profile:0x --kernel-tracing",
+    "profile:cpu": "rm -rf .profile && node --cpu-prof --diagnostic-dir ../../../.profile bin/cli.mjs dev docs",
     "release": "bun run lint && changelogen --release && npm publish && git push --follow-tags",
+    "template:dev": "bun run undocs dev template",
     "undocs": "./bin/cli.mjs"
   },
   "dependencies": {
     "@nuxt/content": "^2.12.0",
     "@nuxt/ui": "^2.13.0",
     "@nuxt/ui-pro": "^0.7.5",
-    "@nuxthq/studio": "^1.0.10",
     "@nuxtjs/fontaine": "^0.4.1",
     "@nuxtjs/google-fonts": "^3.1.3",
     "@nuxtjs/plausible": "^0.2.4",
     "@nuxtjs/seo": "^2.0.0-rc.8",
     "@nuxtjs/tailwindcss": "^6.11.3",
+    "automd": "^0.3.2",
     "c12": "^1.7.0",
     "citty": "^0.1.5",
     "consola": "^3.2.3",
     "defu": "^6.1.4",
     "is-buffer": "^2.0.5",
-    "nuxi": "^3.10.0",
-    "nuxt": "^3.10.1",
+    "nuxi": "^3.10.1",
+    "nuxt": "^3.10.2",
     "nuxt-build-cache": "^0.1.1",
     "pkg-types": "^1.0.3",
     "scule": "^1.3.0",

package/schema/config.d.ts

@@ -7,16 +7,24 @@ export interface DocsConfig {
   github?: string
   themeColor?: string
   redirects?: Record<string, string>
-  landing?: {
-    title?: string
-    description?: string
-    _heroMdTitle?: string
-    heroTitle?: string
-    heroSubtitle?: string
-    heroDescription?: string
-    heroLinks?: Record<string, string | { label?: string; icon?: string; to?: string; size?: string; order?: number }>
-    heroCode?: string | { content: string; title?: string; lang?: string }
-    featuresTitle?: string
-    features?: { title: string; description?: string; icon?: string }[]
-  }
+  automd?: any
+  contributors?: boolean
+  landing?:
+    | false
+    | {
+        title?: string
+        description?: string
+        _heroMdTitle?: string
+        heroTitle?: string
+        heroSubtitle?: string
+        heroDescription?: string
+        heroLinks?: Record<
+          string,
+          string | { label?: string; icon?: string; to?: string; size?: string; order?: number }
+        >
+        heroCode?: string | { content: string; title?: string; lang?: string }
+        featuresTitle?: string
+        featuresLayout?: 'default' | 'hero'
+        features?: { title: string; description?: string; icon?: string }[]
+      }
 }

package/schema/config.json

@@ -34,6 +34,10 @@
       "type": "string",
       "description": "The theme color of the documentation site.\nIt will be used as the `theme-color` meta tag and a full palette of colors will be generated from it."
     },
+    "automd": {
+      "type": "boolean",
+      "description": "Enable integration with https://automd.unjs.io"
+    },
     "redirects": {
       "description": "Redirects for the documentation site.",
       "type": "object",
@@ -42,84 +46,101 @@
       }
     },
     "landing": {
-      "type": "object",
-      "description": "Landing page configuration",
-      "additionalProperties": false,
-      "properties": {
-        "description": {
-          "type": "string",
-          "description": "Page description"
+      "oneOf": [
+        {
+          "type": "boolean",
+          "const": false
         },
-        "features": {
-          "type": "array",
-          "description": "Features section description",
-          "items": {
-            "type": "object",
-            "properties": {
-              "description": {
-                "type": "string"
-              },
-              "icon": {
-                "type": "string"
-              },
-              "title": {
-                "type": "string"
+        {
+          "type": "object",
+          "description": "Landing page configuration",
+          "additionalProperties": false,
+          "properties": {
+            "description": {
+              "type": "string",
+              "description": "Page description"
+            },
+            "contributors": {
+              "type": "boolean",
+              "description": "Show contributors section"
+            },
+            "features": {
+              "type": "array",
+              "description": "Features section description",
+              "items": {
+                "type": "object",
+                "properties": {
+                  "description": {
+                    "type": "string"
+                  },
+                  "icon": {
+                    "type": "string"
+                  },
+                  "title": {
+                    "type": "string"
+                  }
+                }
               }
-            }
-          }
-        },
-        "featuresTitle": {
-          "type": "string",
-          "description": "Features section title"
-        },
-        "heroCode": {
-          "description": "Hero Codes",
-          "anyOf": [
-            {
-              "type": "string"
             },
-            {
-              "type": "object",
-              "additionalProperties": false,
-              "required": ["content"],
-              "properties": {
-                "content": {
-                  "type": "string"
-                },
-                "lang": {
+            "featuresTitle": {
+              "type": "string",
+              "description": "Features section title"
+            },
+            "featuresLayout": {
+              "type": "string",
+              "description": "Features section layout to be in default place or in the hero (only if there is no code)",
+              "enum": ["default", "hero"]
+            },
+            "heroCode": {
+              "description": "Hero Codes",
+              "anyOf": [
+                {
                   "type": "string"
                 },
-                "title": {
-                  "type": "string"
+                {
+                  "type": "object",
+                  "additionalProperties": false,
+                  "required": ["content"],
+                  "properties": {
+                    "content": {
+                      "type": "string"
+                    },
+                    "lang": {
+                      "type": "string"
+                    },
+                    "title": {
+                      "type": "string"
+                    }
+                  }
                 }
+              ]
+            },
+            "heroDescription": {
+              "type": "string",
+              "description": "Additional text in hero (default is same as description)"
+            },
+            "heroLinks": {
+              "description": "Hero Links",
+              "type": "object",
+              "additionalProperties": {
+                "type": "object"
               }
+            },
+            "heroSubtitle": {
+              "type": "string",
+              "description": "second hero title (default is same as shortDescription)"
+            },
+            "heroTitle": {
+              "type": "string",
+              "description": "main title (default is same as page title)"
+            },
+            "title": {
+              "type": "string",
+              "description": "Page title"
             }
-          ]
-        },
-        "heroDescription": {
-          "type": "string",
-          "description": "Additional text in hero (default is same as description)"
-        },
-        "heroLinks": {
-          "description": "Hero Links",
-          "type": "object",
-          "additionalProperties": {
-            "type": "object"
           }
-        },
-        "heroSubtitle": {
-          "type": "string",
-          "description": "second hero title (default is same as shortDescription)"
-        },
-        "heroTitle": {
-          "type": "string",
-          "description": "main title (default is same as page title)"
-        },
-        "title": {
-          "type": "string",
-          "description": "Page title"
         }
-      }
+      ]
     }
   }
 }