lomi. UI
Section informations client
Formulaire d'informations personnelles du checkout hébergé avec nom, e-mail, téléphone et WhatsApp optionnel.
Section informations client
Reprend customer-information-section.tsx du checkout hébergé : nom complet, e-mail, téléphone et numéro WhatsApp optionnel.
Aperçu
*
*
My WhatsApp number is different
Installation
Install to your codebase
Copy the component source with shadcn.
npx shadcn@latest add https://docs.lomi.africa/r/customer-information-section.jsonUtilisation
import { CustomerInformationSection } from '@/components/lomi-ui/customer-information-section';
<CustomerInformationSection
fullName={fullName}
email={email}
phoneNumber={phoneNumber}
whatsappNumber={whatsappNumber}
isDifferentWhatsApp={isDifferentWhatsApp}
onFullNameChange={setFullName}
onEmailChange={setEmail}
onPhoneNumberChange={setPhoneNumber}
onWhatsAppNumberChange={setWhatsAppNumber}
onDifferentWhatsAppChange={setIsDifferentWhatsApp}
/>;Nécessite react-phone-number-input dans votre application.
Props
| Prop | Type | Description |
|---|---|---|
fullName | string | Nom complet (contrôlé). |
email | string | E-mail (contrôlé). |
phoneNumber | string | Téléphone au format E.164 (contrôlé). |
whatsappNumber | string | Numéro WhatsApp quand le champ est affiché. |
isDifferentWhatsApp | boolean | Affiche le champ WhatsApp au lieu de la ligne de bascule. |
defaultCountry | Country | Pays par défaut du téléphone. Par défaut CI. |
onFullNameChange | (value: string) => void | Handler changement nom. |
onEmailChange | (value: string) => void | Handler changement e-mail. |
onPhoneNumberChange | (value?: string) => void | Handler changement téléphone. |