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

package/dist/interaction-areas.js

@@ -1,8 +1,16 @@
 /*!
- * 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
  */
+/*
+ * 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([["interaction-areas"],{
 
 /***/ "./components/themeButton/themedButton.const.js":
@@ -12,13 +20,7 @@
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   BUTTON_THEME: () => (/* binding */ BUTTON_THEME)
-/* harmony export */ });
-const BUTTON_THEME = {
-  TRANSPARENT_WHITE: 'transparent-white'
-};
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   BUTTON_THEME: () => (/* binding */ BUTTON_THEME)\n/* harmony export */ });\nconst BUTTON_THEME = {\n  TRANSPARENT_WHITE: 'transparent-white'\n};\n\n//# sourceURL=webpack://cloudinary-video-player/./components/themeButton/themedButton.const.js?");
 
 /***/ }),
 
@@ -29,42 +31,7 @@ const BUTTON_THEME = {
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   themedButton: () => (/* binding */ themedButton)
-/* harmony export */ });
-/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../utils/dom */ "./utils/dom.js");
-
-const themedButton = _ref => {
-  let {
-    text,
-    onClick,
-    theme = '',
-    loadingDelay = 0
-  } = _ref;
-  return (0,_utils_dom__WEBPACK_IMPORTED_MODULE_0__.elementsCreator)({
-    tag: 'button',
-    attr: {
-      class: `vp-theme-button theme-${theme}`
-    },
-    onClick,
-    children: [{
-      tag: 'div',
-      attr: {
-        class: 'vp-loading-bar'
-      },
-      style: {
-        'animation-duration': `${loadingDelay}ms`
-      }
-    }, {
-      tag: 'div',
-      attr: {
-        class: 'content'
-      },
-      children: text
-    }]
-  });
-};
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   themedButton: () => (/* binding */ themedButton)\n/* harmony export */ });\n/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n\nconst themedButton = _ref => {\n  let {\n    text,\n    onClick,\n    theme = '',\n    loadingDelay = 0\n  } = _ref;\n  return (0,_utils_dom__WEBPACK_IMPORTED_MODULE_0__.elementsCreator)({\n    tag: 'button',\n    attr: {\n      class: `vp-theme-button theme-${theme}`\n    },\n    onClick,\n    children: [{\n      tag: 'div',\n      attr: {\n        class: 'vp-loading-bar'\n      },\n      style: {\n        'animation-duration': `${loadingDelay}ms`\n      }\n    }, {\n      tag: 'div',\n      attr: {\n        class: 'content'\n      },\n      children: text\n    }]\n  });\n};\n\n//# sourceURL=webpack://cloudinary-video-player/./components/themeButton/themedButton.js?");
 
 /***/ }),
 
@@ -75,66 +42,7 @@ const themedButton = _ref => {
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__),
-/* harmony export */   getDefaultPlayerColor: () => (/* binding */ getDefaultPlayerColor)
-/* harmony export */ });
-/* harmony import */ var _video_player_utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../video-player.utils */ "./video-player.utils.js");
-/* harmony import */ var _colors_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./colors.scss */ "./plugins/colors/colors.scss");
-
-
-const defaults = {
-  colorsDark: {
-    'base': '#000000',
-    'accent': '#0D9AFF',
-    'text': '#FFFFFF'
-  },
-  colorsLight: {
-    'base': '#FFFFFF',
-    'accent': '#0D9AFF',
-    'text': '#000000'
-  }
-};
-const getDefaultPlayerColor = options => {
-  return (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_0__.isLight)(options) ? defaults.colorsLight : defaults.colorsDark;
-};
-const colorsPlugin = function (player) {
-  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  const skinDefaults = getDefaultPlayerColor(player.options_);
-  opts.colors = Object.assign({}, skinDefaults, opts.colors);
-
-  // Set CSS custom properties on the player element
-  const playerEl = player.el();
-  if (opts.colors.base) {
-    playerEl.style.setProperty('--color-base', opts.colors.base);
-  }
-  if (opts.colors.accent) {
-    playerEl.style.setProperty('--color-accent', opts.colors.accent);
-  }
-  if (opts.colors.text) {
-    playerEl.style.setProperty('--color-text', opts.colors.text);
-  }
-
-  // Return an object with methods to update colors if needed
-  return {
-    updateColors: newColors => {
-      const updatedColors = Object.assign({}, opts.colors, newColors);
-      if (updatedColors.base) {
-        playerEl.style.setProperty('--color-base', updatedColors.base);
-      }
-      if (updatedColors.accent) {
-        playerEl.style.setProperty('--color-accent', updatedColors.accent);
-      }
-      if (updatedColors.text) {
-        playerEl.style.setProperty('--color-text', updatedColors.text);
-      }
-      opts.colors = updatedColors;
-    },
-    getColors: () => opts.colors
-  };
-};
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (colorsPlugin);
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */   getDefaultPlayerColor: () => (/* binding */ getDefaultPlayerColor)\n/* harmony export */ });\n/* harmony import */ var _video_player_utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../video-player.utils */ \"./video-player.utils.js\");\n/* harmony import */ var _colors_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./colors.scss */ \"./plugins/colors/colors.scss\");\n\n\nconst defaults = {\n  colorsDark: {\n    'base': '#000000',\n    'accent': '#0D9AFF',\n    'text': '#FFFFFF'\n  },\n  colorsLight: {\n    'base': '#FFFFFF',\n    'accent': '#0D9AFF',\n    'text': '#000000'\n  }\n};\nconst getDefaultPlayerColor = options => {\n  return (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_0__.isLight)(options) ? defaults.colorsLight : defaults.colorsDark;\n};\nconst colorsPlugin = function (player) {\n  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n  const skinDefaults = getDefaultPlayerColor(player.options_);\n  opts.colors = Object.assign({}, skinDefaults, opts.colors);\n\n  // Set CSS custom properties on the player element\n  const playerEl = player.el();\n  if (opts.colors.base) {\n    playerEl.style.setProperty('--color-base', opts.colors.base);\n  }\n  if (opts.colors.accent) {\n    playerEl.style.setProperty('--color-accent', opts.colors.accent);\n  }\n  if (opts.colors.text) {\n    playerEl.style.setProperty('--color-text', opts.colors.text);\n  }\n\n  // Return an object with methods to update colors if needed\n  return {\n    updateColors: newColors => {\n      const updatedColors = Object.assign({}, opts.colors, newColors);\n      if (updatedColors.base) {\n        playerEl.style.setProperty('--color-base', updatedColors.base);\n      }\n      if (updatedColors.accent) {\n        playerEl.style.setProperty('--color-accent', updatedColors.accent);\n      }\n      if (updatedColors.text) {\n        playerEl.style.setProperty('--color-text', updatedColors.text);\n      }\n      opts.colors = updatedColors;\n    },\n    getColors: () => opts.colors\n  };\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (colorsPlugin);\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/colors/colors.js?");
 
 /***/ }),
 
