import { DemoTranslations } from "./demo-en"
export const demoFr: DemoTranslations = {
demoIcon: {
description:
"Un composant pour faire le rendu d’une icône enregistrée. Il est enveloppé dans un si `onPress` est fourni, sinon dans une .",
useCase: {
icons: {
name: "Icônes",
description: "Liste des icônes enregistrées dans le composant.",
},
size: {
name: "Taille",
description: "Il y a une prop de taille.",
},
color: {
name: "Couleur",
description: "Il y a une prop de couleur.",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
},
},
},
demoTextField: {
description: "Le composant permet la saisie et l'édition de texte.",
useCase: {
statuses: {
name: "Statuts",
description:
"Il y a une prop de statut - similaire à `preset` dans d'autres composants, mais affecte également la fonctionnalité du composant.",
noStatus: {
label: "Pas de statut",
helper: "C'est le statut par défaut",
placeholder: "Le texte passe par là",
},
error: {
label: "Statut d'erreur",
helper: "Statut à utiliser en cas d’erreur",
placeholder: "Le texte passe par ici",
},
disabled: {
label: "Statut désactivé",
helper: "Désactive l’édition et atténue le texte",
placeholder: "Le texte repasse par là",
},
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transmettre du contenu.",
viaLabel: {
labelTx: "Via la prop `label`",
helper: "Via la prop `helper`",
placeholder: "Via la prop `placeholder`",
},
rightAccessory: {
label: "Accessoire droit",
helper: "Cette prop demande une fonction qui retourne un élément React.",
},
leftAccessory: {
label: "Accessoire gauche",
helper: "Cette prop demande une fonction qui retourne un élément React.",
},
supportsMultiline: {
label: "Supporte le multiligne",
helper: "Permet une saisie plus longue pour le texte multiligne.",
},
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
styleInput: {
label: "Style de saisie",
helper: "Via la prop `style`",
},
styleInputWrapper: {
label: "Style du wrapper de saisie",
helper: "Via la prop `inputWrapperStyle`",
},
styleContainer: {
label: "Style du conteneur",
helper: "Via la prop `containerStyle`",
},
styleLabel: {
label: "Style du label et de l’aide",
helper: "Via les props de style `LabelTextProps` et `HelperTextProps`",
},
styleAccessories: {
label: "Style des accessoires",
helper: "Via les props de style `RightAccessory` et `LeftAccessory`",
},
},
},
},
demoToggle: {
description:
"Fait le rendu d’un booléen. Ce composant contrôlé nécessite un callback `onValueChange` qui met à jour la prop `value` pour que le composant reflète les actions de l'utilisateur. Si la prop `value` n'est pas mise à jour, le composant continuera à rendre la prop `value` fournie au lieu du résultat attendu des actions de l'utilisateur.",
useCase: {
variants: {
name: "Variantes",
description:
"Le composant supporte différentes variantes. Si une personnalisation poussée d'une variante spécifique est nécessaire, elle peut être facilement refactorisée. La valeur par défaut est `checkbox`.",
checkbox: {
label: "Variante `checkbox`",
helper: "Peut être utilisée pour une seule valeure on/off.",
},
radio: {
label: "Variante `radio`",
helper: "Utilisez ceci quand vous avez plusieurs options.",
},
switch: {
label: "Variante `switch`",
helper:
"Une entrée on/off plus proéminente. Possède un meilleur support d’accessibilité.",
},
},
statuses: {
name: "Statuts",
description:
"Il y a une prop de statut - similaire à `preset` dans d'autres composants, mais affecte également la fonctionnalité du composant.",
noStatus: "Pas de statut - c'est le défaut",
errorStatus: "Statut d’erreur - à utiliser quand il y a une erreur",
disabledStatus: "Statut désactivé - désactive l’édition et atténue le style",
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transmettre du contenu.",
useCase: {
checkBox: {
label: "Via la prop `labelTx`",
helper: "Via la prop `helperTx`.",
},
checkBoxMultiLine: {
helper: "Supporte le multiligne - Nulla proident consectetur labore sunt ea labore. ",
},
radioChangeSides: {
helper:
"Vous pouvez changer de côté - Laborum labore adipisicing in eu ipsum deserunt.",
},
customCheckBox: {
label: "Passez une icône de case à cocher personnalisée.",
},
switch: {
label: "Les interrupteurs peuvent être lus comme du texte",
helper:
"Par défaut, cette option n’utilise pas `Text` car selon la police, les caractères on/off pourraient paraître étranges. Personnalisez selon vos besoins.",
},
switchAid: {
label: "Ou aidé d’une icône",
},
},
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
outerWrapper: "1 - styliser le wrapper extérieur de l’entrée",
innerWrapper: "2 - styliser le wrapper intérieur de l’entrée",
inputDetail: "3 - styliser le détail de l’entrée",
labelTx: "Vous pouvez aussi styliser le labelTx",
styleContainer: "Ou, styliser le conteneur entier",
},
},
},
demoButton: {
description:
"Un composant qui permet aux utilisateurs d’effectuer des actions et de faire des choix. Enveloppe le composant Text avec un composant Pressable.",
useCase: {
presets: {
name: "Préréglages",
description: "Il y a quelques préréglages préconfigurés.",
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transmettre du contenu.",
viaTextProps: "Via la prop `text` - Billum In",
children: "Enfants - Irure Reprehenderit",
rightAccessory: "Accessoire droit - Duis Quis",
leftAccessory: "Accessoire gauche - Duis Proident",
nestedChildren: "Enfants imbriqués - proident veniam.",
nestedChildren2: "Ullamco cupidatat officia exercitation velit non ullamco nisi..",
nestedChildren3: "Occaecat aliqua irure proident veniam.",
multiLine:
"Multiligne - consequat veniam veniam reprehenderit. Fugiat id nisi quis duis sunt proident mollit dolor mollit adipisicing proident deserunt.",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
styleContainer: "Style du conteneur - Exercitation",
styleText: "Style du texte - Ea Anim",
styleAccessories: "Style des accessoires - enim ea id fugiat anim ad.",
pressedState: "Style de l’état pressé - fugiat anim",
},
disabling: {
name: "Désactivation",
description:
"Le composant peut être désactivé et stylisé en conséquence. Le comportement de pression sera désactivé.",
standard: "Désactivé - standard",
filled: "Désactivé - rempli",
reversed: "Désactivé - inversé",
accessory: "Style d’accessoire désactivé",
textStyle: "Style de texte désactivé",
},
},
},
demoListItem: {
description:
"Un composant de ligne stylisé qui peut être utilisé dans FlatList, SectionList, ou seul.",
useCase: {
height: {
name: "Hauteur",
description: "La ligne peut avoir différentes hauteurs.",
defaultHeight: "Hauteur par défaut (56px)",
customHeight: "Hauteur personnalisée via la prop `height`",
textHeight:
"Hauteur déterminée par le contenu du texte - Reprehenderit incididunt deserunt do do ea labore.",
longText:
"Limiter le texte long à une ligne - Reprehenderit incididunt deserunt do do ea labore.",
},
separators: {
name: "Séparateurs",
description: "Le séparateur / diviseur est préconfiguré et optionnel.",
topSeparator: "Séparateur uniquement en haut",
topAndBottomSeparator: "Séparateurs en haut et en bas",
bottomSeparator: "Séparateur uniquement en bas",
},
icons: {
name: "Icônes",
description: "Vous pouvez personnaliser les icônes à gauche ou à droite.",
leftIcon: "Icône gauche",
rightIcon: "Icône droite",
leftRightIcons: "Icônes gauche et droite",
},
customLeftRight: {
name: "Composants personnalisés gauche/droite",
description:
"Si vous avez besoin d’un composant personnalisé à gauche/droite, vous pouvez le passer.",
customLeft: "Composant personnalisé à gauche",
customRight: "Composant personnalisé à droite",
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transmettre du contenu.",
text: "Via la prop `text` - reprehenderit sint",
children: "Enfants - mostrud mollit",
nestedChildren1: "Enfants imbriqués - proident veniam.",
nestedChildren2: "Ullamco cupidatat officia exercitation velit non ullamco nisi..",
},
listIntegration: {
name: "Intégration avec FlatList",
description:
"Le composant peut être facilement intégré avec votre interface de liste préférée.",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
styledText: "Texte stylisé",
styledContainer: "Conteneur stylisé (séparateurs)",
tintedIcons: "Icônes teintées",
},
},
},
demoCard: {
description:
"Les cartes sont utiles pour afficher des informations connexes de manière contenue. Si un ListItem affiche le contenu horizontalement, une Card peut être utilisée pour afficher le contenu verticalement.",
useCase: {
presets: {
name: "Préréglages",
description: "Il y a quelques préréglages préconfigurés.",
default: {
heading: "Préréglage par défaut (default)",
content: "Incididunt magna ut aliquip consectetur mollit dolor.",
footer: "Consectetur nulla non aliquip velit.",
},
reversed: {
heading: "Préréglage inversé",
content: "Reprehenderit occaecat proident amet id laboris.",
footer: "Consectetur tempor ea non labore anim .",
},
},
verticalAlignment: {
name: "Alignement vertical",
description:
"Selon les besoins, la carte est préconfigurée avec différentes stratégies d’alignement.",
top: {
heading: "Haut (par défaut)",
content: "Tout le contenu est automatiquement aligné en haut.",
footer: "Même le pied de page",
},
center: {
heading: "Centre",
content: "Le contenu est centré par rapport à la hauteur de la carte.",
footer: "Moi aussi !",
},
spaceBetween: {
heading: "Espace entre",
content: "Tout le contenu est espacé uniformément.",
footer: "Je suis là où je veux être.",
},
reversed: {
heading: "Forcer le pied de page en bas",
content: "Cela pousse le pied de page là où il appartient.",
footer: "Je suis si seul ici en bas.",
},
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transmettre du contenu.",
heading: "Via la prop `heading`",
content: "Via la prop `content`",
footer: "Je suis si seul ici en bas.",
},
customComponent: {
name: "Composants personnalisés",
description:
"N’importe quels composants préconfigurés peuvent être remplacé par le vôtre. Vous pouvez également en ajouter d’autres.",
rightComponent: "Composant droit",
leftComponent: "Composant gauche",
},
style: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
heading: "Styliser l’en-tête",
content: "Styliser le contenu",
footer: "Styliser le pied de page",
},
},
},
demoAutoImage: {
description:
"Un composant Image qui dimensionne automatiquement une image distante ou data-uri.",
useCase: {
remoteUri: { name: "URI distante" },
base64Uri: { name: "URI Base64" },
scaledToFitDimensions: {
name: "Mis à l’échelle pour s’adapter aux dimensions",
description:
"En fournissant les props `maxWidth` et/ou `maxHeight`, l’image se redimensionnera automatiquement à l’échelle tout en conservant son rapport d’aspect. En quoi est-ce différent de `resizeMode: 'contain'` ? Premièrement, vous pouvez spécifier la taille d'un seul côté (pas les deux). Deuxièmement, l'image s'adaptera aux dimensions souhaitées au lieu d'être simplement contenue dans son conteneur d'image.",
heightAuto: "largeur: 60 / hauteur: auto",
widthAuto: "largeur: auto / hauteur: 32",
bothManual: "largeur: 60 / hauteur: 60",
},
},
},
demoText: {
description:
"Pour vos besoins d'affichage de texte. Ce composant est un HOC sur celui intégré à React Native.",
useCase: {
presets: {
name: "Préréglages",
description: "Il y a quelques réglages préconfigurés.",
default:
"préréglage par défaut - Cillum eu laboris in labore. Excepteur mollit tempor reprehenderit fugiat elit et eu consequat laborum.",
bold: "préréglage gras - Tempor et ullamco cupidatat in officia. Nulla ea duis elit id sunt ipsum cillum duis deserunt nostrud ut nostrud id.",
subheading: "préréglage sous-titre - In Cupidatat Cillum.",
heading: "préréglage titre - Voluptate Adipis.",
},
sizes: {
name: "Tailles",
description: "Il y a une prop de taille.",
xs: "xs - Ea ipsum est ea ex sunt.",
sm: "sm - Lorem sunt adipisicin.",
md: "md - Consequat id do lorem.",
lg: "lg - Nostrud ipsum ea.",
xl: "xl - Eiusmod ex excepteur.",
xxl: "xxl - Cillum eu laboris.",
},
weights: {
name: "Graisse",
description: "Il y a une prop de graisse.",
light:
"léger - Nulla magna incididunt excepteur est occaecat duis culpa dolore cupidatat enim et.",
normal:
"normal - Magna incididunt dolor ut veniam veniam laboris aliqua velit ea incididunt.",
medium: "moyen - Non duis laborum quis laboris occaecat culpa cillum.",
semibold: "demi-gras - Exercitation magna nostrud pariatur laborum occaecat aliqua.",
bold: "gras - Eiusmod ullamco magna exercitation est excepteur.",
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transférer du contenu.",
viaText:
"via la prop `text` - Billum in aute fugiat proident nisi pariatur est. Cupidatat anim cillum eiusmod ad. Officia eu magna aliquip labore dolore consequat.",
viaTx: "via la prop `tx` -",
children: "enfants - Aliqua velit irure reprehenderit eu qui amet veniam consectetur.",
nestedChildren: "Enfants imbriqués -",
nestedChildren2: "Occaecat aliqua irure proident veniam.",
nestedChildren3: "Ullamco cupidatat officia exercitation velit non ullamco nisi..",
nestedChildren4: "Occaecat aliqua irure proident veniam.",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
text: "Consequat ullamco veniam velit mollit proident excepteur aliquip id culpa ipsum velit sint nostrud.",
text2:
"Eiusmod occaecat laboris eu ex veniam ipsum adipisicing consectetur. Magna ullamco adipisicing tempor adipisicing.",
text3:
"Eiusmod occaecat laboris eu ex veniam ipsum adipisicing consectetur. Magna ullamco adipisicing tempor adipisicing.",
},
},
},
demoHeader: {
description:
"Composant qui apparaît sur de nombreux écrans. Contiendra les boutons de navigation et le titre de l’écran.",
useCase: {
actionIcons: {
name: "Icônes d’action",
description:
"Vous pouvez facilement passer des icônes aux composants d’action gauche ou droit.",
leftIconTitle: "Icône gauche",
rightIconTitle: "Icône droite",
bothIconsTitle: "Les deux icônes",
},
actionText: {
name: "Texte d’action",
description:
"Vous pouvez facilement passer du texte aux composants d’action gauche ou droit.",
leftTxTitle: "Via `leftTx`",
rightTextTitle: "Via `rightText`",
},
customActionComponents: {
name: "Composants d’action personnalisés",
description:
"Si les options d’icône ou de texte ne suffisent pas, vous pouvez passer votre propre composant d’action personnalisé.",
customLeftActionTitle: "Action gauche personnalisée",
},
titleModes: {
name: "Modes de titre",
description:
"Le titre peut être forcé à rester au centre (par défaut) mais peut être coupé s’il est trop long. Vous pouvez éventuellement le faire s’ajuster aux boutons d’action.",
centeredTitle: "Titre centré",
flexTitle: "Titre flexible",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
styledTitle: "Titre stylisé",
styledWrapperTitle: "Wrapper stylisé",
tintedIconsTitle: "Icônes teintées",
},
},
},
demoEmptyState: {
description:
"Un composant à utiliser lorsqu’il n’y a pas de données à afficher. Il peut être utilisé pour diriger l’utilisateur sur ce qu’il faut faire ensuite.",
useCase: {
presets: {
name: "Préréglages",
description:
"Vous pouvez créer différents ensembles de texte/image. Un est prédéfini appelé `generic`. Notez qu’il n’y a pas de valeur par défaut au cas où vous voudriez avoir un EmptyState complètement personnalisé.",
},
passingContent: {
name: "Transfert de contenu",
description: "Il y a plusieurs façons de transférer du contenu.",
customizeImageHeading: "Personnaliser l’image",
customizeImageContent: "Vous pouvez passer n’importe quelle source d'image.",
viaHeadingProp: "Via la prop `heading`",
viaContentProp: "Via la prop `content`.",
viaButtonProp: "Via la prop `button`",
},
styling: {
name: "Style",
description: "Le composant peut être facilement stylisé.",
},
},
},
}
export default demoFr