Assets

SVGs, PNGs, imagens remotas e fontes usadas no app.

SVGs

SVGs importados diretamente como componentes React Native via react-native-svg-transformer. Configurado em metro.config.js.

Arquivo	Uso	Dimensões
`assets/embarko-logo.svg`	Logo no header da Home	165×24
`assets/favorito.svg`	Ilustração hero da tela Favoritos (não logado)	100% × 320px
`assets/viagem-empty.svg`	Ilustração estado vazio na tela Viagens	240×240

// metro.config.js — habilitar SVG
const { getDefaultConfig } = require('expo/metro-config');
const config = getDefaultConfig(__dirname);
config.transformer.babelTransformerPath = require.resolve('react-native-svg-transformer');
config.resolver.assetExts = config.resolver.assetExts.filter(ext => ext !== 'svg');
config.resolver.sourceExts = [...config.resolver.sourceExts, 'svg'];
module.exports = config;

// Uso no componente
import EmbarkoLogo from '@/assets/embarko-logo.svg';
<EmbarkoLogo width={165} height={24} />

PNGs

Arquivo	Uso	Tamanho
`assets/icon.png`	Ícone do app (app store)	1024×1024
`assets/splash.png`	Splash screen	1284×2778
`assets/adaptive-icon.png`	Ícone adaptativo Android	1024×1024
`assets/favicon.png`	Favicon web	48×48
`assets/providers/*.png`	Logos de companhias aéreas e providers	80×80

Imagens remotas

Carregadas dinamicamente via URL. Sempre usar FastImage ou <Image /> do Expo com contentFit="cover".

Recurso	URL Pattern
Fotos de cidades (Unsplash)	`https://images.unsplash.com/photo-ID?w=640&q=80`
Imagens de passeios (Viator)	`https://hare-media-cdn.tripadvisor.com/media/attractions-splice-spp-674x446/...`
Imagens de passeios (Tiqets)	`https://cdn.tiqets.com/...`
Imagens de shows (Ticketmaster)	`https://s1.ticketm.net/dam/a/...`
Logos de companhias aéreas	`https://pics.avs.io/80/80/{iataCode}.png`

Fontes

Família General Sans. Carregadas via expo-font em app/_layout.tsx. No web, usar string CSS completa (não as constantes do FontFamily).

Arquivo	Peso	FontFamily key
`GeneralSans-Regular.otf`	400	`Regular`
`GeneralSans-Medium.otf`	500	`Medium`
`GeneralSans-Semibold.otf`	600	`Semibold`
`GeneralSans-Bold.otf`	700	`Bold`

// Web: usar string CSS completa
fontFamily: "'General Sans', sans-serif"

// Mobile: usar constante
import { FontFamily } from '@/constants/theme';
fontFamily: FontFamily.Semibold   // "GeneralSans-Semibold"

// _layout.tsx — carregamento
const [fontsLoaded] = useFonts({
  'GeneralSans-Regular':  require('@/assets/fonts/GeneralSans-Regular.otf'),
  'GeneralSans-Medium':   require('@/assets/fonts/GeneralSans-Medium.otf'),
  'GeneralSans-Semibold': require('@/assets/fonts/GeneralSans-Semibold.otf'),
  'GeneralSans-Bold':     require('@/assets/fonts/GeneralSans-Bold.otf'),
});