syncfusion-react-speech-to-text — скилл Claude Code: установка
Скилл помогает добавить распознавание речи в React через компонент Syncfusion SpeechToText и управлять микрофоном, событиями и текстом.
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a claude-codeЧто делает syncfusion-react-speech-to-text
Скилл помогает реализовать компонент Syncfusion React SpeechToText на базе Web Speech API. Он обрабатывает речь с микрофона, передаёт промежуточные и финальные расшифровки, отслеживает состояния прослушивания и позволяет задавать язык распознавания.
Внутри есть инструкции по установке npm-пакета, импорту CSS-темы, обработчикам created, onStart, onStop, onError и transcriptChanged, а также методам startListening(), stopListening() и destroy(). Скилл охватывает управление через ref, настройку кнопки и подсказки, локализацию, RTL, ARIA-атрибуты и обработку ошибок.
Без разрешения браузера на доступ к микрофону распознавание речи не заработает. В примерах используются SpeechToTextComponent, TextAreaComponent и пакет @syncfusion/ej2-react-inputs.
Какие задачи решает
- добавить голосовой ввод в React-форму
- получать промежуточную и финальную расшифровку
- управлять началом и остановкой прослушивания
- настроить кнопку микрофона и подсказку
- обработать ошибки доступа к микрофону
Примеры запросов агенту
- Добавь в React-форму
SpeechToTextComponentи выводи расшифровку вTextAreaComponent. - Свяжи
transcriptChangedс состоянием формы и обновляй текст после распознавания речи. - Настрой
startListening()иstopListening()через ref, а ошибки выведи пользователю.
Как установить syncfusion-react-speech-to-text
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a claude-code2Вручную: положить файлы
~/.claude/skills/syncfusion-react-speech-to-text/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/syncfusion-react-speech-to-text/
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a codex2Вручную: положить файлы
.agents/skills/syncfusion-react-speech-to-text/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a cursor2Вручную: положить файлы
.cursor/skills/syncfusion-react-speech-to-text/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install syncfusion/react-ui-components-skills syncfusion-react-speech-to-text2Вручную: положить файлы
.github/skills/syncfusion-react-speech-to-text/SKILL.md1Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a gemini-cli2Командой платформы
gemini skills install https://github.com/syncfusion/react-ui-components-skills --path skills/syncfusion-react-speech-to-textВручную: положить файлы
.devin/skills/syncfusion-react-speech-to-text/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о syncfusion-react-speech-to-text
Как установить syncfusion-react-speech-to-text в Claude Code?
Выполните npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-speech-to-text -a claude-code, затем проверьте файл ~/.claude/skills/syncfusion-react-speech-to-text/SKILL.md.
Что делает syncfusion-react-speech-to-text?
Скилл показывает, как внедрить Syncfusion React SpeechToText для распознавания речи, обработки событий, управления состоянием прослушивания и настройки интерфейса.
Что нужно для распознавания речи?
Компонент использует Web Speech API и микрофон браузера. Пользователь должен разрешить доступ к микрофону.
