All posts
· Design team· 3 min read

The Grivara blog design kit

Every component available in MDX posts, with usage examples.

designreference

These components are available inside any .mdx post. Import-free — just drop them in.

Callouts

Stat grids

Median TTD

42s

down from 9 min

Specialist agents

10

per claim packet

Auto-denials

0

by design

Pullquote

The goal isn't to replace the adjuster. It's to give them the thirty minutes back they used to spend stitching context together.

Claims VP · Tier-1 auto carrier

Steps

  1. Intake reads the FNOL

    Structured extraction across every line of business. Dates, coverages, parties, and prior policies land in the decision packet.

  2. Coverage + fraud run in parallel

    Coverage posture and fraud scoring happen concurrently. Neither blocks the other.

  3. Orchestrator assembles the packet

    One surface — citations, confidence, reasoning trace, and the recommended action.

  4. Human approves

    High-impact actions always route through an approver.

Agent trace

Claim #A-29814 · auto collision

IntakeDONE0.4s

Extracted 23 fields · 2 prior claims linked

CoverageDONE1.2s

Likely covered · collision with $500 deductible

FraudDONE2.1s

Score 0.18 · no graph collusion signal

ComplianceRUNNING2.9s

Applying TX state rules · 7 of 12 checked

OrchestratorIDLE

Waiting for compliance

ReserveNEEDS HUMAN

Recommended $14,200 · above adjuster threshold

Key takeaways

Before / after

Before

Adjuster opens 6 tabs — policy, prior claims, body-shop history, weather, state rules, notes. Context rebuilt from scratch every time.

After

One surface. Every signal, cited. The adjuster reviews, overrides if needed, and approves.

Link cards

Product

Agentic fraud detection

Graph collusion, adversarial stress, and governed escalation.

Contact

Talk to sales

Walk through the workflow with a real claim.

Inline elements

Use badges, accent badges, and

muted badges to tag status inline. Keyboard shortcuts look like ⌘ K.

Entity graph

SVG visualization of a claim's entity graph with automatic hop-ring layout. Node types are color-coded, edge weights control stroke thickness, and flagged nodes get a red dashed halo.

HOP 1POLICYCLAIMANTHAS_DOCCLM-8817POL-4412J. RiveraFNOL.pdfdamage=$14.2k
ClaimPolicyClaimantDocumentEvidence
A focal claim and its 1-hop neighborhood.

Multi-hop is the same component with more nodes. Pass hops={3} to force the ring count.

HOP 1HOP 2HOP 3CLM-8817J. RiveraShop AAtty M.CLM-8201CLM-7742CLM-6910R. Okafor
ClaimClaimantEntity
A 3-hop neighborhood with a flagged fraud neighbor at hop 2.

Score meter

Normalized 0–100 gauge with low/high band thresholds.

Fraud score · CLM-8817

72HIGH
0 · LOW ≤ 40MEDIUM · 40–70HIGH ≥ 70 · 100

Fraud score · CLM-5512

28LOW
0 · LOW ≤ 40MEDIUM · 40–70HIGH ≥ 70 · 100

Score fusion

Weighted components flowing into a fused result. Use with the four real fraud signals from the backend.

Signal components

  • Graph collusion0.78×0.35
  • Tabular risk0.45×0.25
  • Multimodal evidence0.62×0.20
  • Adversarial stress0.55×0.20

Fused fraud score

0.62

weighted fuse

Formula

Centered monospace block. Supports inline HTML (<sup>, Unicode, subscripts).

Hop decay

w(hop) = 0.3hop

Contribution shrinks by 70% per hop.

Seed propagation

s'(n) = s(n) + Σ sign(k) · sim(n, k) · 0.3hop(n, k)

Event stream

SSE-style timeline. Pair event names with JSON payloads wrapped in template literals.

Live trace · CLM-8817

GET /api/graph/claims
  • GraphNodeVisited0ms
    { "node_id": "CLM-8817", "type": "claim", "reason": "focal" }
  • ToolCallStarted12ms
    { "tool": "get_claim_risk_snapshot", "args": { "claim_id": "CLM-8817" } }
  • GraphEdgeTraversed38ms
    { "from": "CLM-8817", "to": "J. Rivera", "type": "CLAIMANT" }
  • GraphNodeVisited41ms
    { "node_id": "CLM-8201", "type": "claim", "hop": 2, "flagged": true }

That's the kit. Mix freely.

All posts