@clickview/lite 0.0.24-rc.4 → 0.0.24

package/dist/scripts/14.chunk.js

@@ -1,51 +1,97 @@
 (window["webpackJsonp_clickview_lite"] = window["webpackJsonp_clickview_lite"] || []).push([[14],{
 
-/***/ "../../libs/common/src/react/utils/TypeHelper.ts":
-/*!*******************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/common/src/react/utils/TypeHelper.ts ***!
-  \*******************************************************************************************/
-/*! exports provided: TypeHelper */
+/***/ "../../libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList.tsx":
+/*!*********************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList.tsx ***!
+  \*********************************************************************************************************************************/
+/*! exports provided: PartialPlaylistList */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* 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); }
-
-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;
-  }
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialPlaylistList", function() { return PartialPlaylistList; });
+/* 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_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./playlist.scss */ "../../libs/shared/src/apps/playlists/components/playlist-list/playlist.scss");
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_playlist_scss__WEBPACK_IMPORTED_MODULE_2__);
+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); }
+
+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; }
+
+
+
+
+PartialPlaylistList.defaultProps = {
+  numItems: 8
 };
+function PartialPlaylistList(props) {
+  var PARTIAL_PLAYLISTS = _toConsumableArray(Array(props.numItems));
+
+  var className = props.itemClassName || '';
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, props.showHeading && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "".concat(_playlist_scss__WEBPACK_IMPORTED_MODULE_2___default.a.partialHeading, " partial-loading-background")
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Row"], null, PARTIAL_PLAYLISTS.map(function (p, idx) {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Col"], {
+      key: idx,
+      xs: 6,
+      sm: 4,
+      lg: 3,
+      className: className
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: 'py-2'
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: "".concat(_playlist_scss__WEBPACK_IMPORTED_MODULE_2___default.a.playlistItem, " partial-loading-background")
+    })));
+  })));
+}
 
 /***/ }),
 
-/***/ "../../libs/shared/src/components/search-bar/SearchBar.tsx":
-/*!*****************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/SearchBar.tsx ***!
-  \*****************************************************************************************************/
-/*! exports provided: SearchBar */
+/***/ "../../libs/shared/src/components/widgets/dynamic-widget/DynamicWidget.tsx":
+/*!*********************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/dynamic-widget/DynamicWidget.tsx ***!
+  \*********************************************************************************************************************/
+/*! exports provided: DynamicWidget, PartialDynamicWidget */
 /***/ (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 export (binding) */ __webpack_require__.d(__webpack_exports__, "DynamicWidget", function() { return DynamicWidget; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialDynamicWidget", function() { return PartialDynamicWidget; });
 /* 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");
+/* harmony import */ var _common_src_react_utils_ObjectHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../common/src/react/utils/ObjectHelper */ "../../libs/common/src/react/utils/ObjectHelper.ts");
+/* 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 _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../common/src/react/utils/ArrayHelper */ "../../libs/common/src/react/utils/ArrayHelper.ts");
+/* harmony import */ var _hooks_UseResizeListener__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../hooks/UseResizeListener */ "../../libs/shared/src/hooks/UseResizeListener.ts");
+/* harmony import */ var _hooks_UseLazyLoad__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../hooks/UseLazyLoad */ "../../libs/shared/src/hooks/UseLazyLoad.ts");
+/* harmony import */ var _enums_CssMeasurement__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../enums/CssMeasurement */ "../../libs/shared/src/enums/CssMeasurement.ts");
+/* harmony import */ var _widget_button_WidgetButton__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../widget-button/WidgetButton */ "../../libs/shared/src/components/widgets/widget-button/WidgetButton.tsx");
+/* harmony import */ var _items_subject_widget_item_PartialSubjectWidgetItem__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../items/subject-widget-item/PartialSubjectWidgetItem */ "../../libs/shared/src/components/widgets/items/subject-widget-item/PartialSubjectWidgetItem.tsx");
+/* harmony import */ var _sliding_list_SlidingListContainer__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../sliding-list/SlidingListContainer */ "../../libs/shared/src/components/widgets/sliding-list/SlidingListContainer.tsx");
+/* harmony import */ var _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../enums/WidgetInteraction */ "../../libs/shared/src/enums/WidgetInteraction.ts");
+/* harmony import */ var _text_Text__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../text/Text */ "../../libs/shared/src/components/text/Text.tsx");
+/* harmony import */ var _utils_PartialLoadingHelper__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../../utils/PartialLoadingHelper */ "../../libs/shared/src/utils/PartialLoadingHelper.ts");
+/* harmony import */ var _utils_WidgetHelper__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../../utils/WidgetHelper */ "../../libs/shared/src/utils/WidgetHelper.ts");
+/* harmony import */ var _app_link_AppLink__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
+/* harmony import */ var _analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../../../../analytics/src/AnalyticsHelper */ "../../libs/analytics/src/AnalyticsHelper.ts");
+/* harmony import */ var _DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./DynamicWidgetEventHandlers */ "../../libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetEventHandlers.ts");
+/* harmony import */ var _DynamicWidgetReducer__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./DynamicWidgetReducer */ "../../libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetReducer.tsx");
+/* harmony import */ var _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./dynamic-widget.scss */ "../../libs/shared/src/components/widgets/dynamic-widget/dynamic-widget.scss");
+/* harmony import */ var _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default = /*#__PURE__*/__webpack_require__.n(_dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19__);
+/* harmony import */ var _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../../utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 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."); }
@@ -66,247 +112,453 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 
 
