@bigbinary/neeto-site-blocks 1.8.27 → 1.9.0

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,
@@ -14763,7 +14763,7 @@ var withConditionalRender = function withConditionalRender(Component, condition)
   return ConditionalRender;
 };
 
-var _excluded$A = ["id", "disableButtonAndLinks", "wrapperClassName", "index"];
+var _excluded$A = ["id", "disableButtonAndLinks", "wrapperClassName", "index", "image"];
 var StyledImage = styled__default["default"].img.attrs(function () {
   return {
     className: "hover:mix-blend-multiply"
@@ -14794,6 +14794,7 @@ var StyledImageWithWrapper = function StyledImageWithWrapper(_ref2) {
     disableButtonAndLinks = _ref2.disableButtonAndLinks,
     wrapperClassName = _ref2.wrapperClassName,
     index = _ref2.index,
+    image = _ref2.image,
     props = _objectWithoutProperties__default["default"](_ref2, _excluded$A);
   var _useElementClick = useElementClick({
       id: id,
@@ -14805,7 +14806,13 @@ var StyledImageWithWrapper = function StyledImageWithWrapper(_ref2) {
       "neeto-site-highlight__element": disableButtonAndLinks
     }, wrapperClassName, wrapperClassName)),
     onClick: disableButtonAndLinks && handleImageClick
-  }, /*#__PURE__*/React__default["default"].createElement(StyledImage, props));
+  }, /*#__PURE__*/React__default["default"].createElement(StyledImage, _extends__default["default"]({
+    as: image !== null && image !== void 0 ? image : "img",
+    height: 0,
+    objectFit: "contain",
+    sizes: "100vw",
+    width: 0
+  }, props)));
 };
 var StyledImage$1 = withConditionalRender(StyledImageWithWrapper, prop("src"));
 
@@ -16265,7 +16272,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 +16280,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,
@@ -21354,7 +21365,7 @@ const SwiperSlide = /*#__PURE__*/React.forwardRef(function (_temp, externalRef)
 });
 SwiperSlide.displayName = 'SwiperSlide';
 
-var _excluded$r = ["configurations", "className", "id", "disableButtonAndLinks"];
+var _excluded$r = ["configurations", "className", "id", "disableButtonAndLinks", "image"];
 function ownKeys$h(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$h(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$h(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var CardsInGridView = function CardsInGridView(_ref) {
@@ -21363,6 +21374,7 @@ var CardsInGridView = function CardsInGridView(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
     disableButtonAndLinks = _ref.disableButtonAndLinks,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$r);
   var _useState = React.useState(0),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -21405,6 +21417,7 @@ var CardsInGridView = function CardsInGridView(_ref) {
       to: href
     }, otherProps), /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
       disableButtonAndLinks: disableButtonAndLinks,
+      image: image,
       index: index,
       design: mergeRight(design.cardImage, style),
       id: "cards-in-grid-view-".concat(index, "-image"),
@@ -21631,7 +21644,7 @@ var CardsWithCustomizableGrid = function CardsWithCustomizableGrid(_ref) {
   }, button, otherProps)))));
 };
 
