import React, { useState, useEffect, useContext } from 'react';
import classNames from 'classnames';
import { ConfigContext } from '../config-provider/config-context';
import { getPrefixCls } from '../_utils/general';
import Tag from './index';
var CheckableTag = function (props) {
    var _a;
    var _b = props.defaultChecked, defaultChecked = _b === void 0 ? true : _b, customisedCls = props.prefixCls, onChange = props.onChange, className = props.className, style = props.style, children = props.children;
    var _c = useState('checked' in props ? props.checked : defaultChecked), checked = _c[0], setChecked = _c[1];
    var configContext = useContext(ConfigContext);
    var prefixCls = getPrefixCls('checkable-tag', configContext.prefixCls, customisedCls);
    var cls = classNames(prefixCls, className, (_a = {},
        _a[prefixCls + "_checked"] = checked,
        _a));
    var itemOnClick = function (e) {
        var state = !checked;
        !('checked' in props) && setChecked(state);
        onChange && onChange(state, e);
    };
    useEffect(function () {
        'checked' in props && setChecked(props.checked);
    }, [props]);
    return (React.createElement(Tag, { className: cls, style: style, onClick: itemOnClick }, children));
};
CheckableTag.displayName = 'CheckableTag';
export default CheckableTag;
//# sourceMappingURL=checkable-tag.js.map