@nutui/nutui-react/dist/cjs/packages/checkboxgroup/checkboxgroup.js

京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序

"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "CheckboxGroup", {
    enumerable: true,
    get: function() {
        return CheckboxGroup;
    }
});
var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
var _define_property = require("@swc/helpers/_/_define_property");
var _object_spread = require("@swc/helpers/_/_object_spread");
var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
var _classnames = /*#__PURE__*/ _interop_require_default._(require("classnames"));
var _checkbox = require("../checkbox/checkbox");
var _context = /*#__PURE__*/ _interop_require_default._(require("./context"));
var _usepropsvalue = require("../../hooks/use-props-value");
var defaultProps = {
    max: undefined,
    min: undefined,
    list: false,
    labelPosition: 'right',
    direction: 'vertical',
    onChange: function onChange(value) {},
    onLimit: function onLimit(type) {},
    options: []
};
var classPrefix = 'nut-checkboxgroup';
var CheckboxGroup = /*#__PURE__*/ _react.default.forwardRef(function(props, ref) {
    var _ref = (0, _object_spread._)({}, defaultProps, props), children = _ref.children, className = _ref.className, disabled = _ref.disabled, list = _ref.list, value = _ref.value, defaultValue = _ref.defaultValue, max = _ref.max, min = _ref.min, labelPosition = _ref.labelPosition, direction = _ref.direction, options = _ref.options, onChange = _ref.onChange, onLimit = _ref.onLimit, rest = (0, _object_without_properties._)(_ref, [
        "children",
        "className",
        "disabled",
        "list",
        "value",
        "defaultValue",
        "max",
        "min",
        "labelPosition",
        "direction",
        "options",
        "onChange",
        "onLimit"
    ]);
    (0, _react.useImperativeHandle)(ref, function() {
        return {
            toggle: function toggle(state) {
                if (state === false) {
                    setValue([]);
                } else {
                    var childrenLabel = [];
                    _react.default.Children.map(children, function(child) {
                        var childProps = child.props;
                        childrenLabel.push(childProps.value);
                    });
                    setValue(childrenLabel);
                }
            },
            reverse: function reverse() {
                var childrenLabel = [];
                _react.default.Children.map(children, function(child) {
                    var childProps = child.props;
                    childrenLabel.push(childProps.value);
                });
                var reverse = childrenLabel.filter(function(c) {
                    return (_value === null || _value === void 0 ? void 0 : _value.findIndex(function(v) {
                        return v === c;
                    })) === -1;
                });
                setValue(reverse);
            }
        };
    });
    var _usePropsValue = (0, _sliced_to_array._)((0, _usepropsvalue.usePropsValue)({
        value: value,
        defaultValue: defaultValue,
        finalValue: [],
        onChange: onChange
    }), 2), _value = _usePropsValue[0], setValue = _usePropsValue[1];
    var renderOptions = (0, _react.useCallback)(function() {
        return options === null || options === void 0 ? void 0 : options.map(function(_param) {
            var label = _param.label, value = _param.value, disabled = _param.disabled, onChange = _param.onChange, rest = (0, _object_without_properties._)(_param, [
                "label",
                "value",
                "disabled",
                "onChange"
            ]);
            return /*#__PURE__*/ _react.default.createElement(_checkbox.Checkbox, (0, _object_spread._)({
                key: value === null || value === void 0 ? void 0 : value.toString(),
                label: label,
                disabled: disabled,
                value: value
            }, rest));
        });
    }, [
        options,
        max,
        min
    ]);
    var _obj;
    return /*#__PURE__*/ _react.default.createElement(_context.default.Provider, {
        value: {
            labelPosition: labelPosition || 'right',
            disabled: disabled,
            max: max,
            list: list,
            onLimit: onLimit,
            value: _value,
            check: function check(value) {
                var combined = (0, _to_consumable_array._)(_value).concat([
                    value
                ]);
                if (max !== undefined) {
                    if (combined.length > max) {
                        return onLimit === null || onLimit === void 0 ? void 0 : onLimit('max');
                    }
                }
                setValue(combined);
            },
            uncheck: function uncheck(value) {
                var reduced = _value.filter(function(item) {
                    return item !== value;
                });
                if (min !== undefined && reduced.length < min) {
                    return onLimit === null || onLimit === void 0 ? void 0 : onLimit('min');
                }
                setValue(reduced);
            }
        }
    }, /*#__PURE__*/ _react.default.createElement("div", (0, _object_spread._)({
        className: (0, _classnames.default)(classPrefix, (_obj = {}, (0, _define_property._)(_obj, "nut-checkboxgroup-".concat(direction), direction), (0, _define_property._)(_obj, "nut-checkboxgroup-list", list), _obj), className)
    }, rest), (options === null || options === void 0 ? void 0 : options.length) ? renderOptions() : children));
});
CheckboxGroup.displayName = 'NutCheckboxGroup';