material-component-doc
Generar documentación de componentes FlowGram
Crear documentación completa para componentes de UI es un proceso que consume mucho tiempo y a menudo queda incompleto. Esta habilidad automatiza todo el proceso de documentación para componentes material de FlowGram, incluyendo la creación de Story, documentación de API y soporte multiidioma.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"material-component-doc" 사용 중입니다. Crear documentación para un componente FlowGram que muestra selectores de variables con filtrado de esquema
예상 결과:
- Archivo de documentación MDX completo con descripción general del componente
- Componentes Story para BasicStory, WithSchemaStory y DisabledStory
- Tabla de referencia de API con todos los props, tipos y descripciones
- Sección de análisis de código fuente con mapeo de dependencias
- Ejemplos de uso con formato de código apropiado
- Diagrama de flujo Mermaid mostrando el flujo de trabajo del componente
"material-component-doc" 사용 중입니다. Generar componente Story para un input de formulario con validación
예상 결과:
- Patrón de importación de componente React con lazy loading
- Envoltorio FreeFormMetaStoryBuilder con estructura de meta de formulario apropiada
- Componente Field con tipos genéricos TypeScript correctos
- Múltiples variantes Story para diferentes estados de validación
"material-component-doc" 사용 중입니다. Traducir documentación de componente de botón del chino al inglés
예상 결과:
- Archivo MDX traducido preservando todos los bloques de código sin cambios
- Enlaces de documentación interna actualizados de /zh/ a /en/
- Descripciones de tabla de API traducidas manteniendo consistencia terminológica
- Diagramas Mermaid con etiquetas de nodos traducidas
보안 감사
안전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.
위험 요인
🌐 네트워크 접근 (8)
📁 파일 시스템 액세스 (3)
⚡ 스크립트 포함 (2)
⚙️ 외부 명령어 (89)
품질 점수
만들 수 있는 것
Documentar nuevos componentes
Generar documentación completa para componentes material de FlowGram recién creados con tablas de API y ejemplos de uso.
Estandarizar documentación
Asegurar que todos los componentes del equipo sigan patrones de documentación consistentes con ejemplos Story apropiados y referencias de API.
Traducir documentación de componentes
Crear eficientemente documentación bilingüe para equipos internacionales con consistencia terminológica apropiada.
이 프롬프트를 사용해 보세요
Necesito crear documentación para un nuevo componente material de FlowGram llamado 'data-table'. Por favor ayúdame a generar la documentación completa incluyendo componentes Story, referencia de API y ejemplos de código.
Tengo un componente FlowGram 'variable-selector' que necesita documentación con 3 ejemplos Story: uso básico, con filtrado y estado deshabilitado. ¿Puedes crear los componentes Story y la documentación?
Tengo documentación aprobada en chino para el componente 'dynamic-input' en apps/docs/src/zh/materials/components/dynamic-input.mdx. Por favor tradúcela al inglés manteniendo todos los ejemplos de código y tablas de API.
La documentación del componente 'form-validator' está desactualizada. El código fuente tiene nuevos props y dependencias. Por favor analiza la implementación actual y actualiza la documentación con los últimos cambios de API.
모범 사례
- Siempre confirmar que la documentación en chino esté completa y precisa antes de traducir al inglés
- Usar React.lazy para componentes Story para evitar problemas de rendimiento
- Incluir tablas de API completas con todos los props públicos y sus tipos
피하기
- No traducir ejemplos de código, comandos o rutas de archivo en la documentación
- Evitar mezclar chino e inglés en la misma sección de documentación
- Nunca omitir el paso de creación de componente Story ya que es esencial para ejemplos interactivos