@crystin001/theme-settings-lib 1.0.0 → 1.2.0

package/dist/stories/ThemeStories.js

@@ -0,0 +1,285 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IndividualThemes = exports.DarkThemes = exports.LightThemes = exports.AllThemes = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const theme_settings_lib_1 = require("@crystin001/theme-settings-lib");
+// Color Swatch Component
+function ColorSwatch({ label, color, textColor }) {
+    return (<react_native_1.View style={[styles.swatch, { backgroundColor: color }]}>
+      <react_native_1.Text style={[styles.swatchLabel, { color: textColor || '#000' }]} numberOfLines={1}>
+        {label}
+      </react_native_1.Text>
+      <react_native_1.Text style={[styles.swatchValue, { color: textColor || '#000' }]} numberOfLines={1}>
+        {color}
+      </react_native_1.Text>
+    </react_native_1.View>);
+}
+// Theme Preview Component
+function ThemePreview({ themeName }) {
+    const colors = theme_settings_lib_1.Themes[themeName];
+    const { setThemeFamily } = (0, theme_settings_lib_1.useSettings)();
+    const displayName = themeName.replace(/-/g, ' ').replace(/\b\w/g, (l) => l.toUpperCase());
+    const handleSelect = () => {
+        const family = themeName.replace(/-light$|-dark$/, '');
+        setThemeFamily(family);
+    };
+    return (<react_native_1.View style={[styles.themeCard, { backgroundColor: colors.card, borderColor: colors.border }]}>
+      <react_native_1.View style={[styles.themeHeader, { backgroundColor: colors.background }]}>
+        <react_native_1.Text style={[styles.themeTitle, { color: colors.text }]}>{displayName}</react_native_1.Text>
+      </react_native_1.View>
+
+      <react_native_1.View style={styles.colorGrid}>
+        <ColorSwatch label="Background" color={colors.background} textColor={colors.text}/>
+        <ColorSwatch label="Text" color={colors.text}/>
+        <ColorSwatch label="Primary" color={colors.primary}/>
+        <ColorSwatch label="Secondary" color={colors.secondary}/>
+        <ColorSwatch label="Tint" color={colors.tint}/>
+        <ColorSwatch label="Card" color={colors.card} textColor={colors.cardText}/>
+      </react_native_1.View>
+
+      <react_native_1.View style={styles.sampleSection}>
+        <react_native_1.Text style={[styles.sampleLabel, { color: colors.text }]}>Sample UI:</react_native_1.Text>
+        
+        <react_native_1.View style={[styles.sampleCard, { backgroundColor: colors.card, borderColor: colors.border }]}>
+          <react_native_1.Text style={[styles.sampleText, { color: colors.cardText }]}>
+            Sample card content
+          </react_native_1.Text>
+        </react_native_1.View>
+
+        <react_native_1.View style={styles.buttonRow}>
+          <react_native_1.Pressable style={[styles.sampleButton, { backgroundColor: colors.button }]} onPress={handleSelect}>
+            <react_native_1.Text style={[styles.sampleButtonText, { color: colors.buttonText }]}>
+              Apply Theme
+            </react_native_1.Text>
+          </react_native_1.Pressable>
+          <react_native_1.Pressable style={[styles.sampleButton, styles.sampleButtonSecondary, { backgroundColor: colors.buttonSecondary }]} onPress={() => { }}>
+            <react_native_1.Text style={[styles.sampleButtonText, { color: colors.buttonSecondaryText }]}>
+              Secondary
+            </react_native_1.Text>
+          </react_native_1.Pressable>
+        </react_native_1.View>
+
+        <react_native_1.View style={styles.statusRow}>
+          <react_native_1.View style={[styles.statusBadge, { backgroundColor: colors.success }]}>
+            <react_native_1.Text style={[styles.statusText, { color: '#FFF' }]}>Success</react_native_1.Text>
+          </react_native_1.View>
+          <react_native_1.View style={[styles.statusBadge, { backgroundColor: colors.warning }]}>
+            <react_native_1.Text style={[styles.statusText, { color: '#000' }]}>Warning</react_native_1.Text>
+          </react_native_1.View>
+          <react_native_1.View style={[styles.statusBadge, { backgroundColor: colors.error }]}>
+            <react_native_1.Text style={[styles.statusText, { color: '#FFF' }]}>Error</react_native_1.Text>
+          </react_native_1.View>
+          <react_native_1.View style={[styles.statusBadge, { backgroundColor: colors.info }]}>
+            <react_native_1.Text style={[styles.statusText, { color: '#FFF' }]}>Info</react_native_1.Text>
+          </react_native_1.View>
+        </react_native_1.View>
+
+        <react_native_1.View style={[styles.sampleInput, { backgroundColor: colors.input, borderColor: colors.inputBorder }]}>
+          <react_native_1.Text style={[styles.sampleInputText, { color: colors.inputText }]}>
+            Sample input field
+          </react_native_1.Text>
+        </react_native_1.View>
+      </react_native_1.View>
+    </react_native_1.View>);
+}
+// All Themes Story
+const AllThemes = () => {
+    const themeEntries = Object.entries(theme_settings_lib_1.Themes);
+    return (<theme_settings_lib_1.SettingsProvider>
+      <react_native_1.ScrollView style={styles.container} contentContainerStyle={styles.scrollContent}>
+        <react_native_1.View style={styles.header}>
+          <react_native_1.Text style={styles.headerTitle}>All Themes</react_native_1.Text>
+          <react_native_1.Text style={styles.headerSubtitle}>Tap "Apply Theme" to switch themes</react_native_1.Text>
+        </react_native_1.View>
+        {themeEntries.map(([themeName]) => (<ThemePreview key={themeName} themeName={themeName}/>))}
+      </react_native_1.ScrollView>
+    </theme_settings_lib_1.SettingsProvider>);
+};
+exports.AllThemes = AllThemes;
+// Light Themes Story
+const LightThemes = () => {
+    const lightThemes = Object.keys(theme_settings_lib_1.Themes).filter(name => name.endsWith('-light'));
+    return (<theme_settings_lib_1.SettingsProvider>
+      <react_native_1.ScrollView style={styles.container} contentContainerStyle={styles.scrollContent}>
+        <react_native_1.View style={styles.header}>
+          <react_native_1.Text style={styles.headerTitle}>Light Themes</react_native_1.Text>
+        </react_native_1.View>
+        {lightThemes.map((themeName) => (<ThemePreview key={themeName} themeName={themeName}/>))}
+      </react_native_1.ScrollView>
+    </theme_settings_lib_1.SettingsProvider>);
+};
+exports.LightThemes = LightThemes;
+// Dark Themes Story
+const DarkThemes = () => {
+    const darkThemes = Object.keys(theme_settings_lib_1.Themes).filter(name => name.endsWith('-dark'));
+    return (<theme_settings_lib_1.SettingsProvider>
+      <react_native_1.ScrollView style={styles.container} contentContainerStyle={styles.scrollContent}>
+        <react_native_1.View style={styles.header}>
+          <react_native_1.Text style={styles.headerTitle}>Dark Themes</react_native_1.Text>
+        </react_native_1.View>
+        {darkThemes.map((themeName) => (<ThemePreview key={themeName} themeName={themeName}/>))}
+      </react_native_1.ScrollView>
+    </theme_settings_lib_1.SettingsProvider>);
+};
+exports.DarkThemes = DarkThemes;
+// Individual Theme Stories - shows all themes in one view
+const IndividualThemes = () => {
+    const themeEntries = Object.entries(theme_settings_lib_1.Themes);
+    return (<theme_settings_lib_1.SettingsProvider>
+      <react_native_1.ScrollView style={styles.container} contentContainerStyle={styles.scrollContent}>
+        <react_native_1.View style={styles.header}>
+          <react_native_1.Text style={styles.headerTitle}>Individual Themes</react_native_1.Text>
+          <react_native_1.Text style={styles.headerSubtitle}>Scroll to see all themes</react_native_1.Text>
+        </react_native_1.View>
+        {themeEntries.map(([themeName]) => {
+            const displayName = themeName.replace(/-/g, ' ').replace(/\b\w/g, (l) => l.toUpperCase());
+            return (<react_native_1.View key={themeName} style={styles.themeSection}>
+              <react_native_1.Text style={styles.sectionTitle}>{displayName}</react_native_1.Text>
+              <ThemePreview themeName={themeName}/>
+            </react_native_1.View>);
+        })}
+      </react_native_1.ScrollView>
+    </theme_settings_lib_1.SettingsProvider>);
+};
+exports.IndividualThemes = IndividualThemes;
+const styles = react_native_1.StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: '#F5F5F5',
+    },
+    scrollContent: {
+        padding: 20,
+        gap: 20,
+    },
+    header: {
+        padding: 20,
+        backgroundColor: '#FFF',
+        borderRadius: 8,
+        marginBottom: 8,
+    },
+    headerTitle: {
+        fontSize: 24,
+        fontWeight: 'bold',
+        color: '#000',
+        marginBottom: 4,
+    },
+    headerSubtitle: {
+        fontSize: 14,
+        color: '#666',
+    },
+    themeCard: {
+        borderRadius: 12,
+        padding: 16,
+        marginBottom: 16,
+        borderWidth: 1,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.1,
+        shadowRadius: 4,
+        elevation: 3,
+    },
+    themeHeader: {
+        marginBottom: 16,
+        padding: 12,
+        borderRadius: 8,
+    },
+    themeTitle: {
+        fontSize: 18,
+        fontWeight: 'bold',
+    },
+    colorGrid: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        gap: 8,
+        marginBottom: 16,
+    },
+    swatch: {
+        width: '30%',
+        height: 60,
+        borderRadius: 6,
+        padding: 6,
+        justifyContent: 'flex-end',
+    },
+    swatchLabel: {
+        fontSize: 10,
+        fontWeight: '600',
+        marginBottom: 2,
+    },
+    swatchValue: {
+        fontSize: 9,
+        opacity: 0.8,
+    },
+    sampleSection: {
+        marginTop: 8,
+    },
+    sampleLabel: {
+        fontSize: 14,
+        fontWeight: '600',
+        marginBottom: 8,
+    },
+    sampleCard: {
+        padding: 12,
+        borderRadius: 8,
+        borderWidth: 1,
+        marginBottom: 12,
+    },
+    sampleText: {
+        fontSize: 14,
+    },
+    buttonRow: {
+        flexDirection: 'row',
+        gap: 8,
+        marginBottom: 12,
+    },
+    sampleButton: {
+        flex: 1,
+        paddingVertical: 10,
+        paddingHorizontal: 16,
+        borderRadius: 6,
+        alignItems: 'center',
+    },
+    sampleButtonSecondary: {
+    // Additional styles if needed
+    },
+    sampleButtonText: {
+        fontSize: 14,
+        fontWeight: '600',
+    },
+    statusRow: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        gap: 8,
+        marginBottom: 12,
+    },
+    statusBadge: {
+        paddingHorizontal: 10,
+        paddingVertical: 6,
+        borderRadius: 12,
+    },
+    statusText: {
+        fontSize: 11,
+        fontWeight: '600',
+    },
+    sampleInput: {
+        padding: 12,
+        borderRadius: 6,
+        borderWidth: 1,
+    },
+    sampleInputText: {
+        fontSize: 14,
+    },
+    themeSection: {
+        marginBottom: 24,
+    },
+    sectionTitle: {
+        fontSize: 20,
+        fontWeight: 'bold',
+        color: '#000',
+        marginBottom: 12,
+        paddingHorizontal: 4,
+    },
+});

