@clickview/lite 0.0.24-rc.4 → 0.0.24

package/dist/scripts/13.chunk.js

@@ -1,411 +1,325 @@
 (window["webpackJsonp_clickview_lite"] = window["webpackJsonp_clickview_lite"] || []).push([[13],{
 
-/***/ "../../libs/shared/src/flight-requests/FavouriteVideoRequests.ts":
-/*!***********************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/FavouriteVideoRequests.ts ***!
-  \***********************************************************************************************************/
-/*! exports provided: FavouriteVideoRequests */
+/***/ "../../libs/common/src/react/utils/TypeHelper.ts":
+/*!*******************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/common/src/react/utils/TypeHelper.ts ***!
+  \*******************************************************************************************/
+/*! exports provided: TypeHelper */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FavouriteVideoRequests", function() { return FavouriteVideoRequests; });
-/* harmony import */ var _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/backbone/enums/HttpVerbs */ "../../libs/common/src/backbone/enums/HttpVerbs.ts");
-/* harmony import */ var _constants_WithStatements__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../constants/WithStatements */ "../../libs/shared/src/constants/WithStatements.ts");
-var __rest = undefined && undefined.__rest || function (s, e) {
-  var t = {};
-
-  for (var p in s) {
-    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  }
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TypeHelper", function() { return TypeHelper; });
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+var TypeHelper = {
+  isNumber: function isNumber(obj) {
+    return TypeHelper.isType(obj, 'number');
+  },
+  isString: function isString(obj) {
+    return TypeHelper.isType(obj, 'string');
+  },
+  isType: function isType(obj, type) {
+    return _typeof(obj) === type;
   }
-  return t;
 };
 
+/***/ }),
 
+/***/ "../../libs/shared/src/components/search-bar/SearchBar.tsx":
+/*!*****************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/SearchBar.tsx ***!
+  \*****************************************************************************************************/
+/*! exports provided: SearchBar */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SearchBar", function() { return SearchBar; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_autosuggest__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-autosuggest */ "react-autosuggest");
+/* harmony import */ var react_autosuggest__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_autosuggest__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+/* harmony import */ var _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _hooks_UseMediaQuery__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../hooks/UseMediaQuery */ "../../libs/shared/src/hooks/UseMediaQuery.tsx");
+/* harmony import */ var _enums_MediaQueries__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../enums/MediaQueries */ "../../libs/shared/src/enums/MediaQueries.ts");
+/* harmony import */ var _SearchUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./SearchUtils */ "../../libs/shared/src/components/search-bar/SearchUtils.tsx");
+/* harmony import */ var _SearchInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./SearchInput */ "../../libs/shared/src/components/search-bar/SearchInput.tsx");
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function favouriteVideo(videoId, userId, success, error) {
-  return {
-    url: "/api/domain/v2/objects/".concat(userId),
-    key: "favourite:video:".concat(userId, ":").concat(videoId),
-    data: {
-      favouriteVideos: videoId
-    },
-    type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__["HttpVerbs"].PUT,
-    invalidationKeys: ["favourite:videos:".concat(userId), "video:is:favourited:".concat(userId)],
-    success: success,
-    error: error
-  };
-}
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function unfavouriteVideo(videoId, userId, success, error) {
-  return {
-    url: "/api/domain/v2/objects/".concat(userId, "/favouriteVideos/").concat(videoId),
-    key: "favourite:video:".concat(userId, ":").concat(videoId),
-    type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__["HttpVerbs"].DELETE,
-    invalidationKeys: ["favourite:videos:".concat(userId), "video:is:favourited:".concat(userId)],
-    success: success,
-    error: error
-  };
-}
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-var FavouriteVideoRequests = {
-  favouriteVideos: function favouriteVideos(userId, cursor) {
-    var query = "".concat(_constants_WithStatements__WEBPACK_IMPORTED_MODULE_1__["SharedWithStatements"].VIDEO_COLLECTION).concat(addCursor(cursor));
-    return {
-      url: "/api/domain/v2/objects/".concat(userId, "/favouriteVideos?query=").concat(query),
-      key: "favourite:videos:".concat(userId).concat(cursor ? ":".concat(cursor) : '')
-    };
-  },
-  updateIsVideoFavourited: function updateIsVideoFavourited(videoId, userId, shouldFavourite, success, error) {
-    var requestFn = shouldFavourite ? favouriteVideo : unfavouriteVideo;
-    return requestFn(videoId, userId, success, error);
-  },
-  isFavourited: function isFavourited(userId, ids) {
-    var sortedIds = ids.slice().sort();
-    var params = sortedIds.map(function (i) {
-      return "id=".concat(i);
-    });
-    if (!params.length) return;
-    return {
-      url: "/api/domain/v2/objects?query=favouritedBy{id:".concat(userId, "}&").concat(params.join('&')),
-      key: "video:is:favourited:".concat(userId, ":by:id:").concat(sortedIds.join(',')),
-      formatData: function formatData(videos) {
-        var _a;
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-        if (!((_a = videos) === null || _a === void 0 ? void 0 : _a.length)) return videos;
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
-        var setIsFavourited = function setIsFavourited(video) {
-          var _a, _b;
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-          var favouritedBy = video.favouritedBy,
-              v = __rest(video, ["favouritedBy"]); // As we filtered by userId, if there are any users, set isFavourited to true.
 
 
-          return Object.assign(Object.assign({}, v), {
-            isFavourited: !!((_b = (_a = favouritedBy) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.length)
-          });
-        };
 
-        return videos.map(setIsFavourited);
-      }
-    };
-  }
-};
 
-function addCursor(cursor) {
-  return cursor ? "&cursor=".concat(cursor) : '';
-}
 
-/***/ }),
 