-var namespace = 'shared.searchBar';
-var isFunction = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_2__["FunctionHelper"].isFunction;
 
-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);
-}
 
-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);
 
-  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0__["useState"](props.initialQuery || ''),
+
+
+
+
+
+
+
+
+
+
+
+var namespace = 'shared.dynamicWidget';
+function DynamicWidget(props) {
+  var WidgetItemComponent = props.childComponent,
+      staticChildren = props.staticChildren;
+
+  var _React$useReducer = react__WEBPACK_IMPORTED_MODULE_0__["useReducer"](_DynamicWidgetReducer__WEBPACK_IMPORTED_MODULE_18__["DynamicWidgetReducer"], _DynamicWidgetReducer__WEBPACK_IMPORTED_MODULE_18__["initialSliderState"]),
+      _React$useReducer2 = _slicedToArray(_React$useReducer, 2),
+      state = _React$useReducer2[0],
+      dispatch = _React$useReducer2[1]; // A snapshot of the widget state is captured on the very first `Drag` event as a point of reference
+
+
+  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0__["useState"](null),
       _React$useState2 = _slicedToArray(_React$useState, 2),
-      query = _React$useState2[0],
-      setQuery = _React$useState2[1];
+      widgetSnapshot = _React$useState2[0],
+      setWidgetSnapshot = _React$useState2[1];
+
+  var elementRefs = {
+    container: react__WEBPACK_IMPORTED_MODULE_0__["useRef"](null),
+    firstElement: react__WEBPACK_IMPORTED_MODULE_0__["useRef"](null),
+    lastElement: react__WEBPACK_IMPORTED_MODULE_0__["useRef"](null)
+  };
+  Object(_hooks_UseResizeListener__WEBPACK_IMPORTED_MODULE_5__["useResizeListener"])(Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getResizeHandler"])(elementRefs, dispatch), Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getResizeEndHandler"])(elementRefs.container));
 
-  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 _useLazyLoad = Object(_hooks_UseLazyLoad__WEBPACK_IMPORTED_MODULE_6__["useLazyLoad"])(!props.lazyLoad),
+      ref = _useLazyLoad.ref,
+      inView = _useLazyLoad.inView;
+
+  var widgetData = props.collection;
+  if (!props.collection && _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_2__["FunctionHelper"].isFunction(props.fetch)) widgetData = props.fetch(inView);
+  /**
+   * Once the widget data has been set, we can initialize the reducer. This is because
+   * the reducer depends on the refs being set, but they don't get set until the markup has been loaded.
+   */
 
-  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]);
+    if (!widgetData || _common_src_react_utils_ObjectHelper__WEBPACK_IMPORTED_MODULE_1__["ObjectHelper"].isEmpty(widgetData)) return;
+    dispatch({
+      type: _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Init,
+      payload: elementRefs
+    });
+  }, [widgetData]);
 
-  var resetSuggestions = function resetSuggestions() {
-    setSuggestions(initialState);
-  };
+  function getWidgetItems() {
+    var _a;
 
-  var onChange = function onChange(e, _ref) {
-    var newValue = _ref.newValue;
-    setQuery(newValue);
-    if (isFunction(props.onQueryChange)) props.onQueryChange(newValue);
-  };
+    if (!widgetData) return;
+    var FirstComponent;
+    var LastComponent;
 
-  var onSubmit = function onSubmit(event) {
-    event.preventDefault();
-    if (isFunction(props.onSubmit)) props.onSubmit(query);
-  };
+    if ((_a = staticChildren) === null || _a === void 0 ? void 0 : _a.length) {
+      var firstChild = _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_4__["ArrayHelper"].findWhere(staticChildren, {
+        position: 'start'
+      });
+      var lastChild = _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_4__["ArrayHelper"].findWhere(staticChildren, {
+        position: 'end'
+      });
+      FirstComponent = firstChild ? firstChild.component : null;
+      LastComponent = lastChild ? lastChild.component : null;
+    }
 
-  var onKeyDown = function onKeyDown(event) {
-    if (event.keyCode === 8 && props.onBackspace && !query) props.onBackspace();
-  };
+    var items = widgetData.map(function (widgetItem, index) {
+      var _a, _b;
+
+      var itemRef;
+      if (widgetItem === _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_4__["ArrayHelper"].first(widgetData) && !FirstComponent) itemRef = elementRefs.firstElement;
+      if (widgetItem === _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_4__["ArrayHelper"].last(widgetData) && !LastComponent) itemRef = elementRefs.lastElement;
+      return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+        key: widgetItem.id,
+        ref: itemRef,
+        className: _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default.a.itemSpacing
+      }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](WidgetItemComponent, {
+        data: widgetItem,
+        appLink: props.childAppLink,
+        analyticsData: Object.assign({
+          itemIndex: index
+        }, (_a = props) === null || _a === void 0 ? void 0 : _a.analyticsData),
+        analyticsOptions: Object.assign(Object.assign({}, (_b = props) === null || _b === void 0 ? void 0 : _b.analyticsOptions), _utils_WidgetHelper__WEBPACK_IMPORTED_MODULE_14__["WidgetHelper"].getSliderItemAnalyticsOptions())
+      }));
+    });
+    if (FirstComponent) items.unshift(react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      key: 'first-widget-component',
+      ref: elementRefs.firstElement,
+      className: _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default.a.itemSpacing
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](FirstComponent, null)));
+    if (LastComponent) items.push(react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      key: 'end-widget-component',
+      ref: elementRefs.lastElement,
+      className: _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default.a.itemSpacing
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](LastComponent, null)));
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, items);
+  }
+
+  var widgetItems = react__WEBPACK_IMPORTED_MODULE_0__["useMemo"](getWidgetItems, [widgetData]);
+  if (widgetData && !widgetData.length) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
 
