feat(theming): add ColorSchemeProvider

[jzempel]

Description

The following PR adds a ColorSchemeProvider and useColorScheme hook. The provider can be used to 1) determine the user's current theme and 2) persistently update (to localStorage) any color scheme changes made by the user (which override initialColorScheme). The hook is available to child components of <ColorSchemeProvider>:

const { colorScheme, isSystem, setColorScheme } = useColorScheme();

Any attempt to invoke the hook outside of this context will result in an error. The localStorage key defaults to 'color-scheme' but can be customized with the colorSchemeKey prop. Consumers are expected to take the value of colorScheme and modify the root theme accordingly:

<ThemeProvider theme={{ ...theme, colors: { ...theme.colors, base: colorScheme } }}>

Detail

I took a few swings at the API and feel like it ended up in a good place – balancing leverage with flexibility. But please view with a critical eye and provide feedback 🙏

Checklist

• 👌 design updates will be Garden Designer approved (add the designer as a reviewer)
• 🌐 demo is up-to-date (npm start)
• ⬅️ renders as expected with reversed (RTL) direction
• ⚫ renders as expected in dark mode
• 🤘 renders as expected with Bedrock CSS (?bedrock)
• 💂‍♂️ includes new unit tests. Maintain existing coverage (always >= 96%)
• ♿ tested for WCAG 2.1 AA accessibility compliance
• 📝 tested in Chrome, Firefox, Safari, and Edge

[coveralls]

coverage: 95.536% (-0.05%) from 95.584%
when pulling 41addfc on jzempel/color-scheme
into a7dc5a4 on main.

[jzempel]

I realize this is currently empty – the Story was needed to get generated API docs. We can fill it with something meaningful in the future if/when 💡 strikes

[ze-flo]

Long overdue review!😅 Great work! 💯