@bigbinary/neeto-site-blocks 1.8.0 → 1.8.2

package/dist/index.cjs.js

@@ -2108,6 +2108,53 @@ function _curry2(fn) {
   };
 }
 
+/**
+ * Optimized internal three-arity curry function.
+ *
+ * @private
+ * @category Function
+ * @param {Function} fn The function to curry.
+ * @return {Function} The curried function.
+ */
+
+function _curry3(fn) {
+  return function f3(a, b, c) {
+    switch (arguments.length) {
+      case 0:
+        return f3;
+
+      case 1:
+        return _isPlaceholder(a) ? f3 : _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        });
+
+      case 2:
+        return _isPlaceholder(a) && _isPlaceholder(b) ? f3 : _isPlaceholder(a) ? _curry2(function (_a, _c) {
+          return fn(_a, b, _c);
+        }) : _isPlaceholder(b) ? _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        }) : _curry1(function (_c) {
+          return fn(a, b, _c);
+        });
+
+      default:
+        return _isPlaceholder(a) && _isPlaceholder(b) && _isPlaceholder(c) ? f3 : _isPlaceholder(a) && _isPlaceholder(b) ? _curry2(function (_a, _b) {
+          return fn(_a, _b, c);
+        }) : _isPlaceholder(a) && _isPlaceholder(c) ? _curry2(function (_a, _c) {
+          return fn(_a, b, _c);
+        }) : _isPlaceholder(b) && _isPlaceholder(c) ? _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        }) : _isPlaceholder(a) ? _curry1(function (_a) {
+          return fn(_a, b, c);
+        }) : _isPlaceholder(b) ? _curry1(function (_b) {
+          return fn(a, _b, c);
+        }) : _isPlaceholder(c) ? _curry1(function (_c) {
+          return fn(a, b, _c);
+        }) : fn(a, b, c);
+    }
+  };
+}
+
 /**
  * Tests whether or not an object is an array.
  *
@@ -2579,6 +2626,36 @@ _curry2(function prop(p, obj) {
   return _isInteger(p) ? nth(p, obj) : obj[p];
 });
 
+/**
+ * Makes a shallow clone of an object, setting or overriding the specified
+ * property with the given value. Note that this copies and flattens prototype
+ * properties onto the new object as well. All non-primitive properties are
+ * copied by reference.
+ *
+ * @private
+ * @param {String|Number} prop The property name to set
+ * @param {*} val The new value
+ * @param {Object|Array} obj The object to clone
+ * @return {Object|Array} A new object equivalent to the original except for the changed property.
+ */
+
+function _assoc(prop, val, obj) {
+  if (_isInteger(prop) && _isArray(obj)) {
+    var arr = [].concat(obj);
+    arr[prop] = val;
+    return arr;
+  }
+
+  var result = {};
+
+  for (var p in obj) {
+    result[p] = obj[p];
+  }
+
+  result[prop] = val;
+  return result;
+}
+
 /**
  * Checks if the input value is `null` or `undefined`.
  *
@@ -2603,6 +2680,76 @@ _curry1(function isNil(x) {
   return x == null;
 });
 
+/**
+ * Makes a shallow clone of an object, setting or overriding the nodes required
+ * to create the given path, and placing the specific value at the tail end of
+ * that path. Note that this copies and flattens prototype properties onto the
+ * new object as well. All non-primitive properties are copied by reference.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.8.0
+ * @category Object
+ * @typedefn Idx = String | Int | Symbol
+ * @sig [Idx] -> a -> {a} -> {a}
+ * @param {Array} path the path to set
+ * @param {*} val The new value
+ * @param {Object} obj The object to clone
+ * @return {Object} A new object equivalent to the original except along the specified path.
+ * @see R.dissocPath
+ * @example
+ *
+ *      R.assocPath(['a', 'b', 'c'], 42, {a: {b: {c: 0}}}); //=> {a: {b: {c: 42}}}
+ *
+ *      // Any missing or non-object keys in path will be overridden
+ *      R.assocPath(['a', 'b', 'c'], 42, {a: 5}); //=> {a: {b: {c: 42}}}
+ */
+
+var assocPath =
+/*#__PURE__*/
+_curry3(function assocPath(path, val, obj) {
+  if (path.length === 0) {
+    return val;
+  }
+
+  var idx = path[0];
+
+  if (path.length > 1) {
+    var nextObj = !isNil(obj) && _has(idx, obj) && typeof obj[idx] === 'object' ? obj[idx] : _isInteger(path[1]) ? [] : {};
+    val = assocPath(Array.prototype.slice.call(path, 1), val, nextObj);
+  }
+
+  return _assoc(idx, val, obj);
+});
+
+/**
+ * Makes a shallow clone of an object, setting or overriding the specified
+ * property with the given value. Note that this copies and flattens prototype
+ * properties onto the new object as well. All non-primitive properties are
+ * copied by reference.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.8.0
+ * @category Object
+ * @typedefn Idx = String | Int
+ * @sig Idx -> a -> {k: v} -> {k: v}
+ * @param {String|Number} prop The property name to set
+ * @param {*} val The new value
+ * @param {Object} obj The object to clone
+ * @return {Object} A new object equivalent to the original except for the changed property.
+ * @see R.dissoc, R.pick
+ * @example
+ *
+ *      R.assoc('c', 3, {a: 1, b: 2}); //=> {a: 1, b: 2, c: 3}
+ */
+
+var assoc =
+/*#__PURE__*/
+_curry3(function assoc(prop, val, obj) {
+  return assocPath([prop], val, obj);
+});
+
 function _identity(x) {
   return x;
 }
