@oxyhq/services 19.0.0 → 19.1.0

package/src/ui/components/feedback/ProgressIndicator.tsx

@@ -1,35 +0,0 @@
-import React from 'react';
-import { View } from 'react-native';
-import type { FeedbackColors } from './types';
-
-interface ProgressIndicatorProps {
-    currentStep: number;
-    totalSteps: number;
-    colors: FeedbackColors;
-    styles: any;
-}
-
-const ProgressIndicator: React.FC<ProgressIndicatorProps> = React.memo(({
-    currentStep,
-    totalSteps,
-    colors,
-    styles,
-}) => (
-    <View style={styles.progressContainer} accessibilityRole="progressbar" accessibilityLabel={`Step ${currentStep + 1} of ${totalSteps}`}>
-        {Array.from({ length: totalSteps }, (_, index) => (
-            <View
-                key={index}
-                style={[
-                    styles.progressDot,
-                    currentStep === index ?
-                        { backgroundColor: colors.primary, width: 24 } :
-                        { backgroundColor: colors.border }
-                ]}
-            />
-        ))}
-    </View>
-));
-
-ProgressIndicator.displayName = 'ProgressIndicator';
-
-export default ProgressIndicator;

package/src/ui/components/icon/OxyIcon.tsx

@@ -1,31 +0,0 @@
-import type React from 'react';
-import { Ionicons } from '@expo/vector-icons';
-import { useTheme } from '@oxyhq/bloom/theme';
-
-export interface IconProps {
-  name: string;
-  size?: number;
-  color?: string;
-  style?: Record<string, unknown>;
-}
-
-const OxyIcon: React.FC<IconProps> = ({
-  name,
-  size = 24,
-  color,
-  style
-}) => {
-  const theme = useTheme();
-  const resolvedColor = color ?? theme.colors.icon;
-
-  return (
-    <Ionicons
-      name={name as React.ComponentProps<typeof Ionicons>['name']}
-      size={size}
-      color={resolvedColor}
-      style={style}
-    />
-  );
-};
-
-export default OxyIcon;

package/src/ui/components/theming.tsx