-  var onClickClearInput = function onClickClearInput() {
-    setQuery('');
-    if (isFunction(props.onClickClearInput)) props.onClickClearInput();
+  if (!widgetData || _common_src_react_utils_ObjectHelper__WEBPACK_IMPORTED_MODULE_1__["ObjectHelper"].isEmpty(widgetData)) {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      ref: ref
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](PartialDynamicWidget, null));
+  }
+
+  var getSliderAnalyticsData = function getSliderAnalyticsData(type) {
+    return Object.assign(Object.assign({}, props.analyticsData), {
+      name: _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__["LanguageService"].getPhrase(namespace, props.headingPhraseKey),
+      direction: type === _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Next ? 'right' : 'left'
+    });
   };
 
-  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);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, function () {
+    if (!props.headingPhraseKey) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
+    var isTopic = props.headingPhraseKey === 'topics';
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_app_link_AppLink__WEBPACK_IMPORTED_MODULE_15__["AppLink"], {
+      appLink: props.headingAppLink
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("h2", {
+      className: "".concat(_dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default.a.heading, " ").concat(props.headingAppLink ? _dynamic_widget_scss__WEBPACK_IMPORTED_MODULE_19___default.a.link : '', " h4 d-inline-block mr-2 pl-1 mb-2")
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_text_Text__WEBPACK_IMPORTED_MODULE_12__["Text"], {
+      namespace: namespace,
+      phrase: props.headingPhraseKey
+    }), isTopic && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_20__["SvgContainer"], {
+      svgName: _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_21__["cvSvgLibrary"].ChevronRight,
+      size: _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_20__["SvgContainerSize"].Small
+    })));
+  }(), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'position-relative px-1'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_widget_button_WidgetButton__WEBPACK_IMPORTED_MODULE_8__["WidgetButton"], {
+    direction: _widget_button_WidgetButton__WEBPACK_IMPORTED_MODULE_8__["WidgetButtonDirection"].Left,
+    onClick: function onClick() {
+      dispatch({
+        type: _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Previous
+      });
+      _analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_16__["AnalyticsHelper"].logUserAction(getSliderAnalyticsData(_enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Previous), _utils_WidgetHelper__WEBPACK_IMPORTED_MODULE_14__["WidgetHelper"].getSliderAnalyticsOptions());
     },
-    alwaysRenderSuggestions: props.alwaysRenderSuggestions,
-
-    /**
-     * Setting focusInputOnSuggestionClick to false when isMobile is true prevents the keyboard from
-     * appearing on mobile devices when a suggestion is clicked.
-     */
-    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
+    hide: state.hideLeftButton,
+    useGradientBackdrop: true
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'overflow-hidden'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_sliding_list_SlidingListContainer__WEBPACK_IMPORTED_MODULE_10__["SlidingListContainer"], {
+    position: state.offset,
+    positionType: _enums_CssMeasurement__WEBPACK_IMPORTED_MODULE_7__["CssMeasurement"].Pixels,
+    onDrag: Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getDragHandler"])(elementRefs.container, state, dispatch, widgetSnapshot, setWidgetSnapshot),
+    onDragEnd: Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getDragEndHandler"])(elementRefs.container, setWidgetSnapshot),
+    onTouchMove: Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getTouchMoveHandler"])(elementRefs.container, state, dispatch, widgetSnapshot, setWidgetSnapshot),
+    onTouchEnd: Object(_DynamicWidgetEventHandlers__WEBPACK_IMPORTED_MODULE_17__["getTouchEndHandler"])(elementRefs.container, setWidgetSnapshot),
+    ref: elementRefs.container
+  }, widgetItems)), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_widget_button_WidgetButton__WEBPACK_IMPORTED_MODULE_8__["WidgetButton"], {
+    direction: _widget_button_WidgetButton__WEBPACK_IMPORTED_MODULE_8__["WidgetButtonDirection"].Right,
+    onClick: function onClick() {
+      dispatch({
+        type: _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Next
+      });
+      _analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_16__["AnalyticsHelper"].logUserAction(getSliderAnalyticsData(_enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_11__["WidgetInteraction"].Next), _utils_WidgetHelper__WEBPACK_IMPORTED_MODULE_14__["WidgetHelper"].getSliderAnalyticsOptions());
     },
-    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"]
-  }));
+    hide: state.hideRightButton,
+    useGradientBackdrop: true
+  })));
 }
