指標グループStatGroupExperimental

The summary metric strip: a responsive grid of Statistics (Card-wrapped by default) — the KPI row almost every back-office screen opens with (件数 / 金額 / 期限 / アラート …). Fixed or responsive column counts ({ base: 2, md: 4 }). Presentational and RSC-safe (no function props) — pass plain data. For one metric use Statistic; for the row, use this.

プレビュー

請求対象者

6名

未確定 3件

請求総額

¥1,224,520

介護給付＋利用者負担

国保連請求分

¥1,019,911

限度額超過者

1名

提出期限

6/10

あと4日

Props

表は横にスクロールできます
プロパティ型初期値説明
itemsStatisticProps[]-各指標。Statistic の全プロップ（label/value/change/trend/tone/hint）。
cols1–6 | { base?, sm?, md?, lg?, xl? }{ base: 2, md: 4 }列数（固定 or レスポンシブ）。
cardbooleantrue各 Statistic を Card で囲む（back-office のサマリ行）。

Usage

import { StatGroup } from "@gunjo/ui"

<StatGroup
  cols={{ base: 2, md: 3, lg: 5 }}
  items={[
    { label: "請求対象者", value: "6名", hint: "未確定 3件" },
    { label: "請求総額", value: "¥1,224,520" },
    { label: "限度額超過者", value: "1名", tone: "negative" },
    { label: "提出期限", value: "6/10", change: "あと4日", trend: "down" },
  ]}
/>

使用コンポーネント

StatisticCard