-/***/ "../../libs/shared/src/flight-requests/ThemeRequests.ts":
-/*!**************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/ThemeRequests.ts ***!
-  \**************************************************************************************************/
-/*! exports provided: ThemeRequests */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ThemeRequests", function() { return ThemeRequests; });
-/* harmony import */ var _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/backbone/enums/HttpVerbs */ "../../libs/common/src/backbone/enums/HttpVerbs.ts");
-
-var ThemeRequests = {
-  theme: function theme(id) {
-    return {
-      url: "/api/domain/v1/themes/".concat(id),
-      key: "themes:".concat(id)
-    };
-  },
-  themes: function themes(type) {
-    var url = '/api/domain/v1/themes';
-    var key = 'themes';
-
-    if (type) {
-      url += "?type=".concat(type);
-      key += ":type:".concat(type);
-    }
-
-    return {
-      url: url,
-      key: key
-    };
-  },
-  createTheme: function createTheme(data, success, error, always) {
-    return {
-      url: '/api/domain/v1/themes',
-      key: 'theme',
-      data: data,
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__["HttpVerbs"].POST,
-      invalidationKeys: 'themes',
-      success: success,
-      error: error,
-      always: always
-    };
-  },
-  updateTheme: function updateTheme(id, data, success, error, always) {
-    return {
-      url: "/api/domain/v1/themes/".concat(id),
-      key: "update:theme:".concat(id),
-      data: data,
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__["HttpVerbs"].PUT,
-      success: success,
-      error: error,
-      always: always
-    };
-  },
-  deleteTheme: function deleteTheme(id, success, error, always) {
-    return {
-      url: "/api/domain/v1/themes/".concat(id),
-      key: "delete:theme:".concat(id),
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_0__["HttpVerbs"].DELETE,
-      invalidationKeys: 'themes',
-      success: success,
-      error: error,
-      always: always
-    };
-  }
-};
 
-/***/ }),
+var namespace = 'shared.searchBar';
+var isFunction = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_2__["FunctionHelper"].isFunction;
 
-/***/ "./src/apps/watch-history/flight-requests/VideoHistoryRequests.ts":
-/*!************************************************************************!*\
-  !*** ./src/apps/watch-history/flight-requests/VideoHistoryRequests.ts ***!
-  \************************************************************************/
-/*! exports provided: VideoHistoryRequests */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VideoHistoryRequests", function() { return VideoHistoryRequests; });
-var VideoHistoryRequests = {
-  userVideoHistory: function userVideoHistory(customerId, userId, cursor, success, error, always) {
-    var key = "video:history:".concat(customerId, ":").concat(userId);
-    var url = "/api/videoviews/v1/customers/".concat(customerId, "/users/").concat(userId, "/videos/history");
-
-    if (cursor) {
-      key += ":".concat(cursor);
-      url += "?cursor=".concat(cursor);
-    }
+function SearchBarWrapper(props) {
+  if (!props.renderAsForm) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, props.children);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("form", {
+    onSubmit: props.onSubmit
+  }, props.children);
+}
 
-    return {
-      key: key,
-      url: url,
-      success: success,
-      error: error,
-      always: always
-    };
-  },
-  videoHistory: function videoHistory(customerId, userId, ids, success, error, always) {
-    var params = ids.sort().map(function (i) {
-      return "videoId=".concat(i);
-    });
-    return {
-      key: "video:history:".concat(customerId, ":").concat(userId, ":videos:").concat(params.join('&')),
-      url: "/api/videoviews/v1/customers/".concat(customerId, "/users/").concat(userId, "/videos/history?").concat(params.join('&')),
-      formatData: function formatData(historyCollection) {
-        var _a;
-
-        if (!((_a = historyCollection) === null || _a === void 0 ? void 0 : _a.length)) return historyCollection;
-        /**
-         * Data is formatted to enable it to be merged with the existing video object in the store
-         * Where we need to merge more history properties with the video object, map them below.
-         */
-
-        return historyCollection.map(function (watchHistory) {
-          return {
-            id: watchHistory.videoId,
-            lastProgressPoint: watchHistory.lastProgressPoint
-          };
-        });
-      },
-      success: success,
-      error: error,
-      always: always
-    };
-  }
+SearchBar.defaultProps = {
+  updateQueryOnSelection: true,
+  valueKey: 'name',
+  activationLength: 3,
+  suggestionLimit: 5,
+  recentSearches: [],
+  initialSuggestions: [],
+  searchIconPlacement: 'right',
+  renderAsForm: true
 };