-var _excluded$p = ["configurations", "className", "id", "disableButtonAndLinks"];
+var _excluded$p = ["configurations", "className", "id", "disableButtonAndLinks", "image"];
 function ownKeys$g(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$g(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$g(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var CardsWithImage = function CardsWithImage(_ref) {
@@ -21640,6 +21653,7 @@ var CardsWithImage = function CardsWithImage(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
     disableButtonAndLinks = _ref.disableButtonAndLinks,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$p);
   var properties = configurations.properties,
     design = configurations.design;
@@ -21712,6 +21726,7 @@ var CardsWithImage = function CardsWithImage(_ref) {
       className: "absolute bottom-0 right-0 flex items-end justify-end"
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
       disableButtonAndLinks: disableButtonAndLinks,
+      image: image,
       index: index,
       className: "!justify-self-end",
       design: design.cardImage,
@@ -39393,7 +39408,7 @@ var CtaWithEmailAction = function CtaWithEmailAction(_ref) {
   }, otherProps), promotionText));
 };
 
-var _excluded$m = ["configurations", "className", "id"];
+var _excluded$m = ["configurations", "className", "id", "image"];
 function ownKeys$e(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$e(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$e(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var CtaWithLogo = function CtaWithLogo(_ref) {
@@ -39401,6 +39416,7 @@ var CtaWithLogo = function CtaWithLogo(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$m);
   var properties = configurations.properties,
     design = configurations.design;
@@ -39422,6 +39438,7 @@ var CtaWithLogo = function CtaWithLogo(_ref) {
     design: design.body,
     nestedClassName: baseClasses
   }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     alt: "logo",
     className: "col-span-10 col-start-2 mx-auto sm:col-span-2 sm:col-start-1",
     design: design.logo,
@@ -39462,15 +39479,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"],
@@ -39655,7 +39674,7 @@ var FeatureWithBulletList = function FeatureWithBulletList(_ref) {
   }, otherProps), description)), /*#__PURE__*/React__default["default"].createElement(BulletList, null));
 };
 
-var _excluded$j = ["configurations", "className", "id"];
+var _excluded$j = ["configurations", "className", "id", "image"];
 function ownKeys$b(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$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FeatureWithDetails = function FeatureWithDetails(_ref) {
@@ -39663,6 +39682,7 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$j);
   var properties = configurations.properties,
     design = configurations.design;
@@ -39677,6 +39697,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 +39761,8 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
+    image: image,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -39750,12 +39773,13 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
   })));
 };
 
-var _excluded$i = ["configurations", "className", "id"];
+var _excluded$i = ["configurations", "className", "id", "image"];
 var FeatureWithGrid = function FeatureWithGrid(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$i);
   var properties = configurations.properties,
     design = configurations.design;
@@ -39769,6 +39793,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 +39823,8 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
     id: "feature-with-grid-description",
     style: design.description
   }, otherProps), description), /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
+    image: image,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     className: "m-auto",
@@ -39817,6 +39844,7 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
       className: gridClasses(index),
       key: getUniqueKey(featureTitle, featureDescription, index)
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       index: index,
       alt: featureImageAlt,
       design: design.featureImage,
@@ -39840,12 +39868,13 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
   }));
 };
 
-var _excluded$h = ["configurations", "className", "id"];
+var _excluded$h = ["configurations", "className", "id", "image"];
 var FeatureWithImage = function FeatureWithImage(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$h);
   var properties = configurations.properties,
     design = configurations.design;
@@ -39858,6 +39887,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 +39921,8 @@ var FeatureWithImage = function FeatureWithImage(_ref) {
   }, otherProps), description)), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
+    image: image,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -39954,12 +39986,13 @@ var FeatureWithJumboText = function FeatureWithJumboText(_ref) {
   }, otherProps), description)));
 };
 
-var _excluded$f = ["configurations", "className", "id"];
+var _excluded$f = ["configurations", "className", "id", "image"];
 var FeatureWithList = function FeatureWithList(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$f);
   var properties = configurations.properties,
     design = configurations.design;
@@ -39974,6 +40007,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 +40066,8 @@ var FeatureWithList = function FeatureWithList(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
+    image: image,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -40042,12 +40078,13 @@ var FeatureWithList = function FeatureWithList(_ref) {
   })));
 };
 
-var _excluded$e = ["configurations", "className", "id"];
+var _excluded$e = ["configurations", "className", "id", "image"];
 var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$e);
   var _useState = React.useState(configurations.properties.features[0].id),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -40157,6 +40194,8 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: imageBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    image: image,
+    autoPlay: features[selectedTabId - 1].media.autoPlay,
     design: design.media,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "feature-with-progress-bar-".concat(selectedTabId - 1, "-media"),
@@ -40167,7 +40206,7 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
   })));
 };
 
