EnterUI
DocsComponentsThemesExamplesDonation
Get Started
      • FeatureFlagToggle
      • EnvironmentBadge
      • ApiKeyField
      • SecretInput
      • WebhookEndpointCard

Default usage

  1. EnterUI
  2. /Docs
  3. /Product Operations
  4. /Workflow and Admin
  5. /Operations
  6. /WebhookEndpointCard
Updated 3 October 2026

WebhookEndpointCard

Card surface for a webhook endpoint — URL, method, status, signing-secret state, events, last delivery, and ops actions.

Card surface for a webhook endpoint — URL, method, status, signing-secret state, events, last delivery, and ops actions.

#Default usage

Build webhook

Compose with FormLayout / SettingsSection. Use status to surface paused / error.

Build webhook

POSThttps://example.com/hooks/build

Posts when a release is built.

ActiveSigning secret set
build.completedbuild.failed
2 min ago — 200 OK
Code
<WebhookEndpointCard
  title="Build webhook"
  description="Posts when a release is built."
  url="https://example.com/hooks/build"
  events={["build.completed", "build.failed"]}
  status="active"
  signingSecretConfigured
  lastDelivery="2 min ago — 200 OK"
/>

#Import

Code
import { WebhookEndpointCard } from "@froggdesign/enter-ui-react";

#Accessibility

Card renders as a <section> with a heading and labelled action buttons. URL copy uses the standard CopyButton.

#API

  • url: required.
  • method, events, status, signingSecretConfigured, lastDelivery: state slots.
  • onSendTest, onRotateSecret, onDisable: action callbacks. Buttons render only when the callback is provided.
  • actions: extra slot for menus.
  • loading: surface a data-loading="true" attribute.

#Styling

Every exported component accepts className. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.

PreviousSecretInput
NextTokens
On this page
  • Default usage
  • Import
  • Accessibility
  • API
  • Styling