@bigbinary/neeto-site-blocks 1.7.1 → 1.7.3

package/dist/index.cjs.js

@@ -1989,6 +1989,11 @@ var IMAGE_FIT_VALUES = {
   cover: "cover",
   contain: "contain"
 };
+var BUTTON_ALIGN_VALUES = {
+  left: "left",
+  center: "center",
+  right: "right"
+};
 
 var index$1 = /*#__PURE__*/Object.freeze({
 	__proto__: null,
@@ -2015,7 +2020,8 @@ var index$1 = /*#__PURE__*/Object.freeze({
 	DEFAULT_LINK_STYLES: DEFAULT_LINK_STYLES,
 	IMAGE_POSITIONS: IMAGE_POSITIONS,
 	LOGO_SIZE_VALUES: LOGO_SIZE_VALUES,
-	IMAGE_FIT_VALUES: IMAGE_FIT_VALUES
+	IMAGE_FIT_VALUES: IMAGE_FIT_VALUES,
+	BUTTON_ALIGN_VALUES: BUTTON_ALIGN_VALUES
 });
 
 /**
@@ -14252,7 +14258,8 @@ var StyledAnchor = styled__default["default"].a.attrs(function (props) {
 var DropdownWrapper = styled__default["default"].div(function (_ref) {
   var index = _ref.index,
     height = _ref.height,
-    totalLength = _ref.totalLength;
+    totalLength = _ref.totalLength,
+    paddingHorizontal = _ref.paddingHorizontal;
   var _useState = React.useState(0),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
     cumulativeWidth = _useState2[0],
@@ -14264,11 +14271,11 @@ var DropdownWrapper = styled__default["default"].div(function (_ref) {
 
   // Calculate cumulative width of dropdowns with buffer
   React.useEffect(function () {
-    var cumulativeWidth = 0;
+    var cumulativeWidth = paddingHorizontal;
     for (var i = totalLength - 1; i > index; i--) {
       var dropdown = (iframeDocument !== null && iframeDocument !== void 0 ? iframeDocument : document).getElementById("dropdown-".concat(i));
       if (dropdown) {
-        cumulativeWidth += dropdown.offsetWidth + 15; // buffer width
+        cumulativeWidth += dropdown.offsetWidth + 20; // buffer width
       }
     }
 
@@ -15595,7 +15602,7 @@ var Link = withConditionalRender(LinkElement, function () {
   return !!(prop("label") || prop("icon"));
 });
 
-var _excluded$h = ["link", "design", "index", "height", "className", "totalLength"];
+var _excluded$h = ["link", "design", "index", "height", "className", "totalLength", "paddingHorizontal"];
 var Dropdown = function Dropdown(_ref) {
   var link = _ref.link,
     design = _ref.design,
@@ -15604,6 +15611,8 @@ var Dropdown = function Dropdown(_ref) {
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     totalLength = _ref.totalLength,
+    _ref$paddingHorizonta = _ref.paddingHorizontal,
+    paddingHorizontal = _ref$paddingHorizonta === void 0 ? 0 : _ref$paddingHorizonta,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$h);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -15630,6 +15639,7 @@ var Dropdown = function Dropdown(_ref) {
     className: className,
     height: height,
     index: index,
+    paddingHorizontal: paddingHorizontal,
     totalLength: totalLength
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex cursor-pointer items-center justify-between lg:h-full lg:justify-center",
@@ -15978,10 +15988,15 @@ var CardsClassic = function CardsClassic(_ref) {
       component: "p",
       style: design.cardDescription
     }, description));
-  }), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "col-span-12 flex justify-center sm:col-span-6 sm:col-start-4 lg:col-span-4 lg:col-start-5",
+  }), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    className: "col-span-12 flex",
+    design: {
+      justifyContent: design.button.justifyContent
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
+    className: "flex w-full justify-center sm:w-1/2 lg:w-1/3",
     style: design.button
-  }, button)));
+  }, button))));
 };
 
 /**
@@ -20921,10 +20936,13 @@ var CardsInGridView = function CardsInGridView(_ref) {
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
       key: getUniqueKey(card.title, card.description, index)
     }, renderCard(card));
-  })), isButtonRequired && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-span-12 grid grid-cols-12"
+  })), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    className: "col-span-12 flex",
+    design: {
+      justifyContent: design.button.justifyContent
+    }
   }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "col-span-12 flex justify-center sm:col-span-6 sm:col-start-4 lg:col-span-4 lg:col-start-5",
+    className: "flex w-full justify-center sm:w-1/2 lg:w-1/3",
     style: design.button
   }, button))));
 };
@@ -20996,10 +21014,13 @@ var CardsWithCustomizableGrid = function CardsWithCustomizableGrid(_ref) {
       component: "p",
       style: design.cardDescription
     }, description));
-  }), isButtonRequired && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "col-span-12 grid grid-cols-12"
+  }), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    className: "col-span-12 flex",
+    design: {
+      justifyContent: design.button.justifyContent
+    }
   }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "col-span-12 flex justify-center sm:col-span-6 sm:col-start-4 lg:col-span-4 lg:col-start-5",
+    className: "flex w-full justify-center sm:w-1/2 lg:w-1/3",
     style: design.button
   }, button)))));
 };
@@ -21108,18 +21129,17 @@ var CtaClassic = function CtaClassic(_ref) {
     title = _properties$content.title,
     description = _properties$content.description,
     enableAnimation = properties.enableAnimation,
-    primaryButton = properties.primaryButton,
-    src = properties.backgroundImage.src,
-    secondaryButton = properties.secondaryButton;
+    buttons = properties.buttons,
+    src = properties.backgroundImage.src;
   var baseClasses = "grid grid-cols-12 items-center gap-x-4 gap-y-8";
   return /*#__PURE__*/React__default["default"].createElement(BlockWrapper, {
+    className: className,
+    enableAnimation: enableAnimation,
+    id: id,
     backgroundImage: mergeLeft({
       src: src
     }, design.backgroundImage),
-    className: className,
     design: design.body,
-    enableAnimation: enableAnimation,
-    id: id,
     nestedClassName: baseClasses
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-span-12 sm:col-span-8 sm:col-start-3 lg:col-span-6 lg:col-start-4"
@@ -21132,13 +21152,13 @@ var CtaClassic = function CtaClassic(_ref) {
     style: design.description
   }, description)), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-span-10 col-start-2 flex flex-col justify-center gap-y-2 space-x-2 sm:col-span-6 sm:col-start-4 sm:flex-row lg:col-span-4 lg:col-start-5"
-  }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "justify-center sm:w-auto",
-    style: design.primaryButton
-  }, primaryButton, otherProps)), /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "justify-center sm:w-auto",
-    style: design.secondaryButton
-  }, secondaryButton, otherProps))));
+  }, buttons.map(function (button, index) {
+    return /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
+      className: "justify-center sm:w-auto",
+      key: index,
+      style: button.type === "primary" ? design.primaryButton : design.secondaryButton
+    }, button, otherProps));
+  })));
 };
 
 var axios$3 = {exports: {}};