-var _excluded$d = ["configurations", "className", "id"];
+var _excluded$d = ["configurations", "className", "id", "image"];
 function ownKeys$a(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$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FooterClassic = function FooterClassic(_ref) {
@@ -40175,6 +40214,7 @@ var FooterClassic = function FooterClassic(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$d);
   var properties = configurations.properties,
     design = configurations.design;
@@ -40207,6 +40247,7 @@ var FooterClassic = function FooterClassic(_ref) {
     }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "col-span-12 sm:col-span-12 sm:mx-20 sm:flex sm:justify-between sm:gap-y-0"
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       design: design.logo,
       disableButtonAndLinks: otherProps.disableButtonAndLinks,
       id: "footer-classic-logo",
@@ -40258,6 +40299,7 @@ var FooterClassic = function FooterClassic(_ref) {
     design: design.body,
     nestedClassName: baseClasses
   }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "footer-classic-logo",
@@ -40305,7 +40347,7 @@ var FooterClassic = function FooterClassic(_ref) {
   }, otherProps), copyrightText));
 };
 
-var _excluded$c = ["configurations", "className", "id"];
+var _excluded$c = ["configurations", "className", "id", "image"];
 function ownKeys$9(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$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FooterWithIcons = function FooterWithIcons(_ref) {
@@ -40313,6 +40355,7 @@ var FooterWithIcons = function FooterWithIcons(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$c);
   var properties = configurations.properties,
     design = configurations.design;
@@ -40336,6 +40379,7 @@ var FooterWithIcons = function FooterWithIcons(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-span-12 grid grid-cols-8 gap-y-4 sm:col-span-7 sm:w-full sm:gap-x-4 lg:col-span-6"
   }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "footer-with-icons-logo",
@@ -40380,7 +40424,7 @@ var FooterWithIcons = function FooterWithIcons(_ref) {
   }, otherProps), copyrightText));
 };
 
-var _excluded$b = ["configurations", "className", "id"];
+var _excluded$b = ["configurations", "className", "id", "image"];
 function ownKeys$8(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$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FooterWithLinks = function FooterWithLinks(_ref) {
@@ -40388,6 +40432,7 @@ var FooterWithLinks = function FooterWithLinks(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$b);
   var properties = configurations.properties,
     design = configurations.design;
@@ -40415,6 +40460,7 @@ var FooterWithLinks = function FooterWithLinks(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex items-center gap-x-2"
   }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "footer-with-links-logo",
@@ -42348,7 +42394,8 @@ var GalleryClassic = function GalleryClassic(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
-    disableButtonAndLinks = _ref.disableButtonAndLinks;
+    disableButtonAndLinks = _ref.disableButtonAndLinks,
+    image = _ref.image;
   var swiperRef = React.useRef(null);
   var properties = configurations.properties,
     design = configurations.design;
@@ -42424,6 +42471,7 @@ var GalleryClassic = function GalleryClassic(_ref) {
       key: getUniqueKey(src, title, index)
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
       disableButtonAndLinks: disableButtonAndLinks,
+      image: image,
       index: index,
       src: src,
       alt: caption,
@@ -42444,12 +42492,13 @@ var GalleryClassic = function GalleryClassic(_ref) {
   }));
 };
 
-var _excluded$a = ["configurations", "className", "id"];
+var _excluded$a = ["configurations", "className", "id", "image"];
 var GalleryWithAutoplay = function GalleryWithAutoplay(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$a);
   var _useState = React.useState(null),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -42513,6 +42562,7 @@ var GalleryWithAutoplay = function GalleryWithAutoplay(_ref) {
       className: "swiper__wrapper",
       key: getUniqueKey(src, caption, index)
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       index: index,
       src: src,
       alt: caption,
@@ -42549,6 +42599,7 @@ var GalleryWithAutoplay = function GalleryWithAutoplay(_ref) {
       key: getUniqueKey(src, title, index)
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
       alt: alt,
+      image: image,
       index: index,
       src: src,
       title: title,
@@ -42577,7 +42628,7 @@ var useElementVisible = function useElementVisible(ref) {
   return isIntersecting;
 };
 
-var _excluded$9 = ["configurations", "className", "currentPath", "id"];
+var _excluded$9 = ["configurations", "className", "currentPath", "id", "image"];
 function ownKeys$7(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$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeaderWithButtons = function HeaderWithButtons(_ref) {
@@ -42586,6 +42637,7 @@ var HeaderWithButtons = function HeaderWithButtons(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     currentPath = _ref.currentPath,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$9);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -42617,6 +42669,7 @@ var HeaderWithButtons = function HeaderWithButtons(_ref) {
       "col-span-3 sm:col-span-4 sm:col-start-2": neetoCist.isNotEmpty(buttons)
     })
   }, otherProps), /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     className: "max-h-8 sm:max-h-10 lg:max-h-14",
     design: design.logo,
     src: properties.logo.src
@@ -42679,7 +42732,7 @@ var HeaderWithButtons = function HeaderWithButtons(_ref) {
   }))));
 };
 
