A locale switcher - the language dropdown a multilingual app puts in its header or footer.
A pure composition of PetalComponents.Dropdown: the trigger shows the
current locale (flag, code or label - see variant), the menu lists
every language as a plain link to the current path with ?locale=...
appended (&-joined when the path already carries a query). That is
the conventional Phoenix contract - a plug or on_mount hook reads the
param, calls Gettext.put_locale/2 and persists the choice - and
because the items are real links, the switcher works on live and dead
views alike.
<.language_select
current_locale={Gettext.get_locale(MyAppWeb.Gettext)}
current_path={@current_path}
language_options={[
%{locale: "en", flag: "š¬š§", label: "English"},
%{locale: "fr", flag: "š«š·", label: "FranƧais"}
]}
/>Flags read fast but a flag is a country, not a language - Portuguese
isn't only šµš¹. When that matters, drop the :flag keys and switch the
trigger to text: variant="code" renders the locale code (EN), and
variant="label" renders the language name. Options without a :flag
simply render without one.
When current_locale matches no option, the flag trigger falls back to
a language glyph (and the text triggers fall back to the raw locale) -
a half-configured app renders a working menu, not a crash.
Summary
Functions
Attributes
current_locale(:string) (required) - the active locale, e.g. from Gettext.get_locale/1.language_options(:list) (required) - one map per language: %{locale: "en", flag: "š¬š§", label: "English"} - :flag is optional.current_path(:string) - the path the locale links return to; the locale query param is appended. Defaults to"".variant(:string) - what the trigger shows: the current flag, the locale code (EN), or the language name. Defaults to"flag". Must be one of"flag","code", or"label".label(:string) - accessible name for the trigger. Defaults to"Change language".show_chevron(:boolean) - hide for the cleanest text triggers - the flag or code stands alone. Defaults totrue.placement(:string) - Defaults to"left". Must be one of"left", or"right".class(:any) - extra classes for the dropdown container. Defaults tonil.- Global attributes are accepted.