import { ComponentPropsWithoutRef } from 'react'; import { DataTrackingId, LayoutUtilProps, OnCloseProps, Status } from '../../types'; import { AiMarkWithTooltipOrPopoverConfig } from '../../types/ai-marks'; /** * Props for the Alert component * @extends ComponentPropsWithoutRef<"div"> * @extends LayoutUtilProps * @extends OnCloseProps */ export type AlertProps = ComponentPropsWithoutRef<"div"> & LayoutUtilProps & OnCloseProps & { /** * The visual style of an alert. * @default info */ status?: Status; /** * The title text displayed in the alert. */ title: string; /** * When set, displays the AI mark inline after the title. * Use `true` for the sparkle only, or pass tooltip/popover configuration. */ aiMark?: boolean | AiMarkWithTooltipOrPopoverConfig; } & /** * Data tracking id */ DataTrackingId; /** * Alert component for displaying important messages to users. * * Features: * - Supports different visual styles (info, success, warning, danger) * - Optional close button for dismissible alerts * - Optional AI mark inline after the title * - Customizable title and content * - Accessible with proper ARIA roles * - Includes status-specific icons * - Supports layout utilities for positioning and spacing * - Automatic tracking ID generation for analytics * * @example * console.log('Alert closed')} * > * The system will be updated tonight. * * * @example * * Your changes have been saved successfully. * */ export declare const Alert: import('react').ForwardRefExoticComponent, HTMLDivElement>, "ref"> & LayoutUtilProps & OnCloseProps & { /** * The visual style of an alert. * @default info */ status?: Status; /** * The title text displayed in the alert. */ title: string; /** * When set, displays the AI mark inline after the title. * Use `true` for the sparkle only, or pass tooltip/popover configuration. */ aiMark?: boolean | AiMarkWithTooltipOrPopoverConfig; } & DataTrackingId & import('react').RefAttributes>;