技能 material-component-doc

📚

material-component-doc

Name: material-component-doc
Author: bytedance

安全 🌐 网络访问📁 文件系统访问⚡ 包含脚本⚙️ 外部命令

FlowGram 컴포넌트 문서 생성

UI 컴포넌트에 대한 포괄적인 문서 작성은 시간이 많이 소요되며 종종 불완전합니다. 이 스킬은 Story 생성, API 문서화, 다국어 지원을 포함하여 FlowGram Material 컴포넌트의 전체 문서화 프로세스를 자동화합니다.

支持: Claude Codex Code(CC)

📊 70 充足

下载技能 ZIP

在 Claude 中上传

前往设置 → 功能 → 技能 → 上传技能

开启并开始使用

测试它

正在使用“material-component-doc”。 스키마 필터링이 포함된 변수 선택기를 표시하는 FlowGram 컴포넌트에 대한 문서 생성

预期结果:

컴포넌트 개요가 포함된 완전한 MDX 문서 파일
BasicStory, WithSchemaStory, DisabledStory를 위한 Story 컴포넌트
모든 props, 타입, 설명이 포함된 API 레퍼런스 테이블
종속성 매핑이 포함된 소스 코드 분석 섹션
올바른 코드 형식의 사용 예제
컴포넌트 워크플로우를 보여주는 Mermaid 플로우차트

正在使用“material-component-doc”。 유효성 검사가 포함된 폼 입력에 대한 Story 컴포넌트 생성

预期结果:

지연 로딩된 React 컴포넌트 가져오기 패턴
올바른 폼 메타 구조가 포함된 FreeFormMetaStoryBuilder 래퍼
올바른 TypeScript 제네릭 타입이 포함된 Field 컴포넌트
다양한 유효성 검사 상태를 위한 다중 Story 변형

正在使用“material-component-doc”。 버튼 컴포넌트 문서를 중국어에서 영어로 번역

预期结果:

모든 코드 블록이 변경되지 않은 번역된 MDX 파일
/zh/에서 /en/으로 업데이트된 내부 문서 링크
용어 일관성이 유지된 번역된 API 테이블 설명
번역된 노드 레이블이 포함된 Mermaid 다이어그램

安全审计

安全

v4 • 1/16/2026

This is a pure documentation skill containing only markdown guidelines and MDX templates. The static findings are all false positives: the 'weak cryptographic algorithm' flags are just JSON field values (e.g., 'MIT', version numbers), 'shell backtick execution' are markdown code delimiters for documentation examples, and 'system reconnaissance' are standard file path listings in documentation. No executable code, network calls, or file operations exist.

已扫描文件

744

分析行数

发现项

审计总数

风险因素

🌐 网络访问 (8)

skill-report.json:6 templates/material.mdx:94 templates/material.mdx:153 templates/material.mdx:154 templates/material.mdx:155 templates/material.mdx:157 templates/material.mdx:158 templates/material.mdx:170

📁 文件系统访问 (3)

skill-report.json:6 SKILL.md:168 SKILL.md:168

⚡ 包含脚本 (2)

SKILL.md:104 SKILL.md:171

⚙️ 外部命令 (89)

审计者: claude 查看审计历史 →

质量评分

架构

100

可维护性

内容

社区

100

安全

规范符合性

你能构建什么

새 컴포넌트 문서화

API 테이블과 사용 예제를 포함하여 새로 생성된 FlowGram Material 컴포넌트에 대한 포괄적인 문서를 생성합니다.

문서 표준화

모든 팀 컴포넌트가 적절한 Story 예제와 API 참조로 일관된 문서 패턴을 따르도록 합니다.

컴포넌트 문서 번역

올바른 용어 일관성을 바탕으로 국제 팀을 위한 효율적인 이중 언어 문서를 생성합니다.

试试这些提示

새 컴포넌트 문서 생성

이라는 새로운 FlowGram Material 컴포넌트에 대한 문서를 만들어야 합니다. Story 컴포넌트, API 레퍼런스, 코드 예제를 포함하여 완전한 문서를 생성해 주세요.

Story 예제 추가

'variable-selector'라는 FlowGram 컴포넌트가 있는데, 3개의 Story 예제가 필요합니다: 기본 사용, 필터링 포함, 비활성화 상태. Story 컴포넌트와 문서를 생성해 주시겠어요?

문서 번역

apps/docs/src/zh/materials/components/dynamic-input.mdx에 있는 'dynamic-input' 컴포넌트에 대한 승인된 중국어 문서가 있습니다. 모든 코드 예제와 API 테이블을 유지하면서 영어로 번역해 주세요.

기존 문서 업데이트

'form-validator' 컴포넌트 문서가 오래되었습니다. 소스 코드에 새로운 props와 종속성이 추가되었습니다. 현재 구현을 분석하고 최신 API 변경 사항으로 문서를 업데이트해 주세요.

最佳实践

영어로 번역하기 전에 중국어 문서가 완전하고 정확한지 항상 확인하세요
Story 컴포넌트에 React.lazy를 사용하여 성능 문제를 방지하세요
모든 public props와 해당 타입이 포함된 포괄적인 API 테이블을 포함하세요

避免

문서에서 코드 예제, 명령어 또는 파일 경로를 번역하지 마세요
같은 문서 섹션에서 한국어와 영어를 혼합하지 마세요
Story 컴포넌트 생성 단계를 건너뛰지 마세요. 대화형 예제에 필수적입니다

常见问题

이 스킬은 어떤 FlowGram 컴포넌트를 문서화할 수 있나요?

이 스킬은 FlowGram 프레임워크의 모든 Material 컴포넌트, 특히 packages/materials/form-materials/src/components에 있는 컴포넌트에서 작동합니다.

스킬은 컴포넌트 종속성을 어떻게 처리하나요?

스킬은 가져오기 문서, Hook 사용법, package.json을 분석하여 FlowGram API, 기타 Material 및 타사 라이브러리를 포함한 포괄적인 종속성 맵을 생성합니다.

문서 템플릿을 사용자 정의할 수 있나요?

스킬은 templates/material.mdx의 표준화된 템플릿을 사용하여 모든 컴포넌트 문서에서 일관성을 보장합니다. 사용자 정의는 템플릿 파일을 수정해야 합니다.

컴포넌트 소스 코드가 변경되면 어떻게 되나요?

스킬은 매번 현재 소스 코드를 분석하므로 새로운 props, 종속성 또는 기능 변경을 포함하여 최신 구현을 반영한 문서가 생성됩니다.

Story 컴포넌트는 일반 예제와 어떻게 다릅니까?

Story 컴포넌트는 FreeFormMetaStoryBuilder로 래핑된 대화형 데모로, 올바른 지연 로딩, TypeScript 타입, FlowGrids 폼 시스템 통합이 포함됩니다.

스킬은 복잡한 상태 관리가 있는 컴포넌트를 지원하나요?

네, 스킬은 구현을 분석하고 문서에서 아키텍처를 설명함으로써 Hook, Context 및 기타 상태 패턴을 사용하는 컴포넌트를 문서화할 수 있습니다.

开发者详情

作者

bytedance

许可证

MIT

仓库

https://github.com/bytedance/flowgram.ai/tree/main/.claude/skills/material-component-doc

引用

main

文件结构

📁 templates/

📄 material.mdx

📄 SKILL.md