cloudinary-video-player 3.1.2-edge.3 → 3.1.2-edge.4

package/dist/shoppable.js

@@ -1,9 +1,17 @@
 /*!
- * Cloudinary Video Player v3.1.2-edge.3
- * Built on 2025-08-06T14:15:40.534Z
+ * Cloudinary Video Player v3.1.2-edge.4
+ * Built on 2025-08-11T06:41:19.174Z
  * https://github.com/cloudinary/cloudinary-video-player
  */
 "use strict";
+/*
+ * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
+ * This devtool is neither made for production nor for readable output files.
+ * It uses "eval()" calls to create a separate source file in the browser devtools.
+ * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
+ * or disable the default devtool with "devtool: false".
+ * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
+ */
 (self["cloudinaryVideoPlayerChunkLoading"] = self["cloudinaryVideoPlayerChunkLoading"] || []).push([["shoppable"],{
 
 /***/ "./components/shoppable-bar/layout/bar-layout.js":
@@ -12,110 +20,7 @@
   \*******************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _shoppable_products_overlay__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./shoppable-products-overlay */ "./components/shoppable-bar/layout/shoppable-products-overlay.js");
-/* harmony import */ var _shoppable_panel_toggle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-panel-toggle */ "./components/shoppable-bar/layout/shoppable-panel-toggle.js");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/consts */ "./utils/consts.js");
-
-const dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());
-const Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');
-
-
-
-
-class ShoppableBarLayout extends Component {
-  constructor(player, options) {
-    super(player, options);
-    this.player_ = player;
-    this.player().addClass('cld-shoppable-panel');
-    this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-    this.contentWrpEl_ = dom.createEl('div', {
-      className: 'cld-spbl-bar'
-    });
-    this.contentBannerEl_ = dom.createEl('div', {
-      className: 'cld-spbl-banner-msg base-color-text'
-    }, {}, this.options_.bannerMsg || 'Shop the Video');
-    this.contentWrpEl_.appendChild(this.contentBannerEl_);
-    const productsOverlay = new _shoppable_products_overlay__WEBPACK_IMPORTED_MODULE_1__["default"](this.player_, this.options_);
-    this.contentWrpEl_.appendChild(productsOverlay.el_);
-    this.contentEl_ = dom.createEl('div', {
-      className: _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.CLD_SPBL_INNER_BAR
-    });
-    this.contentWrpEl_.appendChild(this.contentEl_);
-    this.player().el().appendChild(this.contentWrpEl_);
-    this.addChild(new _shoppable_panel_toggle__WEBPACK_IMPORTED_MODULE_2__["default"](this.player_, {
-      toggleIcon: this.options_.toggleIcon,
-      clickHandler: () => {
-        this.togglePanel();
-      }
-    }));
-    this.addChild('ShoppablePanel', this.options_);
-    this.dispose = () => {
-      this.removeLayout();
-      super.dispose();
-    };
-    this.togglePanel = open => {
-      if (open === true) {
-        // Open
-        this.player().removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-        this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);
-      } else if (open === false) {
-        // Close
-        this.player().removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);
-        this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-      } else {
-        // Toggle
-        this.player().toggleClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-        this.player().toggleClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);
-      }
-      let eventName = this.player().hasClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS) ? 'productBarMax' : 'productBarMin';
-      this.player().trigger(eventName);
-    };
-
-    // Open shoppable
-    if (this.options_.startState === 'open') {
-      this.togglePanel(true);
-    }
-
-    // On play start
-    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.PLAY, () => {
-      if (this.player_.currentTime() < 0.01) {
-        // Open shoppable on-play
-        if (this.options_.startState === 'openOnPlay') {
-          this.togglePanel(true, this.options_.autoClose);
-        }
-
-        // Auto-close shoppable
-        if (this.options_.autoClose && this.options_.startState.indexOf('open') !== -1) {
-          setTimeout(() => {
-            // Keep it open while hovered
-            if (!this.contentEl_.matches(':hover')) {
-              this.togglePanel(false);
-            } else {
-              this.contentEl_.addEventListener('mouseleave', () => {
-                this.togglePanel(false);
-              }, {
-                once: true
-              });
-            }
-          }, this.options_.autoClose * 1000);
-        }
-      }
-    });
-  }
-  createEl() {
-    const el = super.createEl('div');
-    return el;
-  }
-}
-video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppableBarLayout', ShoppableBarLayout);
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableBarLayout);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _shoppable_products_overlay__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./shoppable-products-overlay */ \"./components/shoppable-bar/layout/shoppable-products-overlay.js\");\n/* harmony import */ var _shoppable_panel_toggle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-panel-toggle */ \"./components/shoppable-bar/layout/shoppable-panel-toggle.js\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/consts */ \"./utils/consts.js\");\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\n\n\n\n\nclass ShoppableBarLayout extends Component {\n  constructor(player, options) {\n    super(player, options);\n    this.player_ = player;\n    this.player().addClass('cld-shoppable-panel');\n    this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n    this.contentWrpEl_ = dom.createEl('div', {\n      className: 'cld-spbl-bar'\n    });\n    this.contentBannerEl_ = dom.createEl('div', {\n      className: 'cld-spbl-banner-msg base-color-text'\n    }, {}, this.options_.bannerMsg || 'Shop the Video');\n    this.contentWrpEl_.appendChild(this.contentBannerEl_);\n    const productsOverlay = new _shoppable_products_overlay__WEBPACK_IMPORTED_MODULE_1__[\"default\"](this.player_, this.options_);\n    this.contentWrpEl_.appendChild(productsOverlay.el_);\n    this.contentEl_ = dom.createEl('div', {\n      className: _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.CLD_SPBL_INNER_BAR\n    });\n    this.contentWrpEl_.appendChild(this.contentEl_);\n    this.player().el().appendChild(this.contentWrpEl_);\n    this.addChild(new _shoppable_panel_toggle__WEBPACK_IMPORTED_MODULE_2__[\"default\"](this.player_, {\n      toggleIcon: this.options_.toggleIcon,\n      clickHandler: () => {\n        this.togglePanel();\n      }\n    }));\n    this.addChild('ShoppablePanel', this.options_);\n    this.dispose = () => {\n      this.removeLayout();\n      super.dispose();\n    };\n    this.togglePanel = open => {\n      if (open === true) {\n        // Open\n        this.player().removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n        this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);\n      } else if (open === false) {\n        // Close\n        this.player().removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);\n        this.player().addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n      } else {\n        // Toggle\n        this.player().toggleClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n        this.player().toggleClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);\n      }\n      let eventName = this.player().hasClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS) ? 'productBarMax' : 'productBarMin';\n      this.player().trigger(eventName);\n    };\n\n    // Open shoppable\n    if (this.options_.startState === 'open') {\n      this.togglePanel(true);\n    }\n\n    // On play start\n    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.PLAY, () => {\n      if (this.player_.currentTime() < 0.01) {\n        // Open shoppable on-play\n        if (this.options_.startState === 'openOnPlay') {\n          this.togglePanel(true, this.options_.autoClose);\n        }\n\n        // Auto-close shoppable\n        if (this.options_.autoClose && this.options_.startState.indexOf('open') !== -1) {\n          setTimeout(() => {\n            // Keep it open while hovered\n            if (!this.contentEl_.matches(':hover')) {\n              this.togglePanel(false);\n            } else {\n              this.contentEl_.addEventListener('mouseleave', () => {\n                this.togglePanel(false);\n              }, {\n                once: true\n              });\n            }\n          }, this.options_.autoClose * 1000);\n        }\n      }\n    });\n  }\n  createEl() {\n    const el = super.createEl('div');\n    return el;\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppableBarLayout', ShoppableBarLayout);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableBarLayout);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/layout/bar-layout.js?");
 
 /***/ }),
 