@@ -145,40 +53,7 @@ const colorsPlugin = function (player) {
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   CLOSE_INTERACTION_AREA_LAYOUT_DELAY: () => (/* binding */ CLOSE_INTERACTION_AREA_LAYOUT_DELAY),
-/* harmony export */   DEFAULT_INTERACTION_ARE_TRANSITION: () => (/* binding */ DEFAULT_INTERACTION_ARE_TRANSITION),
-/* harmony export */   INTERACTION_AREAS_CONTAINER_CLASS_NAME: () => (/* binding */ INTERACTION_AREAS_CONTAINER_CLASS_NAME),
-/* harmony export */   INTERACTION_AREAS_PREFIX: () => (/* binding */ INTERACTION_AREAS_PREFIX),
-/* harmony export */   INTERACTION_AREAS_TEMPLATE: () => (/* binding */ INTERACTION_AREAS_TEMPLATE),
-/* harmony export */   INTERACTION_AREAS_THEME: () => (/* binding */ INTERACTION_AREAS_THEME),
-/* harmony export */   INTERACTION_AREA_HAND_ICON: () => (/* binding */ INTERACTION_AREA_HAND_ICON),
-/* harmony export */   INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME: () => (/* binding */ INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME),
-/* harmony export */   TEMPLATE_INTERACTION_AREAS_VTT: () => (/* binding */ TEMPLATE_INTERACTION_AREAS_VTT)
-/* harmony export */ });
-const INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME = 'cld-ia-layout-state';
-const INTERACTION_AREAS_PREFIX = 'vp-ia';
-const INTERACTION_AREAS_CONTAINER_CLASS_NAME = 'interaction-areas-container';
-const INTERACTION_AREAS_TEMPLATE = {
-  PORTRAIT: 'portrait',
-  LANDSCAPE: 'landscape',
-  All: 'all',
-  CENTER: 'center'
-};
-const INTERACTION_AREAS_THEME = {
-  PULSING: 'pulsing',
-  SHADOWED: 'shadowed'
-};
-const TEMPLATE_INTERACTION_AREAS_VTT = {
-  [INTERACTION_AREAS_TEMPLATE.PORTRAIT]: 'https://res.cloudinary.com/prod/raw/upload/v1623772481/video-player/vtts/portrait.vtt',
-  [INTERACTION_AREAS_TEMPLATE.LANDSCAPE]: 'https://res.cloudinary.com/prod/raw/upload/v1623772303/video-player/vtts/landscape.vtt',
-  [INTERACTION_AREAS_TEMPLATE.All]: 'https://res.cloudinary.com/prod/raw/upload/v1623250266/video-player/vtts/all.vtt',
-  [INTERACTION_AREAS_TEMPLATE.CENTER]: 'https://res.cloudinary.com/prod/raw/upload/v1623250265/video-player/vtts/center.vtt'
-};
-const INTERACTION_AREA_HAND_ICON = 'https://res.cloudinary.com/prod/image/upload/v1626764643/video-player/interaction-area-hand.svg';
-const CLOSE_INTERACTION_AREA_LAYOUT_DELAY = 4500;
-const DEFAULT_INTERACTION_ARE_TRANSITION = 250;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   CLOSE_INTERACTION_AREA_LAYOUT_DELAY: () => (/* binding */ CLOSE_INTERACTION_AREA_LAYOUT_DELAY),\n/* harmony export */   DEFAULT_INTERACTION_ARE_TRANSITION: () => (/* binding */ DEFAULT_INTERACTION_ARE_TRANSITION),\n/* harmony export */   INTERACTION_AREAS_CONTAINER_CLASS_NAME: () => (/* binding */ INTERACTION_AREAS_CONTAINER_CLASS_NAME),\n/* harmony export */   INTERACTION_AREAS_PREFIX: () => (/* binding */ INTERACTION_AREAS_PREFIX),\n/* harmony export */   INTERACTION_AREAS_TEMPLATE: () => (/* binding */ INTERACTION_AREAS_TEMPLATE),\n/* harmony export */   INTERACTION_AREAS_THEME: () => (/* binding */ INTERACTION_AREAS_THEME),\n/* harmony export */   INTERACTION_AREA_HAND_ICON: () => (/* binding */ INTERACTION_AREA_HAND_ICON),\n/* harmony export */   INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME: () => (/* binding */ INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME),\n/* harmony export */   TEMPLATE_INTERACTION_AREAS_VTT: () => (/* binding */ TEMPLATE_INTERACTION_AREAS_VTT)\n/* harmony export */ });\nconst INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME = 'cld-ia-layout-state';\nconst INTERACTION_AREAS_PREFIX = 'vp-ia';\nconst INTERACTION_AREAS_CONTAINER_CLASS_NAME = 'interaction-areas-container';\nconst INTERACTION_AREAS_TEMPLATE = {\n  PORTRAIT: 'portrait',\n  LANDSCAPE: 'landscape',\n  All: 'all',\n  CENTER: 'center'\n};\nconst INTERACTION_AREAS_THEME = {\n  PULSING: 'pulsing',\n  SHADOWED: 'shadowed'\n};\nconst TEMPLATE_INTERACTION_AREAS_VTT = {\n  [INTERACTION_AREAS_TEMPLATE.PORTRAIT]: 'https://res.cloudinary.com/prod/raw/upload/v1623772481/video-player/vtts/portrait.vtt',\n  [INTERACTION_AREAS_TEMPLATE.LANDSCAPE]: 'https://res.cloudinary.com/prod/raw/upload/v1623772303/video-player/vtts/landscape.vtt',\n  [INTERACTION_AREAS_TEMPLATE.All]: 'https://res.cloudinary.com/prod/raw/upload/v1623250266/video-player/vtts/all.vtt',\n  [INTERACTION_AREAS_TEMPLATE.CENTER]: 'https://res.cloudinary.com/prod/raw/upload/v1623250265/video-player/vtts/center.vtt'\n};\nconst INTERACTION_AREA_HAND_ICON = 'https://res.cloudinary.com/prod/image/upload/v1626764643/video-player/interaction-area-hand.svg';\nconst CLOSE_INTERACTION_AREA_LAYOUT_DELAY = 4500;\nconst DEFAULT_INTERACTION_ARE_TRANSITION = 250;\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/interaction-areas/interaction-areas.const.js?");
 
 /***/ }),
 
