wix-style-react
Version:
161 lines (126 loc) • 6.26 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _debounce2 = _interopRequireDefault(require("lodash/debounce"));
var _useIsMounted = _interopRequireDefault(require("../useIsMounted"));
var _useDebouncedCallback = _interopRequireDefault(require("../useDebouncedCallback/useDebouncedCallback"));
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var initialFetchState = {
loading: false,
predictions: []
};
/** A hook for fetching place predictions based on input value */
var usePlacesAutocomplete = function usePlacesAutocomplete(_ref) {
var client = _ref.client,
_ref$debounceMs = _ref.debounceMs,
debounceMs = _ref$debounceMs === void 0 ? 200 : _ref$debounceMs,
_ref$debounceFn = _ref.debounceFn,
debounceFn = _ref$debounceFn === void 0 ? _debounce2["default"] : _ref$debounceFn,
onError = _ref.onError;
var _useState = (0, _react.useState)(initialFetchState),
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
_useState2$ = _useState2[0],
loading = _useState2$.loading,
predictions = _useState2$.predictions,
setFetchState = _useState2[1];
var predictionsRequestId = (0, _react.useRef)(0); // id of latest request to avoid race conditions
var isMounted = (0, _useIsMounted["default"])(); // checks whether component is still mounted
var clearPredictions = (0, _react.useCallback)(function () {
// Increase request id counter
predictionsRequestId.current++;
setFetchState(initialFetchState);
}, []);
var updatePredictions = (0, _useDebouncedCallback["default"])( /*#__PURE__*/function () {
var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, requestOptions) {
var ready, fetchPredictions, requestId, newPredictions, isMostRecentRequest;
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
ready = client.ready, fetchPredictions = client.fetchPredictions;
if (!(!ready || !isMounted())) {
_context.next = 3;
break;
}
return _context.abrupt("return");
case 3:
if (value) {
_context.next = 6;
break;
}
clearPredictions();
return _context.abrupt("return");
case 6:
// Increase request id counter
requestId = ++predictionsRequestId.current;
setFetchState(function (state) {
return _objectSpread(_objectSpread({}, state), {}, {
loading: true
});
});
_context.prev = 8;
_context.next = 11;
return fetchPredictions(value, requestOptions);
case 11:
newPredictions = _context.sent;
_context.next = 17;
break;
case 14:
_context.prev = 14;
_context.t0 = _context["catch"](8);
// failed to fetch predictions
if (onError) {
onError(_context.t0);
}
case 17:
_context.prev = 17;
// check if no new fetch request has been initiated
isMostRecentRequest = requestId === predictionsRequestId.current;
if (isMounted() && isMostRecentRequest) {
setFetchState(function (state) {
return {
loading: false,
// set new predictions if fetched properly, else keep current predictions
predictions: newPredictions || state.predictions
};
});
}
return _context.finish(17);
case 21:
case "end":
return _context.stop();
}
}
}, _callee, null, [[8, 14, 17, 21]]);
}));
return function (_x, _x2) {
return _ref2.apply(this, arguments);
};
}(), [client, onError], debounceMs, debounceFn);
return {
/** array of prediction results */
predictions: predictions,
/** whether fetch request is ongoing */
loading: loading,
/** (value: string, requestOptions?: RequestOptions) => void
* fetches predictions for given value from client (debounced)
* and sets results to prediction state.
*
* Can also receive requestOptions,
* which are client specific options to pass to the request */
updatePredictions: updatePredictions,
/** function that clears predictions array and sets loading state to false */
clearPredictions: clearPredictions
};
};
var _default = usePlacesAutocomplete;
exports["default"] = _default;