You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

90 lines
2.9 KiB

  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  6. var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
  7. var _react = _interopRequireDefault(require("react"));
  8. var _invariant = _interopRequireDefault(require("invariant"));
  9. var _uncontrollable = require("uncontrollable");
  10. var _createChainedFunction = _interopRequireDefault(require("./createChainedFunction"));
  11. var _ElementChildren = require("./ElementChildren");
  12. var _ButtonGroup = _interopRequireDefault(require("./ButtonGroup"));
  13. var _ToggleButton = _interopRequireDefault(require("./ToggleButton"));
  14. var defaultProps = {
  15. type: 'radio'
  16. };
  17. var ToggleButtonGroup = _react.default.forwardRef(function (props, ref) {
  18. var _useUncontrolled = (0, _uncontrollable.useUncontrolled)(props, {
  19. value: 'onChange'
  20. }),
  21. children = _useUncontrolled.children,
  22. type = _useUncontrolled.type,
  23. name = _useUncontrolled.name,
  24. value = _useUncontrolled.value,
  25. onChange = _useUncontrolled.onChange,
  26. controlledProps = (0, _objectWithoutPropertiesLoose2.default)(_useUncontrolled, ["children", "type", "name", "value", "onChange"]);
  27. var getValues = function getValues() {
  28. return value == null ? [] : [].concat(value);
  29. };
  30. var handleToggle = function handleToggle(inputVal, event) {
  31. var values = getValues();
  32. var isActive = values.indexOf(inputVal) !== -1;
  33. if (type === 'radio') {
  34. if (!isActive) onChange(inputVal, event);
  35. return;
  36. }
  37. if (isActive) {
  38. onChange(values.filter(function (n) {
  39. return n !== inputVal;
  40. }), event);
  41. } else {
  42. onChange([].concat(values, [inputVal]), event);
  43. }
  44. };
  45. !(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;
  46. return /*#__PURE__*/_react.default.createElement(_ButtonGroup.default, (0, _extends2.default)({}, controlledProps, {
  47. ref: ref,
  48. toggle: true
  49. }), (0, _ElementChildren.map)(children, function (child) {
  50. var values = getValues();
  51. var _child$props = child.props,
  52. childVal = _child$props.value,
  53. childOnChange = _child$props.onChange;
  54. var handler = function handler(e) {
  55. return handleToggle(childVal, e);
  56. };
  57. return _react.default.cloneElement(child, {
  58. type: type,
  59. name: child.name || name,
  60. checked: values.indexOf(childVal) !== -1,
  61. onChange: (0, _createChainedFunction.default)(childOnChange, handler)
  62. });
  63. }));
  64. });
  65. ToggleButtonGroup.defaultProps = defaultProps;
  66. ToggleButtonGroup.Button = _ToggleButton.default;
  67. var _default = ToggleButtonGroup;
  68. exports.default = _default;
  69. module.exports = exports["default"];