UNPKG

preact-arco-design

Version:

Arco Design React UI Library.

128 lines (116 loc) 4.07 kB
var __read = this && this.__read || function (o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) { ar.push(r.value); } } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; }; var __spreadArray = this && this.__spreadArray || function (to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); }; import React, { createContext, useContext, useCallback, useState } from "preact/compat"; import Checkbox from "./checkbox"; import cs from "../_util/classNames"; import { ConfigContext } from "../ConfigProvider"; import useMergeValue from "../_util/hooks/useMergeValue"; import { isArray, isObject } from "../_util/is"; export var CheckboxGroupContext = createContext({ isCheckboxGroup: false, checkboxGroupValue: [], onGroupChange: function onGroupChange() {}, registerValue: function registerValue() {}, unRegisterValue: function unRegisterValue() {} }); function Group(props) { var _a; var _b = __read(useMergeValue([], { defaultValue: 'defaultValue' in props ? props.defaultValue || [] : undefined, value: 'value' in props ? props.value || [] : undefined }), 2), value = _b[0], setValue = _b[1]; var _c = __read(useState([]), 2), allOptionValues = _c[0], setAllOptionValues = _c[1]; var _d = useContext(ConfigContext), getPrefixCls = _d.getPrefixCls, rtl = _d.rtl; var disabled = props.disabled, options = props.options, style = props.style, className = props.className, error = props.error, children = props.children, _e = props.direction, direction = _e === void 0 ? 'horizontal' : _e; var prefixCls = getPrefixCls('checkbox'); var classNames = cs("".concat(prefixCls, "-group"), (_a = {}, _a["".concat(prefixCls, "-group-is-error")] = error, _a["".concat(prefixCls, "-group-direction-").concat(direction)] = direction, _a["".concat(prefixCls, "-group-rtl")] = rtl, _a), className); var onChange = useCallback(function (optionValue, checked, e) { var newVal = value.slice(); if (checked) { newVal.push(optionValue); } else { newVal.splice(value.indexOf(optionValue), 1); } setValue(newVal); props.onChange && props.onChange(newVal.filter(function (v) { return allOptionValues.indexOf(v) > -1; }), e); }, [value, props.onChange, allOptionValues]); return React.createElement("span", { className: classNames, style: style }, React.createElement(CheckboxGroupContext.Provider, { value: { isCheckboxGroup: true, checkboxGroupValue: value, onGroupChange: onChange, disabled: disabled, registerValue: function registerValue(value) { setAllOptionValues(function (allOptionValues) { return Array.from(new Set(__spreadArray(__spreadArray([], __read(allOptionValues), false), [value], false))); }); }, unRegisterValue: function unRegisterValue(value) { setAllOptionValues(function (allOptionValues) { return allOptionValues.filter(function (x) { return x !== value; }); }); } } }, isArray(options) ? options.map(function (option) { var label = isObject(option) ? option.label : option; var checkValue = isObject(option) ? option.value : option; return React.createElement(Checkbox, { disabled: disabled || isObject(option) && option.disabled, key: checkValue, value: checkValue }, label); }) : children)); } Group.displayName = 'CheckboxGroup'; export default Group;