{{--
  Renders one tab per supported locale. The slot content is rendered inside each
  tab with $locale set to the current locale code.

  Usage:
    <x-dash-translatable-tabs>
        <flux:input wire:model="state.{{ $locale }}.name"
                    label="{{ __('dashboard::dashboard.fields.name') }}"/>
    </x-dash-translatable-tabs>
--}}
<flux:tab.group>
    <flux:tabs>
        @foreach ($locales as $locale)
            <flux:tab :name="$locale">
                {{ __('dashboard::dashboard.fields.tabs.' . ($locale === 'ar' ? 'arabic' : 'english')) }}
            </flux:tab>
        @endforeach
    </flux:tabs>

    @foreach ($locales as $locale)
        <flux:tab.panel :name="$locale" class="space-y-4 pt-4">
            {{ $slot }}
        </flux:tab.panel>
    @endforeach
</flux:tab.group>