boost_moon_light_theme_import_and_terminal_styling.ts

1import { Theme } from '@boost/common';
2import moonLight from '@boost/theme-moon-light';
3
4/**
5 * In Boost, themes are object literal definitions that adhere 
6 * to the Theme interface. You can apply this theme to components
7 * that support styling, such as the Terminal or Logger.
8 */
9
10// 1. View the theme palette
11console.log('Theme Colors:', moonLight.palette);
12
13// 2. Example usage with a hypothetical Boost component (e.g., Terminal)
14// In a real application, you would pass this to your renderer or logger setup.
15const currentTheme: Theme = moonLight;
16
17function renderHeader(text: string) {
18  // Use the theme's brand color for headers
19  const brandColor = currentTheme.palette.brand;
20  console.log(`Applying color ${brandColor} to text: ${text}`);
21}
22
23renderHeader('Boost Moon Light Theme Loaded');