+function SearchBar(props) {
+  var initialState = _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getInitialState"](props.initialSuggestions, props.recentSearches);
 
-/***/ }),
-
-/***/ "./src/shared/hooks/useHandleObjectError.ts":
-/*!**************************************************!*\
-  !*** ./src/shared/hooks/useHandleObjectError.ts ***!
-  \**************************************************/
-/*! exports provided: useHandleObjectError */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
+  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0__["useState"](props.initialQuery || ''),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      query = _React$useState2[0],
+      setQuery = _React$useState2[1];
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useHandleObjectError", function() { return useHandleObjectError; });
-/* harmony import */ var _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../libs/common/src/backbone */ "../../libs/common/src/backbone/index.ts");
-/* harmony import */ var _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../libs/common/src/backbone/enums/HttpStatus */ "../../libs/common/src/backbone/enums/HttpStatus.ts");
-/* harmony import */ var shared_errors_general_not_found_LiteNotFoundError__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! shared/errors/general/not-found/LiteNotFoundError */ "./src/shared/errors/general/not-found/LiteNotFoundError.ts");
-/* harmony import */ var shared_errors_general_unspecified_error_UnspecifiedError__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! shared/errors/general/unspecified-error/UnspecifiedError */ "./src/shared/errors/general/unspecified-error/UnspecifiedError.ts");
-/* harmony import */ var shared_errors_general_private_resource_PrivateResourceError__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! shared/errors/general/private-resource/PrivateResourceError */ "./src/shared/errors/general/private-resource/PrivateResourceError.ts");
-/* harmony import */ var shared_errors_general_region_locked_resource_RegionLockedResourceError__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared/errors/general/region-locked-resource/RegionLockedResourceError */ "./src/shared/errors/general/region-locked-resource/RegionLockedResourceError.ts");
+  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0__["useState"](initialState),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      suggestions = _React$useState4[0],
+      setSuggestions = _React$useState4[1];
 
+  var isMobile = Object(_hooks_UseMediaQuery__WEBPACK_IMPORTED_MODULE_4__["useMediaQuery"])(_enums_MediaQueries__WEBPACK_IMPORTED_MODULE_5__["MediaQueryStrings"].XS);
+  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](function () {
+    var initialQuery = props.initialQuery || '';
+    if (query !== initialQuery) setQuery(initialQuery);
+  }, [props.initialQuery]);
 
+  var resetSuggestions = function resetSuggestions() {
+    setSuggestions(initialState);
+  };
 
+  var onChange = function onChange(e, _ref) {
+    var newValue = _ref.newValue;
+    setQuery(newValue);
+    if (isFunction(props.onQueryChange)) props.onQueryChange(newValue);
+  };
 
+  var onSubmit = function onSubmit(event) {
+    event.preventDefault();
+    if (isFunction(props.onSubmit)) props.onSubmit(query);
+  };
 
+  var onKeyDown = function onKeyDown(event) {
+    if (event.keyCode === 8 && props.onBackspace && !query) props.onBackspace();
+  };
 