@@ -1,126 +0,0 @@
-import { useTheme } from '@oxyhq/bloom/theme';
-import { getTheme } from '../styles/theme';
-import type { InternalTheme } from './types';
-
-/**
- * Adapter to convert services theming to react-native-paper's InternalTheme format
- */
-export const useInternalTheme = (
-  themeOverrides?: Partial<InternalTheme> & { dark?: boolean } | 'light' | 'dark'
-): InternalTheme => {
-  // Handle string theme prop (for compatibility with services theme system)
-  let theme: 'light' | 'dark' = 'light';
-  if (typeof themeOverrides === 'string') {
-    theme = themeOverrides;
-  } else if (themeOverrides && typeof themeOverrides === 'object' && themeOverrides.dark) {
-    theme = 'dark';
-  }
-
-  const bloomTheme = useTheme();
-  const colors = {
-    text: bloomTheme.colors.text,
-    background: bloomTheme.colors.background,
-    inputBackground: bloomTheme.colors.backgroundSecondary,
-    placeholder: bloomTheme.colors.textTertiary,
-    primary: bloomTheme.colors.primary,
-    border: bloomTheme.colors.border,
-    error: bloomTheme.colors.error,
-    success: bloomTheme.colors.success,
-    warning: bloomTheme.colors.warning,
-    secondaryText: bloomTheme.colors.textSecondary,
-  };
-  const themeObj = getTheme(theme);
-
-  // Create InternalTheme compatible object
-  const internalTheme: InternalTheme = {
-    version: 3,
-    isV3: true,
-    dark: theme === 'dark',
-    mode: 'adaptive',
-    roundness: 10,
-    animation: {
-      scale: 1,
-    },
-    colors: {
-      primary: colors.primary,
-      primaryContainer: `${colors.primary}20`,
-      secondary: colors.secondaryText,
-      secondaryContainer: `${colors.secondaryText}20`,
-      tertiary: colors.primary,
-      tertiaryContainer: `${colors.primary}20`,
-      surface: colors.background,
-      surfaceVariant: colors.inputBackground,
-      surfaceDisabled: `${colors.secondaryText}40`,
-      background: colors.background,
-      error: colors.error,
-      errorContainer: `${colors.error}20`,
-      onPrimary: '#FFFFFF',
-      onPrimaryContainer: colors.primary,
-      onSecondary: '#FFFFFF',
-      onSecondaryContainer: colors.secondaryText,
-      onTertiary: '#FFFFFF',
-      onTertiaryContainer: colors.primary,
-      onSurface: colors.text,
-      onSurfaceVariant: colors.secondaryText,
-      onSurfaceDisabled: `${colors.secondaryText}60`,
-      onError: '#FFFFFF',
-      onErrorContainer: colors.error,
-      onBackground: colors.text,
-      outline: colors.border,
-      outlineVariant: `${colors.border}80`,
-      inverseSurface: theme === 'dark' ? '#FFFFFF' : '#000000',
-      inverseOnSurface: theme === 'dark' ? '#000000' : '#FFFFFF',
-      inversePrimary: colors.primary,
-      shadow: '#000000',
-      scrim: '#000000',
-      backdrop: '#00000080',
-      elevation: {
-        level0: 'transparent',
-        level1: theme === 'dark' ? '#1E1E1E' : '#F5F5F5',
-        level2: theme === 'dark' ? '#2A2A2A' : '#EEEEEE',
-        level3: theme === 'dark' ? '#363636' : '#E0E0E0',
-        level4: theme === 'dark' ? '#404040' : '#D5D5D5',
-        level5: theme === 'dark' ? '#4A4A4A' : '#CCCCCC',
-      },
-    },
-    fonts: {
-      displayLarge: themeObj.fonts.title,
-      displayMedium: themeObj.fonts.title,
-      displaySmall: themeObj.fonts.title,
-      headlineLarge: themeObj.fonts.title,
-      headlineMedium: themeObj.fonts.title,
-      headlineSmall: themeObj.fonts.title,
-      titleLarge: themeObj.fonts.title,
-      titleMedium: themeObj.fonts.title,
-      titleSmall: themeObj.fonts.title,
-      labelLarge: themeObj.fonts.label,
-      labelMedium: themeObj.fonts.label,
-      labelSmall: themeObj.fonts.label,
-      bodyLarge: themeObj.fonts.body,
-      bodyMedium: themeObj.fonts.body,
-      bodySmall: themeObj.fonts.body,
-      default: {
-        fontWeight: themeObj.fonts.body.fontWeight || 'normal',
-        letterSpacing: 0,
-      },
-    },
-  };
-
-  // Merge with overrides if provided (only if it's an object, not a string)
-  if (themeOverrides && typeof themeOverrides === 'object') {
-    return {
-      ...internalTheme,
-      ...themeOverrides,
-      colors: {
-        ...internalTheme.colors,
-        ...(themeOverrides.colors || {}),
-      },
-      fonts: {
-        ...internalTheme.fonts,
-        ...(themeOverrides.fonts || {}),
-      },
-    } as InternalTheme;
-  }
-
-  return internalTheme;
-};

package/src/ui/components/types.tsx