+var PARTIAL_WIDGET_ITEMS = _utils_PartialLoadingHelper__WEBPACK_IMPORTED_MODULE_13__["PartialLoadingHelper"].getPartialLoadingItems();
+var PartialDynamicWidget = function PartialDynamicWidget() {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'pb-3 d-flex flex-nowrap'
+  }, PARTIAL_WIDGET_ITEMS.map(function (item, idx) {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_items_subject_widget_item_PartialSubjectWidgetItem__WEBPACK_IMPORTED_MODULE_9__["PartialSubjectWidgetItem"], {
+      key: idx
+    });
+  }));
+};
 
 /***/ }),
 
-/***/ "../../libs/shared/src/components/search-bar/SearchInput.tsx":
-/*!*******************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/SearchInput.tsx ***!
-  \*******************************************************************************************************/
-/*! exports provided: SearchInput */
+/***/ "../../libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetEventHandlers.ts":
+/*!*********************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetEventHandlers.ts ***!
+  \*********************************************************************************************************************************/
+/*! exports provided: getResizeHandler, getResizeEndHandler, getDragHandler, getTouchMoveHandler, getDragEndHandler, getTouchEndHandler */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* 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 = {};
-
-  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__, "getResizeHandler", function() { return getResizeHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getResizeEndHandler", function() { return getResizeEndHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDragHandler", function() { return getDragHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTouchMoveHandler", function() { return getTouchMoveHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDragEndHandler", function() { return getDragEndHandler; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTouchEndHandler", function() { return getTouchEndHandler; });
+/* harmony import */ var _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../enums/WidgetInteraction */ "../../libs/shared/src/enums/WidgetInteraction.ts");
 
-  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]];
+/**
+ * Resize events
+ */
+
+var getResizeHandler = function getResizeHandler(elementRefs, dispatch) {
+  return function () {
+    if (elementRefs.container.current) elementRefs.container.current.style.transition = '';
+    dispatch({
+      type: _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Resize,
+      payload: elementRefs
+    });
+  };
+};
+var getResizeEndHandler = function getResizeEndHandler(containerRef) {
+  return function () {
+    if (containerRef.current) containerRef.current.style.transition = 'transform .4s ease-in-out';
+  };
+};
+/**
+ * Touch / Drag start events
+ */
+
+var getDragHandler = function getDragHandler(containerRef, widgetState, dispatch, widgetSnapshot, setWidgetSnapshot) {
+  return function (event) {
+    var mouseX = event.clientX;
+    handleDragOrTouchMove(mouseX, containerRef, widgetState, dispatch, widgetSnapshot, setWidgetSnapshot);
+  };
+};
+var getTouchMoveHandler = function getTouchMoveHandler(containerRef, widgetState, dispatch, widgetSnapshot, setWidgetSnapshot) {
+  return function (event) {
+    var firstTouch = event.touches.item(0);
+    var touchX = firstTouch.clientX;
+    handleDragOrTouchMove(touchX, containerRef, widgetState, dispatch, widgetSnapshot, setWidgetSnapshot);
+  };
+};
+
+function handleDragOrTouchMove(xCoord, containerRef, widgetState, dispatch, widgetSnapshot, setWidgetSnapshot) {
+  var snapshot = widgetSnapshot;
+
+  if (!snapshot) {
+    snapshot = Object.assign(Object.assign({}, widgetState), {
+      initialMouseX: xCoord
+    });
+    setWidgetSnapshot(snapshot);
+    containerRef.current.style.transition = '';
   }
-  return t;
+
+  dispatch({
+    type: _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Drag,
+    payload: {
+      widgetSnapshot: snapshot,
+      currentMouseX: xCoord
+    }
+  });
+}
+/**
+ * Touch / Drag end events
+ */
+
+
+var getDragEndHandler = function getDragEndHandler(containerRef, setWidgetSnapshot) {
+  return function () {
+    containerRef.current.style.transition = 'transform .4s ease-in-out';
+    setWidgetSnapshot(null);
+  };
 };
+var getTouchEndHandler = getDragEndHandler;
 
+/***/ }),
 
+/***/ "../../libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetReducer.tsx":
+/*!****************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/dynamic-widget/DynamicWidgetReducer.tsx ***!
+  \****************************************************************************************************************************/
+/*! exports provided: initialSliderState, DynamicWidgetReducer */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "initialSliderState", function() { return initialSliderState; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DynamicWidgetReducer", function() { return DynamicWidgetReducer; });
+/* harmony import */ var _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../enums/WidgetInteraction */ "../../libs/shared/src/enums/WidgetInteraction.ts");
 
+var MAX_SLIDE_DISTANCE = 500; // px
 
