@bigbinary/neeto-site-blocks 1.8.27 → 1.8.28

package/dist/index.cjs.js

@@ -4937,20 +4937,20 @@ var blendColors = function blendColors(_ref2) {
   // Generate the final blended color string in hex format
   return "#".concat((r << 16 | g << 8 | b).toString(16).padStart(6, "0"));
 };
-var validateUrl = function validateUrl(url) {
-  return url ? validateYouTubeUrl(url) || validateLoomUrl(url) || validateVimeoUrl(url) : false;
+var validateUrl = function validateUrl(url, autoPlay) {
+  return url ? validateYouTubeUrl(url, autoPlay) || validateLoomUrl(url, autoPlay) || validateVimeoUrl(url, autoPlay) : false;
 };
-var validateYouTubeUrl = function validateYouTubeUrl(url) {
+var validateYouTubeUrl = function validateYouTubeUrl(url, autoPlay) {
   var match = url.match(YOUTUBE_URL_REGEXP);
-  return match && "https://www.youtube.com/embed/".concat(match[5]);
+  return match && "https://www.youtube.com/embed/".concat(match[5]).concat(autoPlay ? "?autoplay=1" : "");
 };
-var validateVimeoUrl = function validateVimeoUrl(url) {
+var validateVimeoUrl = function validateVimeoUrl(url, autoPlay) {
   var match = url.match(VIMEO_URL_REGEXP);
-  return match && "https://player.vimeo.com/video/".concat(match[4], "?h=").concat(match[5]);
+  return match && "https://player.vimeo.com/video/".concat(match[4], "?h=").concat(match[5]).concat(autoPlay ? "&autoplay=1" : "");
 };
-var validateLoomUrl = function validateLoomUrl(url) {
+var validateLoomUrl = function validateLoomUrl(url, autoPlay) {
   var match = url.match(LOOM_URL_REGEXP);
-  return match && "https://www.loom.com/embed/".concat(match[4], "?t=").concat(match[5] || "");
+  return match && "https://www.loom.com/embed/".concat(match[4], "?t=").concat(match[5] || "").concat(autoPlay ? "&autoplay=1" : "");
 };
 var applyResponsiveClasses = function applyResponsiveClasses(_ref3) {
   var fieldValue = _ref3.fieldValue,
@@ -16265,7 +16265,7 @@ var useBreakpoints = function useBreakpoints(breakpointOverrides) {
 };
 var useBreakpoints$1 = useBreakpoints;
 
-var _excluded$v = ["isEmbedded", "src", "design", "videoUrl"];
+var _excluded$v = ["isEmbedded", "src", "design", "videoUrl", "autoPlay"];
 function ownKeys$i(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; }
 function _objectSpread$i(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$i(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Media = function Media(_ref) {
@@ -16273,17 +16273,21 @@ var Media = function Media(_ref) {
     src = _ref.src,
     design = _ref.design,
     videoUrl = _ref.videoUrl,
+    autoPlay = _ref.autoPlay,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$v);
   if (isEmbedded) {
     var _design$width;
-    return videoUrl && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    return videoUrl && /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "relative h-0 w-full overflow-hidden pb-[56.25%]"
+    }, /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
       allow: "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",
       as: "iframe",
+      className: "absolute left-0 top-0 h-full w-full border-0",
       design: dissoc("width", design),
       height: "300px",
-      src: validateUrl(videoUrl),
+      src: validateUrl(videoUrl, autoPlay),
       width: "".concat((_design$width = design === null || design === void 0 ? void 0 : design.width) !== null && _design$width !== void 0 ? _design$width : "100", "%")
-    });
+    }));
   }
   return /*#__PURE__*/React__default["default"].createElement(StyledImage$1, _objectSpread$i({
     design: design,
@@ -39462,15 +39466,17 @@ var Embed = function Embed(_ref) {
     enableAnimation = properties.enableAnimation;
   return /*#__PURE__*/React__default["default"].createElement(BlockWrapper, {
     className: className,
-    design: design.body,
     enableAnimation: enableAnimation,
     id: id,
-    nestedClassName: "h-full"
-  }, /*#__PURE__*/React__default["default"].createElement(Interweave, {
+    design: design.body,
+    nestedClassName: "h-full flex items-center justify-center"
+  }, neetoCist.isNotEmpty(content) ? /*#__PURE__*/React__default["default"].createElement(Interweave, {
+    content: content,
     allowList: ["iframe"],
-    className: "ns-embed-block flex h-full w-full justify-center",
-    content: content
-  }));
+    className: "ns-embed-block relative flex h-0 w-full pb-[56.25%] lg:static lg:pb-0"
+  }) : /*#__PURE__*/React__default["default"].createElement(Typography$1, {
+    className: "text-center font-semibold"
+  }, "No content to display"));
 };
 
 var _excluded$l = ["configurations", "className", "id"],
@@ -39677,6 +39683,7 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
     mediaPosition = _properties$media.position,
     isEmbedded = _properties$media.isEmbedded,
     videoUrl = _properties$media.videoUrl,
+    autoPlay = _properties$media.autoPlay,
     src = properties.backgroundImage.src;
   var mediaURL = isEmbedded ? videoUrl : imageUrl;
   var baseClasses = "grid grid-cols-12 items-center sm:gap-x-2 lg:gap-x-4 grid-flow-row-dense";
@@ -39740,6 +39747,7 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -39769,6 +39777,7 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
     imageURL = _properties$media.src,
     isEmbedded = _properties$media.isEmbedded,
     videoUrl = _properties$media.videoUrl,
+    autoPlay = _properties$media.autoPlay,
     src = properties.backgroundImage.src;
   var baseClasses = "grid grid-cols-12 gap-4";
   var gridClasses = function gridClasses(index) {
@@ -39798,6 +39807,7 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
     id: "feature-with-grid-description",
     style: design.description
   }, otherProps), description), /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     className: "m-auto",
@@ -39858,6 +39868,7 @@ var FeatureWithImage = function FeatureWithImage(_ref) {
     mediaPosition = _properties$media.position,
     isEmbedded = _properties$media.isEmbedded,
     videoUrl = _properties$media.videoUrl,
+    autoPlay = _properties$media.autoPlay,
     src = properties.backgroundImage.src;
   var mediaURL = isEmbedded ? videoUrl : imageUrl;
   var baseClasses = "grid grid-cols-12 items-center grid-flow-row-dense";
@@ -39891,6 +39902,7 @@ var FeatureWithImage = function FeatureWithImage(_ref) {
   }, otherProps), description)), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -39974,6 +39986,7 @@ var FeatureWithList = function FeatureWithList(_ref) {
     mediaPosition = _properties$media.position,
     isEmbedded = _properties$media.isEmbedded,
     videoUrl = _properties$media.videoUrl,
+    autoPlay = _properties$media.autoPlay,
     src = properties.backgroundImage.src;
   var mediaURL = isEmbedded ? videoUrl : imageURL;
   var baseClasses = "grid grid-cols-12 lg:gap-x-4 sm:gap-x-2 items-center grid-flow-row-dense";
@@ -40032,6 +40045,7 @@ var FeatureWithList = function FeatureWithList(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -40157,6 +40171,7 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: imageBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: features[selectedTabId - 1].media.autoPlay,
     design: design.media,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "feature-with-progress-bar-".concat(selectedTabId - 1, "-media"),
@@ -43045,6 +43060,7 @@ var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
     mediaPosition = _properties$media.position,
     isEmbedded = _properties$media.isEmbedded,
     videoUrl = _properties$media.videoUrl,
+    autoPlay = _properties$media.autoPlay,
     src = properties.backgroundImage.src;
   var mediaURL = isEmbedded ? videoUrl : imageURL;
   var baseClasses = "grid sm:gap-x-6 gap-y-6 grid-cols-12 items-center grid-flow-row-dense";
@@ -43105,6 +43121,7 @@ var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -43232,6 +43249,7 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     }, /*#__PURE__*/React__default["default"].createElement(Media, {
       disableButtonAndLinks: disableButtonAndLinks,
       index: index,
+      autoPlay: media.autoPlay,
       design: design.media,
       id: "hero-with-gallery-slide-".concat(index, "-media"),
       isEmbedded: media.isEmbedded,