office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 5.14 kB
JavaScript
define([], function() { return "import * as React from 'react';\nimport { DocumentCard } from './DocumentCard';\nimport { DocumentCardTitle } from './DocumentCardTitle';\nimport { DocumentCardPreview } from './DocumentCardPreview';\nimport { DocumentCardLocation } from './DocumentCardLocation';\nimport { DocumentCardActivity } from './DocumentCardActivity';\nimport { DocumentCardActions } from './DocumentCardActions';\nimport { PersonaInitialsColor } from '../../Persona';\nimport { ImageFit } from '../../Image';\nimport { IButtonProps } from '../../Button';\n\nexport interface IDocumentCardProps extends React.Props<DocumentCard> {\n /**\n * The type of DocumentCard to display.\n * @default DocumentCardType.normal\n */\n type?: DocumentCardType;\n\n /**\n * Function to call when the card is clicked.\n */\n onClick?: (ev?: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * A URL to navigate to when the card is clicked. If a function has also been provided,\n * it will be used instead of the URL.\n */\n onClickHref?: string;\n\n /**\n * Optional class for document card.\n */\n className?: string;\n\n /**\n * Hex color value of the line below the card, which should correspond to the document type.\n * This should only be supplied when using the 'compact' card layout.\n */\n accentColor?: string;\n}\n\nexport enum DocumentCardType {\n /**\n * Standard DocumentCard.\n */\n normal,\n /**\n * Compact layout. Displays the preview beside the details, rather than above.\n */\n compact\n}\n\nexport interface IDocumentCardPreviewProps extends React.Props<DocumentCardPreview> {\n /**\n * One or more preview images to display.\n */\n previewImages: IDocumentCardPreviewImage[];\n\n /**\n * The function return string that will describe the number of overflow documents.\n * such as (overflowCount: number) => `+${ overflowCount } more`,\n */\n getOverflowDocumentCountText?: (overflowCount: number) => string;\n}\n\nexport interface IDocumentCardPreviewImage {\n /**\n * File name for the document this preview represents.\n */\n name?: string;\n\n /**\n * URL to view the file.\n */\n url?: string;\n\n /**\n * Path to the preview image.\n */\n previewImageSrc?: string;\n\n /**\n * Path to the image to display if the preview image won't load.\n */\n errorImageSrc?: string;\n\n /**\n * Path to the icon associated with this document type.\n */\n iconSrc?: string;\n\n /**\n * If provided, forces the preview image to be this width.\n */\n width?: number;\n\n /**\n * If provided, forces the preview image to be this height.\n */\n height?: number;\n\n /**\n * Used to determine how to size the image to fit the dimensions of the component.\n * If both dimensions are provided, then the image is fit using ImageFit.scale, otherwise ImageFit.none is used.\n */\n imageFit?: ImageFit;\n\n /**\n * Hex color value of the line below the preview, which should correspond to the document type.\n */\n accentColor?: string;\n}\n\nexport interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle> {\n /**\n * Title text. If the card represents more than one document, this should be the title of one document and a \"+X\" string. For example, a collection of four documents would have a string of \"Document.docx +3\".\n */\n title: string;\n\n /**\n * Whether we truncate the title to fit within the box. May have a performance impact.\n * @defaultvalue true\n */\n shouldTruncate?: boolean;\n}\n\nexport interface IDocumentCardLocationProps extends React.Props<DocumentCardLocation> {\n /**\n * Text for the location of the document.\n */\n location: string;\n\n /**\n * URL to navigate to for this location.\n */\n locationHref?: string;\n\n /**\n * Function to call when the location is clicked.\n */\n onClick?: (ev?: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * Aria label for the link to the document location.\n */\n ariaLabel?: string;\n}\n\nexport interface IDocumentCardActivityProps extends React.Props<DocumentCardActivity> {\n /**\n * Describes the activity that has taken place, such as \"Created Feb 23, 2016\".\n */\n activity: string;\n\n /**\n * One or more people who are involved in this activity.\n */\n people: IDocumentCardActivityPerson[];\n}\n\nexport interface IDocumentCardActivityPerson {\n /**\n * The name of the person.\n */\n name: string;\n\n /**\n * Path to the profile photo of the person.\n */\n profileImageSrc: string;\n\n /**\n * The user's initials to display in the profile photo area when there is no image.\n */\n initials?: string;\n\n /**\n * The background color when the user's initials are displayed.\n * @defaultvalue PersonaInitialsColor.blue\n */\n initialsColor?: PersonaInitialsColor;\n}\n\nexport interface IDocumentCardActionsProps extends React.Props<DocumentCardActions> {\n /**\n * The actions available for this document.\n */\n actions: IButtonProps[];\n\n /**\n * The number of views this document has received.\n */\n views?: Number;\n}\n"; });