fiboui 1.0.1 → 2.0.0

package/src/theme/cupertino.ts

@@ -1,85 +0,0 @@
-import { FiboTheme } from './types';
-
-export const cupertinoTheme: FiboTheme = {
-  name: 'cupertino',
-  colors: {
-    primary: '#007AFF',
-    secondary: '#AF52DE',
-    background: '#FFFFFF',
-    surface: '#F2F2F7',
-    error: '#FF3B30',
-    success: '#34C759',
-    warning: '#FF9500',
-    info: '#5AC8FA',
-    onPrimary: '#FFFFFF',
-    onSecondary: '#FFFFFF',
-    onBackground: '#000000',
-    onSurface: '#000000',
-    onError: '#FFFFFF',
-  },
-  typography: {
-    h1: {
-      fontSize: '34px',
-      fontWeight: 700,
-      letterSpacing: '0.37px',
-    },
-    h2: {
-      fontSize: '28px',
-      fontWeight: 700,
-      letterSpacing: '0.36px',
-    },
-    h3: {
-      fontSize: '22px',
-      fontWeight: 600,
-      letterSpacing: '0.35px',
-    },
-    h4: {
-      fontSize: '20px',
-      fontWeight: 600,
-    },
-    h5: {
-      fontSize: '17px',
-      fontWeight: 600,
-      letterSpacing: '-0.41px',
-    },
-    h6: {
-      fontSize: '15px',
-      fontWeight: 600,
-      letterSpacing: '-0.24px',
-    },
-    body: {
-      fontSize: '17px',
-      fontWeight: 400,
-      letterSpacing: '-0.41px',
-    },
-    caption: {
-      fontSize: '13px',
-      fontWeight: 400,
-      letterSpacing: '-0.08px',
-    },
-    label: {
-      fontSize: '15px',
-      fontWeight: 500,
-      letterSpacing: '-0.24px',
-    },
-  },
-  spacing: {
-    xs: '4px',
-    sm: '8px',
-    md: '12px',
-    lg: '20px',
-    xl: '32px',
-  },
-  borderRadius: {
-    sm: '8px',
-    md: '12px',
-    lg: '20px',
-    full: '9999px',
-  },
-  shadows: {
-    sm: '0 1px 3px rgba(0,0,0,0.08)',
-    md: '0 2px 8px rgba(0,0,0,0.1)',
-    lg: '0 4px 16px rgba(0,0,0,0.12)',
-  },
-  fontFamily: '-apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif',
-};

package/src/theme/index.ts

@@ -1,5 +0,0 @@
-export * from './types';
-export * from './material';
-export * from './cupertino';
-export * from './web';
-export * from './provider';

package/src/theme/material.ts

@@ -1,86 +0,0 @@
-import { FiboTheme } from './types';
-
-export const materialTheme: FiboTheme = {
-  name: 'material',
-  colors: {
-    primary: '#6200EE',
-    primaryVariant: '#3700B3',
-    secondary: '#03DAC6',
-    secondaryVariant: '#018786',
-    background: '#FFFFFF',
-    surface: '#FFFFFF',
-    error: '#B00020',
-    success: '#4CAF50',
-    warning: '#FF9800',
-    info: '#2196F3',
-    onPrimary: '#FFFFFF',
-    onSecondary: '#000000',
-    onBackground: '#000000',
-    onSurface: '#000000',
-    onError: '#FFFFFF',
-  },
-  typography: {
-    h1: {
-      fontSize: '96px',
-      fontWeight: 300,
-      letterSpacing: '-1.5px',
-    },
-    h2: {
-      fontSize: '60px',
-      fontWeight: 300,
-      letterSpacing: '-0.5px',
-    },
-    h3: {
-      fontSize: '48px',
-      fontWeight: 400,
-    },
-    h4: {
-      fontSize: '34px',
-      fontWeight: 400,
-      letterSpacing: '0.25px',
-    },
-    h5: {
-      fontSize: '24px',
-      fontWeight: 400,
-    },
-    h6: {
-      fontSize: '20px',
-      fontWeight: 500,
-      letterSpacing: '0.15px',
-    },
-    body: {
-      fontSize: '16px',
-      fontWeight: 400,
-      letterSpacing: '0.5px',
-    },
-    caption: {
-      fontSize: '12px',
-      fontWeight: 400,
-      letterSpacing: '0.4px',
-    },
-    label: {
-      fontSize: '14px',
-      fontWeight: 500,
-      letterSpacing: '1.25px',
-    },
-  },
-  spacing: {
-    xs: '4px',
-    sm: '8px',
-    md: '16px',
-    lg: '24px',
-    xl: '32px',
-  },
-  borderRadius: {
-    sm: '4px',
-    md: '8px',
-    lg: '16px',
-    full: '9999px',
-  },
-  shadows: {
-    sm: '0 2px 4px rgba(0,0,0,0.1)',
-    md: '0 4px 8px rgba(0,0,0,0.12)',
-    lg: '0 8px 16px rgba(0,0,0,0.14)',
-  },
-  fontFamily: 'Roboto, sans-serif',
-};

package/src/theme/provider.tsx

