[UI/UX Design] Add a chart-primitive color and axis token set in design-system

[1nonlypiece]

[UI/UX Design] Add a chart-primitive color and axis token set in design-system

Description

Analytics.tsx and VaultTransactions.tsx use Recharts with ad-hoc colors. This issue introduces a categorical/sequential chart palette plus axis/grid/tooltip tokens in design-system/tokens/colors.json, validated by the existing token loader/validators in design-system/src/utils.

Requirements and context

• Must be secure, tested, and documented
• Should be efficient and easy to review
• Add categorical and sequential ramps with light/dark variants
• Include axis, gridline, and tooltip surface tokens
• Ensure ramps remain colorblind-safe, mirroring existing colorblindSimulation metadata
• Validate via design-system/src/utils/validators.ts

Suggested execution

• Fork the repo and create a branch
• git checkout -b feature/chart-token-set
• Implement changes
  • Extend colors.json and design-system/src/types/tokens.ts
  • Write design-system/__tests__/chart-tokens.test.ts
  • Document the chart palette in design-system/documentation
  • Verify contrast and colorblind safety of each ramp step
• Test and commit
  • Run tests, cover edge cases
  • Include test output and notes

Example commit message

feat: add chart color and axis token set to design-system

Guidelines

• Minimum 95 percent test coverage
• Clear documentation
• Timeframe: 96 hours