Translatable Switcher

<x-translatable-switcher> renders a globe dropdown of the app's locales. Picking one switches every <x-translatable> field on the page to that language at once — handy in a form header so editors can flip languages without touching each field's tabs.

Usage

<x-translatable-switcher />

Place it on the same page as your translatable fields (commonly in a form card's header slot). It activates the matching tab on every <x-translatable> present.

Options

• locales — which locales to list. Defaults to the app's configured locales. Each is shown with its label and key, e.g. English (en).
• id — element id; auto-generated when omitted.

Any extra class is added to the dropdown styling.

Examples

In a form card header

<x-layouts::dashboard>
    <x-form-card resource="posts">
        <x-slot:header>
            <x-translatable-switcher />
        </x-slot:header>
    </x-form-card>
</x-layouts::dashboard>

Restricting the listed locales

<x-translatable-switcher :locales="['en', 'ar']" />

Related

• Translatable — the per-locale fields this switches.
• Form Card — where the switcher commonly lives.