import * as React from 'react';

export interface MessageBoxMarketerialLayoutProps {
  /** applied as data-hook HTML attribute that can be used to create driver in testing */
  dataHook?: string;
  title: React.ReactNode;
  content: React.ReactNode;
  primaryButtonLabel?: string;
  primaryButtonDisabled?: boolean;
  primaryButtonNode?: React.ReactNode;
  secondaryButtonLabel?: string;
  onPrimaryButtonClick?: React.MouseEventHandler<HTMLButtonElement>;
  onSecondaryButtonClick?: React.MouseEventHandler<HTMLElement>;
  imageUrl?: string;
  onClose: React.MouseEventHandler<HTMLButtonElement>;
  imageComponent?: React.ReactNode;
  footerBottomChildren?: React.ReactNode;
  /** @default 'blue' */
  theme?: MessageBoxMarketerialLayoutTheme;
  primaryButtonTheme?: MessageBoxMarketerialLayoutThemePrimaryButtonTheme;
  /** @default false */
  removeButtonsPadding?: boolean;
  /** @default '600px' */
  width?: string;
  /** @default false */
  noBodyPadding?: boolean;
}

export default class MessageBoxMarketerialLayout extends React.PureComponent<MessageBoxMarketerialLayoutProps> {}

export type MessageBoxMarketerialLayoutTheme = 'blue' | 'purple' | 'white';
export type MessageBoxMarketerialLayoutThemePrimaryButtonTheme =
  | 'blue'
  | 'purple';
