mirror of
https://github.com/idanoo/GoScrobble.git
synced 2024-11-24 17:35:16 +00:00
176 lines
6.0 KiB
JavaScript
176 lines
6.0 KiB
JavaScript
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
|
|
var _jsxFileName = "/Users/jquense/src/uncontrollable/src/uncontrollable.js";
|
|
import React from 'react';
|
|
import { polyfill } from 'react-lifecycles-compat';
|
|
import invariant from 'invariant';
|
|
import * as Utils from './utils';
|
|
export default function uncontrollable(Component, controlledValues, methods) {
|
|
if (methods === void 0) {
|
|
methods = [];
|
|
}
|
|
|
|
var displayName = Component.displayName || Component.name || 'Component';
|
|
var canAcceptRef = Utils.canAcceptRef(Component);
|
|
var controlledProps = Object.keys(controlledValues);
|
|
var PROPS_TO_OMIT = controlledProps.map(Utils.defaultKey);
|
|
!(canAcceptRef || !methods.length) ? process.env.NODE_ENV !== "production" ? invariant(false, '[uncontrollable] stateless function components cannot pass through methods ' + 'because they have no associated instances. Check component: ' + displayName + ', ' + 'attempting to pass through methods: ' + methods.join(', ')) : invariant(false) : void 0;
|
|
|
|
var UncontrolledComponent =
|
|
/*#__PURE__*/
|
|
function (_React$Component) {
|
|
_inheritsLoose(UncontrolledComponent, _React$Component);
|
|
|
|
function UncontrolledComponent() {
|
|
var _this;
|
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
|
|
_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
|
|
_this.handlers = Object.create(null);
|
|
controlledProps.forEach(function (propName) {
|
|
var handlerName = controlledValues[propName];
|
|
|
|
var handleChange = function handleChange(value) {
|
|
if (_this.props[handlerName]) {
|
|
var _this$props;
|
|
|
|
_this._notifying = true;
|
|
|
|
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
args[_key2 - 1] = arguments[_key2];
|
|
}
|
|
|
|
(_this$props = _this.props)[handlerName].apply(_this$props, [value].concat(args));
|
|
|
|
_this._notifying = false;
|
|
}
|
|
|
|
if (!_this.unmounted) _this.setState(function (_ref) {
|
|
var _extends2;
|
|
|
|
var values = _ref.values;
|
|
return {
|
|
values: _extends(Object.create(null), values, (_extends2 = {}, _extends2[propName] = value, _extends2))
|
|
};
|
|
});
|
|
};
|
|
|
|
_this.handlers[handlerName] = handleChange;
|
|
});
|
|
if (methods.length) _this.attachRef = function (ref) {
|
|
_this.inner = ref;
|
|
};
|
|
var values = Object.create(null);
|
|
controlledProps.forEach(function (key) {
|
|
values[key] = _this.props[Utils.defaultKey(key)];
|
|
});
|
|
_this.state = {
|
|
values: values,
|
|
prevProps: {}
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
var _proto = UncontrolledComponent.prototype;
|
|
|
|
_proto.shouldComponentUpdate = function shouldComponentUpdate() {
|
|
//let setState trigger the update
|
|
return !this._notifying;
|
|
};
|
|
|
|
UncontrolledComponent.getDerivedStateFromProps = function getDerivedStateFromProps(props, _ref2) {
|
|
var values = _ref2.values,
|
|
prevProps = _ref2.prevProps;
|
|
var nextState = {
|
|
values: _extends(Object.create(null), values),
|
|
prevProps: {}
|
|
};
|
|
controlledProps.forEach(function (key) {
|
|
/**
|
|
* If a prop switches from controlled to Uncontrolled
|
|
* reset its value to the defaultValue
|
|
*/
|
|
nextState.prevProps[key] = props[key];
|
|
|
|
if (!Utils.isProp(props, key) && Utils.isProp(prevProps, key)) {
|
|
nextState.values[key] = props[Utils.defaultKey(key)];
|
|
}
|
|
});
|
|
return nextState;
|
|
};
|
|
|
|
_proto.componentWillUnmount = function componentWillUnmount() {
|
|
this.unmounted = true;
|
|
};
|
|
|
|
_proto.render = function render() {
|
|
var _this2 = this;
|
|
|
|
var _this$props2 = this.props,
|
|
innerRef = _this$props2.innerRef,
|
|
props = _objectWithoutPropertiesLoose(_this$props2, ["innerRef"]);
|
|
|
|
PROPS_TO_OMIT.forEach(function (prop) {
|
|
delete props[prop];
|
|
});
|
|
var newProps = {};
|
|
controlledProps.forEach(function (propName) {
|
|
var propValue = _this2.props[propName];
|
|
newProps[propName] = propValue !== undefined ? propValue : _this2.state.values[propName];
|
|
});
|
|
return React.createElement(Component, _extends({}, props, newProps, this.handlers, {
|
|
ref: innerRef || this.attachRef
|
|
}));
|
|
};
|
|
|
|
return UncontrolledComponent;
|
|
}(React.Component);
|
|
|
|
polyfill(UncontrolledComponent);
|
|
UncontrolledComponent.displayName = "Uncontrolled(" + displayName + ")";
|
|
UncontrolledComponent.propTypes = _extends({
|
|
innerRef: function innerRef() {}
|
|
}, Utils.uncontrolledPropTypes(controlledValues, displayName));
|
|
methods.forEach(function (method) {
|
|
UncontrolledComponent.prototype[method] = function $proxiedMethod() {
|
|
var _this$inner;
|
|
|
|
return (_this$inner = this.inner)[method].apply(_this$inner, arguments);
|
|
};
|
|
});
|
|
var WrappedComponent = UncontrolledComponent;
|
|
|
|
if (React.forwardRef) {
|
|
WrappedComponent = React.forwardRef(function (props, ref) {
|
|
return React.createElement(UncontrolledComponent, _extends({}, props, {
|
|
innerRef: ref,
|
|
__source: {
|
|
fileName: _jsxFileName,
|
|
lineNumber: 128
|
|
},
|
|
__self: this
|
|
}));
|
|
});
|
|
WrappedComponent.propTypes = UncontrolledComponent.propTypes;
|
|
}
|
|
|
|
WrappedComponent.ControlledComponent = Component;
|
|
/**
|
|
* useful when wrapping a Component and you want to control
|
|
* everything
|
|
*/
|
|
|
|
WrappedComponent.deferControlTo = function (newComponent, additions, nextMethods) {
|
|
if (additions === void 0) {
|
|
additions = {};
|
|
}
|
|
|
|
return uncontrollable(newComponent, _extends({}, controlledValues, additions), nextMethods);
|
|
};
|
|
|
|
return WrappedComponent;
|
|
} |