@@ -2631,6 +2778,158 @@ var identity =
 /*#__PURE__*/
 _curry1(_identity);
 
+/**
+ * Removes the sub-list of `list` starting at index `start` and containing
+ * `count` elements. _Note that this is not destructive_: it returns a copy of
+ * the list with the changes.
+ * <small>No lists have been harmed in the application of this function.</small>
+ *
+ * @func
+ * @memberOf R
+ * @since v0.2.2
+ * @category List
+ * @sig Number -> Number -> [a] -> [a]
+ * @param {Number} start The position to start removing elements
+ * @param {Number} count The number of elements to remove
+ * @param {Array} list The list to remove from
+ * @return {Array} A new Array with `count` elements from `start` removed.
+ * @see R.without
+ * @example
+ *
+ *      R.remove(2, 3, [1,2,3,4,5,6,7,8]); //=> [1,2,6,7,8]
+ */
+
+var remove =
+/*#__PURE__*/
+_curry3(function remove(start, count, list) {
+  var result = Array.prototype.slice.call(list, 0);
+  result.splice(start, count);
+  return result;
+});
+
+/**
+ * Returns a new object that does not contain a `prop` property.
+ *
+ * @private
+ * @param {String|Number} prop The name of the property to dissociate
+ * @param {Object|Array} obj The object to clone
+ * @return {Object} A new object equivalent to the original but without the specified property
+ */
+
+function _dissoc(prop, obj) {
+  if (obj == null) {
+    return obj;
+  }
+
+  if (_isInteger(prop) && _isArray(obj)) {
+    return remove(prop, 1, obj);
+  }
+
+  var result = {};
+
+  for (var p in obj) {
+    result[p] = obj[p];
+  }
+
+  delete result[prop];
+  return result;
+}
+
+/**
+ * Makes a shallow clone of an object. Note that this copies and flattens
+ * prototype properties onto the new object as well. All non-primitive
+ * properties are copied by reference.
+ *
+ * @private
+ * @param {String|Integer} prop The prop operating
+ * @param {Object|Array} obj The object to clone
+ * @return {Object|Array} A new object equivalent to the original.
+ */
+
+function _shallowCloneObject(prop, obj) {
+  if (_isInteger(prop) && _isArray(obj)) {
+    return [].concat(obj);
+  }
+
+  var result = {};
+
+  for (var p in obj) {
+    result[p] = obj[p];
+  }
+
+  return result;
+}
+/**
+ * Makes a shallow clone of an object, omitting the property at the given path.
+ * Note that this copies and flattens prototype properties onto the new object
+ * as well. All non-primitive properties are copied by reference.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.11.0
+ * @category Object
+ * @typedefn Idx = String | Int | Symbol
+ * @sig [Idx] -> {k: v} -> {k: v}
+ * @param {Array} path The path to the value to omit
+ * @param {Object} obj The object to clone
+ * @return {Object} A new object without the property at path
+ * @see R.assocPath
+ * @example
+ *
+ *      R.dissocPath(['a', 'b', 'c'], {a: {b: {c: 42}}}); //=> {a: {b: {}}}
+ */
+
+
+var dissocPath =
+/*#__PURE__*/
+_curry2(function dissocPath(path, obj) {
+  if (obj == null) {
+    return obj;
+  }
+
+  switch (path.length) {
+    case 0:
+      return obj;
+
+    case 1:
+      return _dissoc(path[0], obj);
+
+    default:
+      var head = path[0];
+      var tail = Array.prototype.slice.call(path, 1);
+
+      if (obj[head] == null) {
+        return _shallowCloneObject(head, obj);
+      } else {
+        return assoc(head, dissocPath(tail, obj[head]), obj);
+      }
+
+  }
+});
+
+/**
+ * Returns a new object that does not contain a `prop` property.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.10.0
+ * @category Object
+ * @sig String -> {k: v} -> {k: v}
+ * @param {String} prop The name of the property to dissociate
+ * @param {Object} obj The object to clone
+ * @return {Object} A new object equivalent to the original but without the specified property
+ * @see R.assoc, R.omit
+ * @example
+ *
+ *      R.dissoc('b', {a: 1, b: 2, c: 3}); //=> {a: 1, c: 3}
+ */
+
+var dissoc =
+/*#__PURE__*/
+_curry2(function dissoc(prop, obj) {
+  return dissocPath([prop], obj);
+});
+
 /**
  * Tests whether or not an object is a typed array.
  *
@@ -4694,8 +4993,8 @@ var isLinkHighlighted = function isLinkHighlighted(to, currentPath) {
   return currentPath.pathName === to && isEmpty(currentPath.hash) || currentPath.hash === to;
 };
 
-function ownKeys$j(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$j(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$j(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$k(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$k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$k(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var StyledWrapper = styled__default["default"].div.attrs(function (props) {
   return {
     className: generateResponsiveStyles(props.design)
@@ -4719,11 +5018,11 @@ var StyledWrapper = styled__default["default"].div.attrs(function (props) {
     borderWidth: (_design$border2 = design.border) === null || _design$border2 === void 0 ? void 0 : _design$border2.borderWidth
   };
   var borderColorStyles = pickBy(identity, borderColors);
-  var backgroundStyles = _objectSpread$j({
+  var backgroundStyles = _objectSpread$k({
     position: "relative",
     zIndex: 0
   }, backgroundImage.src ? {
-    "&::before": _objectSpread$j({
+    "&::before": _objectSpread$k({
       content: "''",
       position: "absolute",
       top: 0,
@@ -14298,6 +14597,7 @@ var useElementClick = function useElementClick(_ref) {
   // This function is used as the click handler for "Link" and "Button" elements in the to highlight the element
   var handleClick = function handleClick(event) {
     event.preventDefault();
+    if (!id) return;
     setTimeout(function () {
       var accordion = document.querySelector("[data-accordion-id=".concat(id.replace(/-[^-]+$/, ""), "]"));
       var element = document.querySelector("[data-element-id=".concat(id, "]"));
@@ -15721,8 +16021,8 @@ var Button = function Button(_ref) {
 var Button$1 = withConditionalRender(Button, prop("label"));
 
 var _excluded$w = ["to", "label", "style", "className", "icon", "action", "baseUrl", "draftMode", "link", "isHighlighted", "disableButtonAndLinks", "children", "disableHovering", "setIsMenuOpen", "id", "index"];
-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; }
+function ownKeys$j(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$j(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$j(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var LinkElement = function LinkElement(_ref) {
   var _ref$to = _ref.to,
     to = _ref$to === void 0 ? "" : _ref$to,
@@ -15764,7 +16064,7 @@ var LinkElement = function LinkElement(_ref) {
     setIsMenuOpen && setIsMenuOpen(false);
     disableButtonAndLinks && handleClick(event);
   };
-  var commonProps = _objectSpread$i({
+  var commonProps = _objectSpread$j({
     className: classnames([baseClass, className]),
     design: style,
     href: to !== null && to !== void 0 ? to : "",
@@ -15795,8 +16095,8 @@ var Link = withConditionalRender(LinkElement, function () {
 });
 
 var _excluded$v = ["link", "design", "index", "height", "className", "totalLength", "paddingHorizontal"];
-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; }
+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 Dropdown = function Dropdown(_ref) {
   var link = _ref.link,
     design = _ref.design,
@@ -15826,7 +16126,7 @@ var Dropdown = function Dropdown(_ref) {
         key: getUniqueKey(subLink.label, subLink.to, index),
         setIsMenuOpen: setIsOpen,
         style: design
-      }, _objectSpread$h(_objectSpread$h({
+      }, _objectSpread$i(_objectSpread$i({
         index: index
       }, subLink), otherProps)));
     });
@@ -15904,8 +16204,8 @@ var Dropdown = function Dropdown(_ref) {
   }, renderDropdownItems("rounded-md px-4 py-2 hover:bg-gray-100")))));
 };
 
-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; }
+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 subscribe = function subscribe(listener) {
   window.addEventListener("resize", listener);
   return function () {
@@ -15914,7 +16214,7 @@ var subscribe = function subscribe(listener) {
 };
 var getCurrentSize = function getCurrentSize(window, breakpointOverrides) {
   var innerWidth = window.innerWidth;
-  var sizes = _objectSpread$g({
+  var sizes = _objectSpread$h({
     mobile: innerWidth < 768,
     tablet: innerWidth >= 768 && innerWidth < 1024,
     desktop: innerWidth >= 1024 && innerWidth < 1280,
@@ -15940,21 +16240,25 @@ var useBreakpoints = function useBreakpoints(breakpointOverrides) {
 var useBreakpoints$1 = useBreakpoints;
 
 var _excluded$u = ["isEmbedded", "src", "design"];
+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 Media = function Media(_ref) {
   var isEmbedded = _ref.isEmbedded,
     src = _ref.src,
     design = _ref.design,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$u);
   if (isEmbedded) {
-    return /*#__PURE__*/React__default["default"].createElement("iframe", {
+    var _design$width;
+    return /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
       allow: "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",
-      className: "w-full",
+      as: "iframe",
+      design: dissoc("width", design),
       height: "300px",
       src: validateUrl(src),
-      style: design
+      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, _extends__default["default"]({
+  return /*#__PURE__*/React__default["default"].createElement(StyledImage$1, _objectSpread$g({
     design: design,
     src: src
   }, otherProps));
@@ -15985,7 +16289,12 @@ var PageNavigation = function PageNavigation(_ref) {
 
 var Pagination$1 = function Pagination(_ref) {
   var swiper = _ref.swiper,
-    design = _ref.design;
+    _ref$design = _ref.design,
+    design = _ref$design === void 0 ? {} : _ref$design,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    _ref$hasNavigation = _ref.hasNavigation,
+    hasNavigation = _ref$hasNavigation === void 0 ? false : _ref$hasNavigation;
   var _useState = React.useState(0),
     _useState2 = _slicedToArray__default["default"](_useState, 2),
     activeSlide = _useState2[0],
@@ -16003,8 +16312,8 @@ var Pagination$1 = function Pagination(_ref) {
   if (!swiper) return null;
   var totalSlides = swiper.slides.length;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "swiper-pagination flex items-center justify-center space-x-4"
-  }, /*#__PURE__*/React__default["default"].createElement("button", {
+    className: classnames("swiper-pagination flex items-center justify-center space-x-4", className)
+  }, hasNavigation && /*#__PURE__*/React__default["default"].createElement("button", {
     onClick: function onClick() {
       return swiper.slidePrev();
     }
@@ -16022,7 +16331,7 @@ var Pagination$1 = function Pagination(_ref) {
         return swiper.slideTo(index);
       }
     });
-  })), /*#__PURE__*/React__default["default"].createElement("button", {
+  })), hasNavigation && /*#__PURE__*/React__default["default"].createElement("button", {
     onClick: function onClick() {
       return swiper.slideNext();
     }
@@ -42728,7 +43037,10 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     id = _ref.id,
     disableButtonAndLinks = _ref.disableButtonAndLinks,
     otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$4);
-  var swiperRef = React.useRef(null);
+  var _useState = React.useState(null),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    swiper = _useState2[0],
+    setSwiper = _useState2[1];
   var properties = configurations.properties,
     design = configurations.design;
   var slides = properties.slides,
@@ -42857,23 +43169,14 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
     className: "hidden sm:flex",
     design: design.navigationButtons,
     onClick: function onClick() {
-      var _swiperRef$current;
-      return (_swiperRef$current = swiperRef.current) === null || _swiperRef$current === void 0 ? void 0 : _swiperRef$current.slidePrev();
+      return swiper === null || swiper === void 0 ? void 0 : swiper.slidePrev();
     }
   }), /*#__PURE__*/React__default["default"].createElement(Swiper, {
     loop: true,
-    className: "ns-hero-with-slider",
-    keyboard: {
-      enabled: true,
-      onlyInViewport: true
-    },
-    modules: [Pagination, Keyboard],
-    pagination: {
-      clickable: true
-    },
-    onSwiper: function onSwiper(swiper) {
-      swiperRef.current = swiper;
-    }
+    className: classnames("ns-hero-with-slider", {
+      "pointer-events-none": disableButtonAndLinks
+    }),
+    onSwiper: setSwiper
   }, slides.map(function (_ref7, index) {
     var content = _ref7.content,
       buttons = _ref7.buttons,
@@ -42887,13 +43190,15 @@ var HeroWithGallery = function HeroWithGallery(_ref) {
       media: media,
       index: index
     }));
+  }), /*#__PURE__*/React__default["default"].createElement(Pagination$1, {
+    swiper: swiper,
+    className: "!pointer-events-auto !relative"
   })), /*#__PURE__*/React__default["default"].createElement(ArrowButton, {
     Icon: ArrowRightS$1,
     className: "hidden sm:flex",
     design: design.navigationButtons,
     onClick: function onClick() {
-      var _swiperRef$current2;
-      return (_swiperRef$current2 = swiperRef.current) === null || _swiperRef$current2 === void 0 ? void 0 : _swiperRef$current2.slideNext();
+      return swiper === null || swiper === void 0 ? void 0 : swiper.slideNext();
     }
   })) : renderHeroWithMedia(slides[0] || {
     content: {},
@@ -43399,6 +43704,7 @@ var TestimonialWithSlider = function TestimonialWithSlider(_ref) {
     }), testimonialDescription))));
   }), /*#__PURE__*/React__default["default"].createElement(Pagination$1, {
     swiper: swiper,
+    hasNavigation: true,
     design: design.buttons
   }))), isButtonRequired && /*#__PURE__*/React__default["default"].createElement(StyledWrapper, {
     className: "col-span-12 flex",