aiagentskills/infographic-item-creator
skills/infographic-item-creator/infographic-item-creator/SKILL.md
Generate or update infographic Item components for this repo (TypeScript/TSX in src/designs/items). Use when asked to design, implement, or modify data item visuals, layout logic, or registerItem composites.
development
Updated Mar 27, 2026
$ install --global
skillsauthnpx skillsauth add aiagentskills/skills infographic-item-creatorInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Mar 29, 2026, 2:25 AM39.3s2 files scanned
SKILL.md
- name:
- infographic-item-creator
- description:
- Generate or update infographic Item components for this repo (TypeScript/TSX in src/designs/items). Use when asked to design, implement, or modify data item visuals, layout logic, or registerItem composites.
Infographic Item Generator
Overview
Generate complete Item component code for the infographic framework, following the project's item rules, layout constraints, and registration requirements.
Workflow
- Read
references/item-prompt.mdfor the full framework rules, allowed components, and output requirements. - Clarify minimal requirements if missing: desired visuals, required fields (icon/label/value/desc/illus), sizing, and alignment needs.
- Use
getItemPropsto extract custom props and compute layout withgetElementBounds. - Produce a full TypeScript file: imports, Props extends BaseItemProps, component implementation, and
registerItemwith accuratecomposites. - Self-check against the constraints in the reference (no unlisted components, indexes passed to all wrapped components, correct conditional rendering).
Notes
- Prefer scanning
src/designs/itemsfor similar items to match local patterns when appropriate. - Keep output concise; avoid React-only features (keys, hooks).
Related Skills
aiagentskills/zig-system-calls
documentation
VerifiedTrustedCommunity
Guides using bun.sys for system calls and file I/O in Zig. Use when implementing file operations instead of std.fs or std.posix.
SKILL.mdUpdated Mar 27, 2026
aiagentskills/xlsx
development
VerifiedTrustedCommunity
Comprehensive spreadsheet creation, editing, and analysis with support for formulas, formatting, data analysis, and visualization. When Claude needs to work with spreadsheets (.xlsx, .xlsm, .csv, .tsv, etc) for: (1) Creating new spreadsheets with formulas and formatting, (2) Reading or analyzing data, (3) Modify existing spreadsheets while preserving formulas, (4) Data analysis and visualization in spreadsheets, or (5) Recalculating formulas
SKILL.mdUpdated Mar 27, 2026
aiagentskills/xlsx
development
VerifiedTrustedCommunity
Comprehensive spreadsheet creation, editing, and analysis with support for formulas, formatting, data analysis, and visualization. When Claude needs to work with spreadsheets (.xlsx, .xlsm, .csv, .tsv, etc) for: (1) Creating new spreadsheets with formulas and formatting, (2) Reading or analyzing data, (3) Modify existing spreadsheets while preserving formulas, (4) Data analysis and visualization in spreadsheets, or (5) Recalculating formulas
SKILL.mdUpdated Mar 27, 2026
aiagentskills/writing-dev-server-tests
development
VerifiedTrustedCommunity
Guides writing HMR/Dev Server tests in test/bake/. Use when creating or modifying dev server, hot reloading, or bundling tests.
SKILL.mdUpdated Mar 27, 2026