@wix/design-system
Version:
@wix/design-system
42 lines (37 loc) • 1.5 kB
TypeScript
import * as React from 'react';
export type PreviewWidgetSkin = 'neutral' | 'gradient' | 'custom';
export type PreviewWidgetContentOutline = 'shadow' | 'border' | 'none';
export interface PreviewWidgetProps {
/** Applies a data-hook HTML attribute to be used in the tests*/
dataHook?: string;
/** Specifies a CSS class name to be appended to the component’s root element.
* @internal
*/
className?: string;
/** Sets the color of the content area background (`neutral` or `gradient`). To use custom skin color, set it to `custom` and use the `backgroundColor` prop
* @default 'neutral'
*/
skin?: PreviewWidgetSkin;
/** Sets the content outline as `shadow` (default), `border` or `none`
* @default 'shadow'
*/
contentOutline?: PreviewWidgetContentOutline;
/** Sets content area background color in HEX code. Can be set with custom colors (from WSR design system color palette) */
backgroundColor?: string;
/** Adjusts the height of the component or can be set in specific % or px
* @default 'auto'
*/
height?: string;
/** Sets the width of the component in % or px
* @default '100%'
*/
width?: string;
/** Enables vertical scroll of the overflowed content *
* @default false
*/
scrollable?: boolean;
/** Sets the main preview content. Accepts an image, text paragraph or any other custom element */
children: React.ReactNode;
}
declare const PreviewWidget: React.ComponentClass<PreviewWidgetProps>;
export default PreviewWidget;