25d895d 🐛 fix(gitea_workflow): clean up temp repos after job steps 2bc3b11 🐛 fix(gitea_workflow): clean up temporary repo dirs in workflows 98c3f30 📝 docs(agent_rules): allow plan execution on current branch 16c7230 📝 docs(prompts): define custom verify layering 8efc4dd 🐛 fix(skills): quote commit-message description bc8498f 🐛 fix(ci): install tomli for gitea tests 55cda3b 🐛 fix(tests): report missing toml parser clearly c0729c7 🐛 fix(playbook): import Optional for cli compatibility 63e24bf 📦 deps(skills): sync thirdparty skills d2f9356 🐛 fix(ci): isolate gitea workflow repos 588b81d 🐛 fix(ci): inline gitea workflow bootstrap e0b1c3a ♻️ refactor(skills): standardize first-party skill contracts 2c5050d ♻️ refactor(skills): rename repo skills source dir f049dfb 📦 deps(skills): drop duplicate first-party superpowers skills 234b335 ✨ feat(workflow): add superpowers planning and execution state tracking c1702a6 📝 docs(markdown): format tracked markdown and drop stale templates 2325409 📝 docs(markdown): clarify optional markdownlint usage 214c44e 🔧 chore(markdown): add markdownlint baseline and lint fixes a22b324 📝 docs(templates): add execution and memory-bank prompt templates 223a797 📝 docs(templates): update README for Claude Code and current features 4ac8672 📝 docs: simplify README + platform-agnostic tools + auto-create local rules 2431c9d 📝 docs: add claude_md config and use cross-platform paths d64b248 📝 docs: fix README.md inaccuracies and add Claude Code info c8d6bf2 🐛 fix(playbook): use relative paths in CLAUDE.md when not at project root 6518f0f ✨ feat(playbook): auto-create CLAUDE.md with path discovery 6ec9a45 ✨ feat(skills): add skill_link symlink support + platform-agnostic prompt 9f8b6b5 📝 docs: update README and config example for Claude Code support 79cff6c 📝 docs(skills): add Claude Code platform support 452c6f5 ✨ feat(playbook): auto-inject AGENTS.md into CLAUDE.md e1dbf3c 🐛 fix(skills): remove dual-path from commit-message skill f3a7259 🔧 chore(ci): use prepare_repo.sh in both workflows da08212 🔧 chore(ci): extract prepare_repo.sh and clean up workflows 7ade85e 🗑️ remove(tsl): drop syntax_book/, data/ source and build script f94dba0 ♻️ refactor(skills): update playbook.py and tests for thirdparty/ layout b3df412 ♻️ refactor(skills): separate thirdparty skills into thirdparty/ subdirectory 64950e7 📦 deps(skills): sync thirdparty skills a2e3cb0 ✨ feat(playbook): add no_backup deploy controls 8609d59 🐛 fix(docs): repair reference catalog source links 956da11 🐛 fix(playbook): publish hidden ci test fixes 3f67754 📦 deps(skills): sync thirdparty skills 08ca87b 📦 deps(skills): add karpathy thirdparty sync 96b705b 📝 docs(tsl): rebuild canonical syntax and routing manual 3ed5052 📦 deps(skills): sync thirdparty skills 60108dd 📦 deps(skills): sync thirdparty skills da85d4e 🐛 fix(thirdparty): prune nested project snapshots a2a697e 📦 deps(skills): sync thirdparty skills 9df610a 🐛 fix(thirdparty): exclude duplicated superpowers skills 33dd5bb 🐛 fix(thirdparty): preserve optional manifest fields 91b0ea7 🐛 fix(thirdparty): preserve manifest during snapshot update 2e26f98 🔧 chore(thirdparty): generalize skills sync pipeline 5b9c1e3 📦 deps(skills): sync superpowers 2f2d34a 📝 docs(readme): normalize subtree command spacing 62db7db 🐛 fix(ci): serialize superpowers update and sync 3463223 🐛 fix(ci): use literal superpowers sync paths 48f6de8 📦 deps(skills): sync superpowers 4b23529 🔧 chore(ci): merge superpowers update and sync workflow a56d75b 📦 deps(skills): sync superpowers 84bcefa 🔧 chore(ci): use ci[bot] commit author name 00a07e5 📦 deps(skills): sync superpowers 7b84daf 🐛 fix(templates): enforce main loop progress tracking 51373d7 🔧 chore(ci): automate superpowers sync workflow eaaa39c 🐛 fix(ci): prevent stale superpowers sync from restoring skills block 79755c6 📦 deps(skills): sync superpowers 836d878 📦 deps(skills): sync superpowers 8216c9f 📦 deps(skills): sync superpowers 9439505 🐛 fix(playbook): address reported repo issues git-subtree-dir: docs/standards/playbook git-subtree-split: 25d895d8b3f56624ccfe99ad7289e9eb49e0f316
14 KiB
14 KiB
| 1 | No | Category | Guideline | Description | Do | Don't | Code Good | Code Bad | Severity | Docs URL |
|---|---|---|---|---|---|---|---|---|---|---|
| 2 | 1 | Installation | Add Nuxt UI module | Install and configure Nuxt UI in your Nuxt project | pnpm add @nuxt/ui and add to modules | Manual component imports | modules: ['@nuxt/ui'] | import { UButton } from '@nuxt/ui' | High | https://ui.nuxt.com/docs/getting-started/installation/nuxt |
| 3 | 2 | Installation | Import Tailwind and Nuxt UI CSS | Required CSS imports in main.css file | @import tailwindcss and @import @nuxt/ui | Skip CSS imports | @import "tailwindcss"; @import "@nuxt/ui"; | No CSS imports | High | https://ui.nuxt.com/docs/getting-started/installation/nuxt |
| 4 | 3 | Installation | Wrap app with UApp component | UApp provides global configs for Toast Tooltip and overlays | <UApp> wrapper in app.vue | Skip UApp wrapper | <UApp><NuxtPage/></UApp> | <NuxtPage/> without wrapper | High | https://ui.nuxt.com/docs/components/app |
| 5 | 4 | Components | Use U prefix for components | All Nuxt UI components use U prefix by default | UButton UInput UModal | Button Input Modal | <UButton>Click</UButton> | <Button>Click</Button> | Medium | https://ui.nuxt.com/docs/getting-started/installation/nuxt |
| 6 | 10 | Theming | Configure colors in app.config.ts | Runtime color configuration without restart | ui.colors.primary in app.config.ts | Hardcoded colors in components | defineAppConfig({ ui: { colors: { primary: 'blue' } } }) | <UButton class="bg-blue-500"> | High | https://ui.nuxt.com/docs/getting-started/theme/design-system |
| 7 | 12 | Theming | Extend semantic colors in nuxt.config | Register new colors like tertiary in theme.colors | theme.colors array in ui config | Use undefined colors | ui: { theme: { colors: ['primary', 'tertiary'] } } | <UButton color="tertiary"> without config | Medium | https://ui.nuxt.com/docs/getting-started/theme/design-system |
| 8 | 13 | Forms | Use UForm with schema validation | UForm supports Zod Yup Joi Valibot schemas | :schema prop with validation schema | Manual form validation | <UForm :schema="schema" :state="state"> | Manual @blur validation | High | https://ui.nuxt.com/docs/components/form |
| 9 | 14 | Forms | Use UFormField for field wrapper | Provides label error message and validation display | UFormField with name prop | Manual error handling | <UFormField name="email" label="Email"> | <div><label>Email</label><UInput/><span>error</span></div> | Medium | https://ui.nuxt.com/docs/components/form-field |
| 10 | 15 | Forms | Handle form submit with @submit | UForm emits submit event with validated data | @submit handler on UForm | @click on submit button | <UForm @submit="onSubmit"> | <UButton @click="onSubmit"> | Medium | https://ui.nuxt.com/docs/components/form |
| 11 | 18 | Overlays | Use useOverlay composable for programmatic overlays | Open overlays programmatically without template refs | useOverlay().open(MyModal) | Template ref and manual control | const overlay = useOverlay(); overlay.open(MyModal, { props }) | const modal = ref(); modal.value.open() | Medium | https://ui.nuxt.com/docs/components/modal |
| 12 | 21 | Dashboard | Use UDashboardGroup for layout | Wraps dashboard components with sidebar state management | UDashboardGroup > UDashboardSidebar + UDashboardPanel | Manual layout flex containers | <UDashboardGroup><UDashboardSidebar/><UDashboardPanel/></UDashboardGroup> | <div class="flex"><aside/><main/></div> | Medium | https://ui.nuxt.com/docs/components/dashboard-group |
| 13 | 23 | Tables | Use UTable with data and columns props | Powered by TanStack Table with built-in features | :data and :columns props | Manual table markup | <UTable :data="users" :columns="columns"/> | <table><tr v-for="user in users"> | High | https://ui.nuxt.com/docs/components/table |
| 14 | 24 | Tables | Define columns with accessorKey | Column definitions use accessorKey for data binding | accessorKey: 'email' in column def | String column names only | { accessorKey: 'email', header: 'Email' } | ['name', 'email'] | Medium | https://ui.nuxt.com/docs/components/table |
| 15 | 27 | Navigation | Use UNavigationMenu for nav links | Horizontal or vertical navigation with dropdown support | UNavigationMenu with items array | Manual nav with v-for | <UNavigationMenu :items="navItems"/> | <nav><a v-for="item in items"> | Medium | https://ui.nuxt.com/docs/components/navigation-menu |
| 16 | 28 | Navigation | Use UBreadcrumb for page hierarchy | Automatic breadcrumb with NuxtLink support | :items array with label and to | Manual breadcrumb links | <UBreadcrumb :items="breadcrumbs"/> | <nav><span v-for="crumb in crumbs"> | Low | https://ui.nuxt.com/docs/components/breadcrumb |
| 17 | 29 | Navigation | Use UTabs for tabbed content | Tab navigation with content panels | UTabs with items containing slot content | Manual tab state | <UTabs :items="tabs"/> | <div><button @click="tab=1"> | Medium | https://ui.nuxt.com/docs/components/tabs |
| 18 | 31 | Feedback | Use UAlert for inline messages | Static alert messages with icon and actions | UAlert with title description color | Toast for static messages | <UAlert title="Warning" color="warning"/> | useToast for inline alerts | Medium | https://ui.nuxt.com/docs/components/alert |
| 19 | 33 | Color Mode | Use UColorModeButton for theme toggle | Built-in light/dark mode toggle button | UColorModeButton component | Manual color mode logic | <UColorModeButton/> | <button @click="toggleColorMode"> | Low | https://ui.nuxt.com/docs/components/color-mode-button |
| 20 | 34 | Color Mode | Use UColorModeSelect for theme picker | Dropdown to select system light or dark mode | UColorModeSelect component | Custom select for theme | <UColorModeSelect/> | <USelect v-model="colorMode" :items="modes"/> | Low | https://ui.nuxt.com/docs/components/color-mode-select |
| 21 | 36 | Customization | Configure default variants in nuxt.config | Set default color and size for all components | theme.defaultVariants in ui config | Repeat props on every component | ui: { theme: { defaultVariants: { color: 'neutral' } } } | <UButton color="neutral"> everywhere | Medium | https://ui.nuxt.com/docs/getting-started/installation/nuxt |
| 22 | 37 | Customization | Use app.config.ts for theme overrides | Runtime theme customization | defineAppConfig with ui key | nuxt.config for runtime values | defineAppConfig({ ui: { button: { defaultVariants: { size: 'sm' } } } }) | nuxt.config ui.button.size: 'sm' | Medium | https://ui.nuxt.com/docs/getting-started/theme/components |
| 23 | 38 | Performance | Enable component detection | Tree-shake unused component CSS | experimental.componentDetection: true | Include all component CSS | ui: { experimental: { componentDetection: true } } | ui: {} (includes all CSS) | Low | https://ui.nuxt.com/docs/getting-started/installation/nuxt |
| 24 | 39 | Performance | Use UTable virtualize for large data | Enable virtualization for 1000+ rows | :virtualize prop on UTable | Render all rows | <UTable :data="largeData" virtualize/> | <UTable :data="largeData"/> | Medium | https://ui.nuxt.com/docs/components/table |
| 25 | 40 | Accessibility | Use semantic component props | Components have built-in ARIA support | Use title description label props | Skip accessibility props | <UModal title="Settings"> | <UModal><h2>Settings</h2> | Medium | https://ui.nuxt.com/docs/components/modal |
| 26 | 41 | Accessibility | Use UFormField for form accessibility | Automatic label-input association | UFormField wraps inputs | Manual id and for attributes | <UFormField label="Email"><UInput/></UFormField> | <label for="email">Email</label><UInput id="email"/> | High | https://ui.nuxt.com/docs/components/form-field |
| 27 | 42 | Content | Use UContentToc for table of contents | Automatic TOC with active heading highlight | UContentToc with :links | Manual TOC implementation | <UContentToc :links="toc"/> | <nav><a v-for="heading in headings"> | Low | https://ui.nuxt.com/docs/components/content-toc |
| 28 | 44 | AI/Chat | Use UChatMessages for chat UI | Designed for Vercel AI SDK integration | UChatMessages with messages array | Custom chat message list | <UChatMessages :messages="messages"/> | <div v-for="msg in messages"> | Medium | https://ui.nuxt.com/docs/components/chat-messages |
| 29 | 46 | Editor | Use UEditor for rich text | TipTap-based editor with toolbar support | UEditor with v-model:content | Custom TipTap setup | <UEditor v-model:content="content"/> | Manual TipTap initialization | Medium | https://ui.nuxt.com/docs/components/editor |
| 30 | 49 | Loading | Use loadingAuto on buttons | Automatic loading state from @click promise | loadingAuto prop on UButton | Manual loading state | <UButton loadingAuto @click="async () => await save()"> | <UButton :loading="isLoading" @click="save"> | Low | https://ui.nuxt.com/docs/components/button |
| 31 | 50 | Loading | Use UForm loadingAuto | Auto-disable form during submit | loadingAuto on UForm (default true) | Manual form disabled state | <UForm @submit="handleSubmit"> | <UForm :disabled="isSubmitting"> | Low | https://ui.nuxt.com/docs/components/form |