@@ -125,62 +30,7 @@ video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppableBarL
   \*******************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../utils/consts */ "./utils/consts.js");
-
-
-
-const dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());
-const ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');
-class ShoppablePanelToggle extends ClickableComponent {
-  constructor(player, options) {
-    super(player, options);
-    this.options_ = options;
-  }
-  handleClick(event) {
-    event.preventDefault();
-    event.stopPropagation();
-    this.options_.clickHandler();
-  }
-  createEl() {
-    let iconProps = {};
-    let iconAttrs = {};
-    if (this.options_.toggleIcon) {
-      iconProps = {
-        className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLOSE_ICON_CLASS}`
-      };
-      iconAttrs = {
-        style: `background-image: url(${this.options_.toggleIcon})`
-      };
-    } else {
-      iconProps = {
-        className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.ICON_CART_CLASS}`
-      };
-    }
-    const icon = dom.createEl('span', iconProps, iconAttrs);
-    const el = super.createEl('a', {
-      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_CLASS} base-color-bg`
-    });
-    el.appendChild(icon);
-    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.PRODUCT_BAR_MIN, () => {
-      setTimeout(() => {
-        icon.classList.add(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.SHOPPABLE_ANIMATION_CLASS);
-        setTimeout(() => {
-          icon.classList.remove(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.SHOPPABLE_ANIMATION_CLASS);
-        }, 1000);
-      }, 500);
-    });
-    return el;
-  }
-}
-video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanelToggle', ShoppablePanelToggle);
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanelToggle);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../utils/consts */ \"./utils/consts.js\");\n\n\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nconst ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');\nclass ShoppablePanelToggle extends ClickableComponent {\n  constructor(player, options) {\n    super(player, options);\n    this.options_ = options;\n  }\n  handleClick(event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.options_.clickHandler();\n  }\n  createEl() {\n    let iconProps = {};\n    let iconAttrs = {};\n    if (this.options_.toggleIcon) {\n      iconProps = {\n        className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLOSE_ICON_CLASS}`\n      };\n      iconAttrs = {\n        style: `background-image: url(${this.options_.toggleIcon})`\n      };\n    } else {\n      iconProps = {\n        className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_ICON_CLASS} ${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.ICON_CART_CLASS}`\n      };\n    }\n    const icon = dom.createEl('span', iconProps, iconAttrs);\n    const el = super.createEl('a', {\n      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.CLD_SPBL_TOGGLE_CLASS} base-color-bg`\n    });\n    el.appendChild(icon);\n    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_2__.PLAYER_EVENT.PRODUCT_BAR_MIN, () => {\n      setTimeout(() => {\n        icon.classList.add(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.SHOPPABLE_ANIMATION_CLASS);\n        setTimeout(() => {\n          icon.classList.remove(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_1__.SHOPPABLE_ANIMATION_CLASS);\n        }, 1000);\n      }, 500);\n    });\n    return el;\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanelToggle', ShoppablePanelToggle);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanelToggle);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/layout/shoppable-panel-toggle.js?");
 
 /***/ }),
 
@@ -190,81 +40,7 @@ video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePane
   \***********************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var utils_time__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! utils/time */ "./utils/time.js");
-/* harmony import */ var utils_find__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/find */ "./utils/find.js");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/consts */ "./utils/consts.js");
-
-const dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());
-
-
-
-
-const Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');
-class ShoppableProductsOverlay extends Component {
-  constructor(player) {
-    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    super(player, options);
-    this.options_ = options;
-    this.player_ = player;
-    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.SHOW_PRODUCTS_OVERLAY, this.renderProducts);
-    this.dispose = () => {
-      this.layout_.dispose();
-    };
-  }
-  renderProducts = () => {
-    // Close products side-panel
-    this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);
-    this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-    this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);
-    this.layout_.innerHTML = '';
-
-    // Filter products with appearance on currentTime
-    const currentTime = this.player_.currentTime();
-    const currentProducts = this.options_.products.filter(product => product.hotspots && product.hotspots.some(a => (0,utils_time__WEBPACK_IMPORTED_MODULE_1__.parseTime)(a.time) === currentTime));
-    currentProducts.forEach(product => {
-      const hotspot = (0,utils_find__WEBPACK_IMPORTED_MODULE_2__.find)(product.hotspots, hs => (0,utils_time__WEBPACK_IMPORTED_MODULE_1__.parseTime)(hs.time) === currentTime);
-      const productName = dom.createEl('div', {
-        className: 'cld-spbl-product-hotspot-name'
-      }, {}, product.productName);
-      const productTooltip = dom.createEl('div', {
-        className: 'cld-spbl-product-tooltip cld-spbl-product-tooltip-' + hotspot.tooltipPosition
-      }, {}, productName);
-      const productHotSpot = dom.createEl('a', {
-        className: 'cld-spbl-product-hotspot accent-color-text',
-        href: hotspot.clickUrl,
-        target: '_blank'
-      }, {
-        style: 'left:' + hotspot.x + '; top:' + hotspot.y + ';'
-      }, productTooltip);
-      this.layout_.appendChild(productHotSpot);
-    });
-
-    // Remove
-    this.player_.one(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.SEEKING, this.clearLayout);
-    this.player_.one(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.PLAY, this.clearLayout);
-  };
-  clearLayout = () => {
-    this.layout_.innerHTML = '';
-    this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);
-  };
-  createEl() {
-    const dimensions = this.player_.currentDimensions();
-    this.layout_ = dom.createEl('div', {
-      className: 'cld-spbl-products-overlay',
-      style: `padding-top: ${dimensions.height / dimensions.width * 100}%;`
-    });
-    return this.layout_;
-  }
-}
-video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('ShoppableProductsOverlay', ShoppableProductsOverlay);
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableProductsOverlay);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var utils_time__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! utils/time */ \"./utils/time.js\");\n/* harmony import */ var utils_find__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/find */ \"./utils/find.js\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/consts */ \"./utils/consts.js\");\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\n\n\n\n\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\nclass ShoppableProductsOverlay extends Component {\n  constructor(player) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    super(player, options);\n    this.options_ = options;\n    this.player_ = player;\n    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.SHOW_PRODUCTS_OVERLAY, this.renderProducts);\n    this.dispose = () => {\n      this.layout_.dispose();\n    };\n  }\n  renderProducts = () => {\n    // Close products side-panel\n    this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_VISIBLE_CLASS);\n    this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n    this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);\n    this.layout_.innerHTML = '';\n\n    // Filter products with appearance on currentTime\n    const currentTime = this.player_.currentTime();\n    const currentProducts = this.options_.products.filter(product => product.hotspots && product.hotspots.some(a => (0,utils_time__WEBPACK_IMPORTED_MODULE_1__.parseTime)(a.time) === currentTime));\n    currentProducts.forEach(product => {\n      const hotspot = (0,utils_find__WEBPACK_IMPORTED_MODULE_2__.find)(product.hotspots, hs => (0,utils_time__WEBPACK_IMPORTED_MODULE_1__.parseTime)(hs.time) === currentTime);\n      const productName = dom.createEl('div', {\n        className: 'cld-spbl-product-hotspot-name'\n      }, {}, product.productName);\n      const productTooltip = dom.createEl('div', {\n        className: 'cld-spbl-product-tooltip cld-spbl-product-tooltip-' + hotspot.tooltipPosition\n      }, {}, productName);\n      const productHotSpot = dom.createEl('a', {\n        className: 'cld-spbl-product-hotspot accent-color-text',\n        href: hotspot.clickUrl,\n        target: '_blank'\n      }, {\n        style: 'left:' + hotspot.x + '; top:' + hotspot.y + ';'\n      }, productTooltip);\n      this.layout_.appendChild(productHotSpot);\n    });\n\n    // Remove\n    this.player_.one(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.SEEKING, this.clearLayout);\n    this.player_.one(_utils_consts__WEBPACK_IMPORTED_MODULE_4__.PLAYER_EVENT.PLAY, this.clearLayout);\n  };\n  clearLayout = () => {\n    this.layout_.innerHTML = '';\n    this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_3__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);\n  };\n  createEl() {\n    const dimensions = this.player_.currentDimensions();\n    this.layout_ = dom.createEl('div', {\n      className: 'cld-spbl-products-overlay',\n      style: `padding-top: ${dimensions.height / dimensions.width * 100}%;`\n    });\n    return this.layout_;\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('ShoppableProductsOverlay', ShoppableProductsOverlay);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableProductsOverlay);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/layout/shoppable-products-overlay.js?");
 
 /***/ }),
 