@@ -189,239 +64,7 @@ const DEFAULT_INTERACTION_ARE_TRANSITION = 250;
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   interactionAreasService: () => (/* binding */ interactionAreasService)
-/* 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_get__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/get */ "../node_modules/lodash/get.js");
-/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/throttle */ "../node_modules/lodash/throttle.js");
-/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! lodash/noop */ "../node_modules/lodash/noop.js");
-/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(lodash_noop__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./interaction-areas.const */ "./plugins/interaction-areas/interaction-areas.const.js");
-/* harmony import */ var _interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./interaction-areas.utils */ "./plugins/interaction-areas/interaction-areas.utils.js");
-/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/dom */ "./utils/dom.js");
-/* harmony import */ var _video_player_utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../video-player.utils */ "./video-player.utils.js");
-/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../utils/consts */ "./utils/consts.js");
-/* harmony import */ var _interaction_areas_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./interaction-areas.scss */ "./plugins/interaction-areas/interaction-areas.scss");
-
-
-
-
-
-
-
-
-
-
-const interactionAreasService = (player, playerOptions, videojsOptions) => {
-  let isZoomed = false;
-  let currentSource = null;
-  let currentTrack = null;
-  let unZoom = (lodash_noop__WEBPACK_IMPORTED_MODULE_3___default());
-  const shouldLayoutMessage = () => (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.shouldShowAreaLayoutMessage)(videojsOptions.interactionDisplay);
-  const getIsSyncOffsetTime = () => {
-    const interactionAreasConfig = getInteractionAreasConfig();
-    return interactionAreasConfig && interactionAreasConfig.syncOffsetTime !== undefined ? interactionAreasConfig.syncOffsetTime : false;
-  };
-  function isInteractionAreasEnabled() {
-    let enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    const interactionAreasConfig = getInteractionAreasConfig();
-    return enabled || interactionAreasConfig && interactionAreasConfig.enable;
-  }
-  function setAreasPositionListener() {
-    currentTrack && player.videojs.removeRemoteTextTrack(currentTrack);
-    const isEnabled = isInteractionAreasEnabled();
-    const interactionAreasConfig = getInteractionAreasConfig();
-    if (!isEnabled || isZoomed) {
-      return null;
-    }
-    if (Array.isArray(interactionAreasConfig.template)) {
-      addInteractionAreasItems(interactionAreasConfig.template);
-      setContainerSize();
-    } else {
-      const vttUrl = interactionAreasConfig.vttUrl || _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_INTERACTION_AREAS_VTT[interactionAreasConfig.template];
-      if (vttUrl) {
-        currentTrack = (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_7__.addMetadataTrack)(player.videojs, vttUrl);
-        addCueListener(currentTrack);
-      }
-    }
-  }
-  function setGoBackButton() {
-    const button = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {
-      'class': 'go-back-button'
-    });
-    button.addEventListener('click', () => {
-      unZoom();
-    }, false);
-    const tracksContainer = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {
-      'class': _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.INTERACTION_AREAS_CONTAINER_CLASS_NAME
-    }, button);
-    (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainer)(player.videojs, tracksContainer);
-  }
-  function getInteractionAreasConfig() {
-    const {
-      cldSrc
-    } = currentSource;
-    return cldSrc && cldSrc.interactionAreas();
-  }
-  function removeLayoutMessage() {
-    (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.removeInteractionAreasContainer)(player.videojs);
-    setAreasPositionListener();
-    player.play();
-  }
-  function setLayoutMessage() {
-    if (!isInteractionAreasEnabled()) {
-      return;
-    }
-    if (shouldLayoutMessage()) {
-      let layoutMessageTimout = null;
-      const showItAgainCheckbox = lodash_get__WEBPACK_IMPORTED_MODULE_1___default()(videojsOptions, 'interactionDisplay.layout.showAgain', false);
-      player.pause();
-      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.createInteractionAreaLayoutMessage)(player.videojs, () => {
-        clearTimeout(layoutMessageTimout);
-        removeLayoutMessage();
-      }, showItAgainCheckbox);
-      if (!showItAgainCheckbox) {
-        layoutMessageTimout = setTimeout(removeLayoutMessage, _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.CLOSE_INTERACTION_AREA_LAYOUT_DELAY);
-      }
-    } else {
-      removeLayoutMessage();
-    }
-  }
-  function handleAds() {
-    player.on('adsready', () => {
-      player.videojs.ima.addEventListener(window.google.ima.AdEvent.Type.ALL_ADS_COMPLETED, setLayoutMessage);
-    });
-  }
-  function init() {
-    currentSource = currentSource || player.videojs.currentSource();
-    if (isInteractionAreasEnabled()) {
-      player.videojs.el().classList.add('interaction-areas');
-      player.videojs.one(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.PLAY, () => {
-        if (typeof player.videojs.ima === 'object') {
-          handleAds();
-        } else {
-          setLayoutMessage();
-        }
-      });
-      const setInteractionAreasContainerSize = lodash_throttle__WEBPACK_IMPORTED_MODULE_2___default()(setContainerSize, 100);
-      player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.FULL_SCREEN_CHANGE, () => {
-        // waiting for fullscreen will end
-        setTimeout(setInteractionAreasContainerSize, 100);
-      });
-      const resizeDestroy = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.addEventListener)(window, 'resize', setContainerSize, false);
-      player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.DISPOSE, resizeDestroy);
-    }
-    player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.ENDED, () => {
-      unZoom();
-    });
-    player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.ERROR, () => {
-      player.pause();
-    });
-  }
-  function onZoom(src, newOption, item) {
-    const originalCurrentTime = player.currentTime();
-    const isSyncOffsetTime = getIsSyncOffsetTime();
-    const {
-      cldSrc
-    } = currentSource;
-    const currentSrcOptions = cldSrc.getInitOptions();
-    const option = newOption || {
-      transformation: currentSrcOptions.transformation
-    };
-    const transformation = !src && (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.getZoomTransformation)(player.videoElement, item);
-    const sourceOptions = transformation ? video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge({
-      transformation
-    }, option) : option;
-    const newSource = cldSrc.isRawUrl ? currentSource.src : {
-      publicId: cldSrc.publicId()
-    };
-    player.source(transformation ? {
-      publicId: cldSrc.publicId()
-    } : src, sourceOptions).play();
-    isSyncOffsetTime && player.currentTime(originalCurrentTime);
-    isZoomed = true;
-    setGoBackButton();
-    unZoom = () => {
-      if (isZoomed) {
-        isZoomed = false;
-        const currentZoomedTime = player.currentTime();
-        const duration = player.duration();
-        player.source(newSource, currentSrcOptions).play();
-        isSyncOffsetTime && currentZoomedTime < duration && player.currentTime(currentZoomedTime);
-        setAreasPositionListener();
-      }
-    };
-  }
-  function onInteractionAreasClick(_ref) {
-    let {
-      event,
-      item,
-      index
-    } = _ref;
-    const interactionAreasConfig = getInteractionAreasConfig();
-    interactionAreasConfig.onClick && interactionAreasConfig.onClick({
-      item,
-      index,
-      event,
-      zoom: (source, option) => {
-        onZoom(source, option, item);
-      }
-    });
-  }
-  function addInteractionAreasItems(interactionAreasData, previousInteractionAreasData) {
-    let durationTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-    const configs = {
-      playerOptions: playerOptions,
-      videojsOptions: videojsOptions
-    };
-    if (previousInteractionAreasData) {
-      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.updateInteractionAreasItem)(player.videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onInteractionAreasClick);
-    } else {
-      const interactionAreasItems = interactionAreasData.map((item, index) => {
-        return (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.getInteractionAreaItem)(configs, item, index, durationTime, event => {
-          onInteractionAreasClick({
-            event,
-            item,
-            index
-          });
-        });
-      });
-      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainer)(player.videojs, (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {
-        'class': _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.INTERACTION_AREAS_CONTAINER_CLASS_NAME
-      }, interactionAreasItems));
-    }
-  }
-  function setContainerSize() {
-    if (isInteractionAreasEnabled()) {
-      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainerSize)(player.videojs, player.videoElement);
-    }
-  }
-  function addCueListener(track) {
-    if (!track) {
-      return;
-    }
-    let previousTracksData = null;
-    track.addEventListener('cuechange', () => {
-      const activeCue = track.activeCues && track.activeCues[0];
-      if (activeCue) {
-        const durationTime = Math.max(Math.floor((activeCue.endTime - activeCue.startTime) * 1000), _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.DEFAULT_INTERACTION_ARE_TRANSITION);
-        const tracksData = JSON.parse(activeCue.text);
-        addInteractionAreasItems(tracksData, previousTracksData, durationTime);
-        !previousTracksData && setContainerSize();
-        previousTracksData = tracksData;
-      } else {
-        (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.removeInteractionAreasContainer)(player.videojs);
-        previousTracksData = null;
-      }
-    });
-  }
-  init();
-};
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   interactionAreasService: () => (/* binding */ interactionAreasService)\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_get__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/get */ \"../node_modules/lodash/get.js\");\n/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/throttle */ \"../node_modules/lodash/throttle.js\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! lodash/noop */ \"../node_modules/lodash/noop.js\");\n/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(lodash_noop__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./interaction-areas.const */ \"./plugins/interaction-areas/interaction-areas.const.js\");\n/* harmony import */ var _interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./interaction-areas.utils */ \"./plugins/interaction-areas/interaction-areas.utils.js\");\n/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n/* harmony import */ var _video_player_utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../video-player.utils */ \"./video-player.utils.js\");\n/* harmony import */ var _utils_consts__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../utils/consts */ \"./utils/consts.js\");\n/* harmony import */ var _interaction_areas_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./interaction-areas.scss */ \"./plugins/interaction-areas/interaction-areas.scss\");\n\n\n\n\n\n\n\n\n\n\nconst interactionAreasService = (player, playerOptions, videojsOptions) => {\n  let isZoomed = false;\n  let currentSource = null;\n  let currentTrack = null;\n  let unZoom = (lodash_noop__WEBPACK_IMPORTED_MODULE_3___default());\n  const shouldLayoutMessage = () => (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.shouldShowAreaLayoutMessage)(videojsOptions.interactionDisplay);\n  const getIsSyncOffsetTime = () => {\n    const interactionAreasConfig = getInteractionAreasConfig();\n    return interactionAreasConfig && interactionAreasConfig.syncOffsetTime !== undefined ? interactionAreasConfig.syncOffsetTime : false;\n  };\n  function isInteractionAreasEnabled() {\n    let enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;\n    const interactionAreasConfig = getInteractionAreasConfig();\n    return enabled || interactionAreasConfig && interactionAreasConfig.enable;\n  }\n  function setAreasPositionListener() {\n    currentTrack && player.videojs.removeRemoteTextTrack(currentTrack);\n    const isEnabled = isInteractionAreasEnabled();\n    const interactionAreasConfig = getInteractionAreasConfig();\n    if (!isEnabled || isZoomed) {\n      return null;\n    }\n    if (Array.isArray(interactionAreasConfig.template)) {\n      addInteractionAreasItems(interactionAreasConfig.template);\n      setContainerSize();\n    } else {\n      const vttUrl = interactionAreasConfig.vttUrl || _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.TEMPLATE_INTERACTION_AREAS_VTT[interactionAreasConfig.template];\n      if (vttUrl) {\n        currentTrack = (0,_video_player_utils__WEBPACK_IMPORTED_MODULE_7__.addMetadataTrack)(player.videojs, vttUrl);\n        addCueListener(currentTrack);\n      }\n    }\n  }\n  function setGoBackButton() {\n    const button = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {\n      'class': 'go-back-button'\n    });\n    button.addEventListener('click', () => {\n      unZoom();\n    }, false);\n    const tracksContainer = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {\n      'class': _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n    }, button);\n    (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainer)(player.videojs, tracksContainer);\n  }\n  function getInteractionAreasConfig() {\n    const {\n      cldSrc\n    } = currentSource;\n    return cldSrc && cldSrc.interactionAreas();\n  }\n  function removeLayoutMessage() {\n    (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.removeInteractionAreasContainer)(player.videojs);\n    setAreasPositionListener();\n    player.play();\n  }\n  function setLayoutMessage() {\n    if (!isInteractionAreasEnabled()) {\n      return;\n    }\n    if (shouldLayoutMessage()) {\n      let layoutMessageTimout = null;\n      const showItAgainCheckbox = lodash_get__WEBPACK_IMPORTED_MODULE_1___default()(videojsOptions, 'interactionDisplay.layout.showAgain', false);\n      player.pause();\n      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.createInteractionAreaLayoutMessage)(player.videojs, () => {\n        clearTimeout(layoutMessageTimout);\n        removeLayoutMessage();\n      }, showItAgainCheckbox);\n      if (!showItAgainCheckbox) {\n        layoutMessageTimout = setTimeout(removeLayoutMessage, _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.CLOSE_INTERACTION_AREA_LAYOUT_DELAY);\n      }\n    } else {\n      removeLayoutMessage();\n    }\n  }\n  function handleAds() {\n    player.on('adsready', () => {\n      player.videojs.ima.addEventListener(window.google.ima.AdEvent.Type.ALL_ADS_COMPLETED, setLayoutMessage);\n    });\n  }\n  function init() {\n    currentSource = currentSource || player.videojs.currentSource();\n    if (isInteractionAreasEnabled()) {\n      player.videojs.el().classList.add('interaction-areas');\n      player.videojs.one(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.PLAY, () => {\n        if (typeof player.videojs.ima === 'object') {\n          handleAds();\n        } else {\n          setLayoutMessage();\n        }\n      });\n      const setInteractionAreasContainerSize = lodash_throttle__WEBPACK_IMPORTED_MODULE_2___default()(setContainerSize, 100);\n      player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.FULL_SCREEN_CHANGE, () => {\n        // waiting for fullscreen will end\n        setTimeout(setInteractionAreasContainerSize, 100);\n      });\n      const resizeDestroy = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.addEventListener)(window, 'resize', setContainerSize, false);\n      player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.DISPOSE, resizeDestroy);\n    }\n    player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.ENDED, () => {\n      unZoom();\n    });\n    player.videojs.on(_utils_consts__WEBPACK_IMPORTED_MODULE_8__.PLAYER_EVENT.ERROR, () => {\n      player.pause();\n    });\n  }\n  function onZoom(src, newOption, item) {\n    const originalCurrentTime = player.currentTime();\n    const isSyncOffsetTime = getIsSyncOffsetTime();\n    const {\n      cldSrc\n    } = currentSource;\n    const currentSrcOptions = cldSrc.getInitOptions();\n    const option = newOption || {\n      transformation: currentSrcOptions.transformation\n    };\n    const transformation = !src && (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.getZoomTransformation)(player.videoElement, item);\n    const sourceOptions = transformation ? video_js__WEBPACK_IMPORTED_MODULE_0___default().obj.merge({\n      transformation\n    }, option) : option;\n    const newSource = cldSrc.isRawUrl ? currentSource.src : {\n      publicId: cldSrc.publicId()\n    };\n    player.source(transformation ? {\n      publicId: cldSrc.publicId()\n    } : src, sourceOptions).play();\n    isSyncOffsetTime && player.currentTime(originalCurrentTime);\n    isZoomed = true;\n    setGoBackButton();\n    unZoom = () => {\n      if (isZoomed) {\n        isZoomed = false;\n        const currentZoomedTime = player.currentTime();\n        const duration = player.duration();\n        player.source(newSource, currentSrcOptions).play();\n        isSyncOffsetTime && currentZoomedTime < duration && player.currentTime(currentZoomedTime);\n        setAreasPositionListener();\n      }\n    };\n  }\n  function onInteractionAreasClick(_ref) {\n    let {\n      event,\n      item,\n      index\n    } = _ref;\n    const interactionAreasConfig = getInteractionAreasConfig();\n    interactionAreasConfig.onClick && interactionAreasConfig.onClick({\n      item,\n      index,\n      event,\n      zoom: (source, option) => {\n        onZoom(source, option, item);\n      }\n    });\n  }\n  function addInteractionAreasItems(interactionAreasData, previousInteractionAreasData) {\n    let durationTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;\n    const configs = {\n      playerOptions: playerOptions,\n      videojsOptions: videojsOptions\n    };\n    if (previousInteractionAreasData) {\n      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.updateInteractionAreasItem)(player.videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onInteractionAreasClick);\n    } else {\n      const interactionAreasItems = interactionAreasData.map((item, index) => {\n        return (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.getInteractionAreaItem)(configs, item, index, durationTime, event => {\n          onInteractionAreasClick({\n            event,\n            item,\n            index\n          });\n        });\n      });\n      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainer)(player.videojs, (0,_utils_dom__WEBPACK_IMPORTED_MODULE_6__.createElement)('div', {\n        'class': _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.INTERACTION_AREAS_CONTAINER_CLASS_NAME\n      }, interactionAreasItems));\n    }\n  }\n  function setContainerSize() {\n    if (isInteractionAreasEnabled()) {\n      (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.setInteractionAreasContainerSize)(player.videojs, player.videoElement);\n    }\n  }\n  function addCueListener(track) {\n    if (!track) {\n      return;\n    }\n    let previousTracksData = null;\n    track.addEventListener('cuechange', () => {\n      const activeCue = track.activeCues && track.activeCues[0];\n      if (activeCue) {\n        const durationTime = Math.max(Math.floor((activeCue.endTime - activeCue.startTime) * 1000), _interaction_areas_const__WEBPACK_IMPORTED_MODULE_4__.DEFAULT_INTERACTION_ARE_TRANSITION);\n        const tracksData = JSON.parse(activeCue.text);\n        addInteractionAreasItems(tracksData, previousTracksData, durationTime);\n        !previousTracksData && setContainerSize();\n        previousTracksData = tracksData;\n      } else {\n        (0,_interaction_areas_utils__WEBPACK_IMPORTED_MODULE_5__.removeInteractionAreasContainer)(player.videojs);\n        previousTracksData = null;\n      }\n    });\n  }\n  init();\n};\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/interaction-areas/interaction-areas.service.js?");
 
 /***/ }),
 
