@props([
    'id' => null,
    'title' => 'Filters',
    'icon' => 'sliders',
    'action' => null,
    'method' => 'GET',
    'columns' => 4,
    'formAttributes' => [],
])

@php
    $titleId = $id ? $id.'_title' : 'ui_filter_panel_'.uniqid();
    $resolvedMethod = strtoupper((string) $method);
    $htmlMethod = in_array($resolvedMethod, ['GET', 'POST'], true) ? $resolvedMethod : 'POST';
    $resolvedColumns = max(1, min(4, (int) $columns));
    $formAttributeBag = new \Illuminate\View\ComponentAttributeBag($formAttributes);
@endphp

<section
    {{ $attributes->class([
        'ui-filter-panel',
        'ui-filter-panel--has-icon' => (bool) $icon,
    ])->merge([
        'id' => $id,
        'aria-labelledby' => $titleId,
    ]) }}
>
    <div class="ui-filter-panel__header">
        <div class="ui-filter-panel__heading">
            @if ($icon)
                <span class="ui-filter-panel__icon" aria-hidden="true">
                    <x-ui.icon :name="$icon" size="16" />
                </span>
            @endif
            <h3 id="{{ $titleId }}">{{ $title }}</h3>
        </div>

        @isset($context)
            <div class="ui-filter-panel__context" data-partial-placeholder="text">
                {{ $context }}
            </div>
        @endisset
    </div>

    <form
        {{ $formAttributeBag->class('ui-filter-panel__form')->merge([
            'method' => $htmlMethod,
            'action' => $action,
        ]) }}
    >
        @if (! in_array($resolvedMethod, ['GET', 'POST'], true))
            @method($resolvedMethod)
        @endif

        @isset($hidden)
            {{ $hidden }}
        @endisset

        <div class="ui-filter-panel__fields ui-filter-panel__fields--{{ $resolvedColumns }}">
            {{ $slot }}
        </div>

        @if (isset($footer) || isset($actions))
            <div class="ui-filter-panel__footer">
                @isset($footer)
                    <div class="ui-filter-panel__footer-content">
                        {{ $footer }}
                    </div>
                @endisset

                @isset($actions)
                    <div class="ui-filter-panel__actions">
                        {{ $actions }}
                    </div>
                @endisset
            </div>
        @endif
    </form>
</section>