@@ -274,108 +50,7 @@ video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('ShoppableProd
   \****************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../plugins/cloudinary/models/image-source */ "./plugins/cloudinary/models/image-source.js");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-
-const ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');
-const dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());
-
-
-const widthTransformation = {
-  width: 132
-};
-class ShoppablePanelItem extends ClickableComponent {
-  constructor(player, initOptions) {
-    super(player, initOptions);
-    this.options_ = initOptions;
-    this.isDragged = false;
-  }
-  handleClick(event) {
-    event.preventDefault();
-    event.stopPropagation();
-    if (!this.el_.matches(`.dragged .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_ITEM}`)) {
-      // Prevent click event if dragged
-      this.options_.clickHandler(event);
-    }
-    this.isDragged = false;
-  }
-  getTitle() {
-    return this.options_.conf.title;
-  }
-  createEl() {
-    const el = super.createEl('a', {
-      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_ITEM} base-color-bg accent-color-text`,
-      href: '#'
-    });
-    el.setAttribute('data-product-id', this.options_.conf.productId || '');
-    el.setAttribute('data-product-name', this.options_.conf.productName || '');
-    if (this.options_.conf.onHover) {
-      addOnHover(el, this.options_.conf.onHover, this.options_.item.cloudinaryConfig());
-    }
-    if (this.options_.conf.onClick) {
-      addOnClick(el, this.options_.conf.onClick);
-    }
-    const img = super.createEl('img', {
-      className: _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_IMAGE
-    }, {
-      src: this.options_.item.url(widthTransformation)
-    });
-    el.appendChild(img);
-    if (this.getTitle()) {
-      const info = dom.createEl('div', {
-        className: 'cld-spbl-item-info base-color-semi-bg text-color-text'
-      });
-      const title = dom.createEl('span', {
-        className: 'cld-spbl-item-title'
-      }, {}, this.getTitle());
-      info.appendChild(title);
-      el.appendChild(info);
-    }
-    return el;
-  }
-}
-const addOnHover = (el, conf, cldConf) => {
-  el.setAttribute('data-hover-action', conf.action);
-  if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_HOVER_ACTIONS.OVERLAY) {
-    const overlayText = dom.createEl('span', {
-      className: 'cld-spbl-overlay-text base-color-text'
-    }, {}, conf.args);
-    const overlay = dom.createEl('span', {
-      className: 'cld-spbl-overlay text-color-semi-bg base-color-text'
-    }, {
-      title: conf.args
-    }, overlayText);
-    el.appendChild(overlay);
-  } else {
-    const switchImgSource = new _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_1__["default"](conf.args.publicId, {
-      cloudinaryConfig: cldConf,
-      transformation: conf.args.transformation
-    });
-    const hoverImg = dom.createEl('img', {
-      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_IMAGE} cld-spbl-hover-img`
-    }, {
-      src: switchImgSource.url(widthTransformation)
-    });
-    el.appendChild(hoverImg);
-  }
-};
-const addOnClick = (el, conf) => {
-  el.setAttribute('data-click-action', conf.action);
-  el.setAttribute('data-pause', conf.pause);
-  if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_CLICK_ACTIONS.SEEk) {
-    el.setAttribute('data-seek', conf.args.time);
-  } else if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_CLICK_ACTIONS.GO_TO) {
-    el.setAttribute('data-goto-url', conf.args.url);
-  }
-};
-video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanelItem', ShoppablePanelItem);
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanelItem);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../plugins/cloudinary/models/image-source */ \"./plugins/cloudinary/models/image-source.js\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n\nconst ClickableComponent = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('ClickableComponent');\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\n\n\nconst widthTransformation = {\n  width: 132\n};\nclass ShoppablePanelItem extends ClickableComponent {\n  constructor(player, initOptions) {\n    super(player, initOptions);\n    this.options_ = initOptions;\n    this.isDragged = false;\n  }\n  handleClick(event) {\n    event.preventDefault();\n    event.stopPropagation();\n    if (!this.el_.matches(`.dragged .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_ITEM}`)) {\n      // Prevent click event if dragged\n      this.options_.clickHandler(event);\n    }\n    this.isDragged = false;\n  }\n  getTitle() {\n    return this.options_.conf.title;\n  }\n  createEl() {\n    const el = super.createEl('a', {\n      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_ITEM} base-color-bg accent-color-text`,\n      href: '#'\n    });\n    el.setAttribute('data-product-id', this.options_.conf.productId || '');\n    el.setAttribute('data-product-name', this.options_.conf.productName || '');\n    if (this.options_.conf.onHover) {\n      addOnHover(el, this.options_.conf.onHover, this.options_.item.cloudinaryConfig());\n    }\n    if (this.options_.conf.onClick) {\n      addOnClick(el, this.options_.conf.onClick);\n    }\n    const img = super.createEl('img', {\n      className: _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_IMAGE\n    }, {\n      src: this.options_.item.url(widthTransformation)\n    });\n    el.appendChild(img);\n    if (this.getTitle()) {\n      const info = dom.createEl('div', {\n        className: 'cld-spbl-item-info base-color-semi-bg text-color-text'\n      });\n      const title = dom.createEl('span', {\n        className: 'cld-spbl-item-title'\n      }, {}, this.getTitle());\n      info.appendChild(title);\n      el.appendChild(info);\n    }\n    return el;\n  }\n}\nconst addOnHover = (el, conf, cldConf) => {\n  el.setAttribute('data-hover-action', conf.action);\n  if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_HOVER_ACTIONS.OVERLAY) {\n    const overlayText = dom.createEl('span', {\n      className: 'cld-spbl-overlay-text base-color-text'\n    }, {}, conf.args);\n    const overlay = dom.createEl('span', {\n      className: 'cld-spbl-overlay text-color-semi-bg base-color-text'\n    }, {\n      title: conf.args\n    }, overlayText);\n    el.appendChild(overlay);\n  } else {\n    const switchImgSource = new _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_1__[\"default\"](conf.args.publicId, {\n      cloudinaryConfig: cldConf,\n      transformation: conf.args.transformation\n    });\n    const hoverImg = dom.createEl('img', {\n      className: `${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_IMAGE} cld-spbl-hover-img`\n    }, {\n      src: switchImgSource.url(widthTransformation)\n    });\n    el.appendChild(hoverImg);\n  }\n};\nconst addOnClick = (el, conf) => {\n  el.setAttribute('data-click-action', conf.action);\n  el.setAttribute('data-pause', conf.pause);\n  if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_CLICK_ACTIONS.SEEk) {\n    el.setAttribute('data-seek', conf.args.time);\n  } else if (conf.action === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.SHOPPABLE_CLICK_ACTIONS.GO_TO) {\n    el.setAttribute('data-goto-url', conf.args.url);\n  }\n};\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanelItem', ShoppablePanelItem);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanelItem);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/panel/shoppable-panel-item.js?");
 
 /***/ }),
 
