# ue-component-model

Скилл настраивает блоки AEM Edge Delivery Services для Universal Editor. Он изучает JS и CSS компонента, после чего создаёт или правит файлы JSON-конфигурации.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 1500 установок · ★ 310
- Автор: adobe
- Лицензия: Apache-2.0 · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/adobe/skills/tree/HEAD/plugins/aem/edge-delivery-services/skills/ue-component-model/SKILL.md
- Обновлён: 2026-10-24
- HTML: https://affpapa.org/nevibecode/skills/ue-component-model

## Что делает

Скилл автоматизирует разметку блоков AEM EDS (Franklin) для Universal Editor. Сначала агент читает реализацию блока в каталоге `blocks/<name>/<name>.js` и стили в `blocks/<name>/<name>.css`, чтобы выяснить структуру данных. По коду видно, ищет ли функция `decorate(block)` ссылки и картинки или обходит дочерние элементы контейнера.

После анализа формируются три файла: `component-definition.json` для палитры компонентов, `component-models.json` для панели полей и `component-filters.json` для правил вставки. Если проект использует распределённую конфигурацию, создаётся единый файл `blocks/<name>/_<name>.json`. Поля связываются по семантическим правилам: например, связка `image` и `imageAlt` автоматически сворачивается в тег picture.

Главная ошибка при ручной правке — забыть добавить идентификатор блока в фильтр `section`. Если не прописать его в `component-filters.json`, авторы контента не увидят блок на странице.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add adobe/skills --skill ue-component-model -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/ue-component-model/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/ue-component-model/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add adobe/skills --skill ue-component-model -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/ue-component-model/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add adobe/skills --skill ue-component-model -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/ue-component-model/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install adobe/skills ue-component-model
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/ue-component-model/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add adobe/skills --skill ue-component-model -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/adobe/skills --path plugins/aem/edge-delivery-services/skills/ue-component-model
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/ue-component-model/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add adobe/skills --skill ue-component-model -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/adobe/skills/tree/HEAD/plugins/aem/edge-delivery-services/skills/ue-component-model/SKILL.md

## Когда брать
- создать JSON-конфигурацию нового блока AEM Edge Delivery Services
- настроить поля панели свойств в Universal Editor под логику JS-файла
- зарегистрировать контейнерный блок с повторяющимися элементами
- добавить блок в фильтр секций для отображения в палитре редактора

## Примеры запросов агенту
- Настрой модель Universal Editor для нового блока blocks/hero/hero.js
- Добавь выпадающий список вариантов оформления в component-models.json для блока teaser
- Создай распределённый конфиг _cards.json для карточек с повторяющимися элементами

## Похожие
- [openclaw-model-switch](https://affpapa.org/nevibecode/skills/openclaw-model-switch.md) — скилл · 323 установки
- [webflow-code-component:component-scaffold](https://affpapa.org/nevibecode/skills/webflow-code-componentcomponent-scaffold.md) — скилл · 997 установок
- [image](https://affpapa.org/nevibecode/skills/vercel-labs-image.md) — скилл · 1500 установок
- [web-component-design](https://affpapa.org/nevibecode/skills/web-component-design.md) — скилл · 13167 установок
- [angular-component](https://affpapa.org/nevibecode/skills/angular-component.md) — скилл · 11500 установок
- [author-component](https://affpapa.org/nevibecode/skills/author-component.md) — скилл · 3100 установок

Из того же набора: [adobe/skills](https://affpapa.org/nevibecode/by/adobe/skills.md) — 46 карточек

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md