jil_moon_light_theme_provider_react_quickstart.ts

1import { ThemeProvider, createTheme } from '@jil/core';
2import { moonLight } from '@jil/theme-moon-light';
3
4// Create a theme instance using the moonLight configuration
5const theme = createTheme(moonLight);
6
7/**
8 * Example React Component usage
9 */
10export const App = () => {
11  return (
12    <ThemeProvider theme={theme}>
13      <div style={{ padding: theme.spacing.medium, backgroundColor: theme.colors.background }}>
14        <h1 style={{ color: theme.colors.text }}>Hello Moon Light</h1>
15        <p style={{ color: theme.colors.primary }}>
16          This is a quickstart example for @jil/theme-moon-light.
17        </p>
18      </div>
19    </ThemeProvider>
20  );
21};