@@ -432,248 +75,7 @@ const interactionAreasService = (player, playerOptions, videojsOptions) => {
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   createInteractionAreaLayoutMessage: () => (/* binding */ createInteractionAreaLayoutMessage),
-/* harmony export */   getInteractionAreaItem: () => (/* binding */ getInteractionAreaItem),
-/* harmony export */   getZoomTransformation: () => (/* binding */ getZoomTransformation),
-/* harmony export */   percentageToFixedValue: () => (/* binding */ percentageToFixedValue),
-/* harmony export */   removeInteractionAreasContainer: () => (/* binding */ removeInteractionAreasContainer),
-/* harmony export */   setInteractionAreasContainer: () => (/* binding */ setInteractionAreasContainer),
-/* harmony export */   setInteractionAreasContainerSize: () => (/* binding */ setInteractionAreasContainerSize),
-/* harmony export */   shouldShowAreaLayoutMessage: () => (/* binding */ shouldShowAreaLayoutMessage),
-/* harmony export */   updateInteractionAreasItem: () => (/* binding */ updateInteractionAreasItem)
-/* harmony export */ });
-/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash/get */ "../node_modules/lodash/get.js");
-/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/noop */ "../node_modules/lodash/noop.js");
-/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_noop__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/dom */ "./utils/dom.js");
-/* harmony import */ var _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./interaction-areas.const */ "./plugins/interaction-areas/interaction-areas.const.js");
-/* harmony import */ var _colors_colors__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../colors/colors */ "./plugins/colors/colors.js");
-/* harmony import */ var _components_themeButton_themedButton__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/themeButton/themedButton */ "./components/themeButton/themedButton.js");
-/* harmony import */ var _components_themeButton_themedButton_const__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/themeButton/themedButton.const */ "./components/themeButton/themedButton.const.js");
-
-
-
-
-
-
-
-const getInteractionAreaItemId = (item, index) => item.id || item.type || `id_${index}`;
-const getInteractionAreaItem = (_ref, item, index, durationTime, onClick) => {
-  let {
-    playerOptions,
-    videojsOptions
-  } = _ref;
-  const defaultColor = (0,_colors_colors__WEBPACK_IMPORTED_MODULE_4__.getDefaultPlayerColor)(videojsOptions);
-  const accentColor = playerOptions && playerOptions.colors ? playerOptions.colors.accent : defaultColor.accent;
-
-  // theme = 'pulsing' / 'shadowed'
-  const theme = lodash_get__WEBPACK_IMPORTED_MODULE_0___default()(videojsOptions, 'interactionDisplay.theme.template', _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_THEME.PULSING);
-  return (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.elementsCreator)({
-    tag: 'div',
-    attr: {
-      class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-item theme-${theme}`,
-      'data-id': getInteractionAreaItemId(item, index)
-    },
-    style: {
-      left: `${item.left}%`,
-      top: `${item.top}%`,
-      width: `${item.width}%`,
-      height: `${item.height}%`,
-      transitionDuration: `${durationTime}ms`
-    },
-    event: {
-      name: 'click',
-      callback: onClick
-    },
-    children: [{
-      tag: 'div',
-      attr: {
-        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-area-marker`
-      },
-      children: [{
-        tag: 'div',
-        attr: {
-          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-marker-shadow`
-        },
-        style: {
-          [theme === _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_THEME.SHADOWED ? 'backgroundColor' : 'borderColor']: accentColor
-        }
-      }, {
-        tag: 'div',
-        attr: {
-          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-marker-main`
-        },
-        style: {
-          borderColor: accentColor
-        }
-      }]
-    }]
-  });
-};
-const percentageToFixedValue = (outOf, value) => outOf / (100 / +value);
-const getZoomTransformation = (videoElement, interactionAreaItem) => {
-  const {
-    videoHeight,
-    videoWidth
-  } = videoElement;
-  const itemX = percentageToFixedValue(videoWidth, interactionAreaItem.left);
-  const itemY = percentageToFixedValue(videoHeight, interactionAreaItem.top);
-  const itemWidth = percentageToFixedValue(videoWidth, interactionAreaItem.width);
-  const itemHeight = percentageToFixedValue(videoHeight, interactionAreaItem.height);
-  const videoAspectRatio = videoWidth / videoHeight;
-  const itemAspectRatio = itemWidth / itemHeight;
-  const width = Math.round(itemAspectRatio > 1 || videoAspectRatio > 1 ? itemHeight * itemAspectRatio : itemWidth);
-  const height = Math.round(width / videoAspectRatio);
-  const x = Math.round(itemX - (width - itemWidth) / 2);
-  const y = Math.round(itemY - (height - itemHeight) / 2);
-  return {
-    width,
-    height,
-    x: Math.min(Math.max(x, 0), videoWidth - width),
-    y: Math.min(Math.max(y, 0), videoHeight - height),
-    crop: 'crop'
-  };
-};
-const setInteractionAreasContainer = (videojs, newInteractionAreasContainer) => {
-  const currentInteractionAreasContainer = getInteractionAreasContainer(videojs);
-  if (currentInteractionAreasContainer) {
-    currentInteractionAreasContainer.replaceWith(newInteractionAreasContainer);
-  } else {
-    // do not use element.append for ie11 support
-    videojs.el().appendChild(newInteractionAreasContainer);
-  }
-};
-const getInteractionAreaElementById = (interactionAreasContainer, item, index) => interactionAreasContainer.querySelector(`[data-id=${getInteractionAreaItemId(item, index)}]`);
-const updateInteractionAreasItem = (videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onClick) => {
-  const interactionAreasContainer = getInteractionAreasContainer(videojs);
-  interactionAreasData.forEach((item, index) => {
-    const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);
-    const itemId = getInteractionAreaItemId(item);
-    const isExistItem = previousInteractionAreasData.some(i => getInteractionAreaItemId(i) === itemId);
-
-    // in case the element of the item is in the dom and exist in the previous data , it update the element position
-    if (isExistItem && itemElement) {
-      (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.styleElement)(itemElement, {
-        left: `${item.left}%`,
-        top: `${item.top}%`,
-        width: `${item.width}%`,
-        height: `${item.height}%`,
-        transitionDuration: `${durationTime}ms`
-      });
-      // if the element did not exist before , not in the dom and not in the previous data , it add a new element
-    } else if (!isExistItem && !itemElement) {
-      // do not use element.append for ie11 support
-      interactionAreasContainer.appendChild(getInteractionAreaItem(configs, item, index, durationTime, event => {
-        onClick({
-          event,
-          item,
-          index
-        });
-      }));
-    }
-  });
-
-  // checking the previous data for element that should be removed if not exist in the new data object.
-  previousInteractionAreasData.forEach((item, index) => {
-    const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);
-    const itemId = getInteractionAreaItemId(item);
-    const shouldBeRemoved = !interactionAreasData.some(i => getInteractionAreaItemId(i) === itemId);
-    if (itemElement && shouldBeRemoved) {
-      // do not use element.remove for ie11 support
-      itemElement.parentNode.removeChild(itemElement);
-    }
-  });
-};
-const shouldShowAreaLayoutMessage = interactionAreasConfig => {
-  const isLayoutEnabled = lodash_get__WEBPACK_IMPORTED_MODULE_0___default()(interactionAreasConfig, 'layout.enable', true);
-  return isLayoutEnabled && localStorage.getItem(_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME) !== 'true';
-};
-const onClickInteractionAreaLayoutClick = function (checked) {
-  let onClick = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (lodash_noop__WEBPACK_IMPORTED_MODULE_1___default());
-  localStorage.setItem(_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, JSON.parse(checked));
-  onClick();
-};
-const createInteractionAreaLayoutMessage = function (videojs, onClick) {
-  let showItAgainCheckbox = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-  let checked = false;
-  const id = `checkbox_${Math.round(Math.random() * 10000)}`;
-  const tracksContainer = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.elementsCreator)({
-    tag: 'div',
-    attr: {
-      class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_CONTAINER_CLASS_NAME} ${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message ${showItAgainCheckbox ? '' : 'clickable'}`
-    },
-    onClick: !showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null,
-    children: [{
-      tag: 'img',
-      attr: {
-        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-icon`,
-        src: _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_HAND_ICON
-      }
-    }, {
-      tag: 'h3',
-      attr: {
-        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-title`
-      },
-      children: 'Tap on dots to zoom for a product.'
-    }, (0,_components_themeButton_themedButton__WEBPACK_IMPORTED_MODULE_5__.themedButton)({
-      text: 'Got it',
-      theme: _components_themeButton_themedButton_const__WEBPACK_IMPORTED_MODULE_6__.BUTTON_THEME.TRANSPARENT_WHITE,
-      loadingDelay: showItAgainCheckbox ? 0 : _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.CLOSE_INTERACTION_AREA_LAYOUT_DELAY,
-      onClick: showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null
-    }), showItAgainCheckbox && {
-      tag: 'div',
-      attr: {
-        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-do-not-show`
-      },
-      children: [{
-        tag: 'input',
-        attr: {
-          type: 'checkbox',
-          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-checkbox`,
-          id
-        },
-        event: {
-          name: 'input',
-          callback: event => {
-            checked = event.target.checked;
-          }
-        }
-      }, {
-        tag: 'label',
-        attr: {
-          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-checkbox-title`,
-          for: id
-        },
-        children: 'Don׳t show it again'
-      }]
-    }].filter(i => i)
-  });
-  setInteractionAreasContainer(videojs, tracksContainer);
-};
-const getInteractionAreasContainer = videojs => videojs.el().querySelector(`.${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_CONTAINER_CLASS_NAME}`);
-const removeInteractionAreasContainer = videojs => {
-  const interactionAreasContainer = getInteractionAreasContainer(videojs);
-
-  // do not use element.remove for ie11 support
-  interactionAreasContainer && interactionAreasContainer.parentNode.removeChild(interactionAreasContainer);
-};
-const setInteractionAreasContainerSize = (videojs, videoElement) => {
-  const interactionAreasContainer = getInteractionAreasContainer(videojs);
-  if (!interactionAreasContainer) {
-    return;
-  }
-  const {
-    videoHeight,
-    videoWidth
-  } = videoElement;
-  const videoAspectRatio = videoWidth / videoHeight;
-  const width = videoAspectRatio * videoElement.clientHeight;
-  interactionAreasContainer.style.width = `${videoElement.clientWidth < width ? '100%' : width}px`;
-  interactionAreasContainer.style.height = videoElement.clientWidth < width ? `${videoElement.clientWidth / videoAspectRatio}px` : '100%';
-};
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   createInteractionAreaLayoutMessage: () => (/* binding */ createInteractionAreaLayoutMessage),\n/* harmony export */   getInteractionAreaItem: () => (/* binding */ getInteractionAreaItem),\n/* harmony export */   getZoomTransformation: () => (/* binding */ getZoomTransformation),\n/* harmony export */   percentageToFixedValue: () => (/* binding */ percentageToFixedValue),\n/* harmony export */   removeInteractionAreasContainer: () => (/* binding */ removeInteractionAreasContainer),\n/* harmony export */   setInteractionAreasContainer: () => (/* binding */ setInteractionAreasContainer),\n/* harmony export */   setInteractionAreasContainerSize: () => (/* binding */ setInteractionAreasContainerSize),\n/* harmony export */   shouldShowAreaLayoutMessage: () => (/* binding */ shouldShowAreaLayoutMessage),\n/* harmony export */   updateInteractionAreasItem: () => (/* binding */ updateInteractionAreasItem)\n/* harmony export */ });\n/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash/get */ \"../node_modules/lodash/get.js\");\n/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/noop */ \"../node_modules/lodash/noop.js\");\n/* harmony import */ var lodash_noop__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_noop__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _utils_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/dom */ \"./utils/dom.js\");\n/* harmony import */ var _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./interaction-areas.const */ \"./plugins/interaction-areas/interaction-areas.const.js\");\n/* harmony import */ var _colors_colors__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../colors/colors */ \"./plugins/colors/colors.js\");\n/* harmony import */ var _components_themeButton_themedButton__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/themeButton/themedButton */ \"./components/themeButton/themedButton.js\");\n/* harmony import */ var _components_themeButton_themedButton_const__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/themeButton/themedButton.const */ \"./components/themeButton/themedButton.const.js\");\n\n\n\n\n\n\n\nconst getInteractionAreaItemId = (item, index) => item.id || item.type || `id_${index}`;\nconst getInteractionAreaItem = (_ref, item, index, durationTime, onClick) => {\n  let {\n    playerOptions,\n    videojsOptions\n  } = _ref;\n  const defaultColor = (0,_colors_colors__WEBPACK_IMPORTED_MODULE_4__.getDefaultPlayerColor)(videojsOptions);\n  const accentColor = playerOptions && playerOptions.colors ? playerOptions.colors.accent : defaultColor.accent;\n\n  // theme = 'pulsing' / 'shadowed'\n  const theme = lodash_get__WEBPACK_IMPORTED_MODULE_0___default()(videojsOptions, 'interactionDisplay.theme.template', _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_THEME.PULSING);\n  return (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-item theme-${theme}`,\n      'data-id': getInteractionAreaItemId(item, index)\n    },\n    style: {\n      left: `${item.left}%`,\n      top: `${item.top}%`,\n      width: `${item.width}%`,\n      height: `${item.height}%`,\n      transitionDuration: `${durationTime}ms`\n    },\n    event: {\n      name: 'click',\n      callback: onClick\n    },\n    children: [{\n      tag: 'div',\n      attr: {\n        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-area-marker`\n      },\n      children: [{\n        tag: 'div',\n        attr: {\n          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-marker-shadow`\n        },\n        style: {\n          [theme === _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_THEME.SHADOWED ? 'backgroundColor' : 'borderColor']: accentColor\n        }\n      }, {\n        tag: 'div',\n        attr: {\n          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-marker-main`\n        },\n        style: {\n          borderColor: accentColor\n        }\n      }]\n    }]\n  });\n};\nconst percentageToFixedValue = (outOf, value) => outOf / (100 / +value);\nconst getZoomTransformation = (videoElement, interactionAreaItem) => {\n  const {\n    videoHeight,\n    videoWidth\n  } = videoElement;\n  const itemX = percentageToFixedValue(videoWidth, interactionAreaItem.left);\n  const itemY = percentageToFixedValue(videoHeight, interactionAreaItem.top);\n  const itemWidth = percentageToFixedValue(videoWidth, interactionAreaItem.width);\n  const itemHeight = percentageToFixedValue(videoHeight, interactionAreaItem.height);\n  const videoAspectRatio = videoWidth / videoHeight;\n  const itemAspectRatio = itemWidth / itemHeight;\n  const width = Math.round(itemAspectRatio > 1 || videoAspectRatio > 1 ? itemHeight * itemAspectRatio : itemWidth);\n  const height = Math.round(width / videoAspectRatio);\n  const x = Math.round(itemX - (width - itemWidth) / 2);\n  const y = Math.round(itemY - (height - itemHeight) / 2);\n  return {\n    width,\n    height,\n    x: Math.min(Math.max(x, 0), videoWidth - width),\n    y: Math.min(Math.max(y, 0), videoHeight - height),\n    crop: 'crop'\n  };\n};\nconst setInteractionAreasContainer = (videojs, newInteractionAreasContainer) => {\n  const currentInteractionAreasContainer = getInteractionAreasContainer(videojs);\n  if (currentInteractionAreasContainer) {\n    currentInteractionAreasContainer.replaceWith(newInteractionAreasContainer);\n  } else {\n    // do not use element.append for ie11 support\n    videojs.el().appendChild(newInteractionAreasContainer);\n  }\n};\nconst getInteractionAreaElementById = (interactionAreasContainer, item, index) => interactionAreasContainer.querySelector(`[data-id=${getInteractionAreaItemId(item, index)}]`);\nconst updateInteractionAreasItem = (videojs, configs, interactionAreasData, previousInteractionAreasData, durationTime, onClick) => {\n  const interactionAreasContainer = getInteractionAreasContainer(videojs);\n  interactionAreasData.forEach((item, index) => {\n    const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    const itemId = getInteractionAreaItemId(item);\n    const isExistItem = previousInteractionAreasData.some(i => getInteractionAreaItemId(i) === itemId);\n\n    // in case the element of the item is in the dom and exist in the previous data , it update the element position\n    if (isExistItem && itemElement) {\n      (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.styleElement)(itemElement, {\n        left: `${item.left}%`,\n        top: `${item.top}%`,\n        width: `${item.width}%`,\n        height: `${item.height}%`,\n        transitionDuration: `${durationTime}ms`\n      });\n      // if the element did not exist before , not in the dom and not in the previous data , it add a new element\n    } else if (!isExistItem && !itemElement) {\n      // do not use element.append for ie11 support\n      interactionAreasContainer.appendChild(getInteractionAreaItem(configs, item, index, durationTime, event => {\n        onClick({\n          event,\n          item,\n          index\n        });\n      }));\n    }\n  });\n\n  // checking the previous data for element that should be removed if not exist in the new data object.\n  previousInteractionAreasData.forEach((item, index) => {\n    const itemElement = getInteractionAreaElementById(interactionAreasContainer, item, index);\n    const itemId = getInteractionAreaItemId(item);\n    const shouldBeRemoved = !interactionAreasData.some(i => getInteractionAreaItemId(i) === itemId);\n    if (itemElement && shouldBeRemoved) {\n      // do not use element.remove for ie11 support\n      itemElement.parentNode.removeChild(itemElement);\n    }\n  });\n};\nconst shouldShowAreaLayoutMessage = interactionAreasConfig => {\n  const isLayoutEnabled = lodash_get__WEBPACK_IMPORTED_MODULE_0___default()(interactionAreasConfig, 'layout.enable', true);\n  return isLayoutEnabled && localStorage.getItem(_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME) !== 'true';\n};\nconst onClickInteractionAreaLayoutClick = function (checked) {\n  let onClick = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (lodash_noop__WEBPACK_IMPORTED_MODULE_1___default());\n  localStorage.setItem(_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_LAYOUT_LOCAL_STORAGE_NAME, JSON.parse(checked));\n  onClick();\n};\nconst createInteractionAreaLayoutMessage = function (videojs, onClick) {\n  let showItAgainCheckbox = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;\n  let checked = false;\n  const id = `checkbox_${Math.round(Math.random() * 10000)}`;\n  const tracksContainer = (0,_utils_dom__WEBPACK_IMPORTED_MODULE_2__.elementsCreator)({\n    tag: 'div',\n    attr: {\n      class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_CONTAINER_CLASS_NAME} ${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message ${showItAgainCheckbox ? '' : 'clickable'}`\n    },\n    onClick: !showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null,\n    children: [{\n      tag: 'img',\n      attr: {\n        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-icon`,\n        src: _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREA_HAND_ICON\n      }\n    }, {\n      tag: 'h3',\n      attr: {\n        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-title`\n      },\n      children: 'Tap on dots to zoom for a product.'\n    }, (0,_components_themeButton_themedButton__WEBPACK_IMPORTED_MODULE_5__.themedButton)({\n      text: 'Got it',\n      theme: _components_themeButton_themedButton_const__WEBPACK_IMPORTED_MODULE_6__.BUTTON_THEME.TRANSPARENT_WHITE,\n      loadingDelay: showItAgainCheckbox ? 0 : _interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.CLOSE_INTERACTION_AREA_LAYOUT_DELAY,\n      onClick: showItAgainCheckbox ? () => onClickInteractionAreaLayoutClick(checked, onClick) : null\n    }), showItAgainCheckbox && {\n      tag: 'div',\n      attr: {\n        class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-do-not-show`\n      },\n      children: [{\n        tag: 'input',\n        attr: {\n          type: 'checkbox',\n          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-checkbox`,\n          id\n        },\n        event: {\n          name: 'input',\n          callback: event => {\n            checked = event.target.checked;\n          }\n        }\n      }, {\n        tag: 'label',\n        attr: {\n          class: `${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_PREFIX}-layout-message-checkbox-title`,\n          for: id\n        },\n        children: 'Don׳t show it again'\n      }]\n    }].filter(i => i)\n  });\n  setInteractionAreasContainer(videojs, tracksContainer);\n};\nconst getInteractionAreasContainer = videojs => videojs.el().querySelector(`.${_interaction_areas_const__WEBPACK_IMPORTED_MODULE_3__.INTERACTION_AREAS_CONTAINER_CLASS_NAME}`);\nconst removeInteractionAreasContainer = videojs => {\n  const interactionAreasContainer = getInteractionAreasContainer(videojs);\n\n  // do not use element.remove for ie11 support\n  interactionAreasContainer && interactionAreasContainer.parentNode.removeChild(interactionAreasContainer);\n};\nconst setInteractionAreasContainerSize = (videojs, videoElement) => {\n  const interactionAreasContainer = getInteractionAreasContainer(videojs);\n  if (!interactionAreasContainer) {\n    return;\n  }\n  const {\n    videoHeight,\n    videoWidth\n  } = videoElement;\n  const videoAspectRatio = videoWidth / videoHeight;\n  const width = videoAspectRatio * videoElement.clientHeight;\n  interactionAreasContainer.style.width = `${videoElement.clientWidth < width ? '100%' : width}px`;\n  interactionAreasContainer.style.height = videoElement.clientWidth < width ? `${videoElement.clientWidth / videoAspectRatio}px` : '100%';\n};\n\n//# sourceURL=webpack://cloudinary-video-player/./plugins/interaction-areas/interaction-areas.utils.js?");
 
 /***/ }),
 