@@ -385,167 +60,7 @@ video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePane
   \***********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/throttle */ "../node_modules/lodash/throttle.js");
-/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var utils_time__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/time */ "./utils/time.js");
-/* harmony import */ var _shoppable_panel_item__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shoppable-panel-item */ "./components/shoppable-bar/panel/shoppable-panel-item.js");
-/* harmony import */ var _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../plugins/cloudinary/models/image-source */ "./plugins/cloudinary/models/image-source.js");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../utils/consts */ "./utils/consts.js");
-
-
-
-
-
-
-
-const Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');
-class ShoppablePanel extends Component {
-  constructor(player) {
-    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    super(player, options);
-    this.options = options;
-    const itemChangeHandler = () => {
-      this.render();
-    };
-    player.on(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.SHOPPABLE_ITEM_CHANGED, itemChangeHandler);
-    this.render();
-    this.dispose = () => {
-      super.dispose();
-      player.off(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.SHOPPABLE_ITEM_CHANGED, itemChangeHandler);
-    };
-  }
-  createEl() {
-    const el = super.createEl();
-    [_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.CLD_SPBL_PANEL_CLASS, 'base-color-bg'].map(cls => el.classList.add(cls));
-    return el;
-  }
-  removeAll() {
-    const childrens = this.children();
-    for (let i = childrens.length - 1; i >= 0; --i) {
-      this.removeChild(childrens[i]);
-    }
-  }
-  getItems() {
-    const cloudinaryConfig = this.player_.cloudinary.cloudinaryConfig();
-    return this.options.products.map(product => {
-      if (product.onHover && typeof product.onHover.args === 'object') {
-        product.onHover.args.transformation = Object.assign({}, this.options.transformation, product.onHover.args.transformation);
-      }
-      const conf = {
-        productId: product.productId,
-        productName: product.productName,
-        title: product.title,
-        onHover: product.onHover,
-        onClick: product.onClick,
-        startTime: product.startTime,
-        endTime: product.endTime
-      };
-      const imageSource = new _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_4__["default"](product.publicId, {
-        cloudinaryConfig: cloudinaryConfig,
-        transformation: Object.assign({}, this.options.transformation, product.transformation)
-      });
-      return {
-        imageSrc: imageSource,
-        conf: conf
-      };
-    });
-  }
-  scrollToActiveItem() {
-    const activeItems = this.el_.getElementsByClassName('active');
-    if (activeItems.length > 0) {
-      const toScroll = activeItems[0].offsetTop - 12;
-      // Test for native scrollTo support (IE will fail)
-      if ('scrollBehavior' in document.documentElement.style) {
-        this.el_.scrollTo({
-          top: toScroll,
-          behavior: 'smooth'
-        });
-      } else {
-        this.el_.scrollTop = toScroll;
-      }
-    }
-  }
-  render() {
-    this.removeAll();
-    const items = this.getItems();
-    const throttledScrollToActiveItem = lodash_throttle__WEBPACK_IMPORTED_MODULE_1___default()(() => this.scrollToActiveItem(), 1000);
-    items.forEach((item, index) => {
-      const shoppablePanelItem = new _shoppable_panel_item__WEBPACK_IMPORTED_MODULE_3__["default"](this.player(), {
-        item: item.imageSrc,
-        conf: item.conf,
-        next: index === 1,
-        current: index === 0,
-        clickHandler: e => {
-          let target = e.currentTarget || e.target;
-          let evName = this.player_.ended() ? 'productClickPost' : 'productClick';
-          this.player_.trigger(evName, {
-            productId: target.dataset.productId,
-            productName: target.dataset.productName
-          });
-
-          // Go to URL, or seek video (set currentTime)
-          if (target.dataset.clickAction === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_CLICK_ACTIONS.GO_TO) {
-            window.open(target.dataset.gotoUrl, '_blank');
-          } else if (target.dataset.clickAction === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_CLICK_ACTIONS.SEEk) {
-            const gotoSecs = (0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.seek);
-            if (gotoSecs !== null) {
-              this.player_.addClass('vjs-has-started'); // Hide the poster image
-              if (this.player_.postModal) {
-                this.player_.postModal.close();
-              }
-              this.player_.currentTime(gotoSecs);
-              // Close products side-panel
-              this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PANEL_VISIBLE_CLASS);
-              this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PANEL_HIDDEN_CLASS);
-              this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);
-              // Wait for the time update and show the tooltips
-              this.player_.one('seeked', () => this.player_.trigger('showProductsOverlay'));
-            }
-          }
-
-          // pause - true (default), false, or number of seconds
-          if (target.dataset.pause !== 'false') {
-            this.player_.pause();
-            if ((0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.pause)) {
-              setTimeout(() => {
-                this.player_.play();
-              }, (0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.pause) * 1000);
-            }
-          }
-        }
-      });
-      shoppablePanelItem.on('mouseover', e => {
-        let target = e.currentTarget || e.target;
-        let evName = this.player_.ended() ? 'productHoverPost' : 'productHover';
-        this.player_.trigger(evName, {
-          productId: target.dataset.productId,
-          productName: target.dataset.productName
-        });
-      });
-      if (typeof item.conf.startTime !== 'undefined' && typeof item.conf.endTime !== 'undefined') {
-        this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.TIME_UPDATE, () => {
-          const time = this.player_.currentTime();
-          if (time >= item.conf.startTime && time < item.conf.endTime) {
-            shoppablePanelItem.el_.classList.add('active');
-            throttledScrollToActiveItem();
-          } else if (shoppablePanelItem.el_.classList.contains('active')) {
-            shoppablePanelItem.el_.classList.remove('active');
-          }
-        });
-      }
-      this.addChild(shoppablePanelItem);
-    });
-  }
-}
-video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanel', ShoppablePanel);
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanel);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/throttle */ \"../node_modules/lodash/throttle.js\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var utils_time__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! utils/time */ \"./utils/time.js\");\n/* harmony import */ var _shoppable_panel_item__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shoppable-panel-item */ \"./components/shoppable-bar/panel/shoppable-panel-item.js\");\n/* harmony import */ var _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../plugins/cloudinary/models/image-source */ \"./plugins/cloudinary/models/image-source.js\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../utils/consts */ \"./utils/consts.js\");\n\n\n\n\n\n\n\nconst Component = video_js__WEBPACK_IMPORTED_MODULE_0___default().getComponent('Component');\nclass ShoppablePanel extends Component {\n  constructor(player) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    super(player, options);\n    this.options = options;\n    const itemChangeHandler = () => {\n      this.render();\n    };\n    player.on(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.SHOPPABLE_ITEM_CHANGED, itemChangeHandler);\n    this.render();\n    this.dispose = () => {\n      super.dispose();\n      player.off(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.SHOPPABLE_ITEM_CHANGED, itemChangeHandler);\n    };\n  }\n  createEl() {\n    const el = super.createEl();\n    [_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.CLD_SPBL_PANEL_CLASS, 'base-color-bg'].map(cls => el.classList.add(cls));\n    return el;\n  }\n  removeAll() {\n    const childrens = this.children();\n    for (let i = childrens.length - 1; i >= 0; --i) {\n      this.removeChild(childrens[i]);\n    }\n  }\n  getItems() {\n    const cloudinaryConfig = this.player_.cloudinary.cloudinaryConfig();\n    return this.options.products.map(product => {\n      if (product.onHover && typeof product.onHover.args === 'object') {\n        product.onHover.args.transformation = Object.assign({}, this.options.transformation, product.onHover.args.transformation);\n      }\n      const conf = {\n        productId: product.productId,\n        productName: product.productName,\n        title: product.title,\n        onHover: product.onHover,\n        onClick: product.onClick,\n        startTime: product.startTime,\n        endTime: product.endTime\n      };\n      const imageSource = new _plugins_cloudinary_models_image_source__WEBPACK_IMPORTED_MODULE_4__[\"default\"](product.publicId, {\n        cloudinaryConfig: cloudinaryConfig,\n        transformation: Object.assign({}, this.options.transformation, product.transformation)\n      });\n      return {\n        imageSrc: imageSource,\n        conf: conf\n      };\n    });\n  }\n  scrollToActiveItem() {\n    const activeItems = this.el_.getElementsByClassName('active');\n    if (activeItems.length > 0) {\n      const toScroll = activeItems[0].offsetTop - 12;\n      // Test for native scrollTo support (IE will fail)\n      if ('scrollBehavior' in document.documentElement.style) {\n        this.el_.scrollTo({\n          top: toScroll,\n          behavior: 'smooth'\n        });\n      } else {\n        this.el_.scrollTop = toScroll;\n      }\n    }\n  }\n  render() {\n    this.removeAll();\n    const items = this.getItems();\n    const throttledScrollToActiveItem = lodash_throttle__WEBPACK_IMPORTED_MODULE_1___default()(() => this.scrollToActiveItem(), 1000);\n    items.forEach((item, index) => {\n      const shoppablePanelItem = new _shoppable_panel_item__WEBPACK_IMPORTED_MODULE_3__[\"default\"](this.player(), {\n        item: item.imageSrc,\n        conf: item.conf,\n        next: index === 1,\n        current: index === 0,\n        clickHandler: e => {\n          let target = e.currentTarget || e.target;\n          let evName = this.player_.ended() ? 'productClickPost' : 'productClick';\n          this.player_.trigger(evName, {\n            productId: target.dataset.productId,\n            productName: target.dataset.productName\n          });\n\n          // Go to URL, or seek video (set currentTime)\n          if (target.dataset.clickAction === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_CLICK_ACTIONS.GO_TO) {\n            window.open(target.dataset.gotoUrl, '_blank');\n          } else if (target.dataset.clickAction === _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_CLICK_ACTIONS.SEEk) {\n            const gotoSecs = (0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.seek);\n            if (gotoSecs !== null) {\n              this.player_.addClass('vjs-has-started'); // Hide the poster image\n              if (this.player_.postModal) {\n                this.player_.postModal.close();\n              }\n              this.player_.currentTime(gotoSecs);\n              // Close products side-panel\n              this.player_.removeClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PANEL_VISIBLE_CLASS);\n              this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PANEL_HIDDEN_CLASS);\n              this.player_.addClass(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_5__.SHOPPABLE_PRODUCTS_OVERLAY_CLASS);\n              // Wait for the time update and show the tooltips\n              this.player_.one('seeked', () => this.player_.trigger('showProductsOverlay'));\n            }\n          }\n\n          // pause - true (default), false, or number of seconds\n          if (target.dataset.pause !== 'false') {\n            this.player_.pause();\n            if ((0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.pause)) {\n              setTimeout(() => {\n                this.player_.play();\n              }, (0,utils_time__WEBPACK_IMPORTED_MODULE_2__.parseTime)(target.dataset.pause) * 1000);\n            }\n          }\n        }\n      });\n      shoppablePanelItem.on('mouseover', e => {\n        let target = e.currentTarget || e.target;\n        let evName = this.player_.ended() ? 'productHoverPost' : 'productHover';\n        this.player_.trigger(evName, {\n          productId: target.dataset.productId,\n          productName: target.dataset.productName\n        });\n      });\n      if (typeof item.conf.startTime !== 'undefined' && typeof item.conf.endTime !== 'undefined') {\n        this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_6__.PLAYER_EVENT.TIME_UPDATE, () => {\n          const time = this.player_.currentTime();\n          if (time >= item.conf.startTime && time < item.conf.endTime) {\n            shoppablePanelItem.el_.classList.add('active');\n            throttledScrollToActiveItem();\n          } else if (shoppablePanelItem.el_.classList.contains('active')) {\n            shoppablePanelItem.el_.classList.remove('active');\n          }\n        });\n      }\n      this.addChild(shoppablePanelItem);\n    });\n  }\n}\nvideo_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePanel', ShoppablePanel);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePanel);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/panel/shoppable-panel.js?");
 
 /***/ }),
 
