UNPKG

3.14 kBJavaScriptView Raw
1"use strict";
2
3var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
5exports.__esModule = true;
6exports.default = void 0;
7
8var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
10var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
12var _react = _interopRequireDefault(require("react"));
13
14var _invariant = _interopRequireDefault(require("invariant"));
15
16var _uncontrollable = require("uncontrollable");
17
18var _createChainedFunction = _interopRequireDefault(require("./createChainedFunction"));
19
20var _ElementChildren = require("./ElementChildren");
21
22var _ButtonGroup = _interopRequireDefault(require("./ButtonGroup"));
23
24var _ToggleButton = _interopRequireDefault(require("./ToggleButton"));
25
26var _excluded = ["children", "type", "name", "value", "onChange"];
27var defaultProps = {
28 type: 'radio',
29 vertical: false
30};
31
32var ToggleButtonGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
33 var _useUncontrolled = (0, _uncontrollable.useUncontrolled)(props, {
34 value: 'onChange'
35 }),
36 children = _useUncontrolled.children,
37 type = _useUncontrolled.type,
38 name = _useUncontrolled.name,
39 value = _useUncontrolled.value,
40 onChange = _useUncontrolled.onChange,
41 controlledProps = (0, _objectWithoutPropertiesLoose2.default)(_useUncontrolled, _excluded);
42
43 var getValues = function getValues() {
44 return value == null ? [] : [].concat(value);
45 };
46
47 var handleToggle = function handleToggle(inputVal, event) {
48 if (!onChange) {
49 return;
50 }
51
52 var values = getValues();
53 var isActive = values.indexOf(inputVal) !== -1;
54
55 if (type === 'radio') {
56 if (!isActive && onChange) onChange(inputVal, event);
57 return;
58 }
59
60 if (isActive) {
61 onChange(values.filter(function (n) {
62 return n !== inputVal;
63 }), event);
64 } else {
65 onChange([].concat(values, [inputVal]), event);
66 }
67 };
68
69 !(type !== 'radio' || !!name) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, 'A `name` is required to group the toggle buttons when the `type` ' + 'is set to "radio"') : invariant(false) : void 0;
70 return /*#__PURE__*/_react.default.createElement(_ButtonGroup.default, (0, _extends2.default)({}, controlledProps, {
71 ref: ref,
72 toggle: true
73 }), (0, _ElementChildren.map)(children, function (child) {
74 var values = getValues();
75 var _child$props = child.props,
76 childVal = _child$props.value,
77 childOnChange = _child$props.onChange;
78
79 var handler = function handler(e) {
80 return handleToggle(childVal, e);
81 };
82
83 return /*#__PURE__*/_react.default.cloneElement(child, {
84 type: type,
85 name: child.name || name,
86 checked: values.indexOf(childVal) !== -1,
87 onChange: (0, _createChainedFunction.default)(childOnChange, handler)
88 });
89 }));
90});
91
92ToggleButtonGroup.defaultProps = defaultProps;
93ToggleButtonGroup.Button = _ToggleButton.default;
94var _default = ToggleButtonGroup;
95exports.default = _default;
96module.exports = exports["default"];
\No newline at end of file