@blaze-cms/react-page-builder 0.124.0-alpha.0 → 0.124.0-alpha.3

package/lib/components/BackToTop/BackToTop.js

@@ -0,0 +1,94 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _fa = require("react-icons/fa");
+
+var _Wrapper = _interopRequireDefault(require("../Wrapper"));
+
+var _utils = require("../../utils");
+
+var _excluded = ["type", "showAfterPixels"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var BackToTop = function BackToTop(_ref) {
+  var type = _ref.type,
+      showAfterPixels = _ref.showAfterPixels,
+      otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      goToTop = _useState2[0],
+      setGoToTop = _useState2[1];
+
+  var modifiers = (0, _utils.getClassModifiers)(type, otherProps);
+  (0, _react.useEffect)(function () {
+    var handleOnScroll = function handleOnScroll() {
+      return setGoToTop(window.scrollY >= showAfterPixels);
+    };
+
+    document.addEventListener('scroll', handleOnScroll);
+    return function () {
+      return document.removeEventListener('scroll', handleOnScroll);
+    };
+  }, [showAfterPixels]);
+
+  var handleBackToTop = function handleBackToTop() {
+    window.scroll({
+      top: 0,
+      left: 0,
+      behavior: 'smooth'
+    });
+    setGoToTop(false);
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, goToTop && /*#__PURE__*/_react["default"].createElement(_Wrapper["default"], {
+    className: type,
+    modifiers: modifiers,
+    onClick: handleBackToTop
+  }, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaArrowUp, null))));
+};
+
+BackToTop.propTypes = {
+  type: _propTypes["default"].string,
+  showAfterPixels: _propTypes["default"].number
+};
+BackToTop.defaultProps = {
+  type: 'backtotop',
+  showAfterPixels: 200
+};
+var _default = BackToTop;
+exports["default"] = _default;
+//# sourceMappingURL=BackToTop.js.map

package/lib/components/BackToTop/BackToTop.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/BackToTop/BackToTop.js"],"names":["BackToTop","type","showAfterPixels","otherProps","goToTop","setGoToTop","modifiers","handleOnScroll","window","scrollY","document","addEventListener","removeEventListener","handleBackToTop","scroll","top","left","behavior","propTypes","PropTypes","string","number","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,SAAS,GAAG,SAAZA,SAAY,OAA8C;AAAA,MAA3CC,IAA2C,QAA3CA,IAA2C;AAAA,MAArCC,eAAqC,QAArCA,eAAqC;AAAA,MAAjBC,UAAiB;;AAC9D,kBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBC,UAAhB;;AACA,MAAMC,SAAS,GAAG,8BAAkBL,IAAlB,EAAwBE,UAAxB,CAAlB;AAEA,wBACE,YAAM;AACJ,QAAMI,cAAc,GAAG,SAAjBA,cAAiB;AAAA,aAAMF,UAAU,CAACG,MAAM,CAACC,OAAP,IAAkBP,eAAnB,CAAhB;AAAA,KAAvB;;AACAQ,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,QAA1B,EAAoCJ,cAApC;AACA,WAAO;AAAA,aAAMG,QAAQ,CAACE,mBAAT,CAA6B,QAA7B,EAAuCL,cAAvC,CAAN;AAAA,KAAP;AACD,GALH,EAME,CAACL,eAAD,CANF;;AASA,MAAMW,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AAC5BL,IAAAA,MAAM,CAACM,MAAP,CAAc;AACZC,MAAAA,GAAG,EAAE,CADO;AAEZC,MAAAA,IAAI,EAAE,CAFM;AAGZC,MAAAA,QAAQ,EAAE;AAHE,KAAd;AAKAZ,IAAAA,UAAU,CAAC,KAAD,CAAV;AACD,GAPD;;AASA,sBACE,kEACGD,OAAO,iBACN,gCAAC,mBAAD;AAAS,IAAA,SAAS,EAAEH,IAApB;AAA0B,IAAA,SAAS,EAAEK,SAArC;AAAgD,IAAA,OAAO,EAAEO;AAAzD,kBACE,wDACE,gCAAC,aAAD,OADF,CADF,CAFJ,CADF;AAWD,CAjCD;;AAmCAb,SAAS,CAACkB,SAAV,GAAsB;AACpBjB,EAAAA,IAAI,EAAEkB,sBAAUC,MADI;AAEpBlB,EAAAA,eAAe,EAAEiB,sBAAUE;AAFP,CAAtB;AAKArB,SAAS,CAACsB,YAAV,GAAyB;AACvBrB,EAAAA,IAAI,EAAE,WADiB;AAEvBC,EAAAA,eAAe,EAAE;AAFM,CAAzB;eAKeF,S","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { FaArrowUp } from 'react-icons/fa';\nimport Wrapper from '../Wrapper';\nimport { getClassModifiers } from '../../utils';\n\nconst BackToTop = ({ type, showAfterPixels, ...otherProps }) => {\n  const [goToTop, setGoToTop] = useState(false);\n  const modifiers = getClassModifiers(type, otherProps);\n\n  useEffect(\n    () => {\n      const handleOnScroll = () => setGoToTop(window.scrollY >= showAfterPixels);\n      document.addEventListener('scroll', handleOnScroll);\n      return () => document.removeEventListener('scroll', handleOnScroll);\n    },\n    [showAfterPixels]\n  );\n\n  const handleBackToTop = () => {\n    window.scroll({\n      top: 0,\n      left: 0,\n      behavior: 'smooth'\n    });\n    setGoToTop(false);\n  };\n\n  return (\n    <>\n      {goToTop && (\n        <Wrapper className={type} modifiers={modifiers} onClick={handleBackToTop}>\n          <i>\n            <FaArrowUp />\n          </i>\n        </Wrapper>\n      )}\n    </>\n  );\n};\n\nBackToTop.propTypes = {\n  type: PropTypes.string,\n  showAfterPixels: PropTypes.number\n};\n\nBackToTop.defaultProps = {\n  type: 'backtotop',\n  showAfterPixels: 200\n};\n\nexport default BackToTop;\n"],"file":"BackToTop.js"}

package/lib/components/BackToTop/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _BackToTop = _interopRequireDefault(require("./BackToTop"));
+
+var _default = _BackToTop["default"];
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/components/BackToTop/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/BackToTop/index.js"],"names":["BackToTop"],"mappings":";;;;;;;;;;;AAAA;;eAEeA,qB","sourcesContent":["import BackToTop from './BackToTop';\n\nexport default BackToTop;\n"],"file":"index.js"}

package/lib/components/CarouselWrapper.js

@@ -31,8 +31,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _fa = require("react-icons/fa");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -129,9 +127,9 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
       setShouldAutoScroll(false);
       handleButtonNavigation();
     }