@@ -1,76 +0,0 @@
-import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
-import { FiboTheme } from './types';
-import { FiboThemeName } from '../core/types';
-import { materialTheme } from './material';
-import { cupertinoTheme } from './cupertino';
-import { webTheme } from './web';
-
-interface FiboThemeContextValue {
-  theme: FiboTheme;
-  themeName: FiboThemeName;
-  setTheme: (name: FiboThemeName) => void;
-}
-
-const FiboThemeContext = createContext<FiboThemeContextValue | undefined>(undefined);
-
-const themes: Record<FiboThemeName, FiboTheme> = {
-  material: materialTheme,
-  cupertino: cupertinoTheme,
-  web: webTheme,
-};
-
-interface FiboThemeProviderProps {
-  theme?: FiboThemeName;
-  children: ReactNode;
-}
-
-export function FiboThemeProvider({ 
-  theme: initialTheme = 'material', 
-  children 
-}: FiboThemeProviderProps) {
-  const [themeName, setThemeName] = useState<FiboThemeName>(initialTheme);
-  const [theme, setThemeObject] = useState<FiboTheme>(themes[initialTheme]);
-
-  useEffect(() => {
-    const newTheme = themes[themeName];
-    setThemeObject(newTheme);
-    
-    if (typeof document !== 'undefined') {
-      const root = document.documentElement;
-      
-      
-      root.classList.remove('fibo-theme-material', 'fibo-theme-cupertino', 'fibo-theme-web');
-      
-      
-      root.classList.add(`fibo-theme-${themeName}`);
-      
-      
-      root.style.setProperty('--fibo-primary', newTheme.colors.primary);
-      root.style.setProperty('--fibo-secondary', newTheme.colors.secondary);
-      root.style.setProperty('--fibo-background', newTheme.colors.background);
-      root.style.setProperty('--fibo-surface', newTheme.colors.surface);
-      root.style.setProperty('--fibo-error', newTheme.colors.error);
-      root.style.setProperty('--fibo-font-family', newTheme.fontFamily);
-    }
-  }, [themeName]);
-
-  const value: FiboThemeContextValue = {
-    theme,
-    themeName,
-    setTheme: setThemeName,
-  };
-
-  return (
-    <FiboThemeContext.Provider value={value}>
-      {children}
-    </FiboThemeContext.Provider>
-  );
-}
-
-export function useFiboTheme(): FiboThemeContextValue {
-  const context = useContext(FiboThemeContext);
-  if (!context) {
-    throw new Error('useFiboTheme must be used within a FiboThemeProvider');
-  }
-  return context;
-}

package/src/theme/types.ts

@@ -1,62 +0,0 @@
-import { FiboThemeName, TextStyle } from '../core/types';
-
-export interface ThemeColors {
-  primary: string;
-  primaryVariant?: string;
-  secondary: string;
-  secondaryVariant?: string;
-  background: string;
-  surface: string;
-  error: string;
-  success?: string;
-  warning?: string;
-  info?: string;
-  onPrimary: string;
-  onSecondary: string;
-  onBackground: string;
-  onSurface: string;
-  onError: string;
-}
-
-export interface ThemeTypography {
-  h1: TextStyle;
-  h2: TextStyle;
-  h3: TextStyle;
-  h4: TextStyle;
-  h5: TextStyle;
-  h6: TextStyle;
-  body: TextStyle;
-  caption: TextStyle;
-  label: TextStyle;
-}
-
-export interface ThemeSpacing {
-  xs: string;
-  sm: string;
-  md: string;
-  lg: string;
-  xl: string;
-}
-
-export interface ThemeBorderRadius {
-  sm: string;
-  md: string;
-  lg: string;
-  full: string;
-}
-
-export interface ThemeShadows {
-  sm: string;
-  md: string;
-  lg: string;
-}
-
-export interface FiboTheme {
-  name: FiboThemeName;
-  colors: ThemeColors;
-  typography: ThemeTypography;
-  spacing: ThemeSpacing;
-  borderRadius: ThemeBorderRadius;
-  shadows: ThemeShadows;
-  fontFamily: string;
-}

package/src/theme/web.ts

@@ -1,82 +0,0 @@
-import { FiboTheme } from './types';
-
-export const webTheme: FiboTheme = {
-  name: 'web',
-  colors: {
-    primary: '#3B82F6',
-    secondary: '#8B5CF6',
-    background: '#FFFFFF',
-    surface: '#F9FAFB',
-    error: '#EF4444',
-    success: '#10B981',
-    warning: '#F59E0B',
-    info: '#06B6D4',
-    onPrimary: '#FFFFFF',
-    onSecondary: '#FFFFFF',
-    onBackground: '#111827',
-    onSurface: '#374151',
-    onError: '#FFFFFF',
-  },
-  typography: {
-    h1: {
-      fontSize: '60px',
-      fontWeight: 800,
-      letterSpacing: '-0.02em',
-    },
-    h2: {
-      fontSize: '48px',
-      fontWeight: 700,
-      letterSpacing: '-0.01em',
-    },
-    h3: {
-      fontSize: '36px',
-      fontWeight: 700,
-    },
-    h4: {
-      fontSize: '30px',
-      fontWeight: 600,
-    },
-    h5: {
-      fontSize: '24px',
-      fontWeight: 600,
-    },
-    h6: {
-      fontSize: '20px',
-      fontWeight: 600,
-    },
-    body: {
-      fontSize: '16px',
-      fontWeight: 400,
-      lineHeight: '1.5',
-    },
-    caption: {
-      fontSize: '14px',
-      fontWeight: 400,
-      lineHeight: '1.4',
-    },
-    label: {
-      fontSize: '14px',
-      fontWeight: 500,
-      letterSpacing: '0.01em',
-    },
-  },
-  spacing: {
-    xs: '4px',
-    sm: '8px',
-    md: '16px',
-    lg: '24px',
-    xl: '32px',
-  },
-  borderRadius: {
-    sm: '6px',
-    md: '8px',
-    lg: '12px',
-    full: '9999px',
-  },
-  shadows: {
-    sm: '0 1px 2px rgba(0,0,0,0.05)',
-    md: '0 4px 6px rgba(0,0,0,0.07)',
-    lg: '0 10px 15px rgba(0,0,0,0.1)',
-  },
-  fontFamily: 'Inter, system-ui, sans-serif',
-};