Search documentation of phoenix_kit

# PhoenixKitWeb.Components.Core.LanguageSwitcher (phoenix_kit v1.7.87)

Copy Markdown View Source

Language switcher component for frontend and admin applications.

Provides reusable language selection UI that pulls available languages from the unified Languages module. Three display variants are available: dropdown, button group, and inline.

## Continent Grouping

When more than 7 languages are enabled (configurable via `continent_threshold`), the dropdown automatically shows a two-step interface: first pick a continent, then pick a language within it. Set `group_by_continent={false}` to always show a flat list regardless of language count.

## Examples

    # Basic dropdown — auto-groups by continent when >7 languages
    <.language_switcher_dropdown current_locale={@current_locale} />

    # Force flat list (no continent step)
    <.language_switcher_dropdown current_locale={@current_locale} group_by_continent={false} />

    # Custom threshold for continent grouping
    <.language_switcher_dropdown current_locale={@current_locale} continent_threshold={5} />

    # Show current language in trigger button
    <.language_switcher_dropdown current_locale={@current_locale} show_current={true} />

    # Button group (for mobile)
    <.language_switcher_buttons current_locale={@current_locale} />

    # Inline text links (for footers)
    <.language_switcher_inline current_locale={@current_locale} />

## Summary

### Functions

language_switcher_buttons(assigns)

Renders a button group language switcher.

language_switcher_dropdown(assigns)

Renders a dropdown language switcher.

language_switcher_inline(assigns)

Renders an inline language switcher.

## Functions

# language_switcher_buttons(assigns)

Renders a button group language switcher.

Displays language buttons in a row. Good for mobile layouts and areas where space allows for multiple buttons. Automatically fetches the configured languages (or default top 12 if not configured).

## Examples

    <.language_switcher_buttons current_locale={@current_locale} />

## Attributes

- `current_locale` (`:string`) - Current active language code (auto-detected if not provided). Defaults to `nil`.
- `languages` (`:any`) - List of language maps. If nil, fetches from Language Module. Defaults to `nil`.
- `show_flags` (`:boolean`) - Show language flags. Defaults to `true`.
- `show_names` (`:boolean`) - Show language names. Defaults to `true`.
- `goto_home` (`:boolean`) - Redirect to home page on language switch. Defaults to `false`.
- `hide_current` (`:boolean`) - Hide currently selected language from list. Defaults to `false`.
- `class` (`:string`) - Additional CSS classes. Defaults to `""`.
- `current_path` (`:string`) - Current path to preserve when switching languages. Defaults to `nil`.

# language_switcher_dropdown(assigns)

Renders a dropdown language switcher.

Displays a globe icon that opens a dropdown menu with available languages. Automatically fetches the configured languages (or defaults when unconfigured). Used in both frontend navigation bars and the admin panel header.

When more than `continent_threshold` languages are enabled, shows a two-step continent → language navigation. Set `group_by_continent={false}` to disable.

## Examples

    <.language_switcher_dropdown current_locale={@current_locale} />

    <.language_switcher_dropdown
      current_locale={@current_locale}
      group_by_continent={false}
    />

## Attributes

- `current_locale` (`:string`) - Current active language code (auto-detected if not provided). Defaults to `nil`.
- `languages` (`:any`) - List of language maps. If nil, fetches from Language Module. Defaults to `nil`.
- `show_flags` (`:boolean`) - Show language flags. Defaults to `true`.
- `show_names` (`:boolean`) - Show language names. Defaults to `true`.
- `show_native_names` (`:boolean`) - Show native language names. Defaults to `false`.
- `goto_home` (`:boolean`) - Redirect to home page on language switch. Defaults to `false`.
- `hide_current` (`:boolean`) - Hide currently selected language from list. Defaults to `false`.
- `class` (`:string`) - Additional CSS classes. Defaults to `""`.
- `current_path` (`:string`) - Current path to preserve when switching languages. Defaults to `nil`.
- `scroll_threshold` (`:integer`) - Number of languages after which to show scrollbar and search. Defaults to `10`.
- `show_current` (`:boolean`) - Show current language (flag + name) in dropdown trigger instead of globe icon. Defaults to `false`.
- `group_by_continent` (`:boolean`) - Enable continent grouping when language count exceeds continent_threshold. Defaults to `true`.
- `continent_threshold` (`:integer`) - Number of languages after which the continent grouping step is shown. Defaults to `7`.
- `_language_update_key` (`:any`) - Internal: forces re-render when languages change. Defaults to `nil`.

# language_switcher_inline(assigns)

Renders an inline language switcher.

Displays languages as inline text links. Minimal design perfect for footers or compact navigation areas. Automatically fetches the configured languages (or default top 12 if not configured).

## Examples

    <.language_switcher_inline current_locale={@current_locale} />

## Attributes

- `current_locale` (`:string`) - Current active language code (auto-detected if not provided). Defaults to `nil`.
- `languages` (`:any`) - List of language maps. If nil, fetches from Language Module. Defaults to `nil`.
- `show_flags` (`:boolean`) - Show language flags. Defaults to `true`.
- `show_names` (`:boolean`) - Show language names. Defaults to `true`.
- `goto_home` (`:boolean`) - Redirect to home page on language switch. Defaults to `false`.
- `hide_current` (`:boolean`) - Hide currently selected language from list. Defaults to `false`.
- `class` (`:string`) - Additional CSS classes. Defaults to `""`.
- `current_path` (`:string`) - Current path to preserve when switching languages. Defaults to `nil`.