bruno/dss

Files

Digital Production Factory 276ed71f31 Initial commit: Clean DSS implementation

Migrated from design-system-swarm with fresh git history.
Old project history preserved in /home/overbits/apps/design-system-swarm

Core components:
- MCP Server (Python FastAPI with mcp 1.23.1)
- Claude Plugin (agents, commands, skills, strategies, hooks, core)
- DSS Backend (dss-mvp1 - token translation, Figma sync)
- Admin UI (Node.js/React)
- Server (Node.js/Express)
- Storybook integration (dss-mvp1/.storybook)

Self-contained configuration:
- All paths relative or use DSS_BASE_PATH=/home/overbits/dss
- PYTHONPATH configured for dss-mvp1 and dss-claude-plugin
- .env file with all configuration
- Claude plugin uses ${CLAUDE_PLUGIN_ROOT} for portability

Migration completed: $(date)
🤖 Clean migration with full functionality preserved

2025-12-09 18:45:48 -03:00

2.4 KiB

Raw Blame History

name, description, arguments

name

description

arguments

dss-audit

Audit React components for design system adoption

name	description	required
path	Path to components directory	false

DSS Audit Command

Audit React/Vue components for design system readiness, identifying hardcoded values and consolidation opportunities.

Usage

/dss-audit [path]

Examples:

/dss-audit
/dss-audit ./src/components
/dss-audit ./src/ui

What This Does

Scans Components
- Finds all React/Vue components
- Parses component code
- Extracts styling information
Identifies Issues
- Hardcoded color values
- Inline spacing values
- Inconsistent styling patterns
- Duplicate component patterns
Maps Dependencies
- Component relationships
- Style imports
- Shared utilities
Generates Report
- Issues by severity
- Consolidation opportunities
- Refactoring recommendations

Instructions for Claude

When the user runs this command:

Use dss_audit_components tool with the provided path
Present findings organized by:
- Summary statistics
- Hardcoded values (table format)
- Consolidation opportunities
- Dependency issues
Prioritize by impact and effort
Provide specific fix recommendations
Offer to create tokens for hardcoded values

Example Output

Component Audit: /src/components

SUMMARY
- Components analyzed: 45
- Hardcoded values: 127
- Consolidation opportunities: 8
- Accessibility issues: 23

HARDCODED VALUES (Top 10)

| File | Line | Value | Suggested Token |
|------|------|-------|-----------------|
| Button.tsx | 12 | #0066cc | --color-primary |
| Button.tsx | 15 | 16px | --spacing-md |
| Card.tsx | 8 | #ffffff | --color-surface |
| Card.tsx | 22 | 8px | --radius-md |
| Modal.tsx | 34 | rgba(0,0,0,0.5) | --color-overlay |

CONSOLIDATION OPPORTUNITIES

1. Button Components (3 variants)
   Files: PrimaryButton.tsx, SecondaryButton.tsx, GhostButton.tsx
   Suggestion: Merge into Button.tsx with 'variant' prop

2. Card Components (2 variants)
   Files: Card.tsx, FeaturedCard.tsx
   Suggestion: Add 'featured' prop to Card.tsx

RECOMMENDATIONS

1. [HIGH] Create color tokens for 89 hardcoded colors
2. [HIGH] Implement spacing scale (34 values)
3. [MEDIUM] Consolidate button variants
4. [LOW] Add TypeScript types for tokens

Next: Run /dss-extract to create tokens from these values

2.4 KiB Raw Blame History