package/dist/stories/index.d.ts

@@ -0,0 +1,2 @@
+import './ThemeStories';
+//# sourceMappingURL=index.d.ts.map

package/dist/stories/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"AACA,OAAO,gBAAgB,CAAC"}

package/dist/stories/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+// Import all stories
+require("./ThemeStories");

package/dist/theme-validation.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Theme validation utilities for checking contrast and accessibility
+ */
+import { ThemeColors } from './theme';
+export interface ContrastIssue {
+    property: string;
+    foreground: string;
+    background: string;
+    contrastRatio: number;
+    meetsAA: boolean;
+    meetsAAA: boolean;
+    suggestion?: string;
+}
+export interface ThemeValidationResult {
+    themeName: string;
+    issues: ContrastIssue[];
+    hasIssues: boolean;
+}
+/**
+ * Validate contrast for all text/background combinations in a theme
+ */
+export declare function validateThemeContrast(themeName: string, colors: ThemeColors): ThemeValidationResult;
+/**
+ * Validate all themes and return results
+ */
+export declare function validateAllThemes(themes: Record<string, ThemeColors>): ThemeValidationResult[];
+//# sourceMappingURL=theme-validation.d.ts.map

package/dist/theme-validation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-validation.d.ts","sourceRoot":"","sources":["../src/theme-validation.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,WAAW,GAClB,qBAAqB,CAgHvB;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GAAG,qBAAqB,EAAE,CAE9F"}

