К основному содержанию
affpapa.org
RU EN
скилл CX Codex

syncfusion-react-carousel — скилл для Claude Code: установка

Скилл помогает агенту собрать React-карусель Syncfusion: слайды, навигацию, переходы и доступность. Пригодится для галерей, витрин и слайд-шоу.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓ 
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-carousel -a claude-code
Открыть на GitHub

Что делает syncfusion-react-carousel

Скилл описывает работу с Carousel в React: добавление элементов, выбор начального слайда, кнопки перехода и индикаторы. Агент может настроить автопрокрутку, паузу при наведении, циклический режим, свайпы и эффекты Fade или Slide. Также разобраны свойства, методы и события компонента.

Отдельные разделы посвящены CSS-оформлению, темам, тёмному режиму, ARIA, клавиатурной навигации и экранным дикторам. В примерах используются CarouselComponent, CarouselItemsDirective и CarouselItemDirective из @syncfusion/ej2-react-navigations. Если этого пакета нет в React-проекте, импорты из примеров не соберутся.

Какие задачи решает

  • собрать карусель изображений в React
  • настроить кнопки, индикаторы и свайпы
  • добавить автопрокрутку и переходы между слайдами
  • связать карусель с данными через шаблон
  • проверить клавиатурную и ARIA-навигацию

Примеры запросов агенту

  • Используй скилл syncfusion-react-carousel и добавь в React-проект карусель товаров с кнопками, индикаторами и автопрокруткой.
  • Настрой слайды через CarouselItemDirective, выбери начальный элемент и добавь переходы Fade.
  • Сделай доступную карусель изображений с клавиатурным управлением и поддержкой свайпов.

Как установить syncfusion-react-carousel

1Через Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-carousel -a claude-code

2Вручную: положить файлы

~/.claude/skills/syncfusion-react-carousel/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/syncfusion-react-carousel/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о syncfusion-react-carousel

Как установить syncfusion-react-carousel в Claude Code?

Выполните npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-carousel -a claude-code, затем проверьте файл ~/.claude/skills/syncfusion-react-carousel/SKILL.md.

Что делает syncfusion-react-carousel?

Скилл помогает реализовать Syncfusion React Carousel: элементы, навигацию, индикаторы, анимации, автопрокрутку, стилизацию и доступность.

Какой пакет используется в примерах скилла?

Примеры импортируют компоненты из @syncfusion/ej2-react-navigations: CarouselComponent, CarouselItemsDirective и CarouselItemDirective.

Похожие скиллы

Всё по теме «Фронтенд и UI» →
frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. CX Codex +1 678 700установок prototype Matt Pocock Создаёт временный прототип, чтобы проверить логику, модель состояния или вид интерфейса до работы над основным кодом. 986 201установок hyperframes heygen-com Скилл задаёт агенту правила рендера HTML-кода в видео через HyperFrames. Помогает собирать проморолики, эксплейнеры и титры прямо в коде проекта. CX Codex +1 1 200 000установок hyperframes-cli heygen-com Управляет проектами HyperFrames через терминал: собирает таймлайн, проверяет контраст кадров, запускает предпросмотр и рендерит видео локально или в облаке. CX Codex +1 1 300 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок

Из того же набора37

syncfusion-react-3d-chart Скилл помогает агенту собрать объёмные столбчатые и линейчатые диаграммы Syncfusion в React-проекте. Пригодится, когда нужен график с осями, легендой и экспортом. CX Codex +1 661установок syncfusion-react-notifications Скилл по компонентам уведомлений Syncfusion для React: тосты, бейджи, сообщения, скелетоны и спиннеры. Пригодится, когда нужно быстро собрать статус-индикаторы. CX Codex +1 659установок syncfusion-react-heatmap Помогает собрать тепловую карту на React с осями, легендой и подсказками. Пригодится, когда нужно показать матрицу данных цветом. CX Codex +1 658установок syncfusion-react-breadcrumb Скилл для ИИ-агента, который помогает собрать и настроить компонент Breadcrumb из Syncfusion в React-приложении: маршруты, иконки, переполнение. Пригодится, когда нужна навигационная цепочка без чтения документации. CX Codex +1 658установок syncfusion-react-sidebar Скилл помогает собрать адаптивную боковую панель Syncfusion React для навигации. Нужен для drawer-меню, вложенных разделов и мобильных макетов. CX Codex +1 656установок syncfusion-react-timeline Подсказывает агенту, как собрать хронологию событий на компоненте Timeline из Syncfusion для React. Пригодится для роадмапов, трекинга доставки и лент активности. CX Codex +1 655установок syncfusion-react-splitter Скилл помогает собрать в React гибкие панели с изменяемым размером, сворачиванием и вложенными раскладками. CX Codex +1 653установок syncfusion-react-smithchart Скилл помогает агенту собрать и настроить Smith Chart из Syncfusion для React: импеданс, согласование, параметры линий передачи. CX Codex +1 652установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой
Золотой спонсор AI-аналитика спроса на iGaming — индекс, тренды, конкуренты
Nutra.Club Закрытое сообщество Nutra-вертикали от команды M1

Показы, клики и копирования кода — открытая статистика. Мы держим цифры публичными по той же логике, что и сам NeBlask. Стать спонсором