"use strict";
/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Toggle = void 0;
var react_1 = __importDefault(require("react"));
var bem_react_classname_1 = require("bem-react-classname");
var cn_1 = require("../cn");
/**
 * Компонент переключателя.
 */
var Toggle = /** @class */ (function (_super) {
    __extends(Toggle, _super);
    function Toggle() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.cn = bem_react_classname_1.createCn('toggle');
        _this.state = {
            checked: false,
            focused: false,
        };
        _this.handleChange = function () {
            if (!_this.props.disabled) {
                // eslint-disable-next-line react/no-access-state-in-setstate
                var nextCheckedValue = !(_this.props.checked === undefined ? _this.state.checked : _this.props.checked);
                _this.setState({ checked: nextCheckedValue });
                if (_this.props.onChange) {
                    _this.props.onChange(nextCheckedValue, _this.props.value);
                }
            }
        };
        _this.handleFocus = function (event) {
            _this.setState({ focused: true });
            if (_this.props.onFocus) {
                _this.props.onFocus(event);
            }
        };
        _this.handleUnfocus = function () { return setImmediate(function () { return _this.setState({ focused: false }); }); };
        _this.handleBlur = function (event) {
            _this.setState({ focused: false });
            if (_this.props.onBlur) {
                _this.props.onBlur(event);
            }
        };
        return _this;
    }
    Toggle.prototype.render = function () {
        var checked = this.props.checked === undefined ? this.state.checked : this.props.checked;
        return (
        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
        react_1.default.createElement("label", { className: this.cn({
                checked: checked,
                focused: this.state.focused,
                disabled: this.props.disabled,
                size: this.props.size,
            }), onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleUnfocus, onMouseUp: this.handleUnfocus, htmlFor: this.props.id, "data-test-id": this.props['data-test-id'] },
            react_1.default.createElement("span", { className: this.cn('wrapper') },
                react_1.default.createElement("input", { className: this.cn('control'), type: "checkbox", autoComplete: "off", id: this.props.id, name: this.props.name, value: this.props.value, checked: checked, disabled: this.props.disabled, onClick: Toggle.handleClick, onChange: this.handleChange }),
                react_1.default.createElement("span", { className: this.cn('switch') }),
                this.props.label && (react_1.default.createElement("span", { className: this.cn('label', { align: this.props.labelAlign }) }, this.props.label))),
            this.props.hint && (react_1.default.createElement("span", { className: this.cn('hint') }, this.props.hint))));
    };
    Toggle.handleClick = function (event) {
        event.stopPropagation();
    };
    Toggle.defaultProps = {
        size: 'm',
        labelAlign: 'right',
    };
    return Toggle;
}(react_1.default.PureComponent));
exports.Toggle = Toggle;
exports.default = cn_1.withTheme(Toggle);

//# sourceMappingURL=toggle.js.map
