docs: provide AGENTS.md for cms-base-layer package #2225
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
There was a problem hiding this comment.
Pull request overview
This PR adds comprehensive AI agent documentation for the @shopware/cms-base-layer package. The documentation provides detailed guidance for AI assistants working with this Nuxt layer, including architecture, component structure, usage patterns, and customization options.
Changes:
- Added AGENTS.md with detailed package documentation including TL;DR, architecture overview, directory structure, component naming conventions, and usage examples
- Documented CMS hierarchy, key files, common components, and customization patterns
- Included practical examples, troubleshooting tips, and best practices
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| ## TL;DR | ||
|
|
||
| **What**: Nuxt layer providing Vue components for Shopware 6 Shopping Experiences (CMS) | ||
| **Purpose**: Pre-built, customizable CMS components styled with UnoCSS/Tailwind |
There was a problem hiding this comment.
The statement 'styled with UnoCSS/Tailwind' is slightly misleading. The package uses UnoCSS with Tailwind-compatible utility classes (via presetWind3), not Tailwind CSS itself. Consider rewording to 'styled with UnoCSS (Tailwind-compatible)' for accuracy.
| - `SwBaseButton` - Button component | ||
| - `SwBaseIcon` - Icon wrapper | ||
| - `SwCheckbox` - Checkbox input | ||
| - `SwRadioButton` - Radio input | ||
| - `SwSwitchButton` - Toggle switch | ||
| - `SwIconButton` - Icon-only button |
There was a problem hiding this comment.
The component names listed don't match the actual filenames in app/components/ui/. The actual files are BaseButton.vue, BaseIcon.vue, Checkbox.vue, etc. (without the 'Sw' prefix in the filename). These components get the 'Sw' prefix via the nuxt.config.ts configuration. The documentation should clarify that these are the registered component names (with prefix), not the filename.
| ## TL;DR | ||
|
|
||
| **What**: Nuxt layer providing Vue components for Shopware 6 Shopping Experiences (CMS) | ||
| **Purpose**: Pre-built, customizable CMS components styled with UnoCSS/Tailwind |
There was a problem hiding this comment.
This line mentions 'UnoCSS/Tailwind' but the actual implementation uses UnoCSS with presetWind3, which provides Tailwind-compatible classes. The documentation should be more specific about this distinction to avoid confusion.
|
|
||
| #### vue-starter-template | ||
|
|
||
| The [vue-starter-template](../../templates/vue-starter-template/) demonstrates full cms-base-layer integration: |
There was a problem hiding this comment.
The relative path ../../templates/vue-starter-template/ is correct for the repository structure, but may be confusing in the context of the published npm package. Consider adding a note that these paths are for the monorepo context.
|
|
||
| #### vue-starter-template | ||
|
|
||
| The [vue-starter-template](../../templates/vue-starter-template/) demonstrates full cms-base-layer integration: |
There was a problem hiding this comment.
This will not work because cms-package is standalone package, this path will not exist in other projects
There was a problem hiding this comment.
the relative paths are valid for AI agents working within this monorepo - that's the purpose of AGENTS.md files. we will remove it entirely once templates will be moved to separate repository 👌🏼
|
|
||
| #### vue-starter-template-extended | ||
|
|
||
| The [vue-starter-template-extended](../../templates/vue-starter-template-extended/) shows how to extend and customize: |
There was a problem hiding this comment.
same as above - monorepo context is intentional.
packages/cms-base-layer/AGENTS.md
Outdated
| ## Dependencies | ||
|
|
||
| ### Required Peer Dependencies | ||
| - `@shopware/composables` - Vue composables for Shopware | ||
| - `@shopware/helpers` - Utility functions | ||
| - `@shopware/api-client` - API communication | ||
|
|
||
| ### Key Dependencies | ||
| - `@unocss/nuxt` - Styling framework | ||
| - `@nuxt/image` - Image optimization | ||
| - `@vuelidate/core` - Form validation | ||
| - `three` / `@tresjs/core` - 3D product visualization |
There was a problem hiding this comment.
We don't need this section, AI will read it from the package.json
vercel
bot
temporarily deployed
to
Preview – shopware-frontends-docs
vercel
bot
temporarily deployed
to
Preview – shopware-frontends-docs
Description
adds AGENTS.md