UNPKG

office-ui-fabric-react

Version:

Reusable React components for building experiences for Office 365.

86 lines (85 loc) 2.11 kB
import * as React from 'react'; import { Persona } from './Persona'; export interface IPersonaProps extends React.HTMLProps<Persona> { /** * Primary text to display, usually the name of the person. */ primaryText?: string; /** * Decides the size of the control. * @defaultvalue PersonaSize.regular */ size?: PersonaSize; /** * Url to the image to use, should be a square aspect ratio and big enough to fit in the image area. */ imageUrl?: string; /** * The user's initials to display in the image area when there is no image. */ imageInitials?: string; /** * The background color when the user's initials are displayed. * @defaultvalue PersonaInitialsColor.blue */ initialsColor?: PersonaInitialsColor; /** * Presence of the person to display - will not display presence if undefined. * @defaultvalue PersonaPresence.none */ presence?: PersonaPresence; /** * Secondary text to display, usually the role of the user. */ secondaryText?: string; /** * Tertiary text to display, usually the status of the user. */ tertiaryText?: string; /** * Optional text to display, usually a custom message set. */ optionalText?: string; /** * Whether to not render persona details, and just render the persona image/initials. */ hidePersonaDetails?: boolean; /** * Additional CSS class(es) to apply to the Persona */ className?: string; } export declare enum PersonaSize { tiny = 0, extraSmall = 1, small = 2, regular = 3, large = 4, extraLarge = 5, } export declare enum PersonaPresence { none = 0, offline = 1, online = 2, away = 3, dnd = 4, blocked = 5, busy = 6, } export declare enum PersonaInitialsColor { lightBlue = 0, blue = 1, darkBlue = 2, teal = 3, lightGreen = 4, green = 5, darkGreen = 6, lightPink = 7, pink = 8, magenta = 9, purple = 10, black = 11, orange = 12, red = 13, darkRed = 14, }