@uifabric/experiments
Version:
Experimental React components for building experiences for Office 365.
95 lines (94 loc) • 2.52 kB
TypeScript
/// <reference types="react" />
import * as React from 'react';
import { ChicletCardBase } from './ChicletCard.base';
import { ITheme, IStyle } from '../../Styling';
import { IStyleFunctionOrObject, IRefObject } from '../../Utilities';
export interface IChicletCard {
}
export interface IChicletCardStyles {
/**
* Style for the root element.
*/
root?: IStyle;
/**
* Style for the icon that overlays the file preview image.
*/
icon?: IStyle;
/**
* Style for the file preview image.
*/
preview?: IStyle;
/**
* Style for preview information about the file, such as title and link.
*/
info?: IStyle;
/**
* Style for the title of the file.
*/
title?: IStyle;
/**
* Style for the dile description, which could be a link, description, etc.
*/
description?: IStyle;
}
export interface IChicletCardProps extends React.Props<ChicletCardBase> {
/**
* Optional callback to access the IChicletCard interface. Use this instead of ref for accessing
* the public methods and properties of the component.
*/
componentRef?: IRefObject<IChicletCard>;
/**
* Call to provide customized styling that will layer on top of the variant rules.
*/
styles?: IStyleFunctionOrObject<IChicletCardStyleProps, IChicletCardStyles>;
/**
* Optional class for ChicletCard.
*/
className?: string;
/**
* Function to call when the card is clicked.
*/
onClick?: (ev?: React.MouseEvent<HTMLElement>) => void;
/**
* Description to render for the component.
*/
description?: React.ReactElement<JSX.Element>;
/**
* Footer to render for the component.
*/
footer?: React.ReactElement<JSX.Element>;
/**
* Theme for the component.
*/
theme?: ITheme;
/**
* Item metadata.
*/
title?: string;
itemType?: string;
image?: string;
imageSecureUrl?: string;
/**
* The width of the preview image.
* @default '198px'
*/
imageWidth?: string;
/**
* The height of the preview image.
* @default '122px'
*/
imageHeight?: string;
imageType?: string;
imageAlt?: string;
url?: string;
}
export interface IChicletCardStyleProps {
/**
* Accept theme prop.
*/
theme: ITheme;
/**
* Accept custom classNames
*/
className?: string;
}