"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
    var ownKeys = function(o) {
        ownKeys = Object.getOwnPropertyNames || function (o) {
            var ar = [];
            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
            return ar;
        };
        return ownKeys(o);
    };
    return function (mod) {
        if (mod && mod.__esModule) return mod;
        var result = {};
        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
        __setModuleDefault(result, mod);
        return result;
    };
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const React = __importStar(require("react"));
const PropTypes = __importStar(require("prop-types"));
const utils_1 = require("../../utils");
const ReactContext_1 = __importDefault(require("../../ReactContext"));
class CheckboxWidget extends React.Component {
    constructor(props) {
        super(props);
        this.containerRef = React.createRef();
        this.onKeyDown = (e) => {
            if (!e.key.startsWith("Arrow")) {
                return;
            }
            const inputs = this.containerRef.current.querySelectorAll("input");
            if (["ArrowRight", "ArrowDown"].includes(e.key) && document.activeElement === inputs[inputs.length - 1]) {
                e.preventDefault();
            }
            else if (["ArrowLeft", "ArrowUp"].includes(e.key) && document.activeElement === inputs[0]) {
                e.preventDefault();
            }
        };
        this.onChange = (value) => {
            if (value !== undefined && this.getOptions(this.props).invert) {
                value = !value;
            }
            this.props.onChange(value);
        };
        this.onChangeTrue = () => this.onChange(true);
        this.onChangeFalse = () => this.onChange(false);
        this.onChangeUndefined = () => this.onChange(undefined);
        this.getOptions = (props) => {
            const { Yes, No, Unknown } = props.registry.formContext.translations;
            return Object.assign({ allowUndefined: true, showUndefined: true, invert: false, trueLabel: Yes, falseLabel: No, unknownLabel: Unknown, required: this.props.required }, (0, utils_1.getUiOptions)(props));
        };
    }
    render() {
        const { value, disabled, readonly, label } = this.props;
        const options = this.getOptions(this.props);
        const { allowUndefined, showUndefined, invert, trueLabel, falseLabel, unknownLabel, required, label: uiOptionsLabel } = options;
        const hasLabel = !(0, utils_1.isEmptyString)(label) && uiOptionsLabel !== false;
        const _value = invert
            ? !value
            : value;
        const displayUndefined = (allowUndefined && showUndefined);
        const _disabled = disabled || readonly;
        const tabTargetClass = "laji-form-checkbox-widget-tab-target";
        const checkbox = (React.createElement("div", { ref: this.containerRef, className: "checkbox-container" },
            React.createElement("label", null,
                React.createElement("input", { type: "radio", value: "true", checked: _value === true, onChange: this.onChangeTrue, className: tabTargetClass, onKeyDown: this.onKeyDown, disabled: _disabled }),
                trueLabel),
            React.createElement("label", null,
                React.createElement("input", { type: "radio", value: "false", checked: _value === false, onChange: this.onChangeFalse, onKeyDown: this.onKeyDown, disabled: _disabled }),
                falseLabel),
            displayUndefined && (React.createElement("label", null,
                React.createElement("input", { type: "radio", value: "undefined", checked: _value === undefined, onChange: this.onChangeUndefined, onKeyDown: this.onKeyDown, disabled: _disabled }),
                unknownLabel))));
        const { Label } = this.props.formContext;
        return !hasLabel ? checkbox : React.createElement(React.Fragment, null,
            React.createElement(Label, { label: label, required: required, uiSchema: this.props.uiSchema, registry: this.props.registry, id: this.props.id }),
            checkbox);
    }
}
CheckboxWidget.contextType = ReactContext_1.default;
CheckboxWidget.propTypes = {
    uiSchema: PropTypes.shape({
        "ui:options": PropTypes.shape({
            allowUndefined: PropTypes.bool,
            showUndefined: PropTypes.bool,
            invert: PropTypes.bool,
            trueLabel: PropTypes.string,
            falseLabel: PropTypes.string,
            unknownLabel: PropTypes.string
        })
    }),
    schema: PropTypes.shape({
        type: PropTypes.oneOf(["boolean"])
    }),
    value: PropTypes.bool
};
exports.default = CheckboxWidget;
