CreditCard

number is the card number, and the only prop the card reads for itself: the network is detected from it on every render, which is what sets the digit grouping, the logo and the expected CVC length. Spacing in the string doesn't matter — grouping is derived from the digits, so raw and pre-formatted values both come out right.

name is the cardholder, printed on the front exactly as you pass it — there's no upper-casing or truncation of its own. Left empty it falls back to a “Your Name” placeholder, so a card being filled in live still looks like a card.

expiry is the expiry date and is expected already formatted as MM/YY — the card prints the string rather than parsing it. Omitted, it shows an MM/YY placeholder in the same slot.

cvc is printed on the back of the card, so it only becomes visible once flipped is set. It's padded with • placeholders up to the length the detected brand expects — four for Amex, three for everything else.

flipped turns the card over to its back face — magnetic stripe and cvc instead of number, name and expiry. It's an ordinary boolean rather than internal state, so the card never flips on its own: drive it from a button, or from a CVC field's focus the way CreditCardInput does.