Skip to main content

2.3 Components

Componentes reutilizables en toda la aplicación. Puede descargar la carpeta completa o archivo por archivo segun le convenga. Descargar carpeta completa

Core​

Componentes base que no requieren dependencias adicionales

Button​

<Button title="Aceptar" onPress={() => {}} />

Props. Las props que tienen el signo (?) son opcionales

src/components/core/Button.tsx
interface ButtonProps extends TouchableOpacityProps {
  title: string;
  onPress: () => void;
  type?: keyof ButtonType;
  underline?: boolean;
  font?: keyof FontStyle;
  fontColor?: keyof FontColors;
  icon?: Icons;
  iconPosition?: 'left' | 'right';
}

Icon​

<Icon name={Icons.Search} />

Props. Las props que tienen el signo (?) son opcionales

interface IconProps {
  name: Icons;
  size?: IconSizes;
}

Margin​

<Margin top={4} bottom={8} />

Props. Las props que tienen el signo (?) son opcionales

interface MarginComponentProps {
  top?: number;
  right?: number;
  bottom?: number;
  left?: number;
  flex?: boolean;
}

SearchInput​

Text​

<Text title="Hello world" font="body16Regular" />

Props. Las props que tienen el signo (?) son opcionales

export interface TextProps extends RNTextProps {
  title: string;
  font: keyof FontStyle;
  color?: keyof FontColors;
  align?: 'auto' | 'left' | 'right' | 'center' | 'justify';
  underline?: boolean;
  textTransform?: 'none' | 'capitalize' | 'uppercase' | 'lowercase' | undefined;
}

TextInput​

Layout​