@@ -38756,17 +38776,17 @@ var CtaWithLogo = function CtaWithLogo(_ref) {
     description = _properties$content.description,
     enableAnimation = properties.enableAnimation,
     logoUrl = properties.logoUrl,
-    button = properties.button,
+    buttons = properties.buttons,
     src = properties.backgroundImage.src;
   var baseClasses = "grid grid-cols-12 items-center gap-x-4 gap-y-8";
   return /*#__PURE__*/React__default["default"].createElement(BlockWrapper, {
+    className: className,
+    enableAnimation: enableAnimation,
+    id: id,
     backgroundImage: mergeLeft({
       src: src
     }, design.backgroundImage),
-    className: className,
     design: design.body,
-    enableAnimation: enableAnimation,
-    id: id,
     nestedClassName: baseClasses
   }, /*#__PURE__*/React__default["default"].createElement(StyledImage$1, {
     alt: "logo",
@@ -38784,10 +38804,13 @@ var CtaWithLogo = function CtaWithLogo(_ref) {
     style: design.description
   }, description)), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-span-12 mx-auto w-full sm:col-span-3 sm:col-start-10 lg:col-span-3 lg:col-start-10"
-  }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "flex w-full justify-center sm:w-auto",
-    style: design.button
-  }, button, otherProps))));
+  }, buttons.map(function (button, index) {
+    return /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
+      className: "justify-center sm:w-auto",
+      key: index,
+      style: design.button
+    }, button, otherProps));
+  })));
 };
 
 var Embed = function Embed(_ref) {
@@ -41916,6 +41939,7 @@ var HeaderWithDropdownLinks = function HeaderWithDropdownLinks(_ref) {
       design: design.links,
       height: headerHeight,
       key: getUniqueKey(link.label, link.to, index),
+      paddingHorizontal: design.body.paddingHorizontal,
       totalLength: properties.links.length
     });
   })), /*#__PURE__*/React__default["default"].createElement("button", {
@@ -42828,10 +42852,15 @@ var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
   }), /*#__PURE__*/React__default["default"].createElement(Pagination$1, {
     swiper: swiper,
     design: design.buttons
-  }))), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "col-span-12 flex justify-center sm:col-span-6 sm:col-start-4 lg:col-span-4 lg:col-start-5",
+  }))), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    className: "col-span-12 flex",
+    design: {
+      justifyContent: design.button.justifyContent
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
+    className: "flex w-full justify-center sm:w-1/2 lg:w-1/3",
     style: design.button
-  }, button, otherProps)));
+  }, button, otherProps))));
 };
 
 var _excluded = ["configurations", "className", "id"];
@@ -42917,10 +42946,15 @@ var TestimonialWithVerticalView = function TestimonialWithVerticalView(_ref) {
       component: "p",
       style: design.testimonialDescription
     }, testimonialDescription)));
-  })), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
-    className: "col-span-12 flex justify-center sm:col-span-6 sm:col-start-4 lg:col-span-4 lg:col-start-5",
+  })), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
+    className: "col-span-12 flex",
+    design: {
+      justifyContent: design.button.justifyContent
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(Button$1, _extends__default["default"]({
+    className: "flex w-full justify-center sm:w-1/2 lg:w-1/3",
     style: design.button
-  }, button, otherProps)));
+  }, button, otherProps))));
 };
 
 var index = /*#__PURE__*/Object.freeze({