@bigbinary/neeto-site-blocks 1.10.27 → 1.10.29

package/dist/index.cjs.js

@@ -4665,7 +4665,7 @@ var withConditionalRender = function withConditionalRender(Component, condition)
   return ConditionalRender;
 };
 
-var _excluded$B = ["id", "disableButtonAndLinks", "wrapperClassName", "index", "image", "isAddNewPane"];
+var _excluded$B = ["id", "disableButtonAndLinks", "wrapperClassName", "wrapperStyles", "index", "image", "isAddNewPane"];
 var StyledImage = styled__default["default"].img.attrs(function () {
   return {
     className: "hover:mix-blend-multiply"
@@ -4695,6 +4695,8 @@ var StyledImageWithWrapper = function StyledImageWithWrapper(_ref2) {
   var id = _ref2.id,
     disableButtonAndLinks = _ref2.disableButtonAndLinks,
     wrapperClassName = _ref2.wrapperClassName,
+    _ref2$wrapperStyles = _ref2.wrapperStyles,
+    wrapperStyles = _ref2$wrapperStyles === void 0 ? {} : _ref2$wrapperStyles,
     index = _ref2.index,
     image = _ref2.image,
     _ref2$isAddNewPane = _ref2.isAddNewPane,
@@ -4707,6 +4709,7 @@ var StyledImageWithWrapper = function StyledImageWithWrapper(_ref2) {
     handleImageClick = _useElementClick.handleImageClick;
   return /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
     id: id,
+    design: wrapperStyles,
     className: classnames__default["default"]("flex justify-center", _defineProperty__default["default"]({
       "neeto-site-highlight__element": disableButtonAndLinks && !isAddNewPane
     }, wrapperClassName, wrapperClassName)),
@@ -12625,7 +12628,7 @@ var FeatureWithDetails = function FeatureWithDetails(_ref) {
       className: classnames__default["default"]({
         "flex flex-col gap-4 md:flex-row": icon
       })
-    }, icon && /*#__PURE__*/React__default["default"].createElement("div", {
+    }, neetoCist.isPresent(icon) && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "flex-shrink-0"
     }, renderIcon(_objectSpread$b({
       name: icon,
@@ -12735,12 +12738,16 @@ var FeatureWithGrid = function FeatureWithGrid(_ref) {
       image: image,
       index: index,
       alt: featureImageAlt,
-      design: design.featureImage,
+      className: "w-full",
+      design: ramda.dissoc("width", design.featureImage),
       disableButtonAndLinks: otherProps.disableButtonAndLinks,
       id: "feature-with-grid-".concat(index, "-image"),
       isAddNewPane: otherProps.isAddNewPane,
       src: featureImageUrl,
-      title: featureImageTitle
+      title: featureImageTitle,
+      wrapperStyles: {
+        width: "".concat(design.featureImage.width, "%")
+      }
     }), /*#__PURE__*/React__default["default"].createElement(Typography$1, _extends__default["default"]({
       index: index,
       isTitle: true,
@@ -13102,7 +13109,8 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
     isAddNewPane: otherProps.isAddNewPane,
     isEmbedded: features[selectedTabId - 1].media.isEmbedded,
     src: features[selectedTabId - 1].media.src,
-    videoUrl: features[selectedTabId - 1].media.videoUrl
+    videoUrl: features[selectedTabId - 1].media.videoUrl,
+    wrapperClassName: "h-full w-full"
   })));
 };
 
@@ -15036,17 +15044,16 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
   var slides = properties.slides,
     src = properties.backgroundImage.src,
     enableAnimation = properties.enableAnimation;
-  var baseClasses = "grid grid-cols-12 items-center gap-y-4 sm:gap-x-4 grid-flow-row-dense";
+  var baseClasses = "grid gap-y-6 lg:gap-6 grid-cols-12 grid-flow-row-dense px-0 sm:px-4";
   var contentBaseClasses = function contentBaseClasses(_ref2) {
     var src = _ref2.src,
       position = _ref2.position,
       isEmptyContent = _ref2.isEmptyContent;
-    return classnames__default["default"]("col-span-12", {
-      "sm:col-start-1 sm:col-span-6 ": src && position === POSITIONS.RIGHT.label,
-      "sm:col-span-8 sm:col-start-3": src && position === POSITIONS.BOTTOM.label,
-      "sm:col-span-8 sm:col-start-3 flex flex-col justify-center order-2": src && position === POSITIONS.TOP.label,
-      "sm:col-start-7 sm:col-span-6 ": src && position === POSITIONS.LEFT.label,
-      "flex flex-col justify-center sm:col-span-12": !src,
+    return classnames__default["default"]("col-span-12 flex flex-col justify-center", {
+      "order-1 lg:col-span-6 ": src && position === POSITIONS.LEFT.label,
+      "order-2 lg:col-span-6": src && position === POSITIONS.RIGHT.label,
+      "order-1": src && position === POSITIONS.BOTTOM.label,
+      "order-2": src && position === POSITIONS.TOP.label,
       hidden: isEmptyContent
     });
   };
@@ -15054,19 +15061,18 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     var src = _ref3.src,
       position = _ref3.position,
       isEmptyContent = _ref3.isEmptyContent;
-    return classnames__default["default"]("col-span-12 flex justify-center", {
-      "sm:col-span-5 sm:col-start-1": src && position === POSITIONS.LEFT.label && !isEmptyContent,
-      "sm:col-span-5 sm:col-start-8": src && position === POSITIONS.RIGHT.label && !isEmptyContent,
-      "sm:col-span-5 sm:col-span-8 sm:col-start-3": src && position === POSITIONS.BOTTOM.label && !isEmptyContent,
-      "sm:col-span-5 sm:col-span-8 sm:col-start-3 flex justify-center order-1": src && position === POSITIONS.TOP.label && !isEmptyContent,
-      hidden: !src,
-      "flex justify-center": isEmptyContent
+    return classnames__default["default"]("col-span-12 flex flex-col justify-center items-center", {
+      "order-2 lg:col-span-6": src && position === POSITIONS.LEFT.label && !isEmptyContent,
+      "order-1 lg:col-span-6": src && position === POSITIONS.RIGHT.label && !isEmptyContent,
+      "order-2": src && position === POSITIONS.BOTTOM.label && !isEmptyContent,
+      "order-1": src && position === POSITIONS.TOP.label && !isEmptyContent,
+      hidden: !src
     });
   };
   var buttonBaseClasses = function buttonBaseClasses(_ref4) {
     var src = _ref4.src,
       position = _ref4.position;
-    return classnames__default["default"]("flex w-full gap-x-4", {
+    return classnames__default["default"]("flex flex-wrap w-full items-center gap-2", {
       "justify-center": !src || position === POSITIONS.BOTTOM.label || position === POSITIONS.TOP.label
     });
   };
@@ -15085,10 +15091,7 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     var isEmptyContent = !content.prefixTitle && !content.title && !content.description;
     return /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
       isRootWrapper: true,
-      className: classnames__default["default"]("neeto-site-block-wrapper", baseClasses),
-      design: {
-        paddingHorizontal: design.body.paddingHorizontal
-      }
+      className: classnames__default["default"]("neeto-site-block-wrapper", baseClasses)
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: contentBaseClasses(_objectSpread$2({
         isEmptyContent: isEmptyContent
@@ -15097,6 +15100,7 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
       disableButtonAndLinks: disableButtonAndLinks,
       index: index,
       isTitle: true,
+      className: textClasses(_objectSpread$2({}, media)),
       component: "h3",
       id: "hero-with-gallery-slide-".concat(index, "-prefixTitle"),
       isAddNewPane: otherProps.isAddNewPane,
@@ -15122,7 +15126,6 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
       className: buttonBaseClasses(_objectSpread$2({}, media))
     }, buttons.map(function (button, buttonIndex) {
       return /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-        className: "flex w-full justify-center sm:w-auto",
         id: "hero-with-gallery-slide-".concat(index, "-buttons-").concat(buttonIndex, "-button"),
         key: getUniqueKey(button.label, button.url, index),
         style: button.type === "primary" ? design.primaryButtons : design.secondaryButtons
@@ -15159,7 +15162,7 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
       src: src
     }, design.backgroundImage),
     design: design.body,
-    nestedClassName: "flex items-center justify-between gap-x-2"
+    nestedClassName: "flex items-center justify-between gap-x-2 ns-hero-with-gallery "
   }, slides.length > 1 ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ArrowButton, {
     isStart: true,
     Icon: ArrowLeftS$1,