Marlow StudioComponent library

Component library

Every Whookhound primitive in one place. Review for consistency before screen build-out.

Buttons
Inputs
Status pills
DeliveredWarningFailedPendingPartialDead
Health badges
HealthyDegradedDown
Badges
neutralsuccesswarndangerinfoaccentmuted
Event-type chips
checkout.session.completedpayment_intent.succeededcharge.refundedcustomer.subscription.updatedinvoice.paid
KPI cards
Events / 24h
17,531
+12.4%vs prev. 24h
Success rate
99.21%
-0.18%vs prev. 24h
p95 dispatch
184ms
-8.2%vs prev. 24h
Metadata match editor
=
Avatars
AMPLSOJCRP
JSON tree
{
"id": "evt_1Oq…"
"type": "checkout.session.completed"
"data": {
"object": { 2 keys }
}
}
Delivery timeline
Store A · productionattempt 1DeliveredHTTP 200142ms
12:04:18.421
{"received":true}
Fulfilment serviceattempt 1FailedHTTP 5028120ms
12:04:18.421
upstream timeout
Fulfilment serviceattempt 2Pending
in 30s
Warehouse loaderattempt 1DeliveredHTTP 200187ms
12:04:18.422
{"loaded":true}
Code block (framework tabs)
1import Stripe from 'stripe';
2const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);
3// stripe.webhooks.constructEvent(body, sig, secret);
Tokens
zinc-950
#09090b
zinc-900
#18181b
zinc-800
#27272a
zinc-700
#3f3f46
hound-300
#fdba74
hound-400
#fb923c
hound-500
#f59e0b
hound-600
#d97706
emerald-400
#34d399
amber-400
#fbbf24
red-400
#f87171
sky-400
#38bdf8