@@ -555,111 +70,7 @@ video_js__WEBPACK_IMPORTED_MODULE_0___default().registerComponent('shoppablePane
   \***********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _panel_shoppable_panel_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./panel/shoppable-panel.js */ "./components/shoppable-bar/panel/shoppable-panel.js");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-
-
-
-const dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());
-class ShoppablePostWidget {
-  constructor(player) {
-    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    this.options_ = {
-      ...options,
-      postPlay: true
-    };
-    this.player_ = player;
-    this.render();
-
-    // Handle drag-to-scroll
-    this.handleDragToScroll();
-    this.dispose = () => {
-      this.layout_.dispose();
-    };
-  }
-  handleDragToScroll() {
-    const postModal = this.player_.postModal.el_;
-    const slider = postModal.querySelector(`.${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_PANEL_CLASS}`);
-    let isDown = false;
-    let startX = 0;
-    let scrollLeft = 0;
-    slider.addEventListener('mousedown', e => {
-      isDown = true;
-      startX = e.pageX - slider.offsetLeft;
-      scrollLeft = slider.scrollLeft;
-    });
-    document.addEventListener('mouseup', e => {
-      isDown = false;
-      setTimeout(() => {
-        slider.classList.remove('dragged');
-      }, 300);
-      const x = e.pageX - slider.offsetLeft;
-      const walk = x - startX;
-      if (Math.abs(walk) > 5) {
-        e.preventDefault();
-      }
-    });
-    document.addEventListener('mousemove', e => {
-      if (!isDown) {
-        return;
-      }
-      e.preventDefault();
-      const x = e.pageX - slider.offsetLeft;
-      const walk = x - startX;
-      slider.scrollLeft = scrollLeft - walk;
-      if (Math.abs(walk) > 5 && !slider.classList.contains('dragged')) {
-        slider.classList.add('dragged');
-      }
-    });
-  }
-  render() {
-    this.player_.postModal = null;
-    const el = dom.createEl('div', {
-      className: 'cld-spbl-post-play'
-    });
-    const panel = new _panel_shoppable_panel_js__WEBPACK_IMPORTED_MODULE_1__["default"](this.player_, this.options_);
-    const title = dom.createEl('div', {
-      className: 'cld-spbl-post-title base-color-text'
-    }, {}, this.options_.bannerMsg || 'Shop the Video');
-
-    // Background - poster + blur effect
-    const bgSrc = this.player_.cloudinary.currentPoster();
-    bgSrc.transformation([bgSrc.transformation().toOptions ? bgSrc.transformation().toOptions() : {}, {
-      effect: 'blur:3000'
-    }]);
-    const panelBg = dom.createEl('div', {
-      className: 'cld-spbl-post-play-bg',
-      style: `background-image: url("${bgSrc.url()}")`
-    });
-    const replayBtn = dom.createEl('button', {
-      className: 'cld-spbl-replay-btn base-color-bg vjs-icon-replay',
-      onclick: () => {
-        this.player_.trigger('replay');
-        this.player_.postModal.close();
-        this.player_.play();
-      }
-    }, {}, 'Replay');
-    el.appendChild(panelBg);
-    el.appendChild(title);
-    el.appendChild(panel.el());
-    el.appendChild(replayBtn);
-    this.player_.postModal = this.player_.createModal(el, {
-      name: 'postModal',
-      uncloseable: true
-    });
-    this.player_.addClass('cld-spbl-post-modal');
-    this.player_.postModal.on('beforemodalclose', () => {
-      this.player_.removeClass('cld-spbl-post-modal');
-    });
-  }
-}
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePostWidget);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _panel_shoppable_panel_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./panel/shoppable-panel.js */ \"./components/shoppable-bar/panel/shoppable-panel.js\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n\n\n\nconst dom = (video_js__WEBPACK_IMPORTED_MODULE_0___default().dom) || (video_js__WEBPACK_IMPORTED_MODULE_0___default());\nclass ShoppablePostWidget {\n  constructor(player) {\n    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    this.options_ = {\n      ...options,\n      postPlay: true\n    };\n    this.player_ = player;\n    this.render();\n\n    // Handle drag-to-scroll\n    this.handleDragToScroll();\n    this.dispose = () => {\n      this.layout_.dispose();\n    };\n  }\n  handleDragToScroll() {\n    const postModal = this.player_.postModal.el_;\n    const slider = postModal.querySelector(`.${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_2__.CLD_SPBL_PANEL_CLASS}`);\n    let isDown = false;\n    let startX = 0;\n    let scrollLeft = 0;\n    slider.addEventListener('mousedown', e => {\n      isDown = true;\n      startX = e.pageX - slider.offsetLeft;\n      scrollLeft = slider.scrollLeft;\n    });\n    document.addEventListener('mouseup', e => {\n      isDown = false;\n      setTimeout(() => {\n        slider.classList.remove('dragged');\n      }, 300);\n      const x = e.pageX - slider.offsetLeft;\n      const walk = x - startX;\n      if (Math.abs(walk) > 5) {\n        e.preventDefault();\n      }\n    });\n    document.addEventListener('mousemove', e => {\n      if (!isDown) {\n        return;\n      }\n      e.preventDefault();\n      const x = e.pageX - slider.offsetLeft;\n      const walk = x - startX;\n      slider.scrollLeft = scrollLeft - walk;\n      if (Math.abs(walk) > 5 && !slider.classList.contains('dragged')) {\n        slider.classList.add('dragged');\n      }\n    });\n  }\n  render() {\n    this.player_.postModal = null;\n    const el = dom.createEl('div', {\n      className: 'cld-spbl-post-play'\n    });\n    const panel = new _panel_shoppable_panel_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"](this.player_, this.options_);\n    const title = dom.createEl('div', {\n      className: 'cld-spbl-post-title base-color-text'\n    }, {}, this.options_.bannerMsg || 'Shop the Video');\n\n    // Background - poster + blur effect\n    const bgSrc = this.player_.cloudinary.currentPoster();\n    bgSrc.transformation([bgSrc.transformation().toOptions ? bgSrc.transformation().toOptions() : {}, {\n      effect: 'blur:3000'\n    }]);\n    const panelBg = dom.createEl('div', {\n      className: 'cld-spbl-post-play-bg',\n      style: `background-image: url(\"${bgSrc.url()}\")`\n    });\n    const replayBtn = dom.createEl('button', {\n      className: 'cld-spbl-replay-btn base-color-bg vjs-icon-replay',\n      onclick: () => {\n        this.player_.trigger('replay');\n        this.player_.postModal.close();\n        this.player_.play();\n      }\n    }, {}, 'Replay');\n    el.appendChild(panelBg);\n    el.appendChild(title);\n    el.appendChild(panel.el());\n    el.appendChild(replayBtn);\n    this.player_.postModal = this.player_.createModal(el, {\n      name: 'postModal',\n      uncloseable: true\n    });\n    this.player_.addClass('cld-spbl-post-modal');\n    this.player_.postModal.on('beforemodalclose', () => {\n      this.player_.removeClass('cld-spbl-post-modal');\n    });\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppablePostWidget);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/shoppable-post-widget.js?");
 
 /***/ }),
 