-var defaultErrors = {
-  notFound: shared_errors_general_not_found_LiteNotFoundError__WEBPACK_IMPORTED_MODULE_2__["NotFoundError"],
-  forbidden: {
-    rating: shared_errors_general_private_resource_PrivateResourceError__WEBPACK_IMPORTED_MODULE_4__["PrivateResourceError"],
-    yearLevel: shared_errors_general_private_resource_PrivateResourceError__WEBPACK_IMPORTED_MODULE_4__["PrivateResourceError"],
-    region: shared_errors_general_region_locked_resource_RegionLockedResourceError__WEBPACK_IMPORTED_MODULE_5__["RegionLockedResourceError"],
-    privacy: shared_errors_general_private_resource_PrivateResourceError__WEBPACK_IMPORTED_MODULE_4__["PrivateResourceError"]
-  },
-  badRequest: shared_errors_general_unspecified_error_UnspecifiedError__WEBPACK_IMPORTED_MODULE_3__["UnspecifiedError"]
-};
-function useHandleObjectError(object, customErrors, currentUser) {
-  var errors = Object.assign(Object.assign({}, defaultErrors), customErrors);
-  if (!object.statusCode || object.statusCode === _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_1__["HttpStatus"].Ok) return;
+  var onClickClearInput = function onClickClearInput() {
+    setQuery('');
+    if (isFunction(props.onClickClearInput)) props.onClickClearInput();
+  };
 
-  if (object.statusCode === _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_1__["HttpStatus"].NotFound) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_0__["Core"].ErrorHelper["throw"](new errors.notFound());
-    return;
-  }
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](SearchBarWrapper, {
+    onSubmit: onSubmit,
+    renderAsForm: !!props.renderAsForm
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_autosuggest__WEBPACK_IMPORTED_MODULE_1__, {
+    suggestions: _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getSuggestionSections"](suggestions, !query, props.recentSearchHeading || _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__["LanguageService"].getPhrase(namespace, 'recentSearchHeading'), props.suggestionsHeading, props.getSections, props.suggestionLimit),
+    onSuggestionsFetchRequested: _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["onSuggestionsFetchRequestedHandler"](props, setSuggestions, resetSuggestions),
+    onSuggestionsClearRequested: function onSuggestionsClearRequested() {
+      if (!props.alwaysRenderSuggestions) resetSuggestions();
+    },
+    onSuggestionSelected: function onSuggestionSelected(e, _ref2) {
+      var suggestion = _ref2.suggestion;
+      if (props.clearQueryOnSelect) setQuery('');
+      props.onSuggestionSelected(suggestion);
+    },
+    getSuggestionValue: function getSuggestionValue(suggestion) {
+      if (!props.updateQueryOnSelection) return query;
+      return _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getSuggestionValue"](props.valueKey, suggestion);
+    },
+    renderSuggestion: function renderSuggestion(suggestion) {
+      if (isFunction(props.getSuggestionComponent)) return props.getSuggestionComponent(suggestion);
+      return _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getSuggestionComponent"](props.valueKey, suggestion);
+    },
+    alwaysRenderSuggestions: props.alwaysRenderSuggestions,
 
-  if (object.statusCode === _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_1__["HttpStatus"].Forbidden) {
     /**
-     * TODO: Work out how to go about handling all forbidden errors, such as region locking, year levels,
-     * ratings, and privacy.
+     * Setting focusInputOnSuggestionClick to false when isMobile is true prevents the keyboard from
+     * appearing on mobile devices when a suggestion is clicked.
      */
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_0__["Core"].ErrorHelper["throw"](new errors.forbidden.privacy());
-    return;
-  }
-
-  _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_0__["Core"].ErrorHelper["throw"](new errors.badRequest());
+    focusInputOnSuggestionClick: !isMobile,
+    inputProps: {
+      placeholder: props.placeholder || _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__["LanguageService"].getPhrase(namespace, 'placeholder'),
+      value: query,
+      onChange: onChange,
+      onKeyDown: onKeyDown,
+      autoFocus: !!props.autoFocusInput,
+      highlightOnFocus: props.highlightInputOnFocus,
+      onClickSearchIcon: !!props.submitOnClickSearchIcon && onSubmit,
+      searchIconPlacement: props.searchIconPlacement,
+      showClearInputIcon: !!props.showClearInputIcon && !!query.length,
+      onClickClearInput: onClickClearInput
+    },
+    renderInputComponent: _SearchInput__WEBPACK_IMPORTED_MODULE_7__["SearchInput"],
+    theme: _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getTheme"](props.theme),
+    multiSection: true,
+    renderSectionTitle: _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["renderSectionTitle"],
+    getSectionSuggestions: _SearchUtils__WEBPACK_IMPORTED_MODULE_6__["getSectionSuggestions"]
+  }));
 }
 
 /***/ }),
 
-/***/ "./src/shared/hooks/useVideoMixin.ts":
-/*!*******************************************!*\
-  !*** ./src/shared/hooks/useVideoMixin.ts ***!
-  \*******************************************/
-/*! exports provided: useVideoMixin */
+/***/ "../../libs/shared/src/components/search-bar/SearchInput.tsx":
+/*!*******************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/SearchInput.tsx ***!
+  \*******************************************************************************************************/
+/*! exports provided: SearchInput */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useVideoMixin", function() { return useVideoMixin; });
-/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../libs/shared/src/flight-requests/UserRequests */ "../../libs/shared/src/flight-requests/UserRequests.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_FavouriteVideoRequests__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../libs/shared/src/flight-requests/FavouriteVideoRequests */ "../../libs/shared/src/flight-requests/FavouriteVideoRequests.ts");
-/* harmony import */ var shared_flight_requests_VideoRequests__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! shared/flight-requests/VideoRequests */ "./src/shared/flight-requests/VideoRequests.ts");
-/* harmony import */ var apps_watch_history_flight_requests_VideoHistoryRequests__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! apps/watch-history/flight-requests/VideoHistoryRequests */ "./src/apps/watch-history/flight-requests/VideoHistoryRequests.ts");
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SearchInput", function() { return SearchInput; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+/* harmony import */ var _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+/* harmony import */ var _search_bar_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./search-bar.scss */ "../../libs/shared/src/components/search-bar/search-bar.scss");
+/* harmony import */ var _search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4__);
+var __rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
 
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
 
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
 
 
 
 
 
-var defaults = {
-  ratings: true,
-  favourites: true,
-  watchHistory: true
-};
 
-function fetchAttribute(videosFetched, request) {
-  var _a;
 
-  var attribute = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_0__["Flight"].useGetResponse((_a = request) === null || _a === void 0 ? void 0 : _a.key);
-  var fetch = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_0__["Flight"].useGetFetch(request);
-  if (videosFetched && request && attribute.shouldFetch) fetch();
+function getInputClassName(props) {
+  var searchIconPlacement = props.searchIconPlacement,
+      showClearInputIcon = props.showClearInputIcon,
+      highlightOnFocus = props.highlightOnFocus,
+      className = props.className;
+  var inputClassName = 'form-control';
+  if (!highlightOnFocus) inputClassName += " ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.inputWithoutHighlight);
+  if (searchIconPlacement === 'left') inputClassName += " ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.inputWithLeftIcon);
+  if (searchIconPlacement === 'right' && !showClearInputIcon || searchIconPlacement === 'left' && showClearInputIcon) inputClassName += " ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.inputWithRightIcon);
+  if (searchIconPlacement === 'right' && showClearInputIcon) inputClassName += " ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.inputWithTwoRightIcons);
+  if (className) inputClassName += "".concat(className);
+  return inputClassName;
 }
 
-function useVideoMixin(videos) {
-  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+function getSvgContainerClassName(onClickSvg) {
+  var className = 'd-inline-block svg-container';
+  if (!_common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__["FunctionHelper"].isFunction(onClickSvg)) return className;
+  return className + ' cursor-pointer';
+}
 
-  var _a, _b, _c;
+function SearchInput(props) {
+  var onClickSearchIcon = props.onClickSearchIcon,
+      searchIconPlacement = props.searchIconPlacement,
+      showClearInputIcon = props.showClearInputIcon,
+      onClickClearInput = props.onClickClearInput,
+      highlightOnFocus = props.highlightOnFocus,
+      className = props.className,
+      inputProps = __rest(props, ["onClickSearchIcon", "searchIconPlacement", "showClearInputIcon", "onClickClearInput", "highlightOnFocus", "className"]);
+
+  var SearchIcon = function SearchIcon() {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: 'd-inline-block'
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainer"], {
+      svgName: _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__["cvSvgLibrary"].Search,
+      size: _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainerSize"].Standard,
+      onClick: onClickSearchIcon,
+      className: getSvgContainerClassName(onClickSearchIcon)
+    }));
+  };
 
-  var _Object$assign = Object.assign(Object.assign({}, defaults), options),
-      ratings = _Object$assign.ratings,
-      favourites = _Object$assign.favourites,
-      watchHistory = _Object$assign.watchHistory;
+  var ClearIcon = function ClearIcon() {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: "d-inline-block text-muted ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.clearButton)
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainer"], {
+      svgName: _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__["cvSvgLibrary"].Close,
+      size: _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainerSize"].Standard,
+      onClick: onClickClearInput,
+      className: getSvgContainerClassName(onClickClearInput)
+    }));
+  };
 
-  var currentUser = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_0__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_1__["UserRequests"].currentUser());
-  var videoIds = videos && (Array.isArray(videos) ? videos.filter(Boolean).map(function (v) {
-    return v.id;
-  }) : videos.data.filter(Boolean).map(function (v) {
-    return v.id;
-  }));
-  var user = currentUser.data;
-  var requests = [];
-  if (ratings) requests = [].concat(_toConsumableArray(requests), [!!((_a = videoIds) === null || _a === void 0 ? void 0 : _a.length) && shared_flight_requests_VideoRequests__WEBPACK_IMPORTED_MODULE_3__["VideoRequests"].videoRatings(videoIds)]);
-  if (favourites) requests = [].concat(_toConsumableArray(requests), [!!((_b = videoIds) === null || _b === void 0 ? void 0 : _b.length) && user && _libs_shared_src_flight_requests_FavouriteVideoRequests__WEBPACK_IMPORTED_MODULE_2__["FavouriteVideoRequests"].isFavourited(user.id, videoIds)]);
-  if (watchHistory) requests = [].concat(_toConsumableArray(requests), [!!((_c = videoIds) === null || _c === void 0 ? void 0 : _c.length) && user && apps_watch_history_flight_requests_VideoHistoryRequests__WEBPACK_IMPORTED_MODULE_4__["VideoHistoryRequests"].videoHistory(user.customerId, user.id, videoIds)]);
-  requests.forEach(function (r) {
-    return fetchAttribute(!!videos, r);
-  });
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "position-relative ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.inputContainer)
+  }, searchIconPlacement === 'left' && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.iconContainer, " ").concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.leftIconContainer)
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](SearchIcon, null)), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("input", Object.assign({
+    className: getInputClassName(props)
+  }, inputProps)), (searchIconPlacement === 'right' || !!showClearInputIcon) && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.iconContainer, " ").concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_4___default.a.rightIconContainer)
+  }, !!showClearInputIcon && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](ClearIcon, null), searchIconPlacement === 'right' && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](SearchIcon, null)));
 }
 
 /***/ }),
 
