office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 1.3 kB
JavaScript
module.exports = "import * as React from 'react';\nimport {\n Slider,\n IFacepileProps,\n Facepile\n} from '../../../../index';\nimport { facepilePersonas } from './FacepileExampleData';\nimport './Facepile.Examples.scss';\n\nconst facepileProps: IFacepileProps = {\n personas: facepilePersonas,\n maxDisplayablePersonas: 5,\n overflowButtonProps: {\n onClick: (ev: React.MouseEvent<HTMLButtonElement>) =>\n alert('overflow icon clicked')\n }\n};\n\nexport interface IFacepileOverflowExampleState {\n displayedPersonas: any;\n}\n\nexport class FacepileOverflowExample extends React.Component<any, IFacepileOverflowExampleState> {\n public constructor() {\n super();\n\n this.state = {\n displayedPersonas: 5\n };\n }\n\n public render() {\n let { displayedPersonas } = this.state;\n facepileProps.maxDisplayablePersonas = displayedPersonas;\n\n return (\n <div className={'ms-FacepileExample'}>\n <Facepile {...facepileProps} />\n <Slider\n label='Number of Personas Shown:'\n min={0}\n max={6}\n step={1}\n showValue={true}\n value={this.state.displayedPersonas}\n onChange={value => this.setState({ displayedPersonas: value })}\n />\n </div>\n );\n }\n}";