@@ -669,60 +80,7 @@ class ShoppablePostWidget {
   \************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   CLD_SPBL_IMAGE: () => (/* binding */ CLD_SPBL_IMAGE),
-/* harmony export */   CLD_SPBL_INNER_BAR: () => (/* binding */ CLD_SPBL_INNER_BAR),
-/* harmony export */   CLD_SPBL_ITEM: () => (/* binding */ CLD_SPBL_ITEM),
-/* harmony export */   CLD_SPBL_PANEL_CLASS: () => (/* binding */ CLD_SPBL_PANEL_CLASS),
-/* harmony export */   CLD_SPBL_TOGGLE_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_CLASS),
-/* harmony export */   CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS),
-/* harmony export */   CLD_SPBL_TOGGLE_ICON_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_ICON_CLASS),
-/* harmony export */   CLOSE_ICON_CLASS: () => (/* binding */ CLOSE_ICON_CLASS),
-/* harmony export */   ICON_CART_CLASS: () => (/* binding */ ICON_CART_CLASS),
-/* harmony export */   SHOPPABLE_ANIMATION_CLASS: () => (/* binding */ SHOPPABLE_ANIMATION_CLASS),
-/* harmony export */   SHOPPABLE_CLICK_ACTIONS: () => (/* binding */ SHOPPABLE_CLICK_ACTIONS),
-/* harmony export */   SHOPPABLE_HOVER_ACTIONS: () => (/* binding */ SHOPPABLE_HOVER_ACTIONS),
-/* harmony export */   SHOPPABLE_PANEL_HIDDEN_CLASS: () => (/* binding */ SHOPPABLE_PANEL_HIDDEN_CLASS),
-/* harmony export */   SHOPPABLE_PANEL_VISIBLE_CLASS: () => (/* binding */ SHOPPABLE_PANEL_VISIBLE_CLASS),
-/* harmony export */   SHOPPABLE_PRODUCTS_OVERLAY_CLASS: () => (/* binding */ SHOPPABLE_PRODUCTS_OVERLAY_CLASS),
-/* harmony export */   SHOPPABLE_WIDGET_OPTIONS_DEFAULTS: () => (/* binding */ SHOPPABLE_WIDGET_OPTIONS_DEFAULTS)
-/* harmony export */ });
-const SHOPPABLE_WIDGET_OPTIONS_DEFAULTS = {
-  location: 'right',
-  toggleIcon: '',
-  width: '20%',
-  startState: 'openOnPlay',
-  autoClose: 2,
-  transformation: {
-    quality: 'auto',
-    width: 'auto',
-    fetch_format: 'auto',
-    crop: 'scale'
-  },
-  products: [],
-  showPostPlayOverlay: false
-};
-const SHOPPABLE_CLICK_ACTIONS = {
-  GO_TO: 'goto',
-  SEEk: 'seek'
-};
-const SHOPPABLE_HOVER_ACTIONS = {
-  OVERLAY: 'overlay'
-};
-const SHOPPABLE_PANEL_VISIBLE_CLASS = 'shoppable-panel-visible';
-const SHOPPABLE_PANEL_HIDDEN_CLASS = 'shoppable-panel-hidden';
-const SHOPPABLE_PRODUCTS_OVERLAY_CLASS = 'shoppable-products-overlay';
-const CLD_SPBL_PANEL_CLASS = 'cld-spbl-panel';
-const CLD_SPBL_TOGGLE_CLASS = 'cld-spbl-toggle';
-const CLD_SPBL_TOGGLE_ICON_CLASS = 'cld-spbl-toggle-icon';
-const CLD_SPBL_INNER_BAR = 'cld-spbl-bar-inner';
-const CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS = 'cld-spbl-toggle-custom-icon';
-const ICON_CART_CLASS = 'vjs-icon-cart';
-const CLOSE_ICON_CLASS = 'vjs-icon-close';
-const SHOPPABLE_ANIMATION_CLASS = 'animate';
-const CLD_SPBL_ITEM = 'cld-spbl-item';
-const CLD_SPBL_IMAGE = 'cld-spbl-img';
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CLD_SPBL_IMAGE: () => (/* binding */ CLD_SPBL_IMAGE),\n/* harmony export */   CLD_SPBL_INNER_BAR: () => (/* binding */ CLD_SPBL_INNER_BAR),\n/* harmony export */   CLD_SPBL_ITEM: () => (/* binding */ CLD_SPBL_ITEM),\n/* harmony export */   CLD_SPBL_PANEL_CLASS: () => (/* binding */ CLD_SPBL_PANEL_CLASS),\n/* harmony export */   CLD_SPBL_TOGGLE_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_CLASS),\n/* harmony export */   CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS),\n/* harmony export */   CLD_SPBL_TOGGLE_ICON_CLASS: () => (/* binding */ CLD_SPBL_TOGGLE_ICON_CLASS),\n/* harmony export */   CLOSE_ICON_CLASS: () => (/* binding */ CLOSE_ICON_CLASS),\n/* harmony export */   ICON_CART_CLASS: () => (/* binding */ ICON_CART_CLASS),\n/* harmony export */   SHOPPABLE_ANIMATION_CLASS: () => (/* binding */ SHOPPABLE_ANIMATION_CLASS),\n/* harmony export */   SHOPPABLE_CLICK_ACTIONS: () => (/* binding */ SHOPPABLE_CLICK_ACTIONS),\n/* harmony export */   SHOPPABLE_HOVER_ACTIONS: () => (/* binding */ SHOPPABLE_HOVER_ACTIONS),\n/* harmony export */   SHOPPABLE_PANEL_HIDDEN_CLASS: () => (/* binding */ SHOPPABLE_PANEL_HIDDEN_CLASS),\n/* harmony export */   SHOPPABLE_PANEL_VISIBLE_CLASS: () => (/* binding */ SHOPPABLE_PANEL_VISIBLE_CLASS),\n/* harmony export */   SHOPPABLE_PRODUCTS_OVERLAY_CLASS: () => (/* binding */ SHOPPABLE_PRODUCTS_OVERLAY_CLASS),\n/* harmony export */   SHOPPABLE_WIDGET_OPTIONS_DEFAULTS: () => (/* binding */ SHOPPABLE_WIDGET_OPTIONS_DEFAULTS)\n/* harmony export */ });\nconst SHOPPABLE_WIDGET_OPTIONS_DEFAULTS = {\n  location: 'right',\n  toggleIcon: '',\n  width: '20%',\n  startState: 'openOnPlay',\n  autoClose: 2,\n  transformation: {\n    quality: 'auto',\n    width: 'auto',\n    fetch_format: 'auto',\n    crop: 'scale'\n  },\n  products: [],\n  showPostPlayOverlay: false\n};\nconst SHOPPABLE_CLICK_ACTIONS = {\n  GO_TO: 'goto',\n  SEEk: 'seek'\n};\nconst SHOPPABLE_HOVER_ACTIONS = {\n  OVERLAY: 'overlay'\n};\nconst SHOPPABLE_PANEL_VISIBLE_CLASS = 'shoppable-panel-visible';\nconst SHOPPABLE_PANEL_HIDDEN_CLASS = 'shoppable-panel-hidden';\nconst SHOPPABLE_PRODUCTS_OVERLAY_CLASS = 'shoppable-products-overlay';\nconst CLD_SPBL_PANEL_CLASS = 'cld-spbl-panel';\nconst CLD_SPBL_TOGGLE_CLASS = 'cld-spbl-toggle';\nconst CLD_SPBL_TOGGLE_ICON_CLASS = 'cld-spbl-toggle-icon';\nconst CLD_SPBL_INNER_BAR = 'cld-spbl-bar-inner';\nconst CLD_SPBL_TOGGLE_CUSTOM_ICON_CLASS = 'cld-spbl-toggle-custom-icon';\nconst ICON_CART_CLASS = 'vjs-icon-cart';\nconst CLOSE_ICON_CLASS = 'vjs-icon-close';\nconst SHOPPABLE_ANIMATION_CLASS = 'animate';\nconst CLD_SPBL_ITEM = 'cld-spbl-item';\nconst CLD_SPBL_IMAGE = 'cld-spbl-img';\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/shoppable-widget.const.js?");
 
 /***/ }),
 
