Feedback

Result

Feedback page for operation results — success, error, warning, info, and HTTP error states.

Payment Successful

Your order #2024-001 has been placed.

Submission Failed

Please check your connection and try again.

Low Balance

Top up to continue.

Page Not Found

The page you visited does not exist.

Installation

npx benflux-ui add result

Usage

import { Result } from "@benflux-ui/react"

<Result
  status="success"
  title="Payment Successful"
  subTitle="Order #1234 has been confirmed."
  extra={<Button>View Order</Button>}
/>

// Status options: "success" | "error" | "warning" | "info" | "404" | "403" | "500"

Props

PropTypeDefaultDescription
status*"success" | "error" | "warning" | "info" | "404" | "403" | "500"Result state which determines the icon and color
titleReactNodeMain heading text
subTitleReactNodeSecondary description below the title
extraReactNodeAction buttons or extra content rendered below
iconReactNodeCustom icon to replace the default status icon