@props([
    // Either pass the record itself…
    'for' => null,
    // …or the registry alias + id directly (handy when the row is an array).
    'type' => null,
    'id' => null,
    'title' => null,
    // Note count for the badge. Falls back to a withCount('notes') / loaded
    // relation on the record; pass it explicitly to avoid an N+1 in tables.
    'count' => null,
    // 'icon' for table action columns, 'link' for text-link action columns,
    // 'button' for a labelled toolbar action, 'segment' for a labelled action
    // sitting inside a joined toolbar group (document previews).
    'variant' => 'icon',
    // Icon-button footprint: 'md' (h-8) matches most tables, 'sm' (h-7) the
    // tighter invoice/people rows.
    'size' => 'md',
    'label' => null,
])

@php
    $record = $for;
    $noteType = $type ?: ($record ? \App\Support\Notables::aliasFor($record) : null);
    $noteId = $id ?: $record?->getKey();

    if ($count === null && $record) {
        $count = $record->notes_count
            ?? ($record->relationLoaded('notes') ? $record->notes->count() : null);
    }

    $count = $count === null ? null : (int) $count;
    $noteTitle = $title ?: (($record && $noteType) ? \App\Support\Notables::title($noteType, $record) : '');
    $noteLabel = $label ?: __('Notes');
    $hint = $count ? trans_choice(':count note|:count notes', $count, ['count' => $count]) : __('Add a note');

    $box = $size === 'sm' ? 'h-7 w-7' : 'h-8 w-8';
    $glyph = $size === 'sm' ? 'h-3.5 w-3.5' : 'h-4 w-4';
@endphp

@if ($noteType && $noteId)
    @php
        $open = 'x-on:click="$dispatch(\'open-notes\', { type: '.\Illuminate\Support\Js::from($noteType).', id: '.(int) $noteId.', title: '.\Illuminate\Support\Js::from($noteTitle).' })"';
    @endphp

    @if ($variant === 'button')
        <button type="button" x-data {!! $open !!}
                {{ $attributes->merge(['class' => 'inline-flex items-center gap-1.5 rounded-xl border border-slate-300 bg-white px-3.5 py-2 text-sm font-semibold text-slate-700 shadow-sm transition hover:bg-slate-50']) }}>
            <x-icon name="sticky-note" class="h-4 w-4 text-amber-500" />
            {{ $noteLabel }}
            @if ($count)
                <span class="ml-0.5 inline-flex min-w-[1.25rem] items-center justify-center rounded-full bg-amber-100 px-1.5 py-0.5 text-[11px] font-semibold text-amber-800">{{ $count }}</span>
            @endif
        </button>
    @elseif ($variant === 'segment')
        <button type="button" x-data {!! $open !!} title="{{ $hint }}"
                {{ $attributes->merge(['class' => 'inline-flex h-8 shrink-0 items-center gap-1.5 whitespace-nowrap px-3 text-xs font-medium text-slate-600 transition hover:bg-slate-50 hover:text-slate-900']) }}>
            <x-icon name="sticky-note" class="h-3.5 w-3.5 text-amber-500" />
            {{ $noteLabel }}
            @if ($count)
                <span class="inline-flex min-w-[1.125rem] items-center justify-center rounded-full bg-amber-100 px-1 text-[10px] font-bold leading-4 text-amber-800">{{ $count }}</span>
            @endif
        </button>
    @elseif ($variant === 'link')
        <button type="button" x-data {!! $open !!} title="{{ $hint }}"
                {{ $attributes->merge(['class' => 'inline-flex items-center gap-1 transition '.($count ? 'text-amber-600 hover:text-amber-700' : 'text-slate-500 hover:text-amber-600')]) }}>
            <x-icon name="sticky-note" class="h-4 w-4" />
            {{ $noteLabel }}@if ($count) <span class="font-semibold">({{ $count }})</span>@endif
        </button>
    @else
        <button type="button" x-data {!! $open !!} title="{{ $hint }}"
                {{ $attributes->merge(['class' => 'relative inline-flex '.$box.' items-center justify-center rounded-lg transition hover:bg-amber-50 hover:text-amber-600 '.($count ? 'text-amber-500' : 'text-slate-400')]) }}>
            <x-icon name="sticky-note" :class="$glyph" />
            @if ($count)
                <span class="absolute -right-0.5 -top-0.5 inline-flex h-4 min-w-[1rem] items-center justify-center rounded-full bg-amber-500 px-1 text-[10px] font-bold leading-none text-white ring-2 ring-white">{{ $count }}</span>
            @endif
            <span class="sr-only">{{ $noteLabel }}</span>
        </button>
    @endif
@endif