define(["require", "exports", "react", "office-ui-fabric-react/lib/Checkbox", "office-ui-fabric-react/lib/Link", "office-ui-fabric-react/lib/Stack"], function (require, exports, React, Checkbox_1, Link_1, Stack_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    // Optional extra props to pass through to the input element
    var inputProps = {
        onFocus: function () { return console.log('Checkbox is focused'); },
        onBlur: function () { return console.log('Checkbox is blurred'); }
    };
    // Used to add spacing between example checkboxes
    var stackTokens = { childrenGap: 10 };
    exports.CheckboxOtherExample = function () {
        // Only for the first checkbox, which is controlled
        var _a = React.useState(true), isChecked = _a[0], setIsChecked = _a[1];
        var onChange = React.useCallback(function (ev, checked) {
            setIsChecked(!!checked);
        }, []);
        return (React.createElement(Stack_1.Stack, { tokens: stackTokens },
            React.createElement(Checkbox_1.Checkbox, { label: "Controlled checkbox", checked: isChecked, onChange: onChange }),
            React.createElement(Checkbox_1.Checkbox, { label: 'Checkbox rendered with boxSide "end"', boxSide: "end" }),
            React.createElement(Checkbox_1.Checkbox, { label: "Checkbox with extra props for the input", inputProps: inputProps }),
            React.createElement(Checkbox_1.Checkbox, { label: "Checkbox with link inside the label", onRenderLabel: _renderLabelWithLink })));
    };
    function _renderLabelWithLink() {
        return (React.createElement("span", null,
            "Custom-rendered label with a",
            ' ',
            React.createElement(Link_1.Link, { href: "https://www.microsoft.com", target: "_blank" }, "link")));
    }
});
//# sourceMappingURL=Checkbox.Other.Example.js.map