+/**
+ * `null` values are initialized in the `Init` action. This is dispatched
+ * later, because it uses JQuery elements that aren't immediately available
+ * when `useReducer` is called.
+ */
 
+var initialSliderState = {
+  offset: 0,
+  containerLeftPosition: null,
+  containerRightPosition: null,
+  firstElementPosition: null,
+  lastElementPosition: null,
+  hideLeftButton: true,
+  hideRightButton: true,
+  maxSlideDistance: MAX_SLIDE_DISTANCE,
+  leftOffsetLimit: null
+};
 
-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 onInit(payload) {
+  var _payload$container = payload.container,
+      container = _payload$container === void 0 ? {} : _payload$container,
+      _payload$lastElement = payload.lastElement,
+      lastElement = _payload$lastElement === void 0 ? {} : _payload$lastElement;
+  if (!container.current || !lastElement.current) return initialSliderState;
+  var containerLeftPosition = payload.container.current.getBoundingClientRect().left;
+  var containerRightPosition = payload.container.current.getBoundingClientRect().right;
+  var firstElementPosition = containerLeftPosition;
+  var lastElementPosition = payload.lastElement.current.getBoundingClientRect().right;
+  var leftOffsetLimit = containerRightPosition - lastElementPosition;
+  return Object.assign(Object.assign({}, initialSliderState), {
+    containerLeftPosition: containerLeftPosition,
+    containerRightPosition: containerRightPosition,
+    firstElementPosition: firstElementPosition,
+    lastElementPosition: lastElementPosition,
+    hideRightButton: lastElementPosition < containerRightPosition,
+    leftOffsetLimit: leftOffsetLimit
+  });
 }
 
-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';
+function onNext(prevState) {
+  var firstElementPosition = prevState.firstElementPosition,
+      lastElementPosition = prevState.lastElementPosition,
+      maxSlideDistance = prevState.maxSlideDistance,
+      offset = prevState.offset,
+      containerRightPosition = prevState.containerRightPosition;
+  /**
+   * The distance in pixels that the slider will move along the x-axis.
+   * This will be the `maxSlideDistance` constant value, or if that value is too large we calculate
+   * the remaining overflowing space and only slide by that amount.
+   */
+
+  var slideDistance = lastElementPosition - containerRightPosition >= maxSlideDistance ? maxSlideDistance : lastElementPosition - containerRightPosition;
+  return {
+    firstElementPosition: firstElementPosition - slideDistance,
+    lastElementPosition: lastElementPosition - slideDistance,
+    offset: offset - slideDistance,
+    hideRightButton: lastElementPosition - slideDistance === containerRightPosition,
+    hideLeftButton: false
+  };
 }
 
-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)
-    }));
+function onPrevious(prevState) {
+  var containerLeftPosition = prevState.containerLeftPosition,
+      firstElementPosition = prevState.firstElementPosition,
+      lastElementPosition = prevState.lastElementPosition,
+      maxSlideDistance = prevState.maxSlideDistance,
+      offset = prevState.offset;
+  var fullSlide = firstElementPosition + maxSlideDistance <= containerLeftPosition;
+  var slideDistance = fullSlide ? maxSlideDistance : Math.abs(offset);
+  return {
+    firstElementPosition: firstElementPosition + slideDistance,
+    lastElementPosition: lastElementPosition + slideDistance,
+    offset: offset + slideDistance,
+    hideLeftButton: !fullSlide || firstElementPosition + slideDistance === containerLeftPosition,
+    hideRightButton: false
   };
+}
 
-  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)
-    }));
+function onDrag(prevState, payload) {
+  var widgetSnapshot = payload.widgetSnapshot,
+      currentMouseX = payload.currentMouseX; // Disable dragging if the slider isn't long enough
+
+  if (widgetSnapshot.hideLeftButton && widgetSnapshot.hideRightButton) return {}; // The distance from the initial `MouseDown` event x-coordinate, to the present x-coordinate
+
+  var dragDistance = widgetSnapshot.initialMouseX - currentMouseX;
+  var offset = widgetSnapshot.offset - dragDistance;
+  var firstElementPosition = widgetSnapshot.firstElementPosition - dragDistance;
+  var lastElementPosition = widgetSnapshot.lastElementPosition - dragDistance;
+  var hideLeftButton = false;
+  var hideRightButton = false;
+
+  if (firstElementPosition > prevState.containerLeftPosition) {
+    offset = 0;
+    firstElementPosition = prevState.containerLeftPosition;
+    lastElementPosition = prevState.lastElementPosition;
+    hideLeftButton = true;
+  }
+
+  if (lastElementPosition <= prevState.containerRightPosition) {
+    offset = prevState.leftOffsetLimit;
+    firstElementPosition = prevState.containerLeftPosition - Math.abs(prevState.leftOffsetLimit);
+    lastElementPosition = widgetSnapshot.containerRightPosition;
+    hideRightButton = true;
+  }
+
+  return {
+    offset: offset,
+    firstElementPosition: firstElementPosition,
+    lastElementPosition: lastElementPosition,
+    hideLeftButton: hideLeftButton,
+    hideRightButton: hideRightButton
   };
+}
 
