Skip to content

Migrate to @primer/primitives v11.3.2 + breaking changes analysis#425

Closed
Copilot wants to merge 14 commits intomainfrom
copilot/migrate-to-latest-primitives
Closed

Migrate to @primer/primitives v11.3.2 + breaking changes analysis#425
Copilot wants to merge 14 commits intomainfrom
copilot/migrate-to-latest-primitives

Conversation

Copy link

Copilot AI commented Jan 20, 2026

Migrates from @primer/primitives v7.10.0 to v11.3.2, adding 7 accessibility themes. Includes analysis of simplified approach for major version bump.

Changes

Package & Structure

  • Bumped @primer/primitives to v11.3.2
  • Updated import paths: dist/json/colors/*dist/docs/functional/themes/*
  • v11 structure: flat keys with .value property vs v7's nested objects

Current Implementation (Backward Compatible)

  • src/colors.js: 341 lines with transformation layer
  • transformToNestedStructure(): Converts v11 flat → v7 nested (260 lines)
  • theme.js unchanged: color.fg.default, scale.blue[6] work as-is
  • Removed temporary overrides from v7.10.0

Breaking Changes Analysis (For Major Version)

  • Added: BREAKING_CHANGES_ANALYSIS.md - detailed comparison
  • Added: src/colors-simple.js - 80-line alternative (77% reduction)
  • Simplification: Direct primitives usage, no transformation
  • Trade-off: ~200 color references in theme.js need updating

Comparison:

// Current (v7 nested, maintained for compatibility)
color.fg.default
color.accent.emphasis
scale.blue[6]

// Simplified (v11 flat, if breaking changes acceptable)
c('fgColor-default')
c('bgColor-accent-emphasis')
scale('blue', 6)

Result: Current PR works with backward compatibility. Analysis shows 261 lines can be eliminated if breaking changes are acceptable for major version.

New Themes

  • Light/Dark Tritanopia (+ High Contrast variants)
  • Light/Dark Colorblind High Contrast
  • Dark Dimmed High Contrast

Total: 16 themes (9 existing + 7 new)

Screenshots

N/A - Theme generation code only, no visual changes to show

Merge checklist

  • Added/updated colors
  • Added/updated documentation/README
  • Tested in GitHub Light Default theme

Take a look at the Contribute section for more information on how test your changes locally.


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants