UNPKG

5.79 kBJavaScriptView Raw
1import { Component } from 'react';
2import PropTypes from 'prop-types';
3
4var classCallCheck = function (instance, Constructor) {
5 if (!(instance instanceof Constructor)) {
6 throw new TypeError("Cannot call a class as a function");
7 }
8};
9
10var _extends = Object.assign || function (target) {
11 for (var i = 1; i < arguments.length; i++) {
12 var source = arguments[i];
13
14 for (var key in source) {
15 if (Object.prototype.hasOwnProperty.call(source, key)) {
16 target[key] = source[key];
17 }
18 }
19 }
20
21 return target;
22};
23
24var inherits = function (subClass, superClass) {
25 if (typeof superClass !== "function" && superClass !== null) {
26 throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
27 }
28
29 subClass.prototype = Object.create(superClass && superClass.prototype, {
30 constructor: {
31 value: subClass,
32 enumerable: false,
33 writable: true,
34 configurable: true
35 }
36 });
37 if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
38};
39
40var possibleConstructorReturn = function (self, call) {
41 if (!self) {
42 throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
43 }
44
45 return call && (typeof call === "object" || typeof call === "function") ? call : self;
46};
47
48var callAll = function () {
49 for (var _len = arguments.length, fns = Array(_len), _key = 0; _key < _len; _key++) {
50 fns[_key] = arguments[_key];
51 }
52
53 return function () {
54 for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
55 args[_key2] = arguments[_key2];
56 }
57
58 return fns.forEach(function (fn) {
59 return fn && fn.apply(undefined, args);
60 });
61 };
62};
63var noop = function () {};
64
65var Toggle = function (_Component) {
66 inherits(Toggle, _Component);
67
68 function Toggle() {
69 var _temp, _this, _ret;
70
71 classCallCheck(this, Toggle);
72
73 for (var _len3 = arguments.length, args = Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
74 args[_key3] = arguments[_key3];
75 }
76
77 return _ret = (_temp = (_this = possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
78 on: _this.getOn({ on: _this.props.defaultOn })
79 }, _this.getTogglerProps = function () {
80 var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
81 return _extends({
82 'aria-expanded': Boolean(_this.getOn()),
83 tabIndex: 0
84 }, props, {
85 onClick: callAll(props.onClick, _this.toggle)
86 });
87 }, _this.toggleKeys = ['Enter', ' '], _this.getInputTogglerProps = function () {
88 var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
89 return _this.getTogglerProps(_extends({}, props, {
90 onKeyUp: callAll(props.onKeyUp, function (event) {
91 if (event.key === 'Enter') {
92 // <input> already respond to Enter
93 _this.toggle();
94 }
95 })
96 }));
97 }, _this.getElementTogglerProps = function () {
98 var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
99 return _this.getTogglerProps(_extends({}, props, {
100 onKeyUp: callAll(props.onKeyUp, function (event) {
101 if (_this.toggleKeys.indexOf(event.key) > -1) {
102 _this.toggle();
103 }
104 })
105 }));
106 }, _this.setOnState = function () {
107 var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : !_this.getOn();
108
109 var cb = _this.getOn() === state ? noop : function () {
110 _this.props.onToggle(state, _this.getTogglerStateAndHelpers());
111 };
112 _this.setState({ on: state }, cb);
113 }, _this.setOn = _this.setOnState.bind(_this, true), _this.setOff = _this.setOnState.bind(_this, false), _this.toggle = _this.setOnState.bind(_this, undefined), _temp), possibleConstructorReturn(_this, _ret);
114 }
115
116 Toggle.prototype.getOn = function getOn() {
117 var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.state;
118 var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.props;
119
120 return this.isOnControlled() ? props.on : state.on;
121 };
122
123 Toggle.prototype.isOnControlled = function isOnControlled() {
124 return this.props.on !== undefined;
125 }; // This matches <button> behavior
126
127 Toggle.prototype.getTogglerStateAndHelpers = function getTogglerStateAndHelpers() {
128 return {
129 on: this.getOn(),
130 getTogglerProps: this.getTogglerProps,
131 getInputTogglerProps: this.getInputTogglerProps,
132 getElementTogglerProps: this.getElementTogglerProps,
133 setOn: this.setOn,
134 setOff: this.setOff,
135 toggle: this.toggle
136 };
137 };
138
139 Toggle.prototype.componentWillReceiveProps = function componentWillReceiveProps(_ref) {
140 var on = _ref.on;
141
142 if (on !== this.props.on && on !== this.state.on) {
143 this.setOnState(on);
144 }
145 };
146
147 Toggle.prototype.render = function render() {
148 var renderProp = unwrapArray(this.props.children);
149 return renderProp(this.getTogglerStateAndHelpers());
150 };
151
152 return Toggle;
153}(Component);
154
155/**
156 * Takes an argument and if it's an array, returns the first item in the array
157 * otherwise returns the argument
158 * @param {*} arg the maybe-array
159 * @return {*} the arg or it's first item
160 */
161
162
163Toggle.defaultProps = {
164 defaultOn: false,
165 onToggle: noop
166};
167process.env.NODE_ENV !== "production" ? Toggle.propTypes = {
168 defaultOn: PropTypes.bool,
169 on: PropTypes.bool,
170 onToggle: PropTypes.func,
171 children: PropTypes.oneOfType([PropTypes.func, PropTypes.array]).isRequired
172} : void 0;
173function unwrapArray(arg) {
174 return Array.isArray(arg) ? arg[0] : arg;
175}
176
177export default Toggle;