@fastwork/xosmoz-theme 0.0.3

package/dist/index-B3oQ5FIa.d.ts

@@ -0,0 +1,259 @@
+/**
+ * Theme type definitions
+ */
+interface ColorToken {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    1000?: string;
+    1100?: string;
+}
+interface ThemeColors {
+    primary: ColorToken;
+    neutral: ColorToken;
+    green: ColorToken;
+    yellow: ColorToken;
+    red: ColorToken;
+    orange: ColorToken;
+    purple: ColorToken;
+    cyan: ColorToken;
+    'black-alpha': ColorToken;
+    'white-alpha': ColorToken;
+}
+interface TypographyScale {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    1000: string;
+    1100: string;
+    1200: string;
+    1300: string;
+    1400: string;
+    1500: string;
+    1600: string;
+}
+interface FontWeights {
+    100: number;
+    200: number;
+    300: number;
+    400: number;
+    500: number;
+    600: number;
+    700: number;
+    800: number;
+    900: number;
+}
+interface TypographyToken {
+    fontFamily: string;
+    fontSize: {
+        desktop: string;
+        mobile: string;
+    };
+    fontWeight: number;
+}
+interface HeadingTokens {
+    h1: TypographyToken;
+    h2: TypographyToken;
+    h3: TypographyToken;
+    h4: TypographyToken;
+    h5: TypographyToken;
+    h6: TypographyToken;
+}
+interface TitleTokens {
+    title1: TypographyToken;
+    title2: TypographyToken;
+    title3: TypographyToken;
+    title4: TypographyToken;
+}
+interface SubtitleTokens {
+    subtitle1Bold: TypographyToken;
+    subtitle1Regular: TypographyToken;
+    subtitle2Bold: TypographyToken;
+    subtitle2Regular: TypographyToken;
+    subtitle3Bold: TypographyToken;
+    subtitle3Regular: TypographyToken;
+}
+interface BodyTokens {
+    body1: TypographyToken;
+    body2: TypographyToken;
+    body3: TypographyToken;
+    body4: TypographyToken;
+}
+interface SpacingScale {
+    0: string;
+    px: string;
+    0.5: string;
+    1: string;
+    1.5: string;
+    2: string;
+    2.5: string;
+    3: string;
+    3.5: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    11: string;
+    12: string;
+    14: string;
+    16: string;
+    20: string;
+    24: string;
+    28: string;
+    32: string;
+    36: string;
+    40: string;
+    44: string;
+    48: string;
+    52: string;
+    56: string;
+    60: string;
+    64: string;
+    72: string;
+    80: string;
+    96: string;
+}
+interface BorderRadius {
+    none: string;
+    sm: string;
+    base: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    '3xl': string;
+    full: string;
+}
+interface Shadows {
+    xs: string;
+    sm: string;
+    base: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    inner: string;
+    none: string;
+}
+interface Theme {
+    colors: ThemeColors;
+    typography: {
+        fontSize: TypographyScale;
+        fontWeight: FontWeights;
+        fontFamily: {
+            primary: string;
+            secondary: string;
+        };
+        lineHeight: {
+            '100pct': string;
+            '125pct': string;
+            '135pct': string;
+            '150pct': string;
+            '165pct': string;
+            '200pct': string;
+        };
+        headings: HeadingTokens;
+        titles: TitleTokens;
+        subtitles: SubtitleTokens;
+        body: BodyTokens;
+    };
+    spacing: SpacingScale;
+    borderRadius: BorderRadius;
+    shadows: Shadows;
+}
+
+/**
+ * Color design tokens
+ */
+
+declare const primary: ColorToken;
+declare const neutral: ColorToken;
+declare const green: ColorToken;
+declare const yellow: ColorToken;
+declare const red: ColorToken;
+declare const orange: ColorToken;
+declare const purple: ColorToken;
+declare const cyan: ColorToken;
+declare const blackAlpha: ColorToken;
+declare const whiteAlpha: ColorToken;
+declare const colors: ThemeColors;
+
+/**
+ * Typography design tokens
+ */
+
+declare const fontSize: TypographyScale;
+declare const fontWeight: FontWeights;
+declare const fontFamily: {
+    primary: string;
+    secondary: string;
+};
+declare const lineHeight: {
+    '100pct': string;
+    '125pct': string;
+    '135pct': string;
+    '150pct': string;
+    '165pct': string;
+    '200pct': string;
+};
+declare const headings: HeadingTokens;
+declare const titles: TitleTokens;
+declare const subtitles: SubtitleTokens;
+declare const body: BodyTokens;
+declare const typography: {
+    fontSize: TypographyScale;
+    fontWeight: FontWeights;
+    fontFamily: {
+        primary: string;
+        secondary: string;
+    };
+    lineHeight: {
+        '100pct': string;
+        '125pct': string;
+        '135pct': string;
+        '150pct': string;
+        '165pct': string;
+        '200pct': string;
+    };
+    headings: HeadingTokens;
+    titles: TitleTokens;
+    subtitles: SubtitleTokens;
+    body: BodyTokens;
+};
+
+/**
+ * Spacing design tokens
+ */
+
+declare const spacing: SpacingScale;
+
+/**
+ * Shadow design tokens
+ */
+
+declare const shadows: Shadows;
+
+/**
+ * Border radius design tokens
+ */
+
+declare const borderRadius: BorderRadius;
+
+export { type TitleTokens as A, type BodyTokens as B, type ColorToken as C, type SpacingScale as D, type BorderRadius as E, type FontWeights as F, type Shadows as G, type HeadingTokens as H, type SubtitleTokens as S, type Theme as T, purple as a, blackAlpha as b, cyan as c, colors as d, fontWeight as e, fontSize as f, green as g, fontFamily as h, headings as i, body as j, typography as k, lineHeight as l, spacing as m, neutral as n, orange as o, primary as p, shadows as q, red as r, subtitles as s, titles as t, borderRadius as u, type ThemeColors as v, whiteAlpha as w, type TypographyScale as x, yellow as y, type TypographyToken as z };