-/***/ "./src/shared/views/play/PlayView.tsx":
-/*!********************************************!*\
-  !*** ./src/shared/views/play/PlayView.tsx ***!
-  \********************************************/
-/*! exports provided: PlayView */
+/***/ "../../libs/shared/src/components/search-bar/SearchUtils.tsx":
+/*!*******************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/SearchUtils.tsx ***!
+  \*******************************************************************************************************/
+/*! exports provided: SuggestionType, getInitialState, onSuggestionsFetchRequestedHandler, getSuggestionValue, getSuggestionComponent, getSuggestionSections, getSectionSuggestions, renderSectionTitle, getTheme */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlayView", function() { return PlayView; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SuggestionType", function() { return SuggestionType; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getInitialState", function() { return getInitialState; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "onSuggestionsFetchRequestedHandler", function() { return onSuggestionsFetchRequestedHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSuggestionValue", function() { return getSuggestionValue; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSuggestionComponent", function() { return getSuggestionComponent; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSuggestionSections", function() { return getSuggestionSections; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSectionSuggestions", function() { return getSectionSuggestions; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "renderSectionTitle", function() { return renderSectionTitle; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTheme", function() { return getTheme; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-redux */ "react-redux");
-/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
-/* harmony import */ var _libs_common_src_react_hooks_useViewModel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../libs/common/src/react/hooks/useViewModel */ "../../libs/common/src/react/hooks/useViewModel.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../libs/shared/src/flight-requests/UserRequests */ "../../libs/shared/src/flight-requests/UserRequests.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_FavouriteVideoRequests__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../libs/shared/src/flight-requests/FavouriteVideoRequests */ "../../libs/shared/src/flight-requests/FavouriteVideoRequests.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_ThemeRequests__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../../../libs/shared/src/flight-requests/ThemeRequests */ "../../libs/shared/src/flight-requests/ThemeRequests.ts");
-/* harmony import */ var _libs_common_src_react_hooks_UseSetPageTitle__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../../../libs/common/src/react/hooks/UseSetPageTitle */ "../../libs/common/src/react/hooks/UseSetPageTitle.ts");
-/* harmony import */ var _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../../../libs/analytics/src/AnalyticsHelper */ "../../libs/analytics/src/AnalyticsHelper.ts");
-/* harmony import */ var _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../../../libs/analytics/src/interfaces */ "../../libs/analytics/src/interfaces/index.ts");
-/* harmony import */ var _libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../../../../libs/shared/src/hooks/UseAlerts */ "../../libs/shared/src/hooks/UseAlerts.ts");
-/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
-/* harmony import */ var shared_flight_requests_VideoRequests__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! shared/flight-requests/VideoRequests */ "./src/shared/flight-requests/VideoRequests.ts");
-/* harmony import */ var shared_components_play_page_PlayPage__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! shared/components/play-page/PlayPage */ "./src/shared/components/play-page/PlayPage.tsx");
-/* harmony import */ var shared_constants_LiteViewModels__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! shared/constants/LiteViewModels */ "./src/shared/constants/LiteViewModels.ts");
-/* harmony import */ var shared_errors_videos_video_not_found_LiteVideoNotFoundError__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! shared/errors/videos/video-not-found/LiteVideoNotFoundError */ "./src/shared/errors/videos/video-not-found/LiteVideoNotFoundError.ts");
-/* harmony import */ var shared_errors_videos_video_private_VideoPrivateError__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! shared/errors/videos/video-private/VideoPrivateError */ "./src/shared/errors/videos/video-private/VideoPrivateError.ts");
-/* harmony import */ var shared_hooks_useHandleObjectError__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! shared/hooks/useHandleObjectError */ "./src/shared/hooks/useHandleObjectError.ts");
-/* harmony import */ var shared_hooks_useVideoMixin__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! shared/hooks/useVideoMixin */ "./src/shared/hooks/useVideoMixin.ts");
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+/* harmony import */ var _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../common/src/backbone/enums/HttpVerbs */ "../../libs/common/src/backbone/enums/HttpVerbs.ts");
+/* harmony import */ var _common_src_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../common/src/react */ "../../libs/common/src/react/index.ts");
+/* harmony import */ var _common_src_react_utils_ObjectHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../common/src/react/utils/ObjectHelper */ "../../libs/common/src/react/utils/ObjectHelper.ts");
+/* harmony import */ var _common_src_react_utils_TypeHelper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../common/src/react/utils/TypeHelper */ "../../libs/common/src/react/utils/TypeHelper.ts");
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+/* harmony import */ var _search_bar_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./search-bar.scss */ "../../libs/shared/src/components/search-bar/search-bar.scss");
+/* harmony import */ var _search_bar_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_search_bar_scss__WEBPACK_IMPORTED_MODULE_6__);
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
 
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
+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; }
 
 
 
@@ -414,87 +328,140 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 
 
+var SuggestionType;
 
+(function (SuggestionType) {
+  SuggestionType["Local"] = "local";
+  SuggestionType["Recent"] = "recent";
+  SuggestionType["Remote"] = "remote";
+})(SuggestionType || (SuggestionType = {}));
 
+function getInitialState(initialSuggestions, recentSearches) {
+  var _ref;
 
+  return _ref = {}, _defineProperty(_ref, SuggestionType.Recent, recentSearches), _defineProperty(_ref, SuggestionType.Local, initialSuggestions), _defineProperty(_ref, SuggestionType.Remote, []), _ref;
+}
 
+function hasAttribute(obj, valueKey) {
+  return _common_src_react_utils_ObjectHelper__WEBPACK_IMPORTED_MODULE_3__["ObjectHelper"].isObject(obj) && obj.hasOwnProperty(valueKey) && _common_src_react_utils_TypeHelper__WEBPACK_IMPORTED_MODULE_4__["TypeHelper"].isString(obj[valueKey]);
+}
 