@@ -732,89 +90,7 @@ const CLD_SPBL_IMAGE = 'cld-spbl-img';
   \******************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ "../node_modules/video.js/dist/alt/video.core-exposed.js");
-/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _layout_bar_layout__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./layout/bar-layout */ "./components/shoppable-bar/layout/bar-layout.js");
-/* harmony import */ var _shoppable_post_widget__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-post-widget */ "./components/shoppable-bar/shoppable-post-widget.js");
-/* harmony import */ var _shoppable_widget_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shoppable-widget.scss */ "./components/shoppable-bar/shoppable-widget.scss");
-/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./shoppable-widget.const */ "./components/shoppable-bar/shoppable-widget.const.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/consts */ "./utils/consts.js");
-
-
-
-
-
-
-class ShoppableWidget {
-  constructor(player) {
-    let initOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    this.options_ = video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.SHOPPABLE_WIDGET_OPTIONS_DEFAULTS, initOptions);
-    this.player_ = player;
-    if (this.options_.showPostPlayOverlay) {
-      this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.ENDED, () => {
-        this.player_.addChild(new _shoppable_post_widget__WEBPACK_IMPORTED_MODULE_2__["default"](this.player_, this.options_));
-      });
-    }
-    const width = this.options_.width;
-    this._injectCSS(`
-      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_INNER_BAR} {
-        transform: translateX(${width});
-      }
-      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.SHOPPABLE_PANEL_VISIBLE_CLASS} .vjs-control-bar {
-        width: calc(100% - ${width});
-      }
-      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_TOGGLE_CLASS} {
-        right: ${width};
-      }
-      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_PANEL_CLASS}{
-        width: ${width};
-      }
-    `);
-    this._setListeners();
-  }
-  _setListeners() {
-    const resizeHandler = this._resizeHandler.bind(this);
-    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.RESIZE, resizeHandler);
-    window.addEventListener('resize', resizeHandler);
-    this.dispose = () => {
-      this.player_.off(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.RESIZE, resizeHandler);
-      window.removeEventListener('resize', resizeHandler);
-      this.layout_.dispose();
-    };
-  }
-  _injectCSS(css) {
-    const style = document.createElement('style');
-    style.innerHTML = css;
-    this.player_.el_.appendChild(style);
-  }
-  _resizeHandler() {
-    const shoppableBarBreakpoints = [['sm', 0, 80], ['md', 81, 110], ['lg', 111, 170]];
-    const shoppableBarWidth = parseFloat(this.options_.width) / 100.0 * this.player_.el_.clientWidth;
-    let inRange = false;
-    if (shoppableBarWidth) {
-      for (const [name, min, max] of shoppableBarBreakpoints) {
-        if (shoppableBarWidth > min && shoppableBarWidth <= max) {
-          this.layout_.contentWrpEl_.setAttribute('size', name);
-          inRange = name;
-        }
-      }
-      if (!inRange) {
-        this.layout_.contentWrpEl_.removeAttribute('size');
-      }
-    }
-  }
-  init() {
-    this.render();
-  }
-  render() {
-    this.layout_ = new _layout_bar_layout__WEBPACK_IMPORTED_MODULE_1__["default"](this.player_, this.options_);
-  }
-}
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableWidget);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! video.js */ \"../node_modules/video.js/dist/alt/video.core-exposed.js\");\n/* harmony import */ var video_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(video_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _layout_bar_layout__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./layout/bar-layout */ \"./components/shoppable-bar/layout/bar-layout.js\");\n/* harmony import */ var _shoppable_post_widget__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shoppable-post-widget */ \"./components/shoppable-bar/shoppable-post-widget.js\");\n/* harmony import */ var _shoppable_widget_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shoppable-widget.scss */ \"./components/shoppable-bar/shoppable-widget.scss\");\n/* harmony import */ var _shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./shoppable-widget.const */ \"./components/shoppable-bar/shoppable-widget.const.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/consts */ \"./utils/consts.js\");\n\n\n\n\n\n\nclass ShoppableWidget {\n  constructor(player) {\n    let initOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n    this.options_ = video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge(_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.SHOPPABLE_WIDGET_OPTIONS_DEFAULTS, initOptions);\n    this.player_ = player;\n    if (this.options_.showPostPlayOverlay) {\n      this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.ENDED, () => {\n        this.player_.addChild(new _shoppable_post_widget__WEBPACK_IMPORTED_MODULE_2__[\"default\"](this.player_, this.options_));\n      });\n    }\n    const width = this.options_.width;\n    this._injectCSS(`\n      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_INNER_BAR} {\n        transform: translateX(${width});\n      }\n      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.SHOPPABLE_PANEL_VISIBLE_CLASS} .vjs-control-bar {\n        width: calc(100% - ${width});\n      }\n      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_TOGGLE_CLASS} {\n        right: ${width};\n      }\n      .${_shoppable_widget_const__WEBPACK_IMPORTED_MODULE_4__.CLD_SPBL_PANEL_CLASS}{\n        width: ${width};\n      }\n    `);\n    this._setListeners();\n  }\n  _setListeners() {\n    const resizeHandler = this._resizeHandler.bind(this);\n    this.player_.on(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.RESIZE, resizeHandler);\n    window.addEventListener('resize', resizeHandler);\n    this.dispose = () => {\n      this.player_.off(_utils_consts__WEBPACK_IMPORTED_MODULE_5__.PLAYER_EVENT.RESIZE, resizeHandler);\n      window.removeEventListener('resize', resizeHandler);\n      this.layout_.dispose();\n    };\n  }\n  _injectCSS(css) {\n    const style = document.createElement('style');\n    style.innerHTML = css;\n    this.player_.el_.appendChild(style);\n  }\n  _resizeHandler() {\n    const shoppableBarBreakpoints = [['sm', 0, 80], ['md', 81, 110], ['lg', 111, 170]];\n    const shoppableBarWidth = parseFloat(this.options_.width) / 100.0 * this.player_.el_.clientWidth;\n    let inRange = false;\n    if (shoppableBarWidth) {\n      for (const [name, min, max] of shoppableBarBreakpoints) {\n        if (shoppableBarWidth > min && shoppableBarWidth <= max) {\n          this.layout_.contentWrpEl_.setAttribute('size', name);\n          inRange = name;\n        }\n      }\n      if (!inRange) {\n        this.layout_.contentWrpEl_.removeAttribute('size');\n      }\n    }\n  }\n  init() {\n    this.render();\n  }\n  render() {\n    this.layout_ = new _layout_bar_layout__WEBPACK_IMPORTED_MODULE_1__[\"default\"](this.player_, this.options_);\n  }\n}\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ShoppableWidget);\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/shoppable-widget.js?");
 
 /***/ }),
 
