Логотип Volt UI

Локальна skill

Вбудований файл skill, який OpenCode і Claude Code самі знаходять у будь-якому робочому просторі з компонентами Volt UI.

Що це

Skill лежить у .agents/skills/volt-ui/SKILL.md у репозиторії Volt UI. Будь-який ШІ-агент із підтримкою skills у стилі OpenCode завантажить її автоматично й використовуватиме конвенції, селектори та каталог компонентів, коли писатиме код для вашого проєкту.

Встановлення skill

Найшвидший спосіб встановити skill у проєкт — скопіювати її у стандартне розташування локальних skills:

mkdir -p .agents/skills/volt-ui && curl -fsSL https://volt-ui.pages.dev/.agents/skills/volt-ui/SKILL.md -o .agents/skills/volt-ui/SKILL.md

Що охоплює skill

  • •Контекст стека — Angular 21, signals без zone.js, OnPush, standalone, Tailwind v4, ng-primitives, CVA
  • •Конвенції назв — ui-* проти volt-* , селектори елементів проти селекторів атрибутів
  • •Каталог компонентів — стабільні та бета-компоненти з селекторами й ключовими входами
  • •Правила накладок — тригери-директиви на атрибутах + <ng-template> для dialog, drawer, popover, tooltip і dropdown-menu
  • •Reactive Forms — які компоненти є CVA і як підключити FormControl
  • •Система тем — provideVoltTheme , кольори, стилі та темний режим

Приклад правила зі skill

// Overlays are template-based
<button [uiDialog]="dialogTpl">Open</button>
<ng-template #dialogTpl let-close="close">
  <div uiDialogOverlay></div>
  <div uiDialogContent>...</div>
</ng-template>

Skill прямо каже агентові ніколи не писати <ui-dialog> , <ui-tooltip> чи інші некоректні селектори елементів.