{{--
    テーブル内ソート項目タイトルを生成する
    @props key ソート項目キー
    @props text 項目タイトル
--}}
@props(['key', 'text'=>null, 'param'])
<div class=" flex items-center justify-between">
    <a href="javascript:void(0)" class="flex-1 text-center"
        @click="sort('{{$key}}')">{{$text?? $slot}}</a>
    <span>
        <i class="fa-solid fa-caret-up" 
            x-show="('{{$param->sort_order_key}}'=='{{$key}}' && '{{$param->sort_order_type}}'=='asc')"></i>
        <i class="fa-solid fa-caret-down" 
            x-show="('{{$param->sort_order_key}}'=='{{$key}}' && '{{$param->sort_order_type}}'=='desc')"></i>
    </span>
</div>