@bigbinary/neeto-site-blocks 1.16.10 → 1.16.12

package/dist/index.js

@@ -7,7 +7,7 @@ import { motion, AnimatePresence } from 'framer-motion';
 import { has, __, isEmpty, mergeRight, pickBy, identity, mergeAll, prop, dissoc, equals, mergeLeft, omit } from 'ramda';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import React, { useState, useEffect, useSyncExternalStore, createElement as createElement$1, forwardRef, useRef, useLayoutEffect, createContext, Fragment } from 'react';
-import { isNotPresent, isPresent, isNotEmpty } from '@bigbinary/neeto-cist';
+import { isNotPresent, isPresent, isNotEmpty, existsBy } from '@bigbinary/neeto-cist';
 import Frame, { useFrame } from 'react-frame-component';
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
@@ -14549,13 +14549,14 @@ var _excluded$e = ["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$1(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 FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
+  var _configurations$prope, _features, _features2, _features3, _features4, _features5;
   var configurations = _ref.configurations,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     id = _ref.id,
     image = _ref.image,
     otherProps = _objectWithoutProperties(_ref, _excluded$e);
-  var _useState = useState(configurations.properties.features[0].id),
+  var _useState = useState(((_configurations$prope = configurations.properties.features[0]) === null || _configurations$prope === void 0 ? void 0 : _configurations$prope.position) || 1),
     _useState2 = _slicedToArray(_useState, 2),
     selectedTabId = _useState2[0],
     setSelectedTabId = _useState2[1];
@@ -14603,6 +14604,15 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
       return clearInterval(id);
     };
   }, [selectedTabId]);
+  useEffect(function () {
+    var tabExists = existsBy({
+      position: selectedTabId
+    }, features);
+    if (!tabExists && isNotEmpty(features)) {
+      clearInterval(intervalId);
+      setSelectedTabId(features[0].position);
+    }
+  }, [features.length]);
   var imageBaseClasses = classnames("col-span-12 flex justify-center", {
     "lg:col-start-7": contentPosition === POSITIONS.LEFT.label,
     "lg:col-span-6": contentPosition === POSITIONS.RIGHT.label
@@ -14636,13 +14646,13 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
         children: description
       })), features.map(function (_ref2, index) {
         var featureTitle = _ref2.title,
-          id = _ref2.id;
+          position = _ref2.position;
         return /*#__PURE__*/createElement$1(MotionWrapper, {
           enableAnimation: enableAnimation,
           className: "relative cursor-pointer",
           key: getUniqueKey(featureTitle, index),
           onClick: function onClick() {
-            return handleTabClick(id);
+            return handleTabClick(position);
           }
         }, /*#__PURE__*/jsx(Typography$1, _objectSpread$e(_objectSpread$e({
           index: index,
@@ -14658,7 +14668,7 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
             backgroundColor: "#E6E6E6",
             height: "1px"
           },
-          children: selectedTabId === id && /*#__PURE__*/jsx(StyledWrapper, {
+          children: selectedTabId === position && /*#__PURE__*/jsx(StyledWrapper, {
             className: "h-full rounded-xl transition-all duration-300 ease-in-out",
             design: {
               width: "0%",
@@ -14672,16 +14682,16 @@ var FeatureWithProgressBar = function FeatureWithProgressBar(_ref) {
       className: imageBaseClasses,
       children: /*#__PURE__*/jsx(Media, {
         image: image,
-        alt: features[selectedTabId - 1].media.alt,
-        autoPlay: features[selectedTabId - 1].media.autoPlay,
+        alt: (_features = features[selectedTabId - 1]) === null || _features === void 0 ? void 0 : _features.media.alt,
+        autoPlay: (_features2 = features[selectedTabId - 1]) === null || _features2 === void 0 ? void 0 : _features2.media.autoPlay,
         design: design.media,
         disableButtonAndLinks: otherProps.disableButtonAndLinks,
         id: "feature-with-progress-bar-".concat(selectedTabId - 1, "-media"),
         index: selectedTabId - 1,
         isAddNewPane: otherProps.isAddNewPane,
-        isEmbedded: features[selectedTabId - 1].media.isEmbedded,
-        src: features[selectedTabId - 1].media.src,
-        videoUrl: features[selectedTabId - 1].media.videoUrl,
+        isEmbedded: (_features3 = features[selectedTabId - 1]) === null || _features3 === void 0 ? void 0 : _features3.media.isEmbedded,
+        src: (_features4 = features[selectedTabId - 1]) === null || _features4 === void 0 ? void 0 : _features4.media.src,
+        videoUrl: (_features5 = features[selectedTabId - 1]) === null || _features5 === void 0 ? void 0 : _features5.media.videoUrl,
         wrapperClassName: "h-full w-full"
       })
     })]