-  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)));
+function DynamicWidgetReducer(prevState, action) {
+  switch (action.type) {
+    case _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Init:
+    case _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Resize:
+      return Object.assign(Object.assign({}, prevState), onInit(action.payload));
+
+    case _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Next:
+      return Object.assign(Object.assign({}, prevState), onNext(prevState));
+
+    case _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Previous:
+      return Object.assign(Object.assign({}, prevState), onPrevious(prevState));
+
+    case _enums_WidgetInteraction__WEBPACK_IMPORTED_MODULE_0__["WidgetInteraction"].Drag:
+      return Object.assign(Object.assign({}, prevState), onDrag(prevState, action.payload));
+
+    default:
+      return prevState;
+  }
 }
 
 /***/ }),
 
-/***/ "../../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 */
+/***/ "../../libs/shared/src/components/widgets/dynamic-widget/dynamic-widget.scss":
+/*!***********************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/dynamic-widget/dynamic-widget.scss ***!
+  \***********************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"itemSpacing":"cv--itemSpacing--10Pgb","heading":"cv--heading--2uNzU","link":"cv--link--3IGFJ"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/widgets/items/series-widget-item/PartialSeriesList.tsx":
+/*!***********************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/items/series-widget-item/PartialSeriesList.tsx ***!
+  \***********************************************************************************************************************************/
+/*! exports provided: PartialSeriesList */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* 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 export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialSeriesList", function() { return PartialSeriesList; });
 /* 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_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__);
+/* harmony import */ var _series_widget_item_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./series-widget-item.scss */ "../../libs/shared/src/components/widgets/items/series-widget-item/series-widget-item.scss");
+/* harmony import */ var _series_widget_item_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_series_widget_item_scss__WEBPACK_IMPORTED_MODULE_1__);
 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."); }
@@ -319,149 +571,358 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 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; }
 
 
 
+var PARTIAL_SERIES = _toConsumableArray(Array(4));
+
+var PartialSeriesList = function PartialSeriesList() {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'pb-3'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "partial-loading-background ".concat(_series_widget_item_scss__WEBPACK_IMPORTED_MODULE_1___default.a.partialLoadingHeading),
+    dangerouslySetInnerHTML: {
+      __html: '&nbsp'
+    }
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'row'
+  }, PARTIAL_SERIES.map(function (s, idx) {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      key: idx,
+      className: 'col-6 col-sm-4 col-lg-3 '
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: 'py-2'
+    }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+      className: "".concat(_series_widget_item_scss__WEBPACK_IMPORTED_MODULE_1___default.a.partialLoading, " partial-loading-background")
+    })));
+  })));
+};
+
+/***/ }),
 
+/***/ "../../libs/shared/src/components/widgets/items/subject-widget-item/PartialSubjectWidgetItem.tsx":
+/*!*******************************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/items/subject-widget-item/PartialSubjectWidgetItem.tsx ***!
+  \*******************************************************************************************************************************************/
+/*! exports provided: PartialSubjectWidgetItem */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialSubjectWidgetItem", function() { return PartialSubjectWidgetItem; });
+/* 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_react_utils_RandomHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../common/src/react/utils/RandomHelper */ "../../libs/common/src/react/utils/RandomHelper.ts");
+/* harmony import */ var _thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../thumbnails/base/ThumbnailFallback */ "../../libs/shared/src/components/thumbnails/base/ThumbnailFallback.tsx");
+/* harmony import */ var _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./subject-widget-item.scss */ "../../libs/shared/src/components/widgets/items/subject-widget-item/subject-widget-item.scss");
+/* harmony import */ var _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_3__);
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
+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 _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 SuggestionType;
+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 (SuggestionType) {
-  SuggestionType["Local"] = "local";
-  SuggestionType["Recent"] = "recent";
-  SuggestionType["Remote"] = "remote";
-})(SuggestionType || (SuggestionType = {}));
+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 getInitialState(initialSuggestions, recentSearches) {
-  var _ref;
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-  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;
+var PartialSubjectWidgetItem = function PartialSubjectWidgetItem() {
+  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0__["useState"](_common_src_react_utils_RandomHelper__WEBPACK_IMPORTED_MODULE_1__["RandomHelper"].getRandomInt(5) + 3 + 'rem'),
+      _React$useState2 = _slicedToArray(_React$useState, 1),
+      width = _React$useState2[0];
 
-    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));
-      });
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "border d-flex position-relative mr-2 ".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_3___default.a.widgetItem)
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_3___default.a.imagePanel
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'px-2',
+    style: {
+      width: width
     }
+  }, "\xA0"), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_2__["ThumbnailFallback"], {
+    type: _thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_2__["ThumbnailFallbackType"].Subject
+  }));
+};
 
