[d24f17c] | 1 | "use strict";
|
---|
| 2 |
|
---|
| 3 | function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
---|
| 4 |
|
---|
| 5 | Object.defineProperty(exports, "__esModule", {
|
---|
| 6 | value: true
|
---|
| 7 | });
|
---|
| 8 | exports.DebounceInput = void 0;
|
---|
| 9 |
|
---|
| 10 | var _react = _interopRequireDefault(require("react"));
|
---|
| 11 |
|
---|
| 12 | var _lodash = _interopRequireDefault(require("lodash.debounce"));
|
---|
| 13 |
|
---|
| 14 | var _excluded = ["element", "onChange", "value", "minLength", "debounceTimeout", "forceNotifyByEnter", "forceNotifyOnBlur", "onKeyDown", "onBlur", "inputRef"];
|
---|
| 15 |
|
---|
| 16 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
---|
| 17 |
|
---|
| 18 | function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
---|
| 19 |
|
---|
| 20 | function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
---|
| 21 |
|
---|
| 22 | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
---|
| 23 |
|
---|
| 24 | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
---|
| 25 |
|
---|
| 26 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
---|
| 27 |
|
---|
| 28 | function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
---|
| 29 |
|
---|
| 30 | function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
---|
| 31 |
|
---|
| 32 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
---|
| 33 |
|
---|
| 34 | function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
---|
| 35 |
|
---|
| 36 | function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
---|
| 37 |
|
---|
| 38 | function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
---|
| 39 |
|
---|
| 40 | function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
---|
| 41 |
|
---|
| 42 | function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
---|
| 43 |
|
---|
| 44 | function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
---|
| 45 |
|
---|
| 46 | function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
---|
| 47 |
|
---|
| 48 | var DebounceInput = /*#__PURE__*/function (_React$PureComponent) {
|
---|
| 49 | _inherits(DebounceInput, _React$PureComponent);
|
---|
| 50 |
|
---|
| 51 | var _super = _createSuper(DebounceInput);
|
---|
| 52 |
|
---|
| 53 | function DebounceInput(props) {
|
---|
| 54 | var _this;
|
---|
| 55 |
|
---|
| 56 | _classCallCheck(this, DebounceInput);
|
---|
| 57 |
|
---|
| 58 | _this = _super.call(this, props);
|
---|
| 59 |
|
---|
| 60 | _defineProperty(_assertThisInitialized(_this), "onChange", function (event) {
|
---|
| 61 | event.persist();
|
---|
| 62 | var oldValue = _this.state.value;
|
---|
| 63 | var minLength = _this.props.minLength;
|
---|
| 64 |
|
---|
| 65 | _this.setState({
|
---|
| 66 | value: event.target.value
|
---|
| 67 | }, function () {
|
---|
| 68 | var value = _this.state.value;
|
---|
| 69 |
|
---|
| 70 | if (value.length >= minLength) {
|
---|
| 71 | _this.notify(event);
|
---|
| 72 |
|
---|
| 73 | return;
|
---|
| 74 | } // If user hits backspace and goes below minLength consider it cleaning the value
|
---|
| 75 |
|
---|
| 76 |
|
---|
| 77 | if (oldValue.length > value.length) {
|
---|
| 78 | _this.notify(_objectSpread(_objectSpread({}, event), {}, {
|
---|
| 79 | target: _objectSpread(_objectSpread({}, event.target), {}, {
|
---|
| 80 | value: ''
|
---|
| 81 | })
|
---|
| 82 | }));
|
---|
| 83 | }
|
---|
| 84 | });
|
---|
| 85 | });
|
---|
| 86 |
|
---|
| 87 | _defineProperty(_assertThisInitialized(_this), "onKeyDown", function (event) {
|
---|
| 88 | if (event.key === 'Enter') {
|
---|
| 89 | _this.forceNotify(event);
|
---|
| 90 | } // Invoke original onKeyDown if present
|
---|
| 91 |
|
---|
| 92 |
|
---|
| 93 | var onKeyDown = _this.props.onKeyDown;
|
---|
| 94 |
|
---|
| 95 | if (onKeyDown) {
|
---|
| 96 | event.persist();
|
---|
| 97 | onKeyDown(event);
|
---|
| 98 | }
|
---|
| 99 | });
|
---|
| 100 |
|
---|
| 101 | _defineProperty(_assertThisInitialized(_this), "onBlur", function (event) {
|
---|
| 102 | _this.forceNotify(event); // Invoke original onBlur if present
|
---|
| 103 |
|
---|
| 104 |
|
---|
| 105 | var onBlur = _this.props.onBlur;
|
---|
| 106 |
|
---|
| 107 | if (onBlur) {
|
---|
| 108 | event.persist();
|
---|
| 109 | onBlur(event);
|
---|
| 110 | }
|
---|
| 111 | });
|
---|
| 112 |
|
---|
| 113 | _defineProperty(_assertThisInitialized(_this), "createNotifier", function (debounceTimeout) {
|
---|
| 114 | if (debounceTimeout < 0) {
|
---|
| 115 | _this.notify = function () {
|
---|
| 116 | return null;
|
---|
| 117 | };
|
---|
| 118 | } else if (debounceTimeout === 0) {
|
---|
| 119 | _this.notify = _this.doNotify;
|
---|
| 120 | } else {
|
---|
| 121 | var debouncedChangeFunc = (0, _lodash["default"])(function (event) {
|
---|
| 122 | _this.isDebouncing = false;
|
---|
| 123 |
|
---|
| 124 | _this.doNotify(event);
|
---|
| 125 | }, debounceTimeout);
|
---|
| 126 |
|
---|
| 127 | _this.notify = function (event) {
|
---|
| 128 | _this.isDebouncing = true;
|
---|
| 129 | debouncedChangeFunc(event);
|
---|
| 130 | };
|
---|
| 131 |
|
---|
| 132 | _this.flush = function () {
|
---|
| 133 | return debouncedChangeFunc.flush();
|
---|
| 134 | };
|
---|
| 135 |
|
---|
| 136 | _this.cancel = function () {
|
---|
| 137 | _this.isDebouncing = false;
|
---|
| 138 | debouncedChangeFunc.cancel();
|
---|
| 139 | };
|
---|
| 140 | }
|
---|
| 141 | });
|
---|
| 142 |
|
---|
| 143 | _defineProperty(_assertThisInitialized(_this), "doNotify", function () {
|
---|
| 144 | var onChange = _this.props.onChange;
|
---|
| 145 | onChange.apply(void 0, arguments);
|
---|
| 146 | });
|
---|
| 147 |
|
---|
| 148 | _defineProperty(_assertThisInitialized(_this), "forceNotify", function (event) {
|
---|
| 149 | var debounceTimeout = _this.props.debounceTimeout;
|
---|
| 150 |
|
---|
| 151 | if (!_this.isDebouncing && debounceTimeout > 0) {
|
---|
| 152 | return;
|
---|
| 153 | }
|
---|
| 154 |
|
---|
| 155 | if (_this.cancel) {
|
---|
| 156 | _this.cancel();
|
---|
| 157 | }
|
---|
| 158 |
|
---|
| 159 | var value = _this.state.value;
|
---|
| 160 | var minLength = _this.props.minLength;
|
---|
| 161 |
|
---|
| 162 | if (value.length >= minLength) {
|
---|
| 163 | _this.doNotify(event);
|
---|
| 164 | } else {
|
---|
| 165 | _this.doNotify(_objectSpread(_objectSpread({}, event), {}, {
|
---|
| 166 | target: _objectSpread(_objectSpread({}, event.target), {}, {
|
---|
| 167 | value: value
|
---|
| 168 | })
|
---|
| 169 | }));
|
---|
| 170 | }
|
---|
| 171 | });
|
---|
| 172 |
|
---|
| 173 | _this.isDebouncing = false;
|
---|
| 174 | _this.state = {
|
---|
| 175 | value: typeof props.value === 'undefined' || props.value === null ? '' : props.value
|
---|
| 176 | };
|
---|
| 177 | var _debounceTimeout2 = _this.props.debounceTimeout;
|
---|
| 178 |
|
---|
| 179 | _this.createNotifier(_debounceTimeout2);
|
---|
| 180 |
|
---|
| 181 | return _this;
|
---|
| 182 | }
|
---|
| 183 |
|
---|
| 184 | _createClass(DebounceInput, [{
|
---|
| 185 | key: "componentDidUpdate",
|
---|
| 186 | value: function componentDidUpdate(prevProps) {
|
---|
| 187 | if (this.isDebouncing) {
|
---|
| 188 | return;
|
---|
| 189 | }
|
---|
| 190 |
|
---|
| 191 | var _this$props = this.props,
|
---|
| 192 | value = _this$props.value,
|
---|
| 193 | debounceTimeout = _this$props.debounceTimeout;
|
---|
| 194 | var oldTimeout = prevProps.debounceTimeout,
|
---|
| 195 | oldValue = prevProps.value;
|
---|
| 196 | var stateValue = this.state.value;
|
---|
| 197 |
|
---|
| 198 | if (typeof value !== 'undefined' && oldValue !== value && stateValue !== value) {
|
---|
| 199 | // Update state.value if new value passed via props, yep re-render should happen
|
---|
| 200 | // eslint-disable-next-line react/no-did-update-set-state
|
---|
| 201 | this.setState({
|
---|
| 202 | value: value
|
---|
| 203 | });
|
---|
| 204 | }
|
---|
| 205 |
|
---|
| 206 | if (debounceTimeout !== oldTimeout) {
|
---|
| 207 | this.createNotifier(debounceTimeout);
|
---|
| 208 | }
|
---|
| 209 | }
|
---|
| 210 | }, {
|
---|
| 211 | key: "componentWillUnmount",
|
---|
| 212 | value: function componentWillUnmount() {
|
---|
| 213 | if (this.flush) {
|
---|
| 214 | this.flush();
|
---|
| 215 | }
|
---|
| 216 | }
|
---|
| 217 | }, {
|
---|
| 218 | key: "render",
|
---|
| 219 | value: function render() {
|
---|
| 220 | var _this$props2 = this.props,
|
---|
| 221 | element = _this$props2.element,
|
---|
| 222 | _onChange = _this$props2.onChange,
|
---|
| 223 | _value = _this$props2.value,
|
---|
| 224 | _minLength = _this$props2.minLength,
|
---|
| 225 | _debounceTimeout = _this$props2.debounceTimeout,
|
---|
| 226 | forceNotifyByEnter = _this$props2.forceNotifyByEnter,
|
---|
| 227 | forceNotifyOnBlur = _this$props2.forceNotifyOnBlur,
|
---|
| 228 | onKeyDown = _this$props2.onKeyDown,
|
---|
| 229 | onBlur = _this$props2.onBlur,
|
---|
| 230 | inputRef = _this$props2.inputRef,
|
---|
| 231 | props = _objectWithoutProperties(_this$props2, _excluded);
|
---|
| 232 |
|
---|
| 233 | var value = this.state.value;
|
---|
| 234 | var maybeOnKeyDown;
|
---|
| 235 |
|
---|
| 236 | if (forceNotifyByEnter) {
|
---|
| 237 | maybeOnKeyDown = {
|
---|
| 238 | onKeyDown: this.onKeyDown
|
---|
| 239 | };
|
---|
| 240 | } else if (onKeyDown) {
|
---|
| 241 | maybeOnKeyDown = {
|
---|
| 242 | onKeyDown: onKeyDown
|
---|
| 243 | };
|
---|
| 244 | } else {
|
---|
| 245 | maybeOnKeyDown = {};
|
---|
| 246 | }
|
---|
| 247 |
|
---|
| 248 | var maybeOnBlur;
|
---|
| 249 |
|
---|
| 250 | if (forceNotifyOnBlur) {
|
---|
| 251 | maybeOnBlur = {
|
---|
| 252 | onBlur: this.onBlur
|
---|
| 253 | };
|
---|
| 254 | } else if (onBlur) {
|
---|
| 255 | maybeOnBlur = {
|
---|
| 256 | onBlur: onBlur
|
---|
| 257 | };
|
---|
| 258 | } else {
|
---|
| 259 | maybeOnBlur = {};
|
---|
| 260 | }
|
---|
| 261 |
|
---|
| 262 | var maybeRef = inputRef ? {
|
---|
| 263 | ref: inputRef
|
---|
| 264 | } : {};
|
---|
| 265 | return /*#__PURE__*/_react["default"].createElement(element, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, props), {}, {
|
---|
| 266 | onChange: this.onChange,
|
---|
| 267 | value: value
|
---|
| 268 | }, maybeOnKeyDown), maybeOnBlur), maybeRef));
|
---|
| 269 | }
|
---|
| 270 | }]);
|
---|
| 271 |
|
---|
| 272 | return DebounceInput;
|
---|
| 273 | }(_react["default"].PureComponent);
|
---|
| 274 |
|
---|
| 275 | exports.DebounceInput = DebounceInput;
|
---|
| 276 |
|
---|
| 277 | _defineProperty(DebounceInput, "defaultProps", {
|
---|
| 278 | element: 'input',
|
---|
| 279 | type: 'text',
|
---|
| 280 | onKeyDown: undefined,
|
---|
| 281 | onBlur: undefined,
|
---|
| 282 | value: undefined,
|
---|
| 283 | minLength: 0,
|
---|
| 284 | debounceTimeout: 100,
|
---|
| 285 | forceNotifyByEnter: true,
|
---|
| 286 | forceNotifyOnBlur: true,
|
---|
| 287 | inputRef: undefined
|
---|
| 288 | }); |
---|