@@ -1,93 +0,0 @@
-import type { TextStyle } from 'react-native';
-
-// Types for react-native-paper compatibility
-// Support both string theme ('light' | 'dark') and InternalTheme object
-export type ThemeProp = Partial<InternalTheme> | 'light' | 'dark';
-
-export type MD3Elevation = 0 | 1 | 2 | 3 | 4 | 5;
-
-export type InternalTheme = {
-  version: 3;
-  isV3: true;
-  dark: boolean;
-  mode?: 'adaptive' | 'exact';
-  roundness: number;
-  animation: {
-    scale: number;
-    defaultAnimationDuration?: number;
-  };
-  colors: {
-    primary: string;
-    primaryContainer: string;
-    secondary: string;
-    secondaryContainer: string;
-    tertiary: string;
-    tertiaryContainer: string;
-    surface: string;
-    surfaceVariant: string;
-    surfaceDisabled: string;
-    background: string;
-    error: string;
-    errorContainer: string;
-    onPrimary: string;
-    onPrimaryContainer: string;
-    onSecondary: string;
-    onSecondaryContainer: string;
-    onTertiary: string;
-    onTertiaryContainer: string;
-    onSurface: string;
-    onSurfaceVariant: string;
-    onSurfaceDisabled: string;
-    onError: string;
-    onErrorContainer: string;
-    onBackground: string;
-    outline: string;
-    outlineVariant: string;
-    inverseSurface: string;
-    inverseOnSurface: string;
-    inversePrimary: string;
-    shadow: string;
-    scrim: string;
-    backdrop: string;
-    elevation: {
-      level0: string;
-      level1: string;
-      level2: string;
-      level3: string;
-      level4: string;
-      level5: string;
-    };
-    // MD2 fallback color slots — TextField/Icon/TouchableRipple read these
-    // first and fall back to MD3 names when the host theme only provides MD3.
-    text?: string;
-    disabled?: string;
-    placeholder?: string;
-  };
-  fonts: {
-    displayLarge: TextStyle;
-    displayMedium: TextStyle;
-    displaySmall: TextStyle;
-    headlineLarge: TextStyle;
-    headlineMedium: TextStyle;
-    headlineSmall: TextStyle;
-    titleLarge: TextStyle;
-    titleMedium: TextStyle;
-    titleSmall: TextStyle;
-    labelLarge: TextStyle;
-    labelMedium: TextStyle;
-    labelSmall: TextStyle;
-    bodyLarge: TextStyle;
-    bodyMedium: TextStyle;
-    bodySmall: TextStyle;
-    default: TextStyle;
-    // MD2 fallback — `AnimatedText` reads this when the theme isn't MD3.
-    regular?: TextStyle;
-  };
-};
-
-export type $Omit<T, K> = Pick<T, Exclude<keyof T, K>>;
-export type $RemoveChildren<T extends React.ComponentType<any>> = $Omit<
-  React.ComponentPropsWithoutRef<T>,
-  'children'
->;
-

package/src/ui/components/utils/forwardRef.tsx

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import type {
-  ForwardRefRenderFunction,
-  PropsWithoutRef,
-  RefAttributes,
-  ForwardRefExoticComponent,
-} from 'react';
-
-export type ForwardRefComponent<T, P = {}> = ForwardRefExoticComponent<
-  PropsWithoutRef<P> & RefAttributes<T>
->;
-
-/**
- * TypeScript generated a large union of props from `ViewProps` in
- * `d.ts` files when using `React.forwardRef`. To prevent this
- * `ForwardRefComponent` was created and exported. Use this
- * `forwardRef` instead of `React.forwardRef` so you don't have to
- * import `ForwardRefComponent`.
- * More info: https://github.com/callstack/react-native-paper/pull/3603
- */
-export const forwardRef: <T, P = {}>(
-  render: ForwardRefRenderFunction<T, PropsWithoutRef<P>>
-) => ForwardRefComponent<T, P> = React.forwardRef;

package/src/ui/constants/iconColors.ts

