#102スコア 4/5保険

AI に保険の契約管理を作らせてみた — 金額内訳がまた手組み、次の結晶化が見えた（やってみた #102）

ルート: /insurance-policies
デスクトップ表示
モバイル表示

375px のビューポートで撮影。縦長のページはフレーム内をスクロールします。

解説記事

AI に保険の契約管理を作らせてみた — 金額内訳がまた手組み、次の結晶化が見えた（やってみた #102）

やってみたシリーズ: 自作のデザインシステム @gunjo/ui（群青）を、文脈ゼロの cold な AI に実 UI で作らせる連載。保険 2枚目——損保の契約管理 / 代理店ダッシュボード（保有契約・更新失効リスク・代理店業績・保険料内訳）。

#101査定とは別の契約/営業系。観測の核——#101 で起票した CalculationLedger（金額導出ブロック）が、保険料内訳でまた手組みされるか。

結果 — 4/5・~85%が composition

tsc/build 緑・375px・0 console error。KPI・保有契約一覧・更新失効リスク・代理店業績・保険料内訳・契約ドリルイン。

観測 — 部品は揃い、逆引き索引も効く。だが金額内訳だけは…

cold AI（群青を一度も触っていない設定）のレポートから:

StatGroup（KPI）・PersonCell（契約者/募集人）・RelationshipRow（募集人↔担当契約・「zero fighting」）・DataTable（renderCard でモバイルカード）・Meter（業績）・formatCurrency（JPY既定） が全部 composition。/docs/by-use-case 索引が秀逸でその働きを果たした——「何を作りたいか」で引いて RelationshipRow（名前は agent↔policy を叫ばない）に辿り着けた。

唯一の本当の穴＝保険料内訳を手組み（基本保険料 ＋ 特約 − 各割引 = 年間保険料）。「read-only の『labeled 明細＋符号付き調整＋合計』表示 primitive が無い。索引は EditableDataTable に誘導したが、あれはエディタグリッド＝read-only の保険料明細には作法が違う。Delta（符号付き行の atom・割引/加算の SR ラベル付き）で組んだ」。

CalculationLedger の手組みは2回連続（#101 査定額＋#102 保険料内訳・別々の cold AI が独立に）＝3回ルール 2/3。しかも cold AI が部品の atom（Delta）と作法まで設計してくれた——「CostBreakdown は Delta＋Separator＋formatCurrency を composition：グループ別 labeled 明細 → 符号付き調整 → 小計 → 総計＋数式キャプション」。あと1回 金融/保険で出れば build。

起票（追記）

  • 🟠 CalculationLedger 2回目（#347・逆引き索引が EditableDataTable に誤誘導＝編集明細 vs read-only 金額内訳を区別すべき・Delta が行 atom）。
  • 🟢 Drawer の side が Root と Content の2箇所＋既定幅 w-80 が狭い（#335）・Select(onChange) vs SearchInput(onValueChange) の API 不一致・TimelineItem は status でなく variant（#330）。

今回 src build なし（4/5・RelationshipRow 含む再利用が成果・CalculationLedger は 2/3 で次回 build 候補）。

学び — 索引は効く、が「合成 primitive」には更新が要る

#101 で逆引き索引が CoSign を救い、#102 でも RelationshipRow を救った——索引は効く。だが #102 は索引の限界も見せた：金額内訳を「EditableDataTable（エディタ）」に誤誘導した。索引は『完成した部品』には強いが、『atom を組んで作るべきもの（CostBreakdown=Delta合成）』には、まだ部品が無い穴を指せない。 だから次の一手は明確——金融横断で2回手組みされた CalculationLedger/CostBreakdown を結晶化し、索引をそこへ向ける。部品が穴を埋め、索引がそれを指す、の両輪。

次回予告（やってみた #103）

  • 保険3枚目（引受査定/申込審査 など）。CalculationLedger 3回目＝build トリガー（保険料計算で再出現の可能性大）。

試す

<!-- 公開前: 相互URL差込／スクショ確定／EN(dev.to)ミラー -->

使用した @gunjo/ui コンポーネント

この画面のソースが直接 import している部品です。

BadgeButtonCardCardContentCardDescriptionCardHeaderCardTitleColumnDefDataTableDeltaDrawerDrawerCloseDrawerContentDrawerDescriptionDrawerFooterDrawerHeaderDrawerTitleEmptyStateMetadataListMeterPersonCellRelationshipRowSearchInputSelectSeparatorStatGroupTabsTabsContentTabsListTabsTriggerTagTimelineTimelineDescriptionTimelineItemTimelineTimeTimelineTitle

cold AI が組み上げた実コード

ファイル名をクリックでソースを展開できます。