@cdr-kit/react/Components/HeartbeatTimer

<HeartbeatTimer>

Countdown to DeadManSwitchCondition.unlockAt with a creator-side poke() button. Flips into critical mode once < 25% of the window remains, so the UI can prompt the creator before silence becomes irreversible.

import { HeartbeatTimer } from "@cdr-kit/react"

Live preview

mock

vault #4242DeadManSwitch

unlocks in3:40

import { HeartbeatTimer, useDeadManTimer } from "@cdr-kit/react";

// Default headless render — countdown + extend button:
<HeartbeatTimer uuid={4242} />

// Custom render — full control via render-prop:
<HeartbeatTimer uuid={4242}>
{({ remainingMs, isCritical, isUnlocked, poke }) => (
  <div className={isCritical ? "warn" : ""}>
    {isUnlocked ? "unlocked" : `unlocks in ${remainingMs / 1000}s`}
    <button onClick={() => poke()}>extend now</button>
  </div>
)}
</HeartbeatTimer>

Props

Prop	Type	Default	Description
uuidrequired	number	—	DeadManSwitchCondition-gated vault uuid.
children	(state: DeadManTimer) => ReactNode	—	Optional render-prop. Receives { unlocksAt, duration, remainingMs, isUnlocked, isCritical, poke, isLoading }.

Hook variant

Skip the component and consume useDeadManTimer(uuid) directly. Returns the same state object the render-prop receives.

← Previous

EmptyVaults

TimeWindowBadge