carbon-react
Version:
A library of reusable React components for easily building user interfaces.
49 lines (48 loc) • 2.37 kB
TypeScript
import React from "react";
import { MarginProps } from "styled-system";
import { IconType } from "../icon";
import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
export type PortraitShapes = "circle" | "square";
export type PortraitSizes = "XS" | "S" | "M" | "ML" | "L" | "XL" | "XXL";
export interface PortraitProps extends MarginProps, TagProps {
/** A custom image URL. */
src?: string;
/** The size of the Portrait. */
size?: PortraitSizes;
/** @private @ignore */
name?: string;
/** The `alt` HTML string. */
alt?: string;
/** The shape of the Portrait. */
shape?: PortraitShapes;
/** Icon to be rendered as a fallback. */
iconType?: IconType;
/** The initials to render in the Portrait. */
initials?: string;
/** Use a dark background. */
darkBackground?: boolean;
/** Prop for `onClick` events. */
onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
/** [Legacy] The message to be displayed within the tooltip */
tooltipMessage?: React.ReactNode;
/** [Legacy] The id attribute to use for the tooltip */
tooltipId?: string;
/** [Legacy] Whether to to show the Tooltip */
tooltipIsVisible?: boolean;
/** [Legacy] Sets position of the tooltip */
tooltipPosition?: "top" | "bottom" | "left" | "right";
/** [Legacy] Defines the message type */
tooltipType?: string;
/** [Legacy] Defines the size of the tooltip content */
tooltipSize?: "medium" | "large";
/** [Legacy] Override background color of the Tooltip, provide any color from palette or any valid css color value. */
tooltipBgColor?: string;
/** [Legacy] Override font color of the Tooltip, provide any color from palette or any valid css color value. */
tooltipFontColor?: string;
/** The hex code of the background colour */
backgroundColor?: string;
/** The hex code of the foreground colour. This will only take effect if use in conjunction with `backgroundColor` */
foregroundColor?: string;
}
export declare const Portrait: ({ alt, backgroundColor, foregroundColor, name, darkBackground, iconType, initials, shape, size, src, onClick, tooltipMessage, tooltipId, tooltipIsVisible, tooltipPosition, tooltipType, tooltipSize, tooltipBgColor, tooltipFontColor, ...rest }: PortraitProps) => React.JSX.Element;
export default Portrait;