import * as React from 'react';

export interface MarketingLayoutProps {
  /** Applies a data-hook HTML attribute that can be used in the tests. */
  dataHook?: string;
  /** Accepts image URL or a custom element to be displayed on the side of content. */
  image?: React.ReactNode;
  /** Specifies image area background color. Can be a keyword from color palette or any supported CSS color value (HEX, RGB, etc.). */
  imageBackgroundColor?: string;
  /**
   * Controls the size of the marketing layout.<br/>
   */
  size?: 'tiny' | 'small' | 'medium';
  /** Controls content direction. */
  direction?: 'horizontal' | 'vertical';
  /** Flips content layout. If true, image will be displayed on the left side of the content. */
  inverted?: boolean;
  /** Sets marketing layout actions. Accepts single or multiple interactive components. Most commonly contain `<Button/>` or `<TextButton/>`. */
  actions?: React.ReactNode;
  /** Sets the marketing layout title. Accepts text string or a custom element. */
  title?: React.ReactNode;
  /** Sets the marketing layout description. Accepts text string or a custom element. */
  description?: React.ReactNode;
  /** Adds a container for a `<Badge/>` component at the top left corner. Affect component height. */
  badge?: React.ReactNode;
  /** Specifies whether the badge is hidden. Can be used to add additional vertical spacing, if no badge is given. */
  hiddenBadge?: boolean;
  /** Controls the vertical alignment of the content. */
  alignItems?: 'center' | 'stretch';
  /** Enables padding inside image container. Use with `direction="horizontal"` layout only. */
  imagePadding?: boolean;
}
/** Marketing layout is a layout designed to promote new features or display first time visit.
 * Component has title, description, action and illustration areas. */
export default class MarketingLayout extends React.PureComponent<MarketingLayoutProps> {}