office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 1.27 kB
JavaScript
module.exports = "import * as React from 'react';\r\nimport {\r\n Facepile,\r\n IFacepileProps,\r\n Slider\r\n} from '../../../../index';\r\nimport { facepilePersonas } from './FacepileExampleData';\r\nimport './Facepile.Examples.scss';\r\n\r\nexport interface IFacepileBasicExampleState {\r\n numberOfFaces: any;\r\n}\r\n\r\nexport class FacepileBasicExample extends React.Component<any, IFacepileBasicExampleState> {\r\n public constructor() {\r\n super();\r\n\r\n this.state = {\r\n numberOfFaces: 1\r\n };\r\n }\r\n\r\n public render() {\r\n let { numberOfFaces } = this.state;\r\n let facepileProps: IFacepileProps = {\r\n personas: facepilePersonas.slice(0, numberOfFaces),\r\n };\r\n\r\n return (\r\n <div className={'ms-FacepileExample'}>\r\n <Facepile {...facepileProps} />\r\n <Slider\r\n label='Number of Personas:'\r\n min={1}\r\n max={5}\r\n step={1}\r\n showValue={true}\r\n value={numberOfFaces}\r\n onChange={value => this.setState((prevState: IFacepileBasicExampleState) => {\r\n prevState.numberOfFaces = value;\r\n return prevState;\r\n })}\r\n />\r\n </div>\r\n );\r\n }\r\n}";