+function getLocalSuggestions(query, data, valueKey) {
+  var q = query.trim().toLowerCase();
+  if (!q.length) return [];
+  return data.filter(function (d) {
+    if (!hasAttribute(d, valueKey) || !_common_src_react_utils_TypeHelper__WEBPACK_IMPORTED_MODULE_4__["TypeHelper"].isString(d[valueKey])) return false;
+    return d[valueKey].trim().toLowerCase().includes(q);
+  });
+}
 
+function fetchSuggestions(getUrl, query, callback) {
+  var resource = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_5__["FunctionHelper"].isFunction(getUrl) && getUrl(query);
+  if (!resource) return;
+  _common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].ajaxRequest({
+    resource: resource,
+    type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].GET,
+    success: callback,
+    error: function error() {}
+  });
+}
 
+function onSuggestionsFetchRequestedHandler(props, setSuggestions, resetSuggestions) {
+  return function (_ref2) {
+    var value = _ref2.value;
+    if (!value.length) resetSuggestions();
+    if (value.length < props.activationLength) return;
 
+    if (props.local) {
+      var filtered = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_5__["FunctionHelper"].isFunction(props.getLocalSuggestions) ? props.getLocalSuggestions(value, props.local) : getLocalSuggestions(value, props.local, props.valueKey);
+      setSuggestions(function (s) {
+        return Object.assign(Object.assign({}, s), _defineProperty({}, SuggestionType.Local, filtered));
+      });
+    }
 
+    if (props.getRemoteUrl) fetchSuggestions(props.getRemoteUrl, value, function (data) {
+      return setSuggestions(function (s) {
+        return Object.assign(Object.assign({}, s), _defineProperty({}, SuggestionType.Remote, _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_5__["FunctionHelper"].isFunction(props.formatRemoteSuggestions) ? props.formatRemoteSuggestions(data) : data));
+      });
+    });
+  };
+}
+function getSuggestionValue(valueKey, suggestion) {
+  if (!hasAttribute(suggestion, valueKey)) return '';
+  return suggestion[valueKey];
+}
+/**
+ * Default suggestion component. Renders text based on valueKey.
+ *
+ * @param valueKey object attribute to be rendered.
+ */
+
+function getSuggestionComponent(valueKey, suggestion) {
+  return hasAttribute(suggestion, valueKey) ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, suggestion[valueKey]) : react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
+}
+/**
+ * Maps the suggestion state into sections.
+ *
+ * @param getSections - an optional function passed in from anything consuming
+ * SearchBar used to break the local and remote suggestions into sections.
+ */
+
+function getSuggestionSections(suggestionState, showRecentSearches, recentSearchHeading, suggestionsHeading, getSections, suggestionLimit) {
+  var getTypeSuggestions = function getTypeSuggestions(type) {
+    var typeSuggestions = suggestionState[type];
+    return typeSuggestions || [];
+  };
 
+  var recentSuggestions = showRecentSearches ? getTypeSuggestions(SuggestionType.Recent) : [];
+  var localSuggestions = getTypeSuggestions(SuggestionType.Local);
+  var remoteSuggestions = getTypeSuggestions(SuggestionType.Remote);
+  var sections = [];
+  if (recentSuggestions.length) sections.push({
+    title: recentSearchHeading,
+    data: recentSuggestions
+  });
+  var matchedSuggestions = [].concat(_toConsumableArray(localSuggestions), _toConsumableArray(remoteSuggestions));
+  if (Number.isInteger(suggestionLimit) && sections.length > suggestionLimit) matchedSuggestions.slice(0, suggestionLimit);
+  if (_common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_5__["FunctionHelper"].isFunction(getSections)) sections.push.apply(sections, _toConsumableArray(getSections(matchedSuggestions)));else sections.push({
+    title: suggestionsHeading,
+    data: matchedSuggestions
+  });
+  return sections;
+}
+/**
+ * Maps a section into a list of suggestions.
+ */
 
