"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (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 (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const styles_1 = require("../../styles");
const Context_1 = require("./Context");
const sc = __importStar(require("./styles"));
const Box_1 = require("../Box");
const Icon_1 = require("../Icon");
const utils_1 = require("../../styles/utils");
const ToggleButtonComponent = (props, ref) => {
    const { checked: checkedProp, name: nameProp, onChange, value, children } = props, other = __rest(props, ["checked", "name", "onChange", "value", "children"]);
    const radioGroup = react_1.useContext(Context_1.Context);
    let checked = checkedProp;
    let name = nameProp;
    const handleChange = (event) => {
        if (other.disabled)
            return;
        if (onChange)
            onChange(event);
        if (radioGroup)
            radioGroup.onChange(event);
    };
    if (radioGroup) {
        if (typeof checked === 'undefined') {
            checked = radioGroup.value === value;
        }
        if (typeof name === 'undefined') {
            name = radioGroup.name;
        }
    }
    return (react_1.default.createElement("label", null,
        react_1.default.createElement(sc.Input, { type: radioGroup ? 'radio' : 'checkbox', name: name, checked: checked, onChange: handleChange, value: value, ref: ref }),
        react_1.default.createElement(BoxButton, Object.assign({}, other, { checked: checked }), children)));
};
const ToggleButton = react_1.default.forwardRef(ToggleButtonComponent);
exports.default = ToggleButton;
const BoxButton = styles_1.styled(Box_1.Box)(utils_1.buttonReset, ({ theme, fluid, tight, iconPosition, disabled }) => (Object.assign(Object.assign(Object.assign({ whiteSpace: 'nowrap', position: 'relative', display: 'inline-flex', justifyContent: 'center', alignItems: 'center', flexShrink: 0, textAlign: 'center', textDecoration: 'none', letterSpacing: '0.75px', border: 'none', padding: '0.75rem 1.75rem', minHeight: '2.5rem', minWidth: tight ? '100px' : '128px', lineHeight: theme.lineHeights.tight, fontFamily: theme.fontFamilies.baseText, fontSize: theme.fontSizes[1], fontWeight: theme.fontWeights.semiBold, borderRadius: '8px' }, (fluid && { width: '100%' })), (disabled && {
    backgroundColor: theme.colors.disabled,
    color: theme.colors.inactive,
    boxShadow: 'none',
    cursor: 'not-allowed',
})), { [Icon_1.Icon]: Object.assign({}, (iconPosition && {
        [`margin${sc.getIconStyle(iconPosition)}`]: theme.space.s,
    })) })), sc.getVariant);
//# sourceMappingURL=ToggleButton.js.map