<div x-data class="divide-y divide-primary-200">
    {{ disclosures }}
        <div x-disclosure class="py-4">
            <button x-disclosure:button class="w-full flex justify-between items-center text-left text-lg font-semibold">
                {{ title }}
                <div class="transition-transform" :class="$disclosure.isOpen ? 'rotate-180' : ''">
                    {{ partial:components/atoms/icons/chevron-down x-show="$disclosure.isOpen" x-cloak="true" }}
                </div>
            </button>
            <div x-disclosure:panel x-collapse>
                <div class="py-4">
                    {{ partial:components/atoms/text/prose }}
                </div>
            </div>
        </div>
    {{ /disclosures }}
</div>

