Создание material-компонентов FlowGram
Создание material-компонентов форм FlowGram требует согласованной структуры, экспортов и проверки в Storybook. Этот навык помогает со scaffolding компонентов, паттернами TypeScript, экспортами и локальными проверками.
Скопируйте этот запрос в своего Агента. Он содержит каноническую страницу Skill и манифест.
Review the Skillstore skill "FlowGram Material Component Development" from https://skillstore.io/skills/bytedance-material-component-dev.md and its manifest at https://skillstore.io/api/skills/bytedance-material-component-dev/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Ваш Агент по-прежнему должен показать план и запросить все подтверждения, требуемые политикой безопасности.
Используйте эти ссылки, когда AI-агенту, crawler или script нужен чистый контекст вместо полной страницы.
Использование «FlowGram Material Component Development». Спланируй новый компонент выбора схемы для form-materials.
Ожидаемый результат:
Краткий план реализации с папкой компонента, необходимыми файлами, props, именованными экспортами и расположением Storybook story.
Использование «FlowGram Material Component Development». Проверь компонент, который не появляется в Storybook.
Ожидаемый результат:
Чеклист вероятных пробелов в экспортах и импортах, затем целевые исправления для точек входа компонента.
Использование «FlowGram Material Component Development». Исправь ошибку TypeScript, связанную с типами React или json-schema.
Ожидаемый результат:
Диагностика, указывающая на явные импорты React или типы FlowGram json-schema, с файлами, которые нужно проверить.
All 57 static findings are false positives caused by Markdown code formatting, fenced examples, a localhost Storybook URL, and a compile-time relative import. The documented shell commands use fixed local development arguments and show no dynamic input, exfiltration, prompt injection, or malicious intent. No security remediation is required.
Делитесь версионным отчетом об оценке, нейтральным значком, встраиваемой карточкой и цитатами. Skillstore публикует доказательства, не решая, безопасен ли этот Skill.
https://skillstore.io/skills/bytedance-material-component-dev/audits/10?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/bytedance-material-component-dev?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/bytedance-material-component-dev?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/bytedance-material-component-dev/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/bytedance-material-component-dev.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>bytedance. (2026). FlowGram Material Component Development security audit report (audit version 10) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/bytedance-material-component-dev/audits/10@techreport{bytedance-bytedance-material-component-dev-2026,
author = {bytedance},
title = {FlowGram Material Component Development security audit report (audit version 10)},
institution = {Skillstore},
year = {2026},
number = {10},
url = {https://skillstore.io/skills/bytedance-material-component-dev/audits/10},
note = {Author version 1.0.0}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "FlowGram Material Component Development security audit report (audit version 10)"
version: "1.0.0"
type: report
authors:
- name: "bytedance"
date-released: "2026-07-19"
url: "https://skillstore.io/skills/bytedance-material-component-dev/audits/10"
identifiers:
- type: other
value: "skillstore:bytedance-material-component-dev:audit:10"
description: "Skillstore immutable audit report identifier"
Создать папку компонента, основные файлы, экспорты и демонстрацию Storybook, соответствующие соглашениям FlowGram.
Проверить props, именованные экспорты, использование зависимостей и шаги валидации перед слиянием изменений компонента.
Изучить ожидаемую структуру, правила импортов, примеры и критерии приемки для работы с form-materials.
Используй этот навык, чтобы спланировать новый компонент FlowGram form material с именем MyComponent. Определи папку, props, экспорты и Storybook story, которые мне нужны.
Используй этот навык, чтобы создать scaffold компонента FlowGram form-materials для выбора поля JSON schema. Следуй правилам именованных экспортов и Semi UI.
Используй этот навык, чтобы проверить мой новый компонент form-materials на соответствие соглашениям FlowGram, полноту экспортов, дизайн props и готовность к Storybook.
Используй этот навык, чтобы диагностировать проблемы TypeScript и Storybook в material-компоненте FlowGram. Сфокусируйся на импортах React, экспортах пакета и типах json-schema.
Автор
bytedanceЛицензия
MIT
Версия автора
v1.0.0
Ревизия Skillstore
r1
Репозиторий
https://github.com/bytedance/flowgram.ai/tree/main/.claude/skills/material-component-devСсылка
67e6747f5b57a33ea8c62a0043d8f2ef310189ab
Актуальность поддержки
22.07.2026
Использование
6 загрузок · 173 просмотров
Структура файлов
📄 SKILL.md
Создание документации для компонентов FlowGram
Material-компонентам FlowGram нужны согласованная документация, запускаемые Story-примеры, таблицы API и этапы двуязычной проверки. Этот навык дает Claude, Codex и Claude Code структурированный рабочий процесс для создания этих материалов.
Создание пользовательских узлов FlowGram
Разработчикам FlowGram нужен воспроизводимый способ добавлять узлы demo-free-layout. Этот навык помогает создавать простые узлы и узлы с пользовательским UI с помощью шаблонов, правил схем, шагов регистрации и проверок тестирования.
Улучшение покрытия тестами Playwright
от C0ntr0lledCha0s
Наборы тестов Playwright могут становиться нестабильными, когда конфигурация, локаторы и фикстуры непоследовательны. Этот навык дает практические шаблоны для надежных браузерных тестов, отладки и переиспользуемых page objects.
Создание приложений Starknet с помощью starknet.js
от internet-court
Интеграции со Starknet требуют точной работы с провайдерами, аккаунтами, транзакциями и комиссиями. Этот навык предоставляет Claude, Codex и Claude Code практические паттерны starknet.js v9.
Улучшение качества кода Vue 3
от vuejs-ai
В проектах Vue со временем часто накапливаются ошибки, связанные с реактивностью, компонентами и производительностью. Этот навык дает целевые рекомендации по Vue 3 для более безопасных паттернов и более понятного кода.
Создание типобезопасных компонентов React
от softaworks
Работа с React и TypeScript часто требует точных типов для событий, хуков и маршрутов. Этот skill предоставляет сфокусированные паттерны для типизированных компонентов, API React 19 и маршрутизации.
Улучшение компонентов Vue Options API
от vuejs-ai
Проекты на Vue Options API могут терять безопасность типов и корректную привязку this. Этот skill дает прямые шаблоны для более безопасных компонентов Vue.
Создание готовых к промышленной эксплуатации фронтенд-функций
от davila7
Фронтенд-командам нужны согласованные рекомендации по React и Next.js для разных проектов. Этот навык предоставляет справочные рабочие процессы, практики обеспечения качества и вспомогательные скрипты для анализа фронтенда.