@@ -1,88 +0,0 @@
-/**
- * Icon color helpers and semantic mappings
- * Provides easy access to icon colors from the theme system
- */
-
-import { Colors } from './theme';
-
-/**
- * Get icon colors for a specific theme
- */
-export const getIconColors = (theme: 'light' | 'dark') => {
-  return Colors[theme];
-};
-
-/**
- * Semantic icon color mappings
- * Maps common icon types to their appropriate theme colors
- */
-export const IconColorMap = {
-  // Profile and personal information
-  profile: 'iconPersonalInfo',
-  personalInfo: 'iconPersonalInfo',
-  editProfile: 'iconPersonalInfo',
-  
-  // Security and authentication
-  security: 'iconSecurity',
-  password: 'iconSecurity',
-  lock: 'iconSecurity',
-  shield: 'iconSecurity',
-  
-  // Documents and rules
-  document: 'iconSecurity',
-  rules: 'iconSecurity',
-  file: 'iconSecurity',
-  
-  // Premium and special features
-  premium: 'iconPayments',
-  star: 'iconPayments',
-  leaderboard: 'iconPayments',
-  trophy: 'iconPayments',
-  
-  // Rewards and gifts
-  rewards: 'iconPayments',
-  gift: 'iconStorage',
-  
-  // Notifications and warnings
-  notifications: 'iconStorage',
-  warning: 'iconStorage',
-  bell: 'iconStorage',
-  
-  // Help and FAQ
-  help: 'iconPersonalInfo',
-  faq: 'iconPersonalInfo',
-  question: 'iconPersonalInfo',
-  
-  // Data and privacy
-  data: 'iconData',
-  privacy: 'iconData',
-  settings: 'iconData',
-  
-  // Sharing and social
-  sharing: 'iconSharing',
-  social: 'iconSharing',
-  
-  // Primary actions
-  primary: 'iconPrimary',
-  home: 'iconHome',
-} as const;
-
-/**
- * Get icon color by semantic name
- */
-export const getIconColor = (
-  semanticName: keyof typeof IconColorMap,
-  theme: 'light' | 'dark' = 'light'
-): string => {
-  const colorKey = IconColorMap[semanticName];
-  const colors = getIconColors(theme);
-  return colors[colorKey as keyof typeof colors] as string;
-};
-
-/**
- * Helper to get icon color for common use cases
- */
-export const useIconColor = (semanticName: keyof typeof IconColorMap, theme: 'light' | 'dark') => {
-  return getIconColor(semanticName, theme);
-};
-

package/src/ui/constants/theme.ts

