Icon

Icon est un wrapper conçu pour contenir une icône Lucide ou une Papicon. Celle-ci permet d'avoir d'avantage de contrôle sur l'affichage des icônes.

Fonctionnement

Avec une Papicon

import * as Papicons from "@getpapillon/papicons"
import Icon from "@/ui/components/Icon";

<Icon papicon>
  <Papicons.Ghost />
</Icon>

Avec une icône Lucide

import { Ghost } from "lucide-react-native";
import Icon from "@/ui/components/Icon";

<Icon>
  <Ghost />
</Icon>

Avec une Vector Icon

import { FontAwesome5 } from "@react-native-vector-icons/fontawesome5";
import Icon from "@/ui/components/Icon";

<Icon>
  <FontAwesome5 name="ghost" />
</Icon>

Propriétés

color

Couleur de fond de l'icône (Ajoute un padding et un fond)

Type
Couleur (HEX)

fill

Couleur de remplissage de l'icône

Type	Valeur par défaut
Couleur (HEX)	Couleur du texte selon le thème clair ou sombre

papicon

A activer si l'icône est une Papicon pour le fonctionnement d'Icon

Cette propriété sera inutile dans une future version des Papicons

Type	Valeur par défaut
Booléen	false

size

Taille de l'icône

Type	Valeur par défaut
Nombre	24

opacity

Opacité de l'icône

Type	Valeur par défaut
Nombre	1