-  }, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleLeft, {
-    size: arrowSize
-  })))), /*#__PURE__*/_react["default"].createElement("div", {
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "carousel--arrow-left"
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "cards-carousel--right-button-wrapper"
   }, displayRight && /*#__PURE__*/_react["default"].createElement("button", {
     type: "button",
@@ -140,9 +138,9 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
       setShouldAutoScroll(false);
       handleButtonNavigation(true);
     }
-  }, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleRight, {
-    size: arrowSize
-  })))), /*#__PURE__*/_react["default"].createElement("div", {
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "carousel--arrow-left"
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
     className: contentClassName,
     ref: ref,
     onScroll: handleScroll

package/lib/components/CarouselWrapper.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","arrowSize","ref","displayLeft","displayRight","buttonDisplay","setButtonDisplays","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","PropTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { FaAngleLeft, FaAngleRight } from 'react-icons/fa';\n\nconst CarouselWrapper = ({\n  children,\n  bannerModifier,\n  itemsPerRow,\n  enableAutoScroll,\n  autoScrollTimer,\n  arrowSize\n}) => {\n  const ref = useRef();\n  const [buttonDisplay, setButtonDisplays] = useState({ displayLeft: false, displayRight: true });\n  const [shouldAutoScroll, setShouldAutoScroll] = useState(false);\n  const autoScrollRef = useRef();\n\n  useEffect(\n    () => {\n      autoScrollRef.current = shouldAutoScroll;\n      const id = setInterval(scrollCheck, autoScrollTimer);\n      function scrollCheck() {\n        if (!autoScrollRef.current) {\n          clearInterval(id);\n        } else {\n          handleButtonNavigation(true);\n        }\n      }\n\n      return () => clearInterval(id);\n    },\n    [autoScrollTimer, shouldAutoScroll]\n  );\n\n  useEffect(\n    () => {\n      const {\n        current: { offsetWidth, scrollWidth }\n      } = ref;\n      if (scrollWidth <= offsetWidth)\n        setButtonDisplays({ displayLeft: false, displayRight: false });\n      setShouldAutoScroll(enableAutoScroll);\n    },\n    [enableAutoScroll]\n  );\n\n  const handleScroll = () => {\n    const {\n      current: { offsetWidth, scrollLeft, scrollWidth }\n    } = ref;\n    const updatedDisplayLeft = !!scrollLeft;\n    const updatedDisplayRight = scrollLeft + offsetWidth + 1 < scrollWidth;\n    setButtonDisplays({ displayLeft: updatedDisplayLeft, displayRight: updatedDisplayRight });\n  };\n\n  const handleButtonNavigation = direction => {\n    if (!ref || !ref.current) return;\n    const {\n      current: { offsetWidth, scrollLeft, scrollWidth }\n    } = ref;\n\n    if (autoScrollRef.current && scrollLeft + offsetWidth >= scrollWidth) {\n      ref.current.scrollLeft = 0;\n    } else {\n      ref.current.scrollLeft = direction ? scrollLeft + offsetWidth : scrollLeft - offsetWidth;\n    }\n  };\n\n  const { displayLeft, displayRight } = buttonDisplay;\n  const wrapperClassName = `cards-carousel${bannerModifier}`;\n  const contentClassName = `cards-carousel--content items-per-row-${itemsPerRow}`;\n\n  return (\n    <div className={wrapperClassName}>\n      <div className=\"cards-carousel--left-button-wrapper\">\n        {displayLeft && (\n          <button\n            type=\"button\"\n            className=\"cards-carousel--button-back icon-button icon\"\n            onClick={() => {\n              setShouldAutoScroll(false);\n              handleButtonNavigation();\n            }}>\n            <i>\n              <FaAngleLeft size={arrowSize} />\n            </i>\n          </button>\n        )}\n      </div>\n      <div className=\"cards-carousel--right-button-wrapper\">\n        {displayRight && (\n          <button\n            type=\"button\"\n            className=\"cards-carousel--button-forward icon-button icon\"\n            onClick={() => {\n              setShouldAutoScroll(false);\n              handleButtonNavigation(true);\n            }}>\n            <i>\n              <FaAngleRight size={arrowSize} />\n            </i>\n          </button>\n        )}\n      </div>\n      <div className={contentClassName} ref={ref} onScroll={handleScroll}>\n        {children}\n      </div>\n    </div>\n  );\n};\n\nCarouselWrapper.propTypes = {\n  bannerModifier: PropTypes.string,\n  itemsPerRow: PropTypes.number,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n  enableAutoScroll: PropTypes.bool,\n  autoScrollTimer: PropTypes.number,\n  arrowSize: PropTypes.number\n};\n\nCarouselWrapper.defaultProps = {\n  itemsPerRow: 0,\n  bannerModifier: '',\n  children: [],\n  enableAutoScroll: false,\n  autoScrollTimer: 0,\n  arrowSize: 14\n};\n\nexport default CarouselWrapper;\n"],"file":"CarouselWrapper.js"}
+{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","arrowSize","ref","displayLeft","displayRight","buttonDisplay","setButtonDisplays","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","PropTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\n\nconst CarouselWrapper = ({\n  children,\n  bannerModifier,\n  itemsPerRow,\n  enableAutoScroll,\n  autoScrollTimer,\n  arrowSize\n}) => {\n  const ref = useRef();\n  const [buttonDisplay, setButtonDisplays] = useState({ displayLeft: false, displayRight: true });\n  const [shouldAutoScroll, setShouldAutoScroll] = useState(false);\n  const autoScrollRef = useRef();\n\n  useEffect(\n    () => {\n      autoScrollRef.current = shouldAutoScroll;\n      const id = setInterval(scrollCheck, autoScrollTimer);\n      function scrollCheck() {\n        if (!autoScrollRef.current) {\n          clearInterval(id);\n        } else {\n          handleButtonNavigation(true);\n        }\n      }\n\n      return () => clearInterval(id);\n    },\n    [autoScrollTimer, shouldAutoScroll]\n  );\n\n  useEffect(\n    () => {\n      const {\n        current: { offsetWidth, scrollWidth }\n      } = ref;\n      if (scrollWidth <= offsetWidth)\n        setButtonDisplays({ displayLeft: false, displayRight: false });\n      setShouldAutoScroll(enableAutoScroll);\n    },\n    [enableAutoScroll]\n  );\n\n  const handleScroll = () => {\n    const {\n      current: { offsetWidth, scrollLeft, scrollWidth }\n    } = ref;\n    const updatedDisplayLeft = !!scrollLeft;\n    const updatedDisplayRight = scrollLeft + offsetWidth + 1 < scrollWidth;\n    setButtonDisplays({ displayLeft: updatedDisplayLeft, displayRight: updatedDisplayRight });\n  };\n\n  const handleButtonNavigation = direction => {\n    if (!ref || !ref.current) return;\n    const {\n      current: { offsetWidth, scrollLeft, scrollWidth }\n    } = ref;\n\n    if (autoScrollRef.current && scrollLeft + offsetWidth >= scrollWidth) {\n      ref.current.scrollLeft = 0;\n    } else {\n      ref.current.scrollLeft = direction ? scrollLeft + offsetWidth : scrollLeft - offsetWidth;\n    }\n  };\n\n  const { displayLeft, displayRight } = buttonDisplay;\n  const wrapperClassName = `cards-carousel${bannerModifier}`;\n  const contentClassName = `cards-carousel--content items-per-row-${itemsPerRow}`;\n\n  return (\n    <div className={wrapperClassName}>\n      <div className=\"cards-carousel--left-button-wrapper\">\n        {displayLeft && (\n          <button\n            type=\"button\"\n            className=\"cards-carousel--button-back icon-button icon\"\n            onClick={() => {\n              setShouldAutoScroll(false);\n              handleButtonNavigation();\n            }}>\n            <i className=\"carousel--arrow-left\" />\n          </button>\n        )}\n      </div>\n      <div className=\"cards-carousel--right-button-wrapper\">\n        {displayRight && (\n          <button\n            type=\"button\"\n            className=\"cards-carousel--button-forward icon-button icon\"\n            onClick={() => {\n              setShouldAutoScroll(false);\n              handleButtonNavigation(true);\n            }}>\n            <i className=\"carousel--arrow-left\" />\n          </button>\n        )}\n      </div>\n      <div className={contentClassName} ref={ref} onScroll={handleScroll}>\n        {children}\n      </div>\n    </div>\n  );\n};\n\nCarouselWrapper.propTypes = {\n  bannerModifier: PropTypes.string,\n  itemsPerRow: PropTypes.number,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n  enableAutoScroll: PropTypes.bool,\n  autoScrollTimer: PropTypes.number,\n  arrowSize: PropTypes.number\n};\n\nCarouselWrapper.defaultProps = {\n  itemsPerRow: 0,\n  bannerModifier: '',\n  children: [],\n  enableAutoScroll: false,\n  autoScrollTimer: 0,\n  arrowSize: 14\n};\n\nexport default CarouselWrapper;\n"],"file":"CarouselWrapper.js"}

package/lib/components/Video/Video.js

@@ -39,15 +39,19 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _useGetImages2 = _interopRequireDefault(require("../../hooks/use-get-images"));
+
 var _VideoRender = _interopRequireDefault(require("./VideoRender"));
 
+var _VideoModal = _interopRequireDefault(require("./VideoModal"));
+
 var _Wrapper = _interopRequireDefault(require("../Wrapper"));
 
 var _getClassModifiers = _interopRequireDefault(require("../../utils/get-class-modifiers"));
 
 var _helpers = require("../../helpers");
 
-var _excluded = ["url", "modifier", "autoplay", "isCaptionDisplayed", "caption", "credits", "areVideoCreditsDisplayed", "provider"];
+var _excluded = ["url", "modifier", "autoplay", "isCaptionDisplayed", "caption", "credits", "areVideoCreditsDisplayed", "provider", "playInModal", "imageId"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -62,11 +66,19 @@ var Video = function Video(_ref) {
       credits = _ref.credits,
       areVideoCreditsDisplayed = _ref.areVideoCreditsDisplayed,
       provider = _ref.provider,
-      variableProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+      playInModal = _ref.playInModal,
+      imageId = _ref.imageId,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+
+  var _useGetImages = (0, _useGetImages2["default"])(imageId),
+      imageData = _useGetImages.data.getFile,
+      loading = _useGetImages.loading;
+
+  if (loading) return '';
   if (!url) return null;
   var modifiers = "video--".concat(provider.toLowerCase(), " ").concat((0, _getClassModifiers["default"])('video', _objectSpread({
     modifier: modifier
-  }, variableProps)));
+  }, props)));
   var shouldDisplayCaption = (0, _helpers.shouldShowProperty)({
     isDisplayed: isCaptionDisplayed,
     value: caption
@@ -78,12 +90,19 @@ var Video = function Video(_ref) {
   return /*#__PURE__*/_react["default"].createElement(_Wrapper["default"], {
     className: "video",
     modifiers: modifiers
-  }, /*#__PURE__*/_react["default"].createElement(_VideoRender["default"], (0, _extends2["default"])({
+  }, playInModal ? /*#__PURE__*/_react["default"].createElement(_VideoModal["default"], (0, _extends2["default"])({
     url: url,
     modifier: modifier,
     autoplay: autoplay,
-    provider: provider
-  }, variableProps)), (shouldDisplayCaption || shouldDisplayCredits) && /*#__PURE__*/_react["default"].createElement("div", {
+    provider: provider,
+    imageData: imageData
+  }, props)) : /*#__PURE__*/_react["default"].createElement(_VideoRender["default"], (0, _extends2["default"])({
+    url: url,
+    modifier: modifier,
+    autoplay: autoplay,
+    provider: provider,
+    imageData: imageData
+  }, props)), (shouldDisplayCaption || shouldDisplayCredits) && /*#__PURE__*/_react["default"].createElement("div", {
     className: "video__details",
     "data-testid": "video-details"
   }, shouldDisplayCaption && /*#__PURE__*/_react["default"].createElement("div", {
@@ -101,17 +120,21 @@ Video.propTypes = {
   autoplay: _propTypes["default"].bool,
   areVideoCreditsDisplayed: _propTypes["default"].bool,
   isCaptionDisplayed: _propTypes["default"].bool,
-  provider: _propTypes["default"].string
+  provider: _propTypes["default"].string,
+  playInModal: _propTypes["default"].bool,
+  imageId: _propTypes["default"].string
 };
 Video.defaultProps = {
   caption: '',
   credits: '',
   modifier: '',
-  autoplay: false,
+  imageId: '',
   url: '',
   provider: 'youtube',
+  autoplay: false,
   isCaptionDisplayed: false,
-  areVideoCreditsDisplayed: false
+  areVideoCreditsDisplayed: false,
+  playInModal: false
 };
 var _default = Video;
 exports["default"] = _default;

package/lib/components/Video/Video.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Video/Video.js"],"names":["Video","url","modifier","autoplay","isCaptionDisplayed","caption","credits","areVideoCreditsDisplayed","provider","variableProps","modifiers","toLowerCase","shouldDisplayCaption","isDisplayed","value","shouldDisplayCredits","propTypes","PropTypes","string","bool","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAUR;AAAA,MATJC,GASI,QATJA,GASI;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,MAPJC,QAOI,QAPJA,QAOI;AAAA,MANJC,kBAMI,QANJA,kBAMI;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAJJC,OAII,QAJJA,OAII;AAAA,MAHJC,wBAGI,QAHJA,wBAGI;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADDC,aACC;AACJ,MAAI,CAACR,GAAL,EAAU,OAAO,IAAP;AAEV,MAAMS,SAAS,oBAAaF,QAAQ,CAACG,WAAT,EAAb,cAAuC,mCAAkB,OAAlB;AACpDT,IAAAA,QAAQ,EAARA;AADoD,KAEjDO,aAFiD,EAAvC,CAAf;AAKA,MAAMG,oBAAoB,GAAG,iCAAmB;AAC9CC,IAAAA,WAAW,EAAET,kBADiC;AAE9CU,IAAAA,KAAK,EAAET;AAFuC,GAAnB,CAA7B;AAIA,MAAMU,oBAAoB,GAAG,iCAAmB;AAC9CF,IAAAA,WAAW,EAAEN,wBADiC;AAE9CO,IAAAA,KAAK,EAAER;AAFuC,GAAnB,CAA7B;AAKA,sBACE,gCAAC,mBAAD;AAAS,IAAA,SAAS,EAAC,OAAnB;AAA2B,IAAA,SAAS,EAAEI;AAAtC,kBACE,gCAAC,uBAAD;AACE,IAAA,GAAG,EAAET,GADP;AAEE,IAAA,QAAQ,EAAEC,QAFZ;AAGE,IAAA,QAAQ,EAAEC,QAHZ;AAIE,IAAA,QAAQ,EAAEK;AAJZ,KAKMC,aALN,EADF,EAQG,CAACG,oBAAoB,IAAIG,oBAAzB,kBACC;AAAK,IAAA,SAAS,EAAC,gBAAf;AAAgC,mBAAY;AAA5C,KACGH,oBAAoB,iBAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAA0BP,OAA1B,CAD3B,EAEGU,oBAAoB,iBAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAA0BT,OAA1B,CAF3B,CATJ,CADF;AAiBD,CA5CD;;AA8CAN,KAAK,CAACgB,SAAN,GAAkB;AAChBf,EAAAA,GAAG,EAAEgB,sBAAUC,MADC;AAEhBhB,EAAAA,QAAQ,EAAEe,sBAAUC,MAFJ;AAGhBb,EAAAA,OAAO,EAAEY,sBAAUC,MAHH;AAIhBZ,EAAAA,OAAO,EAAEW,sBAAUC,MAJH;AAKhBf,EAAAA,QAAQ,EAAEc,sBAAUE,IALJ;AAMhBZ,EAAAA,wBAAwB,EAAEU,sBAAUE,IANpB;AAOhBf,EAAAA,kBAAkB,EAAEa,sBAAUE,IAPd;AAQhBX,EAAAA,QAAQ,EAAES,sBAAUC;AARJ,CAAlB;AAWAlB,KAAK,CAACoB,YAAN,GAAqB;AACnBf,EAAAA,OAAO,EAAE,EADU;AAEnBC,EAAAA,OAAO,EAAE,EAFU;AAGnBJ,EAAAA,QAAQ,EAAE,EAHS;AAInBC,EAAAA,QAAQ,EAAE,KAJS;AAKnBF,EAAAA,GAAG,EAAE,EALc;AAMnBO,EAAAA,QAAQ,EAAE,SANS;AAOnBJ,EAAAA,kBAAkB,EAAE,KAPD;AAQnBG,EAAAA,wBAAwB,EAAE;AARP,CAArB;eAWeP,K","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport VideoRender from './VideoRender';\nimport Wrapper from '../Wrapper';\nimport getClassModifiers from '../../utils/get-class-modifiers';\nimport { shouldShowProperty } from '../../helpers';\n\nconst Video = ({\n  url,\n  modifier,\n  autoplay,\n  isCaptionDisplayed,\n  caption,\n  credits,\n  areVideoCreditsDisplayed,\n  provider,\n  ...variableProps\n}) => {\n  if (!url) return null;\n\n  const modifiers = `video--${provider.toLowerCase()} ${getClassModifiers('video', {\n    modifier,\n    ...variableProps\n  })}`;\n\n  const shouldDisplayCaption = shouldShowProperty({\n    isDisplayed: isCaptionDisplayed,\n    value: caption\n  });\n  const shouldDisplayCredits = shouldShowProperty({\n    isDisplayed: areVideoCreditsDisplayed,\n    value: credits\n  });\n\n  return (\n    <Wrapper className=\"video\" modifiers={modifiers}>\n      <VideoRender\n        url={url}\n        modifier={modifier}\n        autoplay={autoplay}\n        provider={provider}\n        {...variableProps}\n      />\n      {(shouldDisplayCaption || shouldDisplayCredits) && (\n        <div className=\"video__details\" data-testid=\"video-details\">\n          {shouldDisplayCaption && <div className=\"caption\">{caption}</div>}\n          {shouldDisplayCredits && <div className=\"credits\">{credits}</div>}\n        </div>\n      )}\n    </Wrapper>\n  );\n};\n\nVideo.propTypes = {\n  url: PropTypes.string,\n  modifier: PropTypes.string,\n  caption: PropTypes.string,\n  credits: PropTypes.string,\n  autoplay: PropTypes.bool,\n  areVideoCreditsDisplayed: PropTypes.bool,\n  isCaptionDisplayed: PropTypes.bool,\n  provider: PropTypes.string\n};\n\nVideo.defaultProps = {\n  caption: '',\n  credits: '',\n  modifier: '',\n  autoplay: false,\n  url: '',\n  provider: 'youtube',\n  isCaptionDisplayed: false,\n  areVideoCreditsDisplayed: false\n};\n\nexport default Video;\n"],"file":"Video.js"}
+{"version":3,"sources":["../../../src/components/Video/Video.js"],"names":["Video","url","modifier","autoplay","isCaptionDisplayed","caption","credits","areVideoCreditsDisplayed","provider","playInModal","imageId","props","imageData","data","getFile","loading","modifiers","toLowerCase","shouldDisplayCaption","isDisplayed","value","shouldDisplayCredits","propTypes","PropTypes","string","bool","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAYR;AAAA,MAXJC,GAWI,QAXJA,GAWI;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,QASI,QATJA,QASI;AAAA,MARJC,kBAQI,QARJA,kBAQI;AAAA,MAPJC,OAOI,QAPJA,OAOI;AAAA,MANJC,OAMI,QANJA,OAMI;AAAA,MALJC,wBAKI,QALJA,wBAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,WAGI,QAHJA,WAGI;AAAA,MAFJC,OAEI,QAFJA,OAEI;AAAA,MADDC,KACC;;AACJ,sBAGI,+BAAaD,OAAb,CAHJ;AAAA,MACmBE,SADnB,iBACEC,IADF,CACUC,OADV;AAAA,MAEEC,OAFF,iBAEEA,OAFF;;AAKA,MAAIA,OAAJ,EAAa,OAAO,EAAP;AACb,MAAI,CAACd,GAAL,EAAU,OAAO,IAAP;AAEV,MAAMe,SAAS,oBAAaR,QAAQ,CAACS,WAAT,EAAb,cAAuC,mCAAkB,OAAlB;AACpDf,IAAAA,QAAQ,EAARA;AADoD,KAEjDS,KAFiD,EAAvC,CAAf;AAKA,MAAMO,oBAAoB,GAAG,iCAAmB;AAC9CC,IAAAA,WAAW,EAAEf,kBADiC;AAE9CgB,IAAAA,KAAK,EAAEf;AAFuC,GAAnB,CAA7B;AAIA,MAAMgB,oBAAoB,GAAG,iCAAmB;AAC9CF,IAAAA,WAAW,EAAEZ,wBADiC;AAE9Ca,IAAAA,KAAK,EAAEd;AAFuC,GAAnB,CAA7B;AAKA,sBACE,gCAAC,mBAAD;AAAS,IAAA,SAAS,EAAC,OAAnB;AAA2B,IAAA,SAAS,EAAEU;AAAtC,KACGP,WAAW,gBACV,gCAAC,sBAAD;AACE,IAAA,GAAG,EAAER,GADP;AAEE,IAAA,QAAQ,EAAEC,QAFZ;AAGE,IAAA,QAAQ,EAAEC,QAHZ;AAIE,IAAA,QAAQ,EAAEK,QAJZ;AAKE,IAAA,SAAS,EAAEI;AALb,KAMMD,KANN,EADU,gBAUV,gCAAC,uBAAD;AACE,IAAA,GAAG,EAAEV,GADP;AAEE,IAAA,QAAQ,EAAEC,QAFZ;AAGE,IAAA,QAAQ,EAAEC,QAHZ;AAIE,IAAA,QAAQ,EAAEK,QAJZ;AAKE,IAAA,SAAS,EAAEI;AALb,KAMMD,KANN,EAXJ,EAqBG,CAACO,oBAAoB,IAAIG,oBAAzB,kBACC;AAAK,IAAA,SAAS,EAAC,gBAAf;AAAgC,mBAAY;AAA5C,KACGH,oBAAoB,iBAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAA0Bb,OAA1B,CAD3B,EAEGgB,oBAAoB,iBAAI;AAAK,IAAA,SAAS,EAAC;AAAf,KAA0Bf,OAA1B,CAF3B,CAtBJ,CADF;AA8BD,CAjED;;AAmEAN,KAAK,CAACsB,SAAN,GAAkB;AAChBrB,EAAAA,GAAG,EAAEsB,sBAAUC,MADC;AAEhBtB,EAAAA,QAAQ,EAAEqB,sBAAUC,MAFJ;AAGhBnB,EAAAA,OAAO,EAAEkB,sBAAUC,MAHH;AAIhBlB,EAAAA,OAAO,EAAEiB,sBAAUC,MAJH;AAKhBrB,EAAAA,QAAQ,EAAEoB,sBAAUE,IALJ;AAMhBlB,EAAAA,wBAAwB,EAAEgB,sBAAUE,IANpB;AAOhBrB,EAAAA,kBAAkB,EAAEmB,sBAAUE,IAPd;AAQhBjB,EAAAA,QAAQ,EAAEe,sBAAUC,MARJ;AAShBf,EAAAA,WAAW,EAAEc,sBAAUE,IATP;AAUhBf,EAAAA,OAAO,EAAEa,sBAAUC;AAVH,CAAlB;AAaAxB,KAAK,CAAC0B,YAAN,GAAqB;AACnBrB,EAAAA,OAAO,EAAE,EADU;AAEnBC,EAAAA,OAAO,EAAE,EAFU;AAGnBJ,EAAAA,QAAQ,EAAE,EAHS;AAInBQ,EAAAA,OAAO,EAAE,EAJU;AAKnBT,EAAAA,GAAG,EAAE,EALc;AAMnBO,EAAAA,QAAQ,EAAE,SANS;AAOnBL,EAAAA,QAAQ,EAAE,KAPS;AAQnBC,EAAAA,kBAAkB,EAAE,KARD;AASnBG,EAAAA,wBAAwB,EAAE,KATP;AAUnBE,EAAAA,WAAW,EAAE;AAVM,CAArB;eAaeT,K","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport useGetImages from '../../hooks/use-get-images';\nimport VideoRender from './VideoRender';\nimport VideoModal from './VideoModal';\nimport Wrapper from '../Wrapper';\nimport getClassModifiers from '../../utils/get-class-modifiers';\nimport { shouldShowProperty } from '../../helpers';\n\nconst Video = ({\n  url,\n  modifier,\n  autoplay,\n  isCaptionDisplayed,\n  caption,\n  credits,\n  areVideoCreditsDisplayed,\n  provider,\n  playInModal,\n  imageId,\n  ...props\n}) => {\n  const {\n    data: { getFile: imageData },\n    loading\n  } = useGetImages(imageId);\n\n  if (loading) return '';\n  if (!url) return null;\n\n  const modifiers = `video--${provider.toLowerCase()} ${getClassModifiers('video', {\n    modifier,\n    ...props\n  })}`;\n\n  const shouldDisplayCaption = shouldShowProperty({\n    isDisplayed: isCaptionDisplayed,\n    value: caption\n  });\n  const shouldDisplayCredits = shouldShowProperty({\n    isDisplayed: areVideoCreditsDisplayed,\n    value: credits\n  });\n\n  return (\n    <Wrapper className=\"video\" modifiers={modifiers}>\n      {playInModal ? (\n        <VideoModal\n          url={url}\n          modifier={modifier}\n          autoplay={autoplay}\n          provider={provider}\n          imageData={imageData}\n          {...props}\n        />\n      ) : (\n        <VideoRender\n          url={url}\n          modifier={modifier}\n          autoplay={autoplay}\n          provider={provider}\n          imageData={imageData}\n          {...props}\n        />\n      )}\n\n      {(shouldDisplayCaption || shouldDisplayCredits) && (\n        <div className=\"video__details\" data-testid=\"video-details\">\n          {shouldDisplayCaption && <div className=\"caption\">{caption}</div>}\n          {shouldDisplayCredits && <div className=\"credits\">{credits}</div>}\n        </div>\n      )}\n    </Wrapper>\n  );\n};\n\nVideo.propTypes = {\n  url: PropTypes.string,\n  modifier: PropTypes.string,\n  caption: PropTypes.string,\n  credits: PropTypes.string,\n  autoplay: PropTypes.bool,\n  areVideoCreditsDisplayed: PropTypes.bool,\n  isCaptionDisplayed: PropTypes.bool,\n  provider: PropTypes.string,\n  playInModal: PropTypes.bool,\n  imageId: PropTypes.string\n};\n\nVideo.defaultProps = {\n  caption: '',\n  credits: '',\n  modifier: '',\n  imageId: '',\n  url: '',\n  provider: 'youtube',\n  autoplay: false,\n  isCaptionDisplayed: false,\n  areVideoCreditsDisplayed: false,\n  playInModal: false\n};\n\nexport default Video;\n"],"file":"Video.js"}

package/lib/components/Video/VideoModal.js

@@ -0,0 +1,72 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _modal = _interopRequireDefault(require("@blaze-react/modal"));
+
+var _VideoRender = _interopRequireDefault(require("./VideoRender"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var VideoModal = function VideoModal(_ref) {
+  var props = (0, _extends2["default"])({}, _ref);
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      displayModal = _useState2[0],
+      setDisplayModal = _useState2[1];
+
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+    role: "button",
+    onClick: function onClick() {
+      setDisplayModal(!displayModal);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_VideoRender["default"], (0, _extends2["default"])({
+    placeholderOnly: true,
+    autoplay: false
+  }, props))), displayModal && /*#__PURE__*/_react["default"].createElement(_modal["default"], {
+    className: "modal--video",
+    isFullScreen: true,
+    showFooter: false,
+    isSimple: true,
+    onClose: function onClose() {
+      return setDisplayModal(!displayModal);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_VideoRender["default"], (0, _extends2["default"])({}, props, {
+    placeholderOnly: false,
+    autoplay: true
+  }))));
+};
+
+var _default = VideoModal;
+exports["default"] = _default;
+//# sourceMappingURL=VideoModal.js.map

package/lib/components/Video/VideoModal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Video/VideoModal.js"],"names":["VideoModal","props","displayModal","setDisplayModal"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;AAEA,IAAMA,UAAU,GAAG,SAAbA,UAAa,OAAkB;AAAA,MAAZC,KAAY;;AACnC,kBAAwC,qBAAS,KAAT,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;;AAEA,sBACE,+EACE;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,OAAO,EAAE,mBAAM;AACbA,MAAAA,eAAe,CAAC,CAACD,YAAF,CAAf;AACD;AAJH,kBAKE,gCAAC,uBAAD;AAAa,IAAA,eAAe,MAA5B;AAA6B,IAAA,QAAQ,EAAE;AAAvC,KAAkDD,KAAlD,EALF,CADF,EAQGC,YAAY,iBACX,gCAAC,iBAAD;AACE,IAAA,SAAS,EAAC,cADZ;AAEE,IAAA,YAAY,MAFd;AAGE,IAAA,UAAU,EAAE,KAHd;AAIE,IAAA,QAAQ,MAJV;AAKE,IAAA,OAAO,EAAE;AAAA,aAAMC,eAAe,CAAC,CAACD,YAAF,CAArB;AAAA;AALX,kBAME,gCAAC,uBAAD,gCAAiBD,KAAjB;AAAwB,IAAA,eAAe,EAAE,KAAzC;AAAgD,IAAA,QAAQ;AAAxD,KANF,CATJ,CADF;AAqBD,CAxBD;;eA0BeD,U","sourcesContent":["import React, { useState } from 'react';\nimport Modal from '@blaze-react/modal';\nimport VideoRender from './VideoRender';\n\nconst VideoModal = ({ ...props }) => {\n  const [displayModal, setDisplayModal] = useState(false);\n\n  return (\n    <>\n      <div\n        role=\"button\"\n        onClick={() => {\n          setDisplayModal(!displayModal);\n        }}>\n        <VideoRender placeholderOnly autoplay={false} {...props} />\n      </div>\n      {displayModal && (\n        <Modal\n          className=\"modal--video\"\n          isFullScreen\n          showFooter={false}\n          isSimple\n          onClose={() => setDisplayModal(!displayModal)}>\n          <VideoRender {...props} placeholderOnly={false} autoplay />\n        </Modal>\n      )}\n    </>\n  );\n};\n\nexport default VideoModal;\n"],"file":"VideoModal.js"}

package/lib/components/Video/VideoRender.js

@@ -23,9 +23,9 @@ var _excluded = ["provider"];
 
 var VideoRender = function VideoRender(_ref) {
   var provider = _ref.provider,
-      varibleProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   var Provider = (0, _providers["default"])(provider);
-  return /*#__PURE__*/_react["default"].createElement(Provider, varibleProps);
+  return /*#__PURE__*/_react["default"].createElement(Provider, props);
 };
 
 VideoRender.propTypes = {

package/lib/components/Video/VideoRender.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Video/VideoRender.js"],"names":["VideoRender","provider","varibleProps","Provider","propTypes","PropTypes","string","isRequired"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,OAAmC;AAAA,MAAhCC,QAAgC,QAAhCA,QAAgC;AAAA,MAAnBC,YAAmB;AACrD,MAAMC,QAAQ,GAAG,2BAAYF,QAAZ,CAAjB;AACA,sBAAO,gCAAC,QAAD,EAAcC,YAAd,CAAP;AACD,CAHD;;AAKAF,WAAW,CAACI,SAAZ,GAAwB;AACtBH,EAAAA,QAAQ,EAAEI,sBAAUC,MAAV,CAAiBC;AADL,CAAxB;;eAIe,oBAAUP,WAAV,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport getProvider from './providers';\nimport { withTitle } from '../../HOC';\n\nconst VideoRender = ({ provider, ...varibleProps }) => {\n  const Provider = getProvider(provider);\n  return <Provider {...varibleProps} />;\n};\n\nVideoRender.propTypes = {\n  provider: PropTypes.string.isRequired\n};\n\nexport default withTitle(VideoRender);\n"],"file":"VideoRender.js"}
+{"version":3,"sources":["../../../src/components/Video/VideoRender.js"],"names":["VideoRender","provider","props","Provider","propTypes","PropTypes","string","isRequired"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,OAA4B;AAAA,MAAzBC,QAAyB,QAAzBA,QAAyB;AAAA,MAAZC,KAAY;AAC9C,MAAMC,QAAQ,GAAG,2BAAYF,QAAZ,CAAjB;AACA,sBAAO,gCAAC,QAAD,EAAcC,KAAd,CAAP;AACD,CAHD;;AAKAF,WAAW,CAACI,SAAZ,GAAwB;AACtBH,EAAAA,QAAQ,EAAEI,sBAAUC,MAAV,CAAiBC;AADL,CAAxB;;eAIe,oBAAUP,WAAV,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport getProvider from './providers';\nimport { withTitle } from '../../HOC';\n\nconst VideoRender = ({ provider, ...props }) => {\n  const Provider = getProvider(provider);\n  return <Provider {...props} />;\n};\n\nVideoRender.propTypes = {\n  provider: PropTypes.string.isRequired\n};\n\nexport default withTitle(VideoRender);\n"],"file":"VideoRender.js"}

package/lib/components/Video/providers/JWPlayer/JWPlayerProvider.js

@@ -37,8 +37,6 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _reactJwPlayer = _interopRequireDefault(require("react-jw-player"));
 
-var _useGetImages2 = _interopRequireDefault(require("../../../../hooks/use-get-images"));
-
 var _constants = require("../../../../constants");
 
 var _JWPlayerController = _interopRequireDefault(require("./JWPlayerController"));
@@ -57,15 +55,9 @@ var JWPlayerProvider = function JWPlayerProvider(_ref) {
       type = _ref.type,
       urlScript = _ref.urlScript,
       muted = _ref.muted,
-      imageId = _ref.imageId,
+      imageData = _ref.imageData,
       repeat = _ref.loop;
 
-  var _useGetImages = (0, _useGetImages2["default"])(imageId),
-      data = _useGetImages.data,
-      loading = _useGetImages.loading;
-
-  if (loading) return null;
-
   var handleOnReady = function handleOnReady() {
     var jwPlayer = window.jwplayer(name);
 
@@ -91,10 +83,8 @@ var JWPlayerProvider = function JWPlayerProvider(_ref) {
     };
 
     if (type === _constants.JW_PLAYER_TYPE_FILE) {
-      var _ref2 = data.getFile || {},
-          _ref2$url = _ref2.url,
-          imageURL = _ref2$url === void 0 ? '' : _ref2$url;
-
+      var _imageData$url = imageData.url,
+          imageURL = _imageData$url === void 0 ? '' : _imageData$url;
       return _objectSpread(_objectSpread({}, props), {}, {
         image: imageURL,
         file: url
@@ -118,7 +108,8 @@ JWPlayerProvider.propTypes = {
   loop: _propTypes["default"].bool,
   controls: _propTypes["default"].bool,
   muted: _propTypes["default"].bool,
-  type: _propTypes["default"].string
+  type: _propTypes["default"].string,
+  imageData: _propTypes["default"].object
 };
 JWPlayerProvider.defaultProps = {
   autoplay: false,
@@ -126,7 +117,8 @@ JWPlayerProvider.defaultProps = {
   controls: true,
   muted: false,
   type: 'playlist',
-  imageId: null
+  imageId: null,
+  imageData: {}
 };
 var _default = JWPlayerProvider;
 exports["default"] = _default;

package/lib/components/Video/providers/JWPlayer/JWPlayerProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Video/providers/JWPlayer/JWPlayerProvider.js"],"names":["PlayerController","JWPlayerController","JWPlayerProvider","url","name","autoplay","controls","type","urlScript","muted","imageId","repeat","loop","data","loading","handleOnReady","jwPlayer","window","jwplayer","setPlayer","getJWPlayerProps","events","props","customProps","playerScript","isAutoPlay","isMuted","playerId","onReady","className","VIDEO_WRAPPER_CLASS_NAME","JW_PLAYER_TYPE_FILE","getFile","imageURL","image","file","playlist","propTypes","PropTypes","string","isRequired","bool","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ReactJWPlayer from 'react-jw-player';\nimport useGetImages from '../../../../hooks/use-get-images';\nimport { JW_PLAYER_TYPE_FILE, VIDEO_WRAPPER_CLASS_NAME } from '../../../../constants';\nimport JWPlayerController from './JWPlayerController';\n\nconst PlayerController = new JWPlayerController();\n\nconst JWPlayerProvider = ({\n  url,\n  name,\n  autoplay,\n  controls,\n  type,\n  urlScript,\n  muted,\n  imageId,\n  loop: repeat\n}) => {\n  const { data, loading } = useGetImages(imageId);\n\n  if (loading) return null;\n\n  const handleOnReady = () => {\n    const jwPlayer = window.jwplayer(name);\n    if (jwPlayer) {\n      PlayerController.setPlayer(jwPlayer);\n    }\n  };\n\n  const getJWPlayerProps = () => {\n    const { events } = PlayerController;\n\n    const props = {\n      customProps: { repeat, controls, events },\n      playerScript: urlScript,\n      isAutoPlay: autoplay,\n      isMuted: muted,\n      playerId: name,\n      onReady: handleOnReady,\n      className: VIDEO_WRAPPER_CLASS_NAME\n    };\n\n    if (type === JW_PLAYER_TYPE_FILE) {\n      const { url: imageURL = '' } = data.getFile || {};\n      return { ...props, image: imageURL, file: url };\n    }\n\n    return { ...props, playlist: url };\n  };\n\n  return <ReactJWPlayer {...getJWPlayerProps()} />;\n};\n\nJWPlayerProvider.propTypes = {\n  url: PropTypes.string.isRequired,\n  name: PropTypes.string.isRequired,\n  urlScript: PropTypes.string.isRequired,\n  imageId: PropTypes.string,\n  autoplay: PropTypes.bool,\n  loop: PropTypes.bool,\n  controls: PropTypes.bool,\n  muted: PropTypes.bool,\n  type: PropTypes.string\n};\n\nJWPlayerProvider.defaultProps = {\n  autoplay: false,\n  loop: false,\n  controls: true,\n  muted: false,\n  type: 'playlist',\n  imageId: null\n};\n\nexport default JWPlayerProvider;\n"],"file":"JWPlayerProvider.js"}
+{"version":3,"sources":["../../../../../src/components/Video/providers/JWPlayer/JWPlayerProvider.js"],"names":["PlayerController","JWPlayerController","JWPlayerProvider","url","name","autoplay","controls","type","urlScript","muted","imageData","repeat","loop","handleOnReady","jwPlayer","window","jwplayer","setPlayer","getJWPlayerProps","events","props","customProps","playerScript","isAutoPlay","isMuted","playerId","onReady","className","VIDEO_WRAPPER_CLASS_NAME","JW_PLAYER_TYPE_FILE","imageURL","image","file","playlist","propTypes","PropTypes","string","isRequired","imageId","bool","object","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,gBAAgB,GAAG,IAAIC,8BAAJ,EAAzB;;AAEA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,OAUnB;AAAA,MATJC,GASI,QATJA,GASI;AAAA,MARJC,IAQI,QARJA,IAQI;AAAA,MAPJC,QAOI,QAPJA,QAOI;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,IAKI,QALJA,IAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,KAGI,QAHJA,KAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADEC,MACF,QADJC,IACI;;AACJ,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,GAAM;AAC1B,QAAMC,QAAQ,GAAGC,MAAM,CAACC,QAAP,CAAgBZ,IAAhB,CAAjB;;AACA,QAAIU,QAAJ,EAAc;AACZd,MAAAA,gBAAgB,CAACiB,SAAjB,CAA2BH,QAA3B;AACD;AACF,GALD;;AAOA,MAAMI,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AAC7B,QAAQC,MAAR,GAAmBnB,gBAAnB,CAAQmB,MAAR;AAEA,QAAMC,KAAK,GAAG;AACZC,MAAAA,WAAW,EAAE;AAAEV,QAAAA,MAAM,EAANA,MAAF;AAAUL,QAAAA,QAAQ,EAARA,QAAV;AAAoBa,QAAAA,MAAM,EAANA;AAApB,OADD;AAEZG,MAAAA,YAAY,EAAEd,SAFF;AAGZe,MAAAA,UAAU,EAAElB,QAHA;AAIZmB,MAAAA,OAAO,EAAEf,KAJG;AAKZgB,MAAAA,QAAQ,EAAErB,IALE;AAMZsB,MAAAA,OAAO,EAAEb,aANG;AAOZc,MAAAA,SAAS,EAAEC;AAPC,KAAd;;AAUA,QAAIrB,IAAI,KAAKsB,8BAAb,EAAkC;AAChC,2BAA+BnB,SAA/B,CAAQP,GAAR;AAAA,UAAa2B,QAAb,+BAAwB,EAAxB;AACA,6CAAYV,KAAZ;AAAmBW,QAAAA,KAAK,EAAED,QAA1B;AAAoCE,QAAAA,IAAI,EAAE7B;AAA1C;AACD;;AAED,2CAAYiB,KAAZ;AAAmBa,MAAAA,QAAQ,EAAE9B;AAA7B;AACD,GAnBD;;AAqBA,sBAAO,gCAAC,yBAAD,EAAmBe,gBAAgB,EAAnC,CAAP;AACD,CAxCD;;AA0CAhB,gBAAgB,CAACgC,SAAjB,GAA6B;AAC3B/B,EAAAA,GAAG,EAAEgC,sBAAUC,MAAV,CAAiBC,UADK;AAE3BjC,EAAAA,IAAI,EAAE+B,sBAAUC,MAAV,CAAiBC,UAFI;AAG3B7B,EAAAA,SAAS,EAAE2B,sBAAUC,MAAV,CAAiBC,UAHD;AAI3BC,EAAAA,OAAO,EAAEH,sBAAUC,MAJQ;AAK3B/B,EAAAA,QAAQ,EAAE8B,sBAAUI,IALO;AAM3B3B,EAAAA,IAAI,EAAEuB,sBAAUI,IANW;AAO3BjC,EAAAA,QAAQ,EAAE6B,sBAAUI,IAPO;AAQ3B9B,EAAAA,KAAK,EAAE0B,sBAAUI,IARU;AAS3BhC,EAAAA,IAAI,EAAE4B,sBAAUC,MATW;AAU3B1B,EAAAA,SAAS,EAAEyB,sBAAUK;AAVM,CAA7B;AAaAtC,gBAAgB,CAACuC,YAAjB,GAAgC;AAC9BpC,EAAAA,QAAQ,EAAE,KADoB;AAE9BO,EAAAA,IAAI,EAAE,KAFwB;AAG9BN,EAAAA,QAAQ,EAAE,IAHoB;AAI9BG,EAAAA,KAAK,EAAE,KAJuB;AAK9BF,EAAAA,IAAI,EAAE,UALwB;AAM9B+B,EAAAA,OAAO,EAAE,IANqB;AAO9B5B,EAAAA,SAAS,EAAE;AAPmB,CAAhC;eAUeR,gB","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ReactJWPlayer from 'react-jw-player';\nimport { JW_PLAYER_TYPE_FILE, VIDEO_WRAPPER_CLASS_NAME } from '../../../../constants';\nimport JWPlayerController from './JWPlayerController';\n\nconst PlayerController = new JWPlayerController();\n\nconst JWPlayerProvider = ({\n  url,\n  name,\n  autoplay,\n  controls,\n  type,\n  urlScript,\n  muted,\n  imageData,\n  loop: repeat\n}) => {\n  const handleOnReady = () => {\n    const jwPlayer = window.jwplayer(name);\n    if (jwPlayer) {\n      PlayerController.setPlayer(jwPlayer);\n    }\n  };\n\n  const getJWPlayerProps = () => {\n    const { events } = PlayerController;\n\n    const props = {\n      customProps: { repeat, controls, events },\n      playerScript: urlScript,\n      isAutoPlay: autoplay,\n      isMuted: muted,\n      playerId: name,\n      onReady: handleOnReady,\n      className: VIDEO_WRAPPER_CLASS_NAME\n    };\n\n    if (type === JW_PLAYER_TYPE_FILE) {\n      const { url: imageURL = '' } = imageData;\n      return { ...props, image: imageURL, file: url };\n    }\n\n    return { ...props, playlist: url };\n  };\n\n  return <ReactJWPlayer {...getJWPlayerProps()} />;\n};\n\nJWPlayerProvider.propTypes = {\n  url: PropTypes.string.isRequired,\n  name: PropTypes.string.isRequired,\n  urlScript: PropTypes.string.isRequired,\n  imageId: PropTypes.string,\n  autoplay: PropTypes.bool,\n  loop: PropTypes.bool,\n  controls: PropTypes.bool,\n  muted: PropTypes.bool,\n  type: PropTypes.string,\n  imageData: PropTypes.object\n};\n\nJWPlayerProvider.defaultProps = {\n  autoplay: false,\n  loop: false,\n  controls: true,\n  muted: false,\n  type: 'playlist',\n  imageId: null,\n  imageData: {}\n};\n\nexport default JWPlayerProvider;\n"],"file":"JWPlayerProvider.js"}

package/lib/components/Video/providers/YouTube/YouTubeProvider.js

@@ -22,7 +22,9 @@ var _constants = require("../../../../constants");
 var YouTubeProvider = function YouTubeProvider(_ref) {
   var url = _ref.url,
       autoplay = _ref.autoplay,
-      loop = _ref.loop;
+      loop = _ref.loop,
+      placeholderOnly = _ref.placeholderOnly,
+      imageData = _ref.imageData;
   var videoId = (0, _helpers.getYouTubeID)(url);
   if (!videoId) return null;
   var params = "loop=".concat((0, _helpers.booleanToNumber)(loop));
@@ -31,18 +33,24 @@ var YouTubeProvider = function YouTubeProvider(_ref) {
   }, /*#__PURE__*/_react["default"].createElement(_YoutubeEmbeded["default"], {
     autoplay: autoplay,
     videoId: videoId,
-    params: params
+    params: params,
+    placeholderOnly: placeholderOnly,
+    imageData: imageData
   }));
 };
 
 YouTubeProvider.propTypes = {
   url: _propTypes["default"].string.isRequired,
   autoplay: _propTypes["default"].bool,
-  loop: _propTypes["default"].bool
+  loop: _propTypes["default"].bool,
+  placeholderOnly: _propTypes["default"].bool,
+  imageData: _propTypes["default"].object
 };
 YouTubeProvider.defaultProps = {
   autoplay: false,
-  loop: false
+  loop: false,
+  placeholderOnly: false,
+  imageData: {}
 };
 var _default = YouTubeProvider;
 exports["default"] = _default;

package/lib/components/Video/providers/YouTube/YouTubeProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Video/providers/YouTube/YouTubeProvider.js"],"names":["YouTubeProvider","url","autoplay","loop","videoId","params","VIDEO_WRAPPER_CLASS_NAME","propTypes","PropTypes","string","isRequired","bool","defaultProps"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,OAA6B;AAAA,MAA1BC,GAA0B,QAA1BA,GAA0B;AAAA,MAArBC,QAAqB,QAArBA,QAAqB;AAAA,MAAXC,IAAW,QAAXA,IAAW;AACnD,MAAMC,OAAO,GAAG,2BAAaH,GAAb,CAAhB;AAEA,MAAI,CAACG,OAAL,EAAc,OAAO,IAAP;AACd,MAAMC,MAAM,kBAAW,8BAAgBF,IAAhB,CAAX,CAAZ;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEG;AAAhB,kBACE,gCAAC,0BAAD;AAAgB,IAAA,QAAQ,EAAEJ,QAA1B;AAAoC,IAAA,OAAO,EAAEE,OAA7C;AAAsD,IAAA,MAAM,EAAEC;AAA9D,IADF,CADF;AAKD,CAXD;;AAaAL,eAAe,CAACO,SAAhB,GAA4B;AAC1BN,EAAAA,GAAG,EAAEO,sBAAUC,MAAV,CAAiBC,UADI;AAE1BR,EAAAA,QAAQ,EAAEM,sBAAUG,IAFM;AAG1BR,EAAAA,IAAI,EAAEK,sBAAUG;AAHU,CAA5B;AAMAX,eAAe,CAACY,YAAhB,GAA+B;AAC7BV,EAAAA,QAAQ,EAAE,KADmB;AAE7BC,EAAAA,IAAI,EAAE;AAFuB,CAA/B;eAKeH,e","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport YoutubeEmbeded from './YoutubeEmbeded';\nimport { getYouTubeID, booleanToNumber } from './helpers';\nimport { VIDEO_WRAPPER_CLASS_NAME } from '../../../../constants';\n\nconst YouTubeProvider = ({ url, autoplay, loop }) => {\n  const videoId = getYouTubeID(url);\n\n  if (!videoId) return null;\n  const params = `loop=${booleanToNumber(loop)}`;\n\n  return (\n    <div className={VIDEO_WRAPPER_CLASS_NAME}>\n      <YoutubeEmbeded autoplay={autoplay} videoId={videoId} params={params} />\n    </div>\n  );\n};\n\nYouTubeProvider.propTypes = {\n  url: PropTypes.string.isRequired,\n  autoplay: PropTypes.bool,\n  loop: PropTypes.bool\n};\n\nYouTubeProvider.defaultProps = {\n  autoplay: false,\n  loop: false\n};\n\nexport default YouTubeProvider;\n"],"file":"YouTubeProvider.js"}
+{"version":3,"sources":["../../../../../src/components/Video/providers/YouTube/YouTubeProvider.js"],"names":["YouTubeProvider","url","autoplay","loop","placeholderOnly","imageData","videoId","params","VIDEO_WRAPPER_CLASS_NAME","propTypes","PropTypes","string","isRequired","bool","object","defaultProps"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,OAAyD;AAAA,MAAtDC,GAAsD,QAAtDA,GAAsD;AAAA,MAAjDC,QAAiD,QAAjDA,QAAiD;AAAA,MAAvCC,IAAuC,QAAvCA,IAAuC;AAAA,MAAjCC,eAAiC,QAAjCA,eAAiC;AAAA,MAAhBC,SAAgB,QAAhBA,SAAgB;AAC/E,MAAMC,OAAO,GAAG,2BAAaL,GAAb,CAAhB;AAEA,MAAI,CAACK,OAAL,EAAc,OAAO,IAAP;AACd,MAAMC,MAAM,kBAAW,8BAAgBJ,IAAhB,CAAX,CAAZ;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEK;AAAhB,kBACE,gCAAC,0BAAD;AACE,IAAA,QAAQ,EAAEN,QADZ;AAEE,IAAA,OAAO,EAAEI,OAFX;AAGE,IAAA,MAAM,EAAEC,MAHV;AAIE,IAAA,eAAe,EAAEH,eAJnB;AAKE,IAAA,SAAS,EAAEC;AALb,IADF,CADF;AAWD,CAjBD;;AAmBAL,eAAe,CAACS,SAAhB,GAA4B;AAC1BR,EAAAA,GAAG,EAAES,sBAAUC,MAAV,CAAiBC,UADI;AAE1BV,EAAAA,QAAQ,EAAEQ,sBAAUG,IAFM;AAG1BV,EAAAA,IAAI,EAAEO,sBAAUG,IAHU;AAI1BT,EAAAA,eAAe,EAAEM,sBAAUG,IAJD;AAK1BR,EAAAA,SAAS,EAAEK,sBAAUI;AALK,CAA5B;AAQAd,eAAe,CAACe,YAAhB,GAA+B;AAC7Bb,EAAAA,QAAQ,EAAE,KADmB;AAE7BC,EAAAA,IAAI,EAAE,KAFuB;AAG7BC,EAAAA,eAAe,EAAE,KAHY;AAI7BC,EAAAA,SAAS,EAAE;AAJkB,CAA/B;eAOeL,e","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport YoutubeEmbeded from './YoutubeEmbeded';\nimport { getYouTubeID, booleanToNumber } from './helpers';\nimport { VIDEO_WRAPPER_CLASS_NAME } from '../../../../constants';\n\nconst YouTubeProvider = ({ url, autoplay, loop, placeholderOnly, imageData }) => {\n  const videoId = getYouTubeID(url);\n\n  if (!videoId) return null;\n  const params = `loop=${booleanToNumber(loop)}`;\n\n  return (\n    <div className={VIDEO_WRAPPER_CLASS_NAME}>\n      <YoutubeEmbeded\n        autoplay={autoplay}\n        videoId={videoId}\n        params={params}\n        placeholderOnly={placeholderOnly}\n        imageData={imageData}\n      />\n    </div>\n  );\n};\n\nYouTubeProvider.propTypes = {\n  url: PropTypes.string.isRequired,\n  autoplay: PropTypes.bool,\n  loop: PropTypes.bool,\n  placeholderOnly: PropTypes.bool,\n  imageData: PropTypes.object\n};\n\nYouTubeProvider.defaultProps = {\n  autoplay: false,\n  loop: false,\n  placeholderOnly: false,\n  imageData: {}\n};\n\nexport default YouTubeProvider;\n"],"file":"YouTubeProvider.js"}