mirror of
https://github.com/idanoo/GoScrobble.git
synced 2024-11-25 09:55:15 +00:00
76 lines
2.5 KiB
JavaScript
76 lines
2.5 KiB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
var _excluded = ["children", "type", "name", "value", "onChange"];
|
|
import React from 'react';
|
|
import invariant from 'invariant';
|
|
import { useUncontrolled } from 'uncontrollable';
|
|
import chainFunction from './createChainedFunction';
|
|
import { map } from './ElementChildren';
|
|
import ButtonGroup from './ButtonGroup';
|
|
import ToggleButton from './ToggleButton';
|
|
var defaultProps = {
|
|
type: 'radio',
|
|
vertical: false
|
|
};
|
|
var ToggleButtonGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
var _useUncontrolled = useUncontrolled(props, {
|
|
value: 'onChange'
|
|
}),
|
|
children = _useUncontrolled.children,
|
|
type = _useUncontrolled.type,
|
|
name = _useUncontrolled.name,
|
|
value = _useUncontrolled.value,
|
|
onChange = _useUncontrolled.onChange,
|
|
controlledProps = _objectWithoutPropertiesLoose(_useUncontrolled, _excluded);
|
|
|
|
var getValues = function getValues() {
|
|
return value == null ? [] : [].concat(value);
|
|
};
|
|
|
|
var handleToggle = function handleToggle(inputVal, event) {
|
|
if (!onChange) {
|
|
return;
|
|
}
|
|
|
|
var values = getValues();
|
|
var isActive = values.indexOf(inputVal) !== -1;
|
|
|
|
if (type === 'radio') {
|
|
if (!isActive && onChange) onChange(inputVal, event);
|
|
return;
|
|
}
|
|
|
|
if (isActive) {
|
|
onChange(values.filter(function (n) {
|
|
return n !== inputVal;
|
|
}), event);
|
|
} else {
|
|
onChange([].concat(values, [inputVal]), event);
|
|
}
|
|
};
|
|
|
|
!(type !== 'radio' || !!name) ? process.env.NODE_ENV !== "production" ? invariant(false, 'A `name` is required to group the toggle buttons when the `type` ' + 'is set to "radio"') : invariant(false) : void 0;
|
|
return /*#__PURE__*/React.createElement(ButtonGroup, _extends({}, controlledProps, {
|
|
ref: ref,
|
|
toggle: true
|
|
}), map(children, function (child) {
|
|
var values = getValues();
|
|
var _child$props = child.props,
|
|
childVal = _child$props.value,
|
|
childOnChange = _child$props.onChange;
|
|
|
|
var handler = function handler(e) {
|
|
return handleToggle(childVal, e);
|
|
};
|
|
|
|
return /*#__PURE__*/React.cloneElement(child, {
|
|
type: type,
|
|
name: child.name || name,
|
|
checked: values.indexOf(childVal) !== -1,
|
|
onChange: chainFunction(childOnChange, handler)
|
|
});
|
|
}));
|
|
});
|
|
ToggleButtonGroup.defaultProps = defaultProps;
|
|
ToggleButtonGroup.Button = ToggleButton;
|
|
export default ToggleButtonGroup; |