@uifabric/experiments/lib-commonjs/components/signals/examples/SignalField.Basic.Example.js

Experimental React components for building experiences for Office 365.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var SignalField_1 = require("../SignalField");
var Signals_1 = require("../Signals");
var example_app_base_1 = require("@uifabric/example-app-base");
var Checkbox_1 = require("office-ui-fabric-react/lib/Checkbox");
var text = example_app_base_1.lorem(4);
var SignalFieldBasicExample = /** @class */ (function (_super) {
    tslib_1.__extends(SignalFieldBasicExample, _super);
    function SignalFieldBasicExample(props) {
        var _this = _super.call(this, props) || this;
        _this._onModeChange = function (event, checked) {
            _this.setState({
                mode: checked ? 'wide' : 'compact'
            });
        };
        _this.state = {
            mode: 'compact'
        };
        return _this;
    }
    SignalFieldBasicExample.prototype.render = function () {
        return (React.createElement("div", null,
            React.createElement(Checkbox_1.Checkbox, { label: "Wide?", onChange: this._onModeChange, checked: this.state.mode === 'wide' }),
            React.createElement(SignalField_1.SignalField, { signalsFieldMode: this.state.mode, before: [React.createElement(Signals_1.YouCheckedOutSignal, { key: "a" })], after: [React.createElement(Signals_1.AwaitingApprovalSignal, { key: "b" })] }, text)));
    };
    return SignalFieldBasicExample;
}(React.Component));
exports.SignalFieldBasicExample = SignalFieldBasicExample;
//# sourceMappingURL=SignalField.Basic.Example.js.map