-var _excluded$8 = ["configurations", "className", "id"];
+var _excluded$8 = ["configurations", "className", "id", "image"];
 function ownKeys$6(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$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeaderWithDropdownLinks = function HeaderWithDropdownLinks(_ref) {
@@ -42687,6 +42740,7 @@ var HeaderWithDropdownLinks = function HeaderWithDropdownLinks(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$8);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -42732,6 +42786,7 @@ var HeaderWithDropdownLinks = function HeaderWithDropdownLinks(_ref) {
     className: "flex w-full gap-x-2",
     to: properties.logo.to
   }, otherProps), /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     className: "max-h-8 sm:max-h-10 lg:max-h-14",
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
@@ -42790,7 +42845,7 @@ var HeaderWithDropdownLinks = function HeaderWithDropdownLinks(_ref) {
   })))));
 };
 
-var _excluded$7 = ["configurations", "className", "currentPath", "id"];
+var _excluded$7 = ["configurations", "className", "currentPath", "id", "image"];
 function ownKeys$5(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$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeaderWithIcons = function HeaderWithIcons(_ref) {
@@ -42799,6 +42854,7 @@ var HeaderWithIcons = function HeaderWithIcons(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     currentPath = _ref.currentPath,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$7);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -42838,6 +42894,7 @@ var HeaderWithIcons = function HeaderWithIcons(_ref) {
     className: "col-span-6 col-start-4 m-auto flex max-h-8 justify-center sm:col-span-4 sm:col-start-5 sm:max-h-10 lg:col-span-3 lg:col-start-6 lg:max-h-14",
     to: properties.logo.to
   }, otherProps), /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
     id: "header-with-icons-logo",
@@ -42909,7 +42966,7 @@ var HeaderWithIcons = function HeaderWithIcons(_ref) {
   })))));
 };
 
-var _excluded$6 = ["configurations", "className", "id", "currentPath"];
+var _excluded$6 = ["configurations", "className", "id", "currentPath", "image"];
 function ownKeys$4(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$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeaderWithLogoTitle = function HeaderWithLogoTitle(_ref) {
@@ -42918,6 +42975,7 @@ var HeaderWithLogoTitle = function HeaderWithLogoTitle(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
     currentPath = _ref.currentPath,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$6);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -42951,6 +43009,7 @@ var HeaderWithLogoTitle = function HeaderWithLogoTitle(_ref) {
     className: "flex w-full gap-x-2",
     to: properties.logo.to
   }, otherProps), /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+    image: image,
     className: "max-h-8 sm:max-h-10 lg:max-h-14",
     design: design.logo,
     disableButtonAndLinks: otherProps.disableButtonAndLinks,
@@ -43024,7 +43083,7 @@ var HeaderWithLogoTitle = function HeaderWithLogoTitle(_ref) {
   }))));
 };
 
