When to use it

Use LanguageSelector when the storefront supports multiple languages and visitors need a way to switch. It is typically placed in the header utility area or footer alongside other locale controls like CountryRedirect.

Composition notes

LanguageSelector is a controlled select component:

• languages is an array of language options with code, label, and optional icon.
• value and onValueChange manage the selected language.
• variant controls the trigger display: "full" (language name), "code" (two-letter code with globe icon), or "icon" (language icon only).

Behavior and theming guidance

The selector renders as a styled Select dropdown that fits into compact utility bars. The "code" variant is the most space-efficient for tight header layouts. The "full" variant works better in footer or settings contexts where space is not constrained.