wix-style-react
Version:
wix-style-react
36 lines (34 loc) • 1.9 kB
TypeScript
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> {}