package/dist/theme-validation.js

@@ -0,0 +1,114 @@
+"use strict";
+/**
+ * Theme validation utilities for checking contrast and accessibility
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateThemeContrast = validateThemeContrast;
+exports.validateAllThemes = validateAllThemes;
+const color_utils_1 = require("./color-utils");
+/**
+ * Validate contrast for all text/background combinations in a theme
+ */
+function validateThemeContrast(themeName, colors) {
+    const issues = [];
+    // Check text on background
+    const textContrast = (0, color_utils_1.getContrastRatio)(colors.text, colors.background);
+    if (!(0, color_utils_1.meetsContrastRequirement)(colors.text, colors.background, 'AA')) {
+        issues.push({
+            property: 'text on background',
+            foreground: colors.text,
+            background: colors.background,
+            contrastRatio: textContrast,
+            meetsAA: false,
+            meetsAAA: (0, color_utils_1.meetsContrastRequirement)(colors.text, colors.background, 'AAA'),
+            suggestion: (0, color_utils_1.getContrastTextColor)(colors.background),
+        });
+    }
+    // Check cardText on card
+    const cardTextContrast = (0, color_utils_1.getContrastRatio)(colors.cardText, colors.card);
+    if (!(0, color_utils_1.meetsContrastRequirement)(colors.cardText, colors.card, 'AA')) {
+        issues.push({
+            property: 'cardText on card',
+            foreground: colors.cardText,
+            background: colors.card,
+            contrastRatio: cardTextContrast,
+            meetsAA: false,
+            meetsAAA: (0, color_utils_1.meetsContrastRequirement)(colors.cardText, colors.card, 'AAA'),
+            suggestion: (0, color_utils_1.getContrastTextColor)(colors.card),
+        });
+    }
+    // Check buttonText on button
+    const buttonTextContrast = (0, color_utils_1.getContrastRatio)(colors.buttonText, colors.button);
+    if (!(0, color_utils_1.meetsContrastRequirement)(colors.buttonText, colors.button, 'AA')) {
+        issues.push({
+            property: 'buttonText on button',
+            foreground: colors.buttonText,
+            background: colors.button,
+            contrastRatio: buttonTextContrast,
+            meetsAA: false,
+            meetsAAA: (0, color_utils_1.meetsContrastRequirement)(colors.buttonText, colors.button, 'AAA'),
+            suggestion: (0, color_utils_1.getContrastTextColor)(colors.button),
+        });
+    }
+    // Check buttonSecondaryText on buttonSecondary
+    const buttonSecondaryTextContrast = (0, color_utils_1.getContrastRatio)(colors.buttonSecondaryText, colors.buttonSecondary);
+    if (!(0, color_utils_1.meetsContrastRequirement)(colors.buttonSecondaryText, colors.buttonSecondary, 'AA')) {
+        issues.push({
+            property: 'buttonSecondaryText on buttonSecondary',
+            foreground: colors.buttonSecondaryText,
+            background: colors.buttonSecondary,
+            contrastRatio: buttonSecondaryTextContrast,
+            meetsAA: false,
+            meetsAAA: (0, color_utils_1.meetsContrastRequirement)(colors.buttonSecondaryText, colors.buttonSecondary, 'AAA'),
+            suggestion: (0, color_utils_1.getContrastTextColor)(colors.buttonSecondary),
+        });
+    }
+    // Check inputText on input
+    const inputTextContrast = (0, color_utils_1.getContrastRatio)(colors.inputText, colors.input);
+    if (!(0, color_utils_1.meetsContrastRequirement)(colors.inputText, colors.input, 'AA')) {
+        issues.push({
+            property: 'inputText on input',
+            foreground: colors.inputText,
+            background: colors.input,
+            contrastRatio: inputTextContrast,
+            meetsAA: false,
+            meetsAAA: (0, color_utils_1.meetsContrastRequirement)(colors.inputText, colors.input, 'AAA'),
+            suggestion: (0, color_utils_1.getContrastTextColor)(colors.input),
+        });
+    }
+    // Check status colors with white text (common pattern)
+    const statusColors = [
+        { name: 'success', color: colors.success },
+        { name: 'warning', color: colors.warning },
+        { name: 'error', color: colors.error },
+        { name: 'info', color: colors.info },
+    ];
+    statusColors.forEach(({ name, color }) => {
+        const whiteContrast = (0, color_utils_1.getContrastRatio)('#FFFFFF', color);
+        const blackContrast = (0, color_utils_1.getContrastRatio)('#000000', color);
+        const bestText = whiteContrast > blackContrast ? '#FFFFFF' : '#000000';
+        const bestContrast = Math.max(whiteContrast, blackContrast);
+        if (!(0, color_utils_1.meetsContrastRequirement)(bestText, color, 'AA')) {
+            issues.push({
+                property: `text on ${name}`,
+                foreground: bestText,
+                background: color,
+                contrastRatio: bestContrast,
+                meetsAA: false,
+                meetsAAA: (0, color_utils_1.meetsContrastRequirement)(bestText, color, 'AAA'),
+                suggestion: (0, color_utils_1.getContrastTextColor)(color),
+            });
+        }
+    });
+    return {
+        themeName,
+        issues,
+        hasIssues: issues.length > 0,
+    };
+}
+/**
+ * Validate all themes and return results
+ */
+function validateAllThemes(themes) {
+    return Object.entries(themes).map(([name, colors]) => validateThemeContrast(name, colors));
+}