@@ -824,21 +100,7 @@ class ShoppableWidget {
   \***********************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   parseTime: () => (/* binding */ parseTime)
-/* harmony export */ });
-// Convert time string i.e. '2:40' to seconds number (160)
-// Also allows h:m:s format and mm:ss, m:s etc.
-const parseTime = function (hms) {
-  const [seconds, minutes, hours] = hms.split(':').reverse();
-  let sum = null;
-  if (!isNaN(seconds)) {
-    sum = (+hours || 0) * 60 * 60 + (+minutes || 0) * 60 + +seconds;
-  }
-  return sum;
-};
-
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   parseTime: () => (/* binding */ parseTime)\n/* harmony export */ });\n// Convert time string i.e. '2:40' to seconds number (160)\n// Also allows h:m:s format and mm:ss, m:s etc.\nconst parseTime = function (hms) {\n  const [seconds, minutes, hours] = hms.split(':').reverse();\n  let sum = null;\n  if (!isNaN(seconds)) {\n    sum = (+hours || 0) * 60 * 60 + (+minutes || 0) * 60 + +seconds;\n  }\n  return sum;\n};\n\n\n//# sourceURL=webpack://cloudinary-video-player/./utils/time.js?");
 
 /***/ }),
 
@@ -848,11 +110,8 @@ const parseTime = function (hms) {
   \********************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-__webpack_require__.r(__webpack_exports__);
-// extracted by mini-css-extract-plugin
-
+eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://cloudinary-video-player/./components/shoppable-bar/shoppable-widget.scss?");
 
 /***/ })
 
-}]);
-//# sourceMappingURL=shoppable.js.map
+}]);