feat: multiselect field for filtering

This commit is contained in:
Björn Fromme
2024-07-15 18:25:14 +02:00
parent 1cb0227d1e
commit 7d84f321da
9 changed files with 151 additions and 31 deletions
+17 -1
View File
@@ -216,4 +216,20 @@
{{ icon('search', 'w-4 h-4 text-gray-700') }}
</div>
</div>
{%- endblock autocomplete_widget %}
{%- endblock autocomplete_widget -%}
{%- block multiselect_widget -%}
<div class="relative" {{ stimulus_controller('multiselect', { 'placeholder': form.vars.empty_label }) }}>
<div {{ stimulus_action('multiselect', 'toggle', 'click')}}
role="button"
class="relative rounded-md border border-gray-300 flex items-center space-x-2 px-3">
<div {{ stimulus_target('multiselect', 'label') }} class="flex-1 h-8 py-1.5 text-gray-900 text-sm overflow-hidden whitespace-nowrap"></div>
{{ icon('dots', 'w-4 h-4') }}
</div>
<div {{ stimulus_target('multiselect', 'dropdown')}} class="absolute z-10 top-full -mt-1.5 left-0 inset-x-0 px-3 py-2 bg-white shadow-lg rounded-md rounded-t-none border border-gray-300 border-t-0 hidden">
{% for item in form.children %}
{{ form_row(item, { 'attr': { 'data-action': 'multiselect#update', 'data-multiselect-target': 'choice', 'data-label': item.vars.label } }) }}
{% endfor %}
</div>
</div>
{%- endblock multiselect_widget -%}