import type { CSSProperties, ReactNode } from "react";
import type { SxValue } from "../CSSFab";

export type BannerLevel = "info" | "success" | "warning" | "error";
export type BannerSize = "small" | "normal" | "large";

export type BannerI18nKey = "cancel" | "action" | (string & {});

export type BannerLocaleText = Partial<
  Record<"cancel" | "action" | string, string>
>;

export interface BannerProps
  extends Omit<React.HTMLAttributes<HTMLDivElement>, "style" | "className" | "children"> {
  /** Banner content text; falls back to i18n cancel text if omitted */
  children?: ReactNode;
  /** Fired when close/cancel button is clicked */
  onCancel?: () => void;
  /** Fired when action button is clicked */
  onAction?: () => void;
  /** Banner size variant */
  size?: BannerSize;
  /** Custom cancel button text (overrides i18n) */
  cancelText?: string;
  /** Custom action button text (overrides i18n) */
  actionText?: string;
  /** Level determines icon & color scheme */
  level?: BannerLevel;
  /** Transparent mode: background becomes transparent, text turns gray */
  transparent?: boolean;
  /** Custom background color (overrides level default) */
  bannerBgColor?: string;
  /** Custom border color (overrides level default) */
  bannerBorderColor?: string;
  /** Custom icon color (overrides level default) */
  bannerIconColor?: string;
  /** Style extension via CSSFab sx (string / object / slot) */
  sx?: SxValue;
  style?: CSSProperties;
  className?: string;
  /** i18n key for built-in text lookup */
  i18nKey?: BannerI18nKey;
  /** Override locale text map */
  localeText?: BannerLocaleText;
}

declare function Banner(props: BannerProps): JSX.Element;

export { Banner };
export default Banner;
