gufaUIAlertError
Alert message if there is error or show success message.
Child Components
Usage
Import
ts
import { AalertError } from "@agufaui/${framework name}";
Html
<aalert-error /> or <AalertError />
Configuration
Theme component name: aalertError
Showcase
- Self-closable
Alert
Success
Click to see code
vue
<aalert-error v="Alert" :show="true" :error="true" />
<aalert-error v="Success" :show="true" :error="false" />Slot
One default slot for message span html element
AgufaUI provided Theme
CDefaultType is just string constant "default"
ts
import { CDefaultType } from "@agufaui/config";
import type { IAAlertErrorProps } from "../../types/utility/AAlertError";
export const DAAlertError: Readonly<Record<string, IAAlertErrorProps>> = {
[CDefaultType]: {
errorAAlertType: "red",
successAAlertType: "green",
},
};
Attributes (Properties)
Unique
ts
export interface IAAlertErrorProps extends IProps, IPropsComposeX {
show?: boolean; // show alert error
error?: boolean; // if error occurred
v?: string; // message. Not configurable
errorAAlertType?: string; // Child component AAlert type for error message
successAAlertType?: string; // Child component AAlert type for success message
}Inherit from IProps
ts
export interface IProps {
t?: string; // user defined or AgufaUI provided component type. Not configurable
c?: string; // css classes for component root html element
}Inherit from IPropsComposeX
ts
export interface IPropsComposeX {
spacex?: string; // space between elements in x-axis eg. space-x-1.5
}Events
ts
export interface IAAlertErrorEmits {
(e: "close"): void; // close alert error component
}