office-ui-fabric-react/lib-commonjs/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.js

Reusable React components for building experiences for Office 365.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var ChoiceGroup_1 = require("office-ui-fabric-react/lib/ChoiceGroup");
var example_data_1 = require("@uifabric/example-data");
exports.ChoiceGroupImageExample = function () {
    var _a = React.useState('bar'), selectedKey = _a[0], setSelectedKey = _a[1];
    var onChange = function (ev, option) {
        setSelectedKey(option.key);
    };
    return (React.createElement("div", null,
        React.createElement(ChoiceGroup_1.ChoiceGroup, { label: "Pick one image", selectedKey: selectedKey, options: [
                {
                    key: 'bar',
                    imageSrc: example_data_1.TestImages.choiceGroupBarUnselected,
                    imageAlt: 'Bar chart icon',
                    selectedImageSrc: example_data_1.TestImages.choiceGroupBarSelected,
                    imageSize: { width: 32, height: 32 },
                    text: 'Clustered bar chart' // This text is long to show text wrapping.
                },
                {
                    key: 'pie',
                    imageSrc: example_data_1.TestImages.choiceGroupBarUnselected,
                    selectedImageSrc: example_data_1.TestImages.choiceGroupBarSelected,
                    imageSize: { width: 32, height: 32 },
                    text: 'Pie chart'
                }
            ], onChange: onChange })));
};
//# sourceMappingURL=ChoiceGroup.Image.Example.js.map