ErrorCard

Error card component for displaying error messages.

import { ErrorCard } from "@tetherto/mdk-react-devkit";

Prop	Status	Type	Default	Description
`error`	Required	`string`	—	Error message string. Supports `\n` for line breaks.
`title`	Optional	`string \| undefined`	`"Errors"`	Title displayed above the error message
`variant`	Optional	`ErrorCardVariant \| undefined`	`"card"`	Display variant. "card" shows a bordered container, "inline" shows flat text.
`className`	Optional	`string \| undefined`	—	Additional CSS class name

Usage

Displays one or more error messages in a card or inline style. Multi-line messages are supported using \n separators.

Example

/** * Runnable example for ErrorCard. */import { ErrorCard } from '@tetherto/mdk-react-devkit'export const ErrorCardExample = () => (  <div className="mdk-example-row" style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>    {/* Default card variant */}    <ErrorCard error="Connection timed out. Please try again." />    {/* Card variant with custom title */}    <ErrorCard      title="Authentication Error"      error="Invalid credentials. Please check your username and password."    />    {/* Multi-line error */}    <ErrorCard      title="Validation Errors"      error={        "Field 'name' is required\nField 'email' must be a valid address\nField 'password' must be at least 8 characters"      }    />    {/* Inline variant */}    <ErrorCard      variant="inline"      title="Warning"      error="Some miners are reporting high temperatures."    />  </div>)