Description

The design system's theme handling in the twrnc preset currently includes an unused ColorSet enum that adds unnecessary complexity to the codebase. This abstraction was originally created to support multiple color sets (Brand, Neutral, etc.), but in practice, we only use the 'Brand' color set. This creates unnecessary nesting and type complexity that should be removed to simplify the codebase.

Technical Details

Current structure has unnecessary nesting:

export enum ColorSet {
  Brand = 'brand',
}

export const colorSetList: ColorSetListProps = {
  [ColorSet.Brand]: {
    [ColorScheme.Light]: flattenColors(lightTheme.colors),
    [ColorScheme.Dark]: flattenColors(darkTheme.colors),
  },
};

Changes needed:

1. Remove ColorSet enum and related types
2. Flatten color set list structure to directly map color schemes to colors
3. Update generateTailwindConfig to work with ColorScheme directly
4. Update ThemeProvider and ThemeContext to remove ColorSet references
5. Update exports to remove ColorSet
6. Convert font sizes to strings to match twrnc requirements

Acceptance Criteria

• ColorSet enum and related types are removed
• Color configuration is simplified to directly map ColorScheme to colors
• Theme switching (light/dark) continues to work correctly
• All components render with correct colors
• Font sizes render correctly in all components
• No breaking changes to public API
• All tests pass
• Storybook examples work correctly
• Documentation is updated to reflect changes

References

• Related to theme handling in design system
• Affects @metamask/design-system-twrnc-preset package
• Improves code maintainability by removing unused abstraction
• Simplifies type system and reduces complexity