-var _excluded$5 = ["configurations", "className", "id"];
+var _excluded$5 = ["configurations", "className", "id", "image"];
 function ownKeys$3(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$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
@@ -43032,6 +43091,7 @@ var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$5);
   var properties = configurations.properties,
     design = configurations.design;
@@ -43045,6 +43105,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 +43166,8 @@ var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mediaBaseClasses
   }, /*#__PURE__*/React__default["default"].createElement(Media, {
+    autoPlay: autoPlay,
+    image: image,
     isEmbedded: isEmbedded,
     videoUrl: videoUrl,
     design: design.media,
@@ -43114,7 +43177,7 @@ var HeroWithCallToAction = function HeroWithCallToAction(_ref) {
   })));
 };
 
-var _excluded$4 = ["configurations", "className", "id", "disableButtonAndLinks"];
+var _excluded$4 = ["configurations", "className", "id", "disableButtonAndLinks", "image"];
 function ownKeys$2(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$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var HeroWithGallery = function HeroWithGallery(_ref) {
@@ -43123,6 +43186,7 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
     disableButtonAndLinks = _ref.disableButtonAndLinks,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$4);
   var _useState = React.useState(null),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -43231,7 +43295,9 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
       }))
     }, /*#__PURE__*/React__default["default"].createElement(Media, {
       disableButtonAndLinks: disableButtonAndLinks,
+      image: image,
       index: index,
+      autoPlay: media.autoPlay,
       design: design.media,
       id: "hero-with-gallery-slide-".concat(index, "-media"),
       isEmbedded: media.isEmbedded,
@@ -43298,7 +43364,8 @@ var LogoClouds = function LogoClouds(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
-    disableButtonAndLinks = _ref.disableButtonAndLinks;
+    disableButtonAndLinks = _ref.disableButtonAndLinks,
+    image = _ref.image;
   var properties = configurations.properties,
     design = configurations.design;
   var _properties$logos = properties.logos,
@@ -43347,6 +43414,7 @@ var LogoClouds = function LogoClouds(_ref) {
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
       alt: alt,
       disableButtonAndLinks: disableButtonAndLinks,
+      image: image,
       index: index,
       src: src,
       title: title,
@@ -43562,7 +43630,8 @@ var Slides = function Slides(_ref) {
     id = _ref.id,
     disableButtonAndLinks = _ref.disableButtonAndLinks,
     pageUrl = _ref.pageUrl,
-    hostUrl = _ref.hostUrl;
+    hostUrl = _ref.hostUrl,
+    image = _ref.image;
   var _useState = React.useState(0),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
     activeIndex = _useState2[0],
@@ -43603,6 +43672,7 @@ var Slides = function Slides(_ref) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "bottom-0 col-span-12 flex w-full justify-center sm:absolute sm:col-span-10 sm:col-start-2"
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       design: design.image,
       src: imageUrl
     }));
@@ -43679,7 +43749,7 @@ var Slides = function Slides(_ref) {
   }));
 };
 
-var _excluded$1 = ["configurations", "className", "id"];
+var _excluded$1 = ["configurations", "className", "id", "image"];
 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; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
@@ -43687,6 +43757,7 @@ var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$1);
   var _useState = React.useState(null),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -43758,6 +43829,7 @@ var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: imageClasses(imagePosition)
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       index: index,
       src: src,
       className: "ns-testimonial-image-aspect-ratio object-cover",
@@ -43810,12 +43882,13 @@ var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
   }, button, otherProps))));
 };
 
-var _excluded = ["configurations", "className", "id"];
+var _excluded = ["configurations", "className", "id", "image"];
 var TestimonialWithVerticalView = function TestimonialWithVerticalView(_ref) {
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
+    image = _ref.image,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
   var properties = configurations.properties,
     design = configurations.design;
@@ -43873,6 +43946,7 @@ var TestimonialWithVerticalView = function TestimonialWithVerticalView(_ref) {
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: imageClasses
     }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
+      image: image,
       index: index,
       src: src,
       className: "ns-testimonial-image-aspect-ratio",