@@ -1,121 +0,0 @@
-/**
- * Below are the colors that are used in the app.
- * These are kept as a compatibility layer — prefer using bloom's useTheme() / useThemeColor()
- * directly in new code. Existing screens still reference Colors.light / Colors.dark.
- */
-
-import { Platform } from 'react-native';
-
-const tintColorLight = '#c46ede';
-const tintColorDark = '#d69ae8';
-
-export const Colors = {
-  light: {
-    text: '#11181C',
-    background: '#fff',
-    inputBackground: '#F5F5F5',
-    tint: tintColorLight,
-    icon: '#687076',
-    tabIconDefault: '#687076',
-    tabIconSelected: tintColorLight,
-    card: '#F2F2F7',
-    border: '#E5E5EA',
-    secondaryText: '#8E8E93',
-    avatarBackground: '#0a7ea4',
-    avatarText: '#FFFFFF',
-    sidebarBackground: '#F8F9FA',
-    sidebarItemActiveBackground: '#E8F0FE',
-    sidebarItemActiveText: '#1A73E8',
-    sidebarIconHome: '#1A73E8',
-    sidebarIconPersonalInfo: '#34A853',
-    sidebarIconSecurity: '#4285F4',
-    sidebarIconPassword: '#4285F4',
-    sidebarIconDevices: '#4285F4',
-    sidebarIconData: '#9C27B0',
-    sidebarIconSharing: '#EA4335',
-    sidebarIconFamily: '#EA4335',
-    sidebarIconPayments: '#FBBC04',
-    sidebarIconStorage: '#FF9800',
-    // Semantic aliases for easier use
-    iconHome: '#1A73E8',
-    iconPrimary: '#1A73E8',
-    iconPersonalInfo: '#34A853',
-    iconSuccess: '#34A853',
-    iconSecurity: '#4285F4',
-    iconData: '#9C27B0',
-    iconPurple: '#9C27B0',
-    iconSharing: '#EA4335',
-    iconRed: '#EA4335',
-    iconPayments: '#FBBC04',
-    iconGold: '#FBBC04',
-    iconStorage: '#FF9800',
-    iconOrange: '#FF9800',
-  },
-  dark: {
-    text: '#ECEDEE',
-    background: '#000000',
-    inputBackground: '#333333',
-    tint: tintColorDark,
-    icon: '#9BA1A6',
-    tabIconDefault: '#9BA1A6',
-    tabIconSelected: tintColorDark,
-    card: '#1C1C1E',
-    border: '#2C2C2E',
-    secondaryText: '#8E8E93',
-    avatarBackground: '#0a7ea4',
-    avatarText: '#FFFFFF',
-    sidebarBackground: '#1C1C1E',
-    sidebarItemActiveBackground: '#2D2E30',
-    sidebarItemActiveText: '#8AB4F8',
-    sidebarIconHome: '#8AB4F8',
-    sidebarIconPersonalInfo: '#81C995',
-    sidebarIconSecurity: '#8AB4F8',
-    sidebarIconPassword: '#8AB4F8',
-    sidebarIconDevices: '#8AB4F8',
-    sidebarIconData: '#CE93D8',
-    sidebarIconSharing: '#F28B82',
-    sidebarIconFamily: '#F28B82',
-    sidebarIconPayments: '#FDD663',
-    sidebarIconStorage: '#FFB74D',
-    // Semantic aliases for easier use
-    iconHome: '#8AB4F8',
-    iconPrimary: '#8AB4F8',
-    iconPersonalInfo: '#81C995',
-    iconSuccess: '#81C995',
-    iconSecurity: '#8AB4F8',
-    iconData: '#CE93D8',
-    iconPurple: '#CE93D8',
-    iconSharing: '#F28B82',
-    iconRed: '#F28B82',
-    iconPayments: '#FDD663',
-    iconGold: '#FDD663',
-    iconStorage: '#FFB74D',
-    iconOrange: '#FFB74D',
-  },
-};
-
-export const Fonts = Platform.select({
-  ios: {
-    /** iOS `UIFontDescriptorSystemDesignDefault` */
-    sans: 'system-ui',
-    /** iOS `UIFontDescriptorSystemDesignSerif` */
-    serif: 'ui-serif',
-    /** iOS `UIFontDescriptorSystemDesignRounded` */
-    rounded: 'ui-rounded',
-    /** iOS `UIFontDescriptorSystemDesignMonospaced` */
-    mono: 'ui-monospace',
-  },
-  default: {
-    sans: 'normal',
-    serif: 'serif',
-    rounded: 'normal',
-    mono: 'monospace',
-  },
-  web: {
-    sans: "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif",
-    serif: "Georgia, 'Times New Roman', serif",
-    rounded: "'SF Pro Rounded', 'Hiragino Maru Gothic ProN', Meiryo, 'MS PGothic', sans-serif",
-    mono: "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace",
-  },
-});
-

package/src/ui/context/ThemeContext.tsx

@@ -1,41 +0,0 @@
-import React, { createContext, useContext, type ReactNode } from 'react';
-
-type ResolvedTheme = 'light' | 'dark';
-
-interface ThemeContextType {
-  resolvedTheme: ResolvedTheme;
-  isLoaded: boolean;
-}
-
-export const ThemeContext = createContext<ThemeContextType | undefined>(undefined);
-
-interface ThemeProviderProps {
-  theme: 'light' | 'dark';
-  children: ReactNode;
-}
-
-/**
- * ThemeProvider component that accepts a theme prop and provides it via context.
- * This allows Accounts-style components to access theme through hooks.
- */
-export function ThemeProvider({ theme, children }: ThemeProviderProps) {
-  return (
-    <ThemeContext.Provider
-      value={{
-        resolvedTheme: theme,
-        isLoaded: true,
-      }}
-    >
-      {children}
-    </ThemeContext.Provider>
-  );
-}
-
-export function useThemeContext() {
-  const context = useContext(ThemeContext);
-  if (context === undefined) {
-    throw new Error('useThemeContext must be used within a ThemeProvider');
-  }
-  return context;
-}
-