@props(['width' => 'w-auto', 'height' => 'h-auto', 'chartData' => []])

@php

    $chartDataJson = is_array($chartData) ? json_encode($chartData) : $chartData;
@endphp
<div class="{{ $width }} {{ $height }}">
    <x-base.chart
        id="report-donut-chart" data-chart-data="{{ $chartDataJson }}"
        {{ $attributes->merge($attributes->whereDoesntStartWith('class')->getAttributes()) }}
    >
    </x-base.chart>
</div>

@pushOnce('scripts')
    @vite('resources/js/utils/colors.js')
    @vite('resources/js/components/report-donut-chart.js')
@endPushOnce