@@ -683,24 +85,7 @@ const setInteractionAreasContainerSize = (videojs, videoElement) => {
   \**************************************/
 /***/ ((module) => {
 
-/**
- * This method returns `undefined`.
- *
- * @static
- * @memberOf _
- * @since 2.3.0
- * @category Util
- * @example
- *
- * _.times(2, _.noop);
- * // => [undefined, undefined]
- */
-function noop() {
-  // No operation performed.
-}
-
-module.exports = noop;
-
+eval("/**\n * This method returns `undefined`.\n *\n * @static\n * @memberOf _\n * @since 2.3.0\n * @category Util\n * @example\n *\n * _.times(2, _.noop);\n * // => [undefined, undefined]\n */\nfunction noop() {\n  // No operation performed.\n}\n\nmodule.exports = noop;\n\n\n//# sourceURL=webpack://cloudinary-video-player/../node_modules/lodash/noop.js?");
 
 /***/ }),
 
@@ -711,9 +96,7 @@ module.exports = noop;
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__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/./plugins/colors/colors.scss?");
 
 /***/ }),
 
@@ -724,11 +107,8 @@ __webpack_require__.r(__webpack_exports__);
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-__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/./plugins/interaction-areas/interaction-areas.scss?");
 
 /***/ })
 
-}]);
-//# sourceMappingURL=interaction-areas.js.map
+}]);