-    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.
- */
+/***/ "../../libs/shared/src/components/widgets/items/subject-widget-item/SubjectWidgetItem.tsx":
+/*!************************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/items/subject-widget-item/SubjectWidgetItem.tsx ***!
+  \************************************************************************************************************************************/
+/*! exports provided: SubjectWidgetItem */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-function getSuggestionSections(suggestionState, showRecentSearches, recentSearchHeading, suggestionsHeading, getSections, suggestionLimit) {
-  var getTypeSuggestions = function getTypeSuggestions(type) {
-    var typeSuggestions = suggestionState[type];
-    return typeSuggestions || [];
-  };
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SubjectWidgetItem", function() { return Memoized; });
+/* 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_react_utils_TextHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../common/src/react/utils/TextHelper */ "../../libs/common/src/react/utils/TextHelper.ts");
+/* harmony import */ var _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../utils/ImageHelper */ "../../libs/shared/src/utils/ImageHelper.ts");
+/* harmony import */ var _enums_Images__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../enums/Images */ "../../libs/shared/src/enums/Images.ts");
+/* harmony import */ var _app_link_AppLink__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
+/* harmony import */ var _thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../thumbnails/base/ThumbnailFallback */ "../../libs/shared/src/components/thumbnails/base/ThumbnailFallback.tsx");
+/* harmony import */ var _text_Text__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../text/Text */ "../../libs/shared/src/components/text/Text.tsx");
+/* harmony import */ var _analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../../../analytics/src/interfaces */ "../../libs/analytics/src/interfaces/index.ts");
+/* harmony import */ var _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./subject-widget-item.scss */ "../../libs/shared/src/components/widgets/items/subject-widget-item/subject-widget-item.scss");
+/* harmony import */ var _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8__);
+
+
+
+
+
+
+
+
+
+var namespace = 'shared.subjectWidgetItem';
+
+var ComingSoonNamePanel = function ComingSoonNamePanel(_ref) {
+  var name = _ref.name,
+      multiline = _ref.multiline;
+  var wrapperClassName = "".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.comingSoonPanel, " \n    d-flex flex-column align-items-center justify-content-center px-3 text-center");
+  var textClassName = "".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.name, " h6 mb-0 pb-1");
+
+  if (!multiline) {
+    wrapperClassName += ' text-nowrap';
+    textClassName += ' text-truncate';
+  } else {
+    textClassName += " ".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.clamped, " clamp-2");
+  }
 
-  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
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: wrapperClassName
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("small", {
+    className: 'text-muted'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'comingSoon'
+  })), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("p", {
+    className: textClassName
+  }, name));
+};
+
+var NormalNamePanel = function NormalNamePanel(_ref2) {
+  var name = _ref2.name,
+      multiline = _ref2.multiline;
+  var wrapperClassName = 'px-3 text-center d-flex align-items-center';
+  var textClassName = "".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.name, " h6 mb-0 pb-1");
+
+  if (!multiline) {
+    wrapperClassName += ' text-nowrap text-truncate';
+    textClassName += ' text-truncate';
+  } else {
+    textClassName += " ".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.clamped, " clamp-2 text-left");
+  }
+
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: wrapperClassName
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("p", {
+    className: textClassName
+  }, name));
+};
+
+function SubjectWidgetItem(props) {
+  var _a, _b, _c, _d, _e;
+
+  var appLink = Object.assign(Object.assign({}, props.appLink), {
+    args: [props.data.id, _common_src_react_utils_TextHelper__WEBPACK_IMPORTED_MODULE_1__["TextHelper"].slugify(props.data.name)]
   });
-  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
+  var coverUrl = _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_2__["ImageHelper"].createUrl((_a = props.data.cover) === null || _a === void 0 ? void 0 : _a.url, {
+    size: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ImageSize"].Small
   });
-  return sections;
+  var analyticsData = Object.assign(Object.assign({}, props.analyticsData), {
+    id: (_b = props.data) === null || _b === void 0 ? void 0 : _b.id,
+    name: (_c = props.data) === null || _c === void 0 ? void 0 : _c.name,
+    presentationId: (_d = props.data) === null || _d === void 0 ? void 0 : _d.presentationId,
+    comingSoon: !!((_e = props.data) === null || _e === void 0 ? void 0 : _e.comingSoon)
+  });
+  var analyticsOptions = Object.assign(Object.assign({}, props.analyticsOptions), {
+    actionType: _analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_7__["UserAction"].Click,
+    entity: _analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_7__["EntityType"].Classification,
+    descriptor: _analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_7__["ClickDescriptor"].Cover
+  });
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_app_link_AppLink__WEBPACK_IMPORTED_MODULE_4__["AppLink"], {
+    appLink: appLink,
+    analyticsData: analyticsData,
+    analyticsOptions: analyticsOptions
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "border d-flex position-relative ".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.widgetItem),
+    id: props.data.id
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: "".concat(_subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.imagePanel, " ").concat(props.isLarge ? _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.large : '')
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.image,
+    style: {
+      backgroundImage: "url('".concat(coverUrl, "')")
+    }
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_5__["ThumbnailFallback"], {
+    type: _thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_5__["ThumbnailFallbackType"].Subject,
+    extraClasses: props.isLarge ? _subject_widget_item_scss__WEBPACK_IMPORTED_MODULE_8___default.a.large : ''
+  })), props.data.comingSoon ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"](ComingSoonNamePanel, {
+    name: props.data.name,
+    multiline: props.isLarge
+  }) : react__WEBPACK_IMPORTED_MODULE_0__["createElement"](NormalNamePanel, {
+    name: props.data.name,
+    multiline: props.isLarge
+  })));
 }
