UNPKG

ultra-design

Version:
76 lines (63 loc) 3.04 kB
import _defineProperty from '@babel/runtime/helpers/defineProperty'; import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray'; import _slicedToArray from '@babel/runtime/helpers/slicedToArray'; import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties'; import { useState, useMemo, useEffect } from 'react'; import { useMergeProps } from '../utils/mergeProps.js'; import { CheckboxContext } from './checkbox-context.js'; import { checkboxGroupStyles } from './checkbox-styles.js'; import { jsx } from '@emotion/react/jsx-runtime'; var _excluded = ["disabled", "onChange", "children"]; function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } var defaultProps = { disabled: false, className: '' }; var CheckboxGroup = function CheckboxGroup(p) { var props = useMergeProps(defaultProps, p); var disabled = props.disabled, onChange = props.onChange, children = props.children, rest = _objectWithoutProperties(props, _excluded); var value = rest.value; var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), selfVal = _useState2[0], setSelfVal = _useState2[1]; if (!value) { value = []; console.warn('Props "value" is required.', 'Checkbox Group'); } var updateState = function updateState(val, checked) { var removed = selfVal.filter(function (v) { return v !== val; }); var next = checked ? [].concat(_toConsumableArray(removed), [val]) : removed; setSelfVal(next); onChange && onChange(next); }; var providerValue = useMemo(function () { return { updateState: updateState, disabledAll: disabled, inGroup: true, values: selfVal }; }, [disabled, selfVal]); useEffect(function () { setSelfVal(value); }, [value.join(',')]); return jsx(CheckboxContext.Provider, { value: providerValue, children: jsx("div", _objectSpread(_objectSpread({ css: checkboxGroupStyles(props) }, rest), {}, { className: "ultra-checkbox-group", children: children })) }); }; CheckboxGroup.displayName = 'UltraCheckboxGroup'; var CheckboxGroup$1 = CheckboxGroup; export { CheckboxGroup$1 as default };