@props([
'rows',
'labelKey' => 'label',
'valueKey' => 'value',
'metaKey' => null,
'money' => false,
'hrefKey' => null,
'color' => 'var(--panel-primary)',
])
@php
$rows = collect($rows);
$max = max(1, (float) $rows->max($valueKey));
@endphp
{{--
Horizontal bars. RTL-native: each bar grows from the right edge, which is where a
Persian reader's eye starts. Widths are percentages of the largest row, so the chart
needs no axis and no measurement pass.
--}}
merge(['class' => 'space-y-2.5']) }}>
@foreach ($rows as $row)
@php
$value = (float) data_get($row, $valueKey);
$href = $hrefKey ? data_get($row, $hrefKey) : null;
$width = max(1.5, $value / $max * 100);
@endphp
-
<{{ $href ? 'a' : 'div' }}
@if ($href) href="{{ $href }}" wire:navigate @endif
class="group block {{ $href ? 'cursor-pointer' : '' }}"
>
{{ data_get($row, $labelKey) }}
{{ $money ? number_format($value) : $value }}
@if ($metaKey && data_get($row, $metaKey) !== null)
({{ data_get($row, $metaKey) }})
@endif
{{ $href ? 'a' : 'div' }}>
@endforeach