Stat
KPI / 指标单独显示。包装 daisyUI 的 stats + stat 类，除 label / value / desc 外，还有 valueColor / trend / trendValue 控制着色和方向箭头。多个并排时设 wrapped=false，外层自行 <div class="stats">。
default label + value だけ — wrapped=true, valueColor=null, trend=null
Visits
1,234
+ desc — 補足テキスト
Visits
1,234
since last month
valueColor — null / primary / secondary / accent / info / success / warning / error
null (default)
42.0K
valueColor=null
primary
42.0K
valueColor=primary
secondary
42.0K
valueColor=secondary
accent
42.0K
valueColor=accent
info
42.0K
valueColor=info
success
42.0K
valueColor=success
warning
42.0K
valueColor=warning
error
42.0K
valueColor=error
trend — up / down / flat (desc に arrow + 色付け + trendValue)
Signups
2,847
↑ vs last week +12%
Refunds
38
↓ vs last week -3%
Sessions
9,120
→ vs last week ±0%
with icon (slot) — stat-figure に SVG icon を挿入。valueColor を渡すと icon も同色に
Downloads
31K
今月
Likes
1.2K
累計
Verified
89%
↑ ユーザー認証率 +2.1%
wrapped=false — 複数 stat を 1 つの stats container にまとめる (ダッシュボード風)
Total Visits
89,400
累計
New Users
2,103
↑ 今月新規 +18%
Revenue
¥1.2M
↑ MTD +4.7%
使い方
{{-- 最小 --}}
<x-stat label="Visits" value="1,234" />
{{-- + desc --}}
<x-stat label="Visits" value="1,234" desc="since last month" />
{{-- value に色 --}}
<x-stat label="Errors" value="38" valueColor="error" />
{{-- trend (up=text-success ↑ / down=text-error ↓ / flat=灰 →) --}}
<x-stat label="Signups" value="2,847" trend="up" trendValue="+12%" desc="vs last week" />
<x-stat label="Refunds" value="38" trend="down" trendValue="-3%" />
{{-- icon (stat-figure に slot) --}}
<x-stat label="Downloads" value="31K" valueColor="primary">
<svg class="h-8 w-8 stroke-current" ... />
</x-stat>
{{-- 複数並べる: 外側 stats を自前で作って wrapped=false --}}
<div class="stats stats-vertical lg:stats-horizontal shadow">
<x-stat wrapped="false" label="Visits" value="89,400" />
<x-stat wrapped="false" label="Users" value="2,103" trend="up" trendValue="+18%" />
<x-stat wrapped="false" label="Revenue" value="¥1.2M" valueColor="success" />
</div>