package/dist/index.d.mts

@@ -0,0 +1,109 @@
+import { T as Theme } from './index-B3oQ5FIa.mjs';
+export { B as BodyTokens, E as BorderRadius, C as ColorToken, F as FontWeights, H as HeadingTokens, G as Shadows, D as SpacingScale, S as SubtitleTokens, v as ThemeColors, A as TitleTokens, x as TypographyScale, z as TypographyToken, b as blackAlpha, j as body, u as borderRadius, d as colors, c as cyan, h as fontFamily, f as fontSize, e as fontWeight, g as green, i as headings, l as lineHeight, n as neutral, o as orange, p as primary, a as purple, r as red, q as shadows, m as spacing, s as subtitles, t as titles, k as typography, w as whiteAlpha, y as yellow } from './index-B3oQ5FIa.mjs';
+
+/**
+ * Theme configuration
+ */
+
+declare const defaultTheme: Theme;
+/**
+ * Create a custom theme by merging with the default theme
+ */
+declare function createTheme(overrides?: Partial<Theme>): Theme;
+/**
+ * Generate CSS custom properties from theme
+ */
+declare function themeToCSSVariables(theme: Theme): Record<string, string>;
+/**
+ * Generate CSS string from theme
+ */
+declare function generateCSSVariables(theme?: Theme): string;
+
+/**
+ * Theme configuration types
+ */
+interface ThemeConfig {
+    name: string;
+    colors: {
+        background: string;
+        foreground: string;
+        muted: string;
+        mutedForeground: string;
+        border: string;
+        input: string;
+        ring: string;
+        card: string;
+        cardForeground: string;
+        popover: string;
+        popoverForeground: string;
+        primary: string;
+        primaryForeground: string;
+        secondary: string;
+        secondaryForeground: string;
+        accent: string;
+        accentForeground: string;
+        destructive: string;
+        destructiveForeground: string;
+        success: string;
+        successForeground: string;
+        warning: string;
+        warningForeground: string;
+        info: string;
+        infoForeground: string;
+    };
+}
+type ThemeName = 'light' | 'dark' | 'cyberpunk' | 'forest' | 'ocean';
+type ThemeRegistry = Record<ThemeName, ThemeConfig>;
+
+/**
+ * Light theme configuration
+ */
+
+declare const lightTheme: ThemeConfig;
+
+/**
+ * Dark theme configuration
+ */
+
+declare const darkTheme: ThemeConfig;
+
+/**
+ * Cyberpunk theme - Neon colors on dark background
+ */
+
+declare const cyberpunkTheme: ThemeConfig;
+
+/**
+ * Forest theme - Natural greens and earthy tones
+ */
+
+declare const forestTheme: ThemeConfig;
+
+/**
+ * Ocean theme - Deep blues and aqua tones
+ */
+
+declare const oceanTheme: ThemeConfig;
+
+/**
+ * Theme registry and exports
+ */
+
+/**
+ * All available predefined themes
+ */
+declare const themes: ThemeRegistry;
+/**
+ * Get a theme by name
+ */
+declare function getTheme(name: ThemeName): ThemeConfig;
+/**
+ * Get all theme names
+ */
+declare function getThemeNames(): ThemeName[];
+/**
+ * Create a custom theme
+ */
+declare function createCustomTheme(name: string, colors: Partial<ThemeConfig['colors']>, baseTheme?: ThemeName): ThemeConfig;
+
+export { Theme, type ThemeConfig, type ThemeName, type ThemeRegistry, createCustomTheme, createTheme, cyberpunkTheme, darkTheme, defaultTheme, forestTheme, generateCSSVariables, getTheme, getThemeNames, lightTheme, oceanTheme, themeToCSSVariables, themes };