-/**
- * Maps a section into a list of suggestions.
- */
 
-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 getTheme() {
-  var theme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return Object.assign(defaultTheme, theme);
-}
+var Memoized = react__WEBPACK_IMPORTED_MODULE_0__["memo"](SubjectWidgetItem);
+
 
 /***/ }),
 
-/***/ "../../libs/shared/src/components/search-bar/search-bar.scss":
-/*!*******************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/search-bar/search-bar.scss ***!
-  \*******************************************************************************************************/
+/***/ "../../libs/shared/src/components/widgets/items/subject-widget-item/subject-widget-item.scss":
+/*!***************************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/widgets/items/subject-widget-item/subject-widget-item.scss ***!
+  \***************************************************************************************************************************************/
 /*! no static exports found */
 /***/ (function(module, exports, __webpack_require__) {
 
 // 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"};
+module.exports = {"widgetItem":"cv--widgetItem--1oyw1","imagePanel":"cv--imagePanel--1UOVG","image":"cv--image--1_BF4","large":"cv--large--1EtWs","comingSoonPanel":"cv--comingSoonPanel--3js2e","name":"cv--name--3csgE","clamped":"cv--clamped--1y2oG","editSubjectsItem":"cv--editSubjectsItem--1yBMf","allSubjectsItem":"cv--allSubjectsItem--2oBMH","logoContainer":"cv--logoContainer--T3Lym"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/flight-requests/AudienceRequests.ts":
+/*!*****************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/AudienceRequests.ts ***!
+  \*****************************************************************************************************/
+/*! exports provided: AudienceRequests */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AudienceRequests", function() { return AudienceRequests; });
+var endpoints = {
+  presentationAudiences: function presentationAudiences() {
+    return "/api/domain/v1/subjects/audiences?type=subject";
+  }
+};
+var AudienceRequests = {
+  presentationAudiences: function presentationAudiences() {
+    return {
+      bootstrapName: 'presentationAudiences',
+      url: endpoints.presentationAudiences(),
+      key: "presentation:audiences",
+      normalize: false
+    };
+  }
+};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/hooks/UseResizeListener.ts":
+/*!********************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseResizeListener.ts ***!
+  \********************************************************************************************/
+/*! exports provided: useResizeListener */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useResizeListener", function() { return useResizeListener; });
+/* 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__);
+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); }
+
+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; }
+
+
+/**
+ * Hook function for listening to scroll events
+ * @param onResize - gets called on resize.
+ * @param onResizeEnd (optional) - gets called 100ms after the last resize event. Timer restarts everytime the callback
+ * runs so that endCallback only fires after a stretch of resize events.
+ * @param dependencies - values from the component (e.g. state, props and functions) that are used
+ * inside the effect hook.
+ */
+
+function useResizeListener(onResize, onResizeEnd) {
+  var dependencies = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var resizeTimeout;
+
+  var onResizeModified = function onResizeModified() {
+    onResize();
+    window.clearTimeout(resizeTimeout);
+    resizeTimeout = window.setTimeout(onResizeEnd, 100);
+  };
+
+  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](function () {
+    window.addEventListener('resize', onResizeEnd ? onResizeModified : onResize);
+    return function () {
+      return window.removeEventListener('resize', onResizeEnd ? onResizeModified : onResize);
+    };
+  }, _toConsumableArray(dependencies));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/utils/PartialLoadingHelper.ts":
+/*!***********************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/utils/PartialLoadingHelper.ts ***!
+  \***********************************************************************************************/
+/*! exports provided: PartialLoadingHelper */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialLoadingHelper", function() { return PartialLoadingHelper; });
+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); }
+
+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; }
+
+var DEFAULT_NUM_ITEMS = 5;
+var DEFAULT_MIN_WIDTH = 50; // px
+
+var DEFAULT_MAX_WIDTH = 100; // px
+
+var PartialLoadingHelper = {
+  getPartialLoadingItems: function getPartialLoadingItems() {
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var _options$numItems = options.numItems,
+        numItems = _options$numItems === void 0 ? DEFAULT_NUM_ITEMS : _options$numItems,
+        _options$minWidth = options.minWidth,
+        minWidth = _options$minWidth === void 0 ? DEFAULT_MIN_WIDTH : _options$minWidth,
+        _options$maxWidth = options.maxWidth,
+        maxWidth = _options$maxWidth === void 0 ? DEFAULT_MAX_WIDTH : _options$maxWidth;
+
+    var getRandomFilterWidth = function getRandomFilterWidth() {
+      return Math.max(Math.floor(Math.random() * maxWidth), minWidth);
+    };
+
+    return _toConsumableArray(Array(numItems)).map(function () {
+      return {
+        width: "".concat(getRandomFilterWidth(), "px")
+      };
+    });
+  }
+};
 
 /***/ })