package/dist/theme.d.ts

@@ -2,7 +2,7 @@
  * Theme system with theme families that have light and dark variants
  * Each theme family has both a light and dark mode
  */
-export type ThemeFamily = 'system' | 'neon-surf' | 'pink-purple' | 'pastel' | 'github' | 'high-contrast' | 'solarized' | 'dark-plus';
+export type ThemeFamily = 'cosmic-orchid' | 'cotton-candy' | 'cyber-amethyst' | 'dark-plus' | 'desert-sunset' | 'high-contrast' | 'midnight-forest' | 'neon-surf' | 'solarized' | 'system';
 export type ThemeVariant = 'light' | 'dark';
 export type ThemeName = `${ThemeFamily}-${ThemeVariant}` | 'system';
 export type ActualThemeName = Exclude<ThemeName, 'system'>;
@@ -30,6 +30,21 @@ export interface ThemeColors {
     primary: string;
     secondary: string;
     muted: string;
+    accent1: string;
+    accent1Light: string;
+    accent1Dark: string;
+    accent2: string;
+    accent2Light: string;
+    accent2Dark: string;
+    accent3: string;
+    accent3Light: string;
+    accent3Dark: string;
+    accent4: string;
+    accent4Light: string;
+    accent4Dark: string;
+    accent5: string;
+    accent5Light: string;
+    accent5Dark: string;
 }
 export declare const Themes: Record<ActualThemeName, ThemeColors>;
 export declare const Colors: {

package/dist/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,MAAM,MAAM,WAAW,GACnB,QAAQ,GACR,WAAW,GACX,aAAa,GACb,QAAQ,GACR,QAAQ,GACR,eAAe,GACf,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,SAAS,GAAG,GAAG,WAAW,IAAI,YAAY,EAAE,GAAG,QAAQ,CAAC;AAEpE,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;AAE3D,MAAM,WAAW,WAAW;IAE1B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IAExB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IAEb,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,MAAM,EAAE,MAAM,CAAC,eAAe,EAAE,WAAW,CAyZvD,CAAC;AAGF,eAAO,MAAM,MAAM;;;CAGlB,CAAC;AAEF,eAAO,MAAM,KAAK;IAEd,gDAAgD;;IAEhD,8CAA8C;;IAE9C,gDAAgD;;IAEhD,mDAAmD;;CAerD,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,MAAM,MAAM,WAAW,GACnB,eAAe,GACf,cAAc,GACd,gBAAgB,GAChB,WAAW,GACX,eAAe,GACf,eAAe,GACf,iBAAiB,GACjB,WAAW,GACX,WAAW,GACX,QAAQ,CAAC;AAEb,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,SAAS,GAAG,GAAG,WAAW,IAAI,YAAY,EAAE,GAAG,QAAQ,CAAC;AAEpE,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;AAE3D,MAAM,WAAW,WAAW;IAE1B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IAExB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IAEb,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,MAAM,EAAE,MAAM,CAAC,eAAe,EAAE,WAAW,CA+rBvD,CAAC;AAGF,eAAO,MAAM,MAAM;;;CAGlB,CAAC;AAEF,eAAO,MAAM,KAAK;IAEd,gDAAgD;;IAEhD,8CAA8C;;IAE9C,gDAAgD;;IAEhD,mDAAmD;;CAerD,CAAC"}