Badge Delta code

@props([
    'trend' => 'up',
    'tone' => null,
    'icon' => true,
])

@php
    /*
    | Metric delta: a bare trend arrow and tabular figure with no chrome at
    | all, for stat cards and table cells. Tone defaults to the trend (up is
    | good) but can be overridden when a falling number is the win.
    |
    | Trends: up, down, flat
    | Tones:  positive, negative, neutral
    |
    | Usage:
    |   <x-ui.badge-delta trend="up">12.4%</x-ui.badge-delta>
    |   <x-ui.badge-delta trend="up" :icon="false">+ 4.92%</x-ui.badge-delta>
    |   <x-ui.badge-delta trend="down" tone="positive">18ms p95</x-ui.badge-delta>
    */
    $icons = ['up' => 'trend-up', 'down' => 'trend-down', 'flat' => 'minus'];

    $defaultTones = ['up' => 'positive', 'down' => 'negative', 'flat' => 'neutral'];

    $toneColors = [
        'positive' => 'text-green-700 dark:text-green-400',
        'negative' => 'text-red-700 dark:text-red-400',
        'neutral' => 'text-gray-500 dark:text-gray-400',
    ];

    $resolvedTone = $tone ?? $defaultTones[$trend] ?? 'neutral';
@endphp

<span {{ $attributes->merge(['class' => 'inline-flex items-center gap-1 text-xs font-semibold tabular-nums '.($toneColors[$resolvedTone] ?? $toneColors['neutral'])]) }}>
    @if ($icon)
        <x-ui.icon :name="$icons[$trend] ?? $icons['flat']" weight="bold" size="sm" />
    @endif
    {{ $slot }}
</span>