feat: major theming system refactor v1.1.0 - remove shadcn variables, add 5 accent themes

[nipsysdev]

Summary

This PR introduces a major theming system refactor for LSD v1.1.0, transitioning from shadcn-style theme variables to pure LSD design tokens with improved semantic clarity, enhanced light/dark variants support, and reorganized theme structure.

Breaking Changes 🚨

Complete Theme Variable Migration

Removed shadcn-style variables:

• --background, --foreground
• --primary, --primary-foreground
• --secondary, --secondary-foreground
• --accent, --accent-foreground
• --destructive, --destructive-foreground
• --muted, --muted-foreground
• --border, --input, --ring

Renamed to LSD design tokens:

• Double-prefix pattern (text-lsd-text-secondary) → Single prefix (text-secondary)
• All 40+ components updated to use new variable naming convention
• Custom theme creation now requires LSD-specific variable names

Variable name updates:

• text-primary → text-neutral
• surface → background
• text-decorative → text-secondary
• And other semantic naming improvements

Features ✨

Enhanced Theme Architecture

• Restructured Theme System: Moved monochrome theme from core.css to explicit [data-theme="monochrome"] in themes.css for consistent data-theme support
• Improved Light/Dark Nesting: Better CSS specificity for nested theme switching with explicit &.light and &.dark variants
• Enhanced Theme Inheritance: Better support for nested light/dark variants with accent theme inheritance
• Redesigned CSS Custom Properties: Improved semantic clarity and consistency across all theme variables

Component Enhancements

• Sidebar Trigger: New triggerStyle prop for inline styling with cn() className merging support
• Made SidebarTrigger classNames optional
• Improved positioning and styling capabilities

Documentation Improvements

• US English standardization: colours → colors
• Updated Nord theme colors and simplified branding
• Added installation guide and semantic color tokens to skill references
• Updated contribute skill with dev setup workflows

Migration Guide 📋

If you have custom themes or override theme variables, you'll need to update them:

1. Replace shadcn-style variables with LSD tokens

   /* Before */
   background: var(--background);
   color: var(--foreground);
   
   /* After */
   background: var(--lsd-background);
   color: var(--lsd-text-neutral);

2. Update variable naming to single-prefix pattern

   /* Before */
   class="lsd:bg-lsd-primary"
   
   /* After */
   class="lsd:bg-lsd-primary"  /* Same pattern, but remove any lsd-lsd- remnants */

3. Review custom theme definitions against the new theme structure in packages/lsd/src/styles/themes.css

Note: The 5 themes (monochrome, teal, nord, terracotta, catppuccin) that existed in v1.0.0 are still available, but with improved structure and variable naming.

Testing 🧪

• 1776 tests passing across 127 test files
• Comprehensive theme switching tests
• Theme variant validation
• All component tests updated to new variable names
• E2E tests for accessibility and behavior

Bug Fixes 🐛

• Fixed monochrome theme test regex pattern
• Added color/background-color to theme variants
• Adjusted custom variants and body styling
• Added missing relative class to sidebar component
• Fixed CommandInput placeholder syntax with proper lsd: prefix

Quality Improvements

• Zero linting errors with Biome
• Consistent lsd: prefix usage across all components
• No legacy shadcn-style variable references remaining
• Proper migration from double-prefix to single-prefix pattern

Files Changed

• 180 files changed: 2622 insertions, 967 deletions
• 23 commits total
• Key files:
  • packages/lsd/src/styles/themes.css (theme restructuring)
  • packages/lsd/src/styles/core.css (shadcn var removal)
  • packages/lsd/src/styles/sonner.css (variable updates)
  • 126+ component files (variable name updates)
  • Documentation and skill files

Checklist

• Breaking changes documented
• Migration guide provided
• All tests passing
• Zero linting errors
• Documentation updated
• CHANGELOG.md updated
• Critical issues resolved (slate theme tests, CommandInput placeholder)

Release Notes

This change requires users upgrading from v1.0.0 to update any custom theme definitions or variable overrides. The new theming system provides better semantic clarity, cleaner architecture by removing shadcn-ui compatibility layer, and enhanced support for nested light/dark theme variants with existing accent themes.