chore(docs): eslint migration + extractor updates

Migrate docs to eslint flat config (build-script console override); doc
extractor points at configs/eslint.
This commit is contained in:
2026-06-07 16:30:14 +07:00
parent 23a2795523
commit 96ac895f7a
30 changed files with 1934 additions and 864 deletions
+52 -55
View File
@@ -1,72 +1,69 @@
<script setup lang="ts">const { getPackages, getTotalItems } = useDocs();
<script setup lang="ts">const { getGroupedPackages, getPackages, countEntries, getTotalItems } = useDocs();
const groups = getGroupedPackages();
const packages = getPackages();
const totalItems = getTotalItems();
const packageIcons: Record<string, string> = {
stdlib: '📦',
platform: '🖥️',
vue: '💚',
oxlint: '🔍',
const kindMeta: Record<string, { label: string; cls: string }> = {
api: { label: 'API', cls: 'bg-blue-100 text-blue-700 dark:bg-blue-500/15 dark:text-blue-300' },
components: { label: 'Components', cls: 'bg-fuchsia-100 text-fuchsia-700 dark:bg-fuchsia-500/15 dark:text-fuchsia-300' },
guide: { label: 'Guide', cls: 'bg-teal-100 text-teal-700 dark:bg-teal-500/15 dark:text-teal-300' },
};
useHead({ title: '@robonen/tools — Documentation' });
</script>
<template>
<div class="max-w-3xl min-w-0">
<div class="max-w-4xl">
<!-- Hero -->
<div class="mb-12">
<h1 class="text-3xl font-bold tracking-tight text-(--color-text) mb-3">
<section class="mb-14">
<div class="inline-flex items-center gap-2 mb-5 px-3 py-1 rounded-full border border-(--border) bg-(--bg-subtle) text-xs text-(--fg-muted)">
<span class="w-1.5 h-1.5 rounded-full bg-emerald-500" />
Auto-generated from source &amp; JSDoc
</div>
<h1 class="text-4xl sm:text-5xl font-bold tracking-tight text-(--fg) mb-4">
@robonen/tools
</h1>
<p class="text-lg text-(--color-text-soft) leading-relaxed">
A collection of TypeScript utilities, Vue composables, and developer tools.
Auto-generated documentation from source types and JSDoc annotations.
<p class="text-lg text-(--fg-muted) leading-relaxed max-w-2xl">
A monorepo of TypeScript utilities, Vue composables, headless UI primitives
and shared tooling documented, typed and tested.
</p>
<div class="mt-4 flex items-center gap-4 text-sm text-(--color-text-mute)">
<span>{{ packages.length }} packages</span>
<span>·</span>
<span>{{ totalItems }} documented items</span>
<div class="mt-6 flex flex-wrap items-center gap-x-6 gap-y-2 text-sm text-(--fg-subtle)">
<span><span class="text-(--fg) font-semibold">{{ packages.length }}</span> packages</span>
<span><span class="text-(--fg) font-semibold">{{ totalItems }}</span> documented items</span>
<span><span class="text-(--fg) font-semibold">{{ groups.length }}</span> groups</span>
</div>
</div>
</section>
<!-- Package cards -->
<div class="grid gap-4 sm:grid-cols-2">
<NuxtLink
v-for="pkg in packages"
:key="pkg.slug"
:to="`/${pkg.slug}`"
class="group block p-5 rounded-xl border border-(--color-border) hover:border-brand-300 hover:shadow-sm transition-all bg-(--color-bg)"
>
<div class="flex items-start gap-3">
<span class="text-2xl">{{ packageIcons[pkg.slug] ?? '📦' }}</span>
<div class="min-w-0">
<h2 class="font-semibold text-(--color-text) group-hover:text-brand-600 transition-colors">
{{ pkg.name }}
</h2>
<p class="text-sm text-(--color-text-soft) mt-1">
{{ pkg.description }}
</p>
<div class="mt-3 flex items-center gap-3 text-xs text-(--color-text-mute)">
<span>v{{ pkg.version }}</span>
<span>·</span>
<span>{{ pkg.categories.reduce((sum, c) => sum + c.items.length, 0) }} items</span>
<span>·</span>
<span>{{ pkg.categories.length }} categories</span>
</div>
</div>
</div>
</NuxtLink>
</div>
<!-- Quick start -->
<div class="mt-12">
<h2 class="text-lg font-semibold text-(--color-text) mb-4">
Quick Start
<!-- Package groups -->
<section v-for="grp in groups" :key="grp.group" class="mb-10">
<h2 class="text-xs font-semibold uppercase tracking-wider text-(--fg-subtle) mb-4">
{{ grp.label }}
</h2>
<div class="space-y-3">
<div v-for="pkg in packages" :key="pkg.slug">
<DocsCode :code="`pnpm add ${pkg.name}`" lang="bash" />
</div>
<div class="grid gap-3 sm:grid-cols-2">
<NuxtLink
v-for="pkg in grp.packages"
:key="pkg.slug"
:to="`/${pkg.slug}`"
class="group relative block p-5 rounded-card border border-(--border) bg-(--bg-elevated) hover:border-(--border-strong) hover:shadow-(--shadow-card) transition-all"
>
<div class="flex items-start justify-between gap-3 mb-2">
<h3 class="font-mono text-sm font-semibold text-(--fg) group-hover:text-(--accent-text) transition-colors">
{{ pkg.name }}
</h3>
<span :class="['text-[10px] px-2 py-0.5 rounded-full font-medium leading-none shrink-0', kindMeta[pkg.kind]?.cls]">
{{ kindMeta[pkg.kind]?.label }}
</span>
</div>
<p class="text-sm text-(--fg-muted) leading-relaxed line-clamp-2">
{{ pkg.description }}
</p>
<div class="mt-4 flex items-center gap-3 text-xs text-(--fg-subtle)">
<span class="font-mono">v{{ pkg.version }}</span>
<span>·</span>
<span>{{ countEntries(pkg) }} {{ pkg.kind === 'components' ? 'components' : pkg.kind === 'guide' ? 'sections' : 'items' }}</span>
</div>
</NuxtLink>
</div>
</div>
</section>
</div>
</template>