package/dist/index.d.ts

@@ -0,0 +1,109 @@
+import { T as Theme } from './index-B3oQ5FIa.js';
+export { B as BodyTokens, E as BorderRadius, C as ColorToken, F as FontWeights, H as HeadingTokens, G as Shadows, D as SpacingScale, S as SubtitleTokens, v as ThemeColors, A as TitleTokens, x as TypographyScale, z as TypographyToken, b as blackAlpha, j as body, u as borderRadius, d as colors, c as cyan, h as fontFamily, f as fontSize, e as fontWeight, g as green, i as headings, l as lineHeight, n as neutral, o as orange, p as primary, a as purple, r as red, q as shadows, m as spacing, s as subtitles, t as titles, k as typography, w as whiteAlpha, y as yellow } from './index-B3oQ5FIa.js';
+
+/**
+ * Theme configuration
+ */
+
+declare const defaultTheme: Theme;
+/**
+ * Create a custom theme by merging with the default theme
+ */
+declare function createTheme(overrides?: Partial<Theme>): Theme;
+/**
+ * Generate CSS custom properties from theme
+ */
+declare function themeToCSSVariables(theme: Theme): Record<string, string>;
+/**
+ * Generate CSS string from theme
+ */
+declare function generateCSSVariables(theme?: Theme): string;
+
+/**
+ * Theme configuration types
+ */
+interface ThemeConfig {
+    name: string;
+    colors: {
+        background: string;
+        foreground: string;
+        muted: string;
+        mutedForeground: string;
+        border: string;
+        input: string;
+        ring: string;
+        card: string;
+        cardForeground: string;
+        popover: string;
+        popoverForeground: string;
+        primary: string;
+        primaryForeground: string;
+        secondary: string;
+        secondaryForeground: string;
+        accent: string;
+        accentForeground: string;
+        destructive: string;
+        destructiveForeground: string;
+        success: string;
+        successForeground: string;
+        warning: string;
+        warningForeground: string;
+        info: string;
+        infoForeground: string;
+    };
+}
+type ThemeName = 'light' | 'dark' | 'cyberpunk' | 'forest' | 'ocean';
+type ThemeRegistry = Record<ThemeName, ThemeConfig>;
+
+/**
+ * Light theme configuration
+ */
+
+declare const lightTheme: ThemeConfig;
+
+/**
+ * Dark theme configuration
+ */
+
+declare const darkTheme: ThemeConfig;
+
+/**
+ * Cyberpunk theme - Neon colors on dark background
+ */
+
+declare const cyberpunkTheme: ThemeConfig;
+
+/**
+ * Forest theme - Natural greens and earthy tones
+ */
+
+declare const forestTheme: ThemeConfig;
+
+/**
+ * Ocean theme - Deep blues and aqua tones
+ */
+
+declare const oceanTheme: ThemeConfig;
+
+/**
+ * Theme registry and exports
+ */
+
+/**
+ * All available predefined themes
+ */
+declare const themes: ThemeRegistry;
+/**
+ * Get a theme by name
+ */
+declare function getTheme(name: ThemeName): ThemeConfig;
+/**
+ * Get all theme names
+ */
+declare function getThemeNames(): ThemeName[];
+/**
+ * Create a custom theme
+ */
+declare function createCustomTheme(name: string, colors: Partial<ThemeConfig['colors']>, baseTheme?: ThemeName): ThemeConfig;
+
+export { Theme, type ThemeConfig, type ThemeName, type ThemeRegistry, createCustomTheme, createTheme, cyberpunkTheme, darkTheme, defaultTheme, forestTheme, generateCSSVariables, getTheme, getThemeNames, lightTheme, oceanTheme, themeToCSSVariables, themes };