-var namespace = 'shared.play';
-var videoErrors = {
-  notFound: shared_errors_videos_video_not_found_LiteVideoNotFoundError__WEBPACK_IMPORTED_MODULE_15__["VideoNotFoundError"],
-  forbidden: {
-    privacy: shared_errors_videos_video_private_VideoPrivateError__WEBPACK_IMPORTED_MODULE_16__["VideoPrivateError"]
-  }
+function getSectionSuggestions(section) {
+  return section.data;
+}
+function renderSectionTitle(section) {
+  if (section.title) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("strong", null, section.title);
+}
+var defaultTheme = {
+  container: 'position-relative',
+  suggestionsContainerOpen: "bg-white py-1 border rounded ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_6___default.a.suggestionsContainerOpen),
+  suggestionsList: 'list-unstyled m-0',
+  suggestion: 'cursor-pointer py-1 px-2',
+  suggestionHighlighted: _search_bar_scss__WEBPACK_IMPORTED_MODULE_6___default.a.suggestionHighlighted,
+  sectionContainer: "border-bottom py-1 ".concat(_search_bar_scss__WEBPACK_IMPORTED_MODULE_6___default.a.sectionContainer)
 };
-function PlayView(props) {
-  var _a, _b, _c;
-
-  var dispatch = Object(react_redux__WEBPACK_IMPORTED_MODULE_1__["useDispatch"])();
-  var alerts = Object(_libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_10__["useAlerts"])();
-
-  var _useViewModel = Object(_libs_common_src_react_hooks_useViewModel__WEBPACK_IMPORTED_MODULE_3__["useViewModel"])(shared_constants_LiteViewModels__WEBPACK_IMPORTED_MODULE_14__["ViewModelKeys"].WEB_PLAYER_DATA),
-      _useViewModel2 = _slicedToArray(_useViewModel, 2),
-      currentPlayerData = _useViewModel2[0],
-      setPlayerData = _useViewModel2[1];
-
-  var video = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(shared_flight_requests_VideoRequests__WEBPACK_IMPORTED_MODULE_12__["VideoRequests"].video(props.id));
-  var currentUser = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_4__["UserRequests"].currentUser()); // const relatedVideos = Flight.useBasicFetch<VideoCollection>(!!currentUser.data &&
-  //   FavouriteVideoRequests.favouriteVideos(currentUser.data.id));
-
-  var glanceTheme = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(((_b = (_a = video.data) === null || _a === void 0 ? void 0 : _a.glance) === null || _b === void 0 ? void 0 : _b.theme) ? _libs_shared_src_flight_requests_ThemeRequests__WEBPACK_IMPORTED_MODULE_6__["ThemeRequests"].theme(video.data.glance.theme) : null);
-  Object(_libs_common_src_react_hooks_UseSetPageTitle__WEBPACK_IMPORTED_MODULE_7__["useSetPageTitle"])((_c = video.data) === null || _c === void 0 ? void 0 : _c.name);
-  Object(shared_hooks_useHandleObjectError__WEBPACK_IMPORTED_MODULE_17__["useHandleObjectError"])(video, videoErrors, currentUser.data);
-  Object(shared_hooks_useVideoMixin__WEBPACK_IMPORTED_MODULE_18__["useVideoMixin"])([video.data]);
-
-  function setFavourite(_video, shouldFavourite, onError) {
-    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].fetch(dispatch, _libs_shared_src_flight_requests_FavouriteVideoRequests__WEBPACK_IMPORTED_MODULE_5__["FavouriteVideoRequests"].updateIsVideoFavourited(_video.id, currentUser.data.id, shouldFavourite, function () {
-      _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].logUserAction({
-        id: _video.id
-      }, {
-        entity: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["EntityType"].Video,
-        actionType: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["UserAction"].Favourite,
-        descriptor: shouldFavourite ? _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["ToggleDescriptor"].On : _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["ToggleDescriptor"].Off,
-        location: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["LocationContext"].PlayPage,
-        workflowPhase: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["WorkflowPhase"].Complete
-      });
-      alerts.success(_libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_11__["LanguageService"].getPhrase(namespace, shouldFavourite ? 'favourited' : 'unfavourited', {
-        video: _video.name
-      }));
-    }, onError));
-  }
+function getTheme() {
+  var theme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return Object.assign(defaultTheme, theme);
+}
 
-  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](function () {
-    var _a;
+/***/ }),
 
-    if (!video.data) return;
-    setPlayerData('video', video.data);
-    var newVideo = ((_a = currentPlayerData.video) === null || _a === void 0 ? void 0 : _a.id) !== video.data.id;
-    var newStartTime = Number.isInteger(props.startTime) && props.startTime !== currentPlayerData.startTime;
-    /**
-     * Only update start time if the video has changed or if a new startTime has been passed as a prop.
-     *
-     * We must set startTime as something other than undefined (i.e. a number) otherwise the ViewModelReducer
-     * won't recognise that it's a KVP.
-     */
+/***/ "../../libs/shared/src/components/search-bar/search-bar.scss":
+/*!*******************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/search-bar.scss ***!
+  \*******************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
 
-    if (newVideo || newStartTime) setPlayerData('startTime', props.startTime || 0);
-  }, [!!video.data, props.startTime]);
-  if (!video.data || !currentUser.data) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
-  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
-    className: 'px-3'
-  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](shared_components_play_page_PlayPage__WEBPACK_IMPORTED_MODULE_13__["PlayPage"], {
-    video: video.data,
-    glanceTheme: glanceTheme.data,
-    // relatedVideos={relatedVideos.data ? relatedVideos.data.data : null}
-    setFavourite: setFavourite
-  }));
-}
+// extracted by mini-css-extract-plugin
+module.exports = {"inputWithoutHighlight":"cv--inputWithoutHighlight---L0yF","suggestionsContainerOpen":"cv--suggestionsContainerOpen--ahMdW","sectionContainer":"cv--sectionContainer--xstWL","suggestionHighlighted":"cv--suggestionHighlighted--3YTCa","inputContainer":"cv--inputContainer--1wn3m","clearButton":"cv--clearButton--1BwBs","inputWithLeftIcon":"cv--inputWithLeftIcon--qxZOe","inputWithRightIcon":"cv--inputWithRightIcon--3U4W-","inputWithTwoRightIcons":"cv--inputWithTwoRightIcons--2rgzF","iconContainer":"cv--iconContainer--1DLw5","leftIconContainer":"cv--leftIconContainer--AZCtZ","rightIconContainer":"cv--rightIconContainer--1R52s"};
 
 /***/ })