@blaze-cms/react-page-builder 0.146.0-node18-core-styles-tooltips.45 → 0.146.0-node18-tooltips.38

package/lib-es/variants/ThumbnailCarousel/ThumbnailCarousel.js

@@ -0,0 +1,49 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import useThumbnailCarousel from './useThumbnailCarousel';
+import ThumbnailImage from './ThumbnailImage';
+const ThumbnailCarousel = props => {
+  const {
+    thumbnailsListRef,
+    imageIds,
+    selectedImageId,
+    priorityLimit,
+    scrollToImage,
+    mainImageButtonClick
+  } = useThumbnailCarousel(props);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "thumbnail-carousel",
+    "data-testid": "thumbnail-carousel"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "thumbnail-carousel__main_image_container"
+  }, /*#__PURE__*/React.createElement("div", {
+    id: "previous-button",
+    className: "thumbnail-carousel__main_image_container__button",
+    role: "button",
+    onClick: () => mainImageButtonClick()
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "arrow arrow--left"
+  })), /*#__PURE__*/React.createElement(ThumbnailImage, _extends({}, props, {
+    priority: true,
+    imageId: selectedImageId
+  })), /*#__PURE__*/React.createElement("div", {
+    id: "next-button",
+    className: "thumbnail-carousel__main_image_container__button next",
+    role: "button",
+    onClick: () => mainImageButtonClick(true)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "arrow arrow--right"
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "thumbnail-carousel__list",
+    ref: thumbnailsListRef
+  }, imageIds.map((imageId, index) => /*#__PURE__*/React.createElement(ThumbnailImage, _extends({}, props, {
+    key: imageId,
+    imageIndex: index,
+    priority: index < priorityLimit,
+    imageId: imageId,
+    selectedImageId: selectedImageId,
+    scrollToImage: scrollToImage
+  })))));
+};
+export default ThumbnailCarousel;
+//# sourceMappingURL=ThumbnailCarousel.js.map

package/lib-es/variants/ThumbnailCarousel/ThumbnailCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThumbnailCarousel.js","names":["React","useThumbnailCarousel","ThumbnailImage","ThumbnailCarousel","props","thumbnailsListRef","imageIds","selectedImageId","priorityLimit","scrollToImage","mainImageButtonClick","createElement","className","id","role","onClick","_extends","priority","imageId","ref","map","index","key","imageIndex"],"sources":["../../../src/variants/ThumbnailCarousel/ThumbnailCarousel.js"],"sourcesContent":["import React from 'react';\nimport useThumbnailCarousel from './useThumbnailCarousel';\nimport ThumbnailImage from './ThumbnailImage';\n\nconst ThumbnailCarousel = props => {\n  const {\n    thumbnailsListRef,\n    imageIds,\n    selectedImageId,\n    priorityLimit,\n    scrollToImage,\n    mainImageButtonClick\n  } = useThumbnailCarousel(props);\n\n  return (\n    <div className=\"thumbnail-carousel\" data-testid=\"thumbnail-carousel\">\n      <div className=\"thumbnail-carousel__main_image_container\">\n        <div\n          id=\"previous-button\"\n          className=\"thumbnail-carousel__main_image_container__button\"\n          role=\"button\"\n          onClick={() => mainImageButtonClick()}>\n          <div className=\"arrow arrow--left\" />\n        </div>\n        <ThumbnailImage {...props} priority imageId={selectedImageId} />\n        <div\n          id=\"next-button\"\n          className=\"thumbnail-carousel__main_image_container__button next\"\n          role=\"button\"\n          onClick={() => mainImageButtonClick(true)}>\n          <div className=\"arrow arrow--right\" />\n        </div>\n      </div>\n      <div className=\"thumbnail-carousel__list\" ref={thumbnailsListRef}>\n        {imageIds.map((imageId, index) => (\n          <ThumbnailImage\n            {...props}\n            key={imageId}\n            imageIndex={index}\n            priority={index < priorityLimit}\n            imageId={imageId}\n            selectedImageId={selectedImageId}\n            scrollToImage={scrollToImage}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default ThumbnailCarousel;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,oBAAoB,MAAM,wBAAwB;AACzD,OAAOC,cAAc,MAAM,kBAAkB;AAE7C,MAAMC,iBAAiB,GAAGC,KAAK,IAAI;EACjC,MAAM;IACJC,iBAAiB;IACjBC,QAAQ;IACRC,eAAe;IACfC,aAAa;IACbC,aAAa;IACbC;EACF,CAAC,GAAGT,oBAAoB,CAACG,KAAK,CAAC;EAE/B,oBACEJ,KAAA,CAAAW,aAAA;IAAKC,SAAS,EAAC,oBAAoB;IAAC,eAAY;EAAoB,gBAClEZ,KAAA,CAAAW,aAAA;IAAKC,SAAS,EAAC;EAA0C,gBACvDZ,KAAA,CAAAW,aAAA;IACEE,EAAE,EAAC,iBAAiB;IACpBD,SAAS,EAAC,kDAAkD;IAC5DE,IAAI,EAAC,QAAQ;IACbC,OAAO,EAAEA,CAAA,KAAML,oBAAoB,CAAC;EAAE,gBACtCV,KAAA,CAAAW,aAAA;IAAKC,SAAS,EAAC;EAAmB,CAAE,CACjC,CAAC,eACNZ,KAAA,CAAAW,aAAA,CAACT,cAAc,EAAAc,QAAA,KAAKZ,KAAK;IAAEa,QAAQ;IAACC,OAAO,EAAEX;EAAgB,EAAE,CAAC,eAChEP,KAAA,CAAAW,aAAA;IACEE,EAAE,EAAC,aAAa;IAChBD,SAAS,EAAC,uDAAuD;IACjEE,IAAI,EAAC,QAAQ;IACbC,OAAO,EAAEA,CAAA,KAAML,oBAAoB,CAAC,IAAI;EAAE,gBAC1CV,KAAA,CAAAW,aAAA;IAAKC,SAAS,EAAC;EAAoB,CAAE,CAClC,CACF,CAAC,eACNZ,KAAA,CAAAW,aAAA;IAAKC,SAAS,EAAC,0BAA0B;IAACO,GAAG,EAAEd;EAAkB,GAC9DC,QAAQ,CAACc,GAAG,CAAC,CAACF,OAAO,EAAEG,KAAK,kBAC3BrB,KAAA,CAAAW,aAAA,CAACT,cAAc,EAAAc,QAAA,KACTZ,KAAK;IACTkB,GAAG,EAAEJ,OAAQ;IACbK,UAAU,EAAEF,KAAM;IAClBJ,QAAQ,EAAEI,KAAK,GAAGb,aAAc;IAChCU,OAAO,EAAEA,OAAQ;IACjBX,eAAe,EAAEA,eAAgB;IACjCE,aAAa,EAAEA;EAAc,EAC9B,CACF,CACE,CACF,CAAC;AAEV,CAAC;AAED,eAAeN,iBAAiB","ignoreList":[]}

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/ThumbnailImage.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import LazyImage from '../../../components/LazyImage';
+import useThumbnailImage from './useThumbnailImage';
+const ThumbnailImage = props => {
+  const {
+    loading,
+    error,
+    className,
+    imageUrl,
+    altText,
+    priority,
+    handleClick
+  } = useThumbnailImage(props);
+  if (error) return error.message;
+  if (loading) return null;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className,
+    onClick: handleClick,
+    role: "button",
+    "data-testid": "thumbnail-image"
+  }, /*#__PURE__*/React.createElement(LazyImage, {
+    src: imageUrl,
+    alt: altText,
+    sizeKey: "carousel",
+    role: "button",
+    priority: priority
+  }));
+};
+export default ThumbnailImage;
+//# sourceMappingURL=ThumbnailImage.js.map

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/ThumbnailImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThumbnailImage.js","names":["React","LazyImage","useThumbnailImage","ThumbnailImage","props","loading","error","className","imageUrl","altText","priority","handleClick","message","createElement","onClick","role","src","alt","sizeKey"],"sources":["../../../../src/variants/ThumbnailCarousel/ThumbnailImage/ThumbnailImage.js"],"sourcesContent":["import React from 'react';\nimport LazyImage from '../../../components/LazyImage';\nimport useThumbnailImage from './useThumbnailImage';\n\nconst ThumbnailImage = props => {\n  const { loading, error, className, imageUrl, altText, priority, handleClick } =\n    useThumbnailImage(props);\n\n  if (error) return error.message;\n  if (loading) return null;\n\n  return (\n    <div className={className} onClick={handleClick} role=\"button\" data-testid=\"thumbnail-image\">\n      <LazyImage\n        src={imageUrl}\n        alt={altText}\n        sizeKey=\"carousel\"\n        role=\"button\"\n        priority={priority}\n      />\n    </div>\n  );\n};\n\nexport default ThumbnailImage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,+BAA+B;AACrD,OAAOC,iBAAiB,MAAM,qBAAqB;AAEnD,MAAMC,cAAc,GAAGC,KAAK,IAAI;EAC9B,MAAM;IAAEC,OAAO;IAAEC,KAAK;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,OAAO;IAAEC,QAAQ;IAAEC;EAAY,CAAC,GAC3ET,iBAAiB,CAACE,KAAK,CAAC;EAE1B,IAAIE,KAAK,EAAE,OAAOA,KAAK,CAACM,OAAO;EAC/B,IAAIP,OAAO,EAAE,OAAO,IAAI;EAExB,oBACEL,KAAA,CAAAa,aAAA;IAAKN,SAAS,EAAEA,SAAU;IAACO,OAAO,EAAEH,WAAY;IAACI,IAAI,EAAC,QAAQ;IAAC,eAAY;EAAiB,gBAC1Ff,KAAA,CAAAa,aAAA,CAACZ,SAAS;IACRe,GAAG,EAAER,QAAS;IACdS,GAAG,EAAER,OAAQ;IACbS,OAAO,EAAC,UAAU;IAClBH,IAAI,EAAC,QAAQ;IACbL,QAAQ,EAAEA;EAAS,CACpB,CACE,CAAC;AAEV,CAAC;AAED,eAAeP,cAAc","ignoreList":[]}

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/index.js

@@ -0,0 +1,3 @@
+import ThumbnailImage from './ThumbnailImage';
+export default ThumbnailImage;
+//# sourceMappingURL=index.js.map

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ThumbnailImage"],"sources":["../../../../src/variants/ThumbnailCarousel/ThumbnailImage/index.js"],"sourcesContent":["import ThumbnailImage from './ThumbnailImage';\n\nexport default ThumbnailImage;\n"],"mappings":"AAAA,OAAOA,cAAc,MAAM,kBAAkB;AAE7C,eAAeA,cAAc","ignoreList":[]}

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/useThumbnailImage.js

@@ -0,0 +1,62 @@
+import PropTypes from 'prop-types';
+import { useGetImages } from '../../../hooks';
+import { getImageData } from '../../../utils';
+const useThumbnailImage = ({
+  imageId,
+  imageIndex,
+  enableLightbox,
+  toggleModal,
+  handleSelectedImage,
+  priority,
+  selectedImageId,
+  scrollToImage
+}) => {
+  const {
+    data = {},
+    loading,
+    error
+  } = useGetImages(imageId);
+  const handleClick = () => {
+    if (scrollToImage) scrollToImage(imageIndex);else if (enableLightbox) {
+      toggleModal();
+      handleSelectedImage(imageId);
+    }
+  };
+  const {
+    url: imageUrl = '',
+    data: imageData = {}
+  } = data.getFile || {
+    getFile: {
+      url: '',
+      data: {}
+    }
+  };
+  const {
+    altText
+  } = getImageData({}, imageData);
+  const className = selectedImageId === imageId ? 'thumbnail-carousel-image thumbnail-carousel-image--selected' : 'thumbnail-carousel-image';
+  return {
+    loading,
+    error,
+    className,
+    imageId,
+    imageUrl,
+    altText,
+    priority,
+    handleClick
+  };
+};
+useThumbnailImage.propTypes = {
+  imageId: PropTypes.string.isRequired,
+  selectedImageId: PropTypes.string.isRequired,
+  enableLightbox: PropTypes.bool.isRequired,
+  toggleModal: PropTypes.func.isRequired,
+  handleSelectedImage: PropTypes.func.isRequired,
+  priority: PropTypes.bool.isRequired,
+  scrollToImage: PropTypes.func
+};
+useThumbnailImage.defaultProps = {
+  scrollToImage: null
+};
+export default useThumbnailImage;
+//# sourceMappingURL=useThumbnailImage.js.map

package/lib-es/variants/ThumbnailCarousel/ThumbnailImage/useThumbnailImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThumbnailImage.js","names":["PropTypes","useGetImages","getImageData","useThumbnailImage","imageId","imageIndex","enableLightbox","toggleModal","handleSelectedImage","priority","selectedImageId","scrollToImage","data","loading","error","handleClick","url","imageUrl","imageData","getFile","altText","className","propTypes","string","isRequired","bool","func","defaultProps"],"sources":["../../../../src/variants/ThumbnailCarousel/ThumbnailImage/useThumbnailImage.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { useGetImages } from '../../../hooks';\nimport { getImageData } from '../../../utils';\n\nconst useThumbnailImage = ({\n  imageId,\n  imageIndex,\n  enableLightbox,\n  toggleModal,\n  handleSelectedImage,\n  priority,\n  selectedImageId,\n  scrollToImage\n}) => {\n  const { data = {}, loading, error } = useGetImages(imageId);\n\n  const handleClick = () => {\n    if (scrollToImage) scrollToImage(imageIndex);\n    else if (enableLightbox) {\n      toggleModal();\n      handleSelectedImage(imageId);\n    }\n  };\n\n  const { url: imageUrl = '', data: imageData = {} } = data.getFile || {\n    getFile: { url: '', data: {} }\n  };\n  const { altText } = getImageData({}, imageData);\n\n  const className =\n    selectedImageId === imageId\n      ? 'thumbnail-carousel-image thumbnail-carousel-image--selected'\n      : 'thumbnail-carousel-image';\n\n  return {\n    loading,\n    error,\n    className,\n    imageId,\n    imageUrl,\n    altText,\n    priority,\n    handleClick\n  };\n};\n\nuseThumbnailImage.propTypes = {\n  imageId: PropTypes.string.isRequired,\n  selectedImageId: PropTypes.string.isRequired,\n  enableLightbox: PropTypes.bool.isRequired,\n  toggleModal: PropTypes.func.isRequired,\n  handleSelectedImage: PropTypes.func.isRequired,\n  priority: PropTypes.bool.isRequired,\n  scrollToImage: PropTypes.func\n};\n\nuseThumbnailImage.defaultProps = {\n  scrollToImage: null\n};\n\nexport default useThumbnailImage;\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,YAAY;AAClC,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,YAAY,QAAQ,gBAAgB;AAE7C,MAAMC,iBAAiB,GAAGA,CAAC;EACzBC,OAAO;EACPC,UAAU;EACVC,cAAc;EACdC,WAAW;EACXC,mBAAmB;EACnBC,QAAQ;EACRC,eAAe;EACfC;AACF,CAAC,KAAK;EACJ,MAAM;IAAEC,IAAI,GAAG,CAAC,CAAC;IAAEC,OAAO;IAAEC;EAAM,CAAC,GAAGb,YAAY,CAACG,OAAO,CAAC;EAE3D,MAAMW,WAAW,GAAGA,CAAA,KAAM;IACxB,IAAIJ,aAAa,EAAEA,aAAa,CAACN,UAAU,CAAC,CAAC,KACxC,IAAIC,cAAc,EAAE;MACvBC,WAAW,CAAC,CAAC;MACbC,mBAAmB,CAACJ,OAAO,CAAC;IAC9B;EACF,CAAC;EAED,MAAM;IAAEY,GAAG,EAAEC,QAAQ,GAAG,EAAE;IAAEL,IAAI,EAAEM,SAAS,GAAG,CAAC;EAAE,CAAC,GAAGN,IAAI,CAACO,OAAO,IAAI;IACnEA,OAAO,EAAE;MAAEH,GAAG,EAAE,EAAE;MAAEJ,IAAI,EAAE,CAAC;IAAE;EAC/B,CAAC;EACD,MAAM;IAAEQ;EAAQ,CAAC,GAAGlB,YAAY,CAAC,CAAC,CAAC,EAAEgB,SAAS,CAAC;EAE/C,MAAMG,SAAS,GACbX,eAAe,KAAKN,OAAO,GACvB,6DAA6D,GAC7D,0BAA0B;EAEhC,OAAO;IACLS,OAAO;IACPC,KAAK;IACLO,SAAS;IACTjB,OAAO;IACPa,QAAQ;IACRG,OAAO;IACPX,QAAQ;IACRM;EACF,CAAC;AACH,CAAC;AAEDZ,iBAAiB,CAACmB,SAAS,GAAG;EAC5BlB,OAAO,EAAEJ,SAAS,CAACuB,MAAM,CAACC,UAAU;EACpCd,eAAe,EAAEV,SAAS,CAACuB,MAAM,CAACC,UAAU;EAC5ClB,cAAc,EAAEN,SAAS,CAACyB,IAAI,CAACD,UAAU;EACzCjB,WAAW,EAAEP,SAAS,CAAC0B,IAAI,CAACF,UAAU;EACtChB,mBAAmB,EAAER,SAAS,CAAC0B,IAAI,CAACF,UAAU;EAC9Cf,QAAQ,EAAET,SAAS,CAACyB,IAAI,CAACD,UAAU;EACnCb,aAAa,EAAEX,SAAS,CAAC0B;AAC3B,CAAC;AAEDvB,iBAAiB,CAACwB,YAAY,GAAG;EAC/BhB,aAAa,EAAE;AACjB,CAAC;AAED,eAAeR,iBAAiB","ignoreList":[]}

package/lib-es/variants/ThumbnailCarousel/index.js

@@ -0,0 +1,10 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import dynamic from 'next/dynamic';
+const ThumbnailCarousel = {
+  getSettings: componentSettings => _objectSpread({}, componentSettings),
+  VariantComponent: dynamic(() => import(/* webpackChunkName: "blazePbVariantThumbnailCarousel" */'./ThumbnailCarousel'))
+};
+export default ThumbnailCarousel;
+//# sourceMappingURL=index.js.map

package/lib-es/variants/ThumbnailCarousel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["dynamic","ThumbnailCarousel","getSettings","componentSettings","_objectSpread","VariantComponent"],"sources":["../../../src/variants/ThumbnailCarousel/index.js"],"sourcesContent":["import dynamic from 'next/dynamic';\n\nconst ThumbnailCarousel = {\n  getSettings: componentSettings => ({\n    ...componentSettings\n  }),\n  VariantComponent: dynamic(\n    () => import(/* webpackChunkName: \"blazePbVariantThumbnailCarousel\" */ './ThumbnailCarousel')\n  )\n};\n\nexport default ThumbnailCarousel;\n"],"mappings":";;;AAAA,OAAOA,OAAO,MAAM,cAAc;AAElC,MAAMC,iBAAiB,GAAG;EACxBC,WAAW,EAAEC,iBAAiB,IAAAC,aAAA,KACzBD,iBAAiB,CACpB;EACFE,gBAAgB,EAAEL,OAAO,CACvB,MAAM,MAAM,CAAC,yDAA0D,qBAAqB,CAC9F;AACF,CAAC;AAED,eAAeC,iBAAiB","ignoreList":[]}

package/lib-es/variants/ThumbnailCarousel/useThumbnailCarousel.js

@@ -0,0 +1,47 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+const _excluded = ["imageIds", "priorityLimit"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import { useState, useRef } from 'react';
+const useThumbnailCarousel = _ref => {
+  let {
+      imageIds,
+      priorityLimit
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const [selectedImageIndex, setSelectedImageIndex] = useState(0);
+  const thumbnailsListRef = useRef(null);
+  const selectedImageId = imageIds[selectedImageIndex];
+  const mainImageButtonClick = next => {
+    let newIndex;
+    if (next) {
+      const isLast = imageIds.length - 1 === selectedImageIndex;
+      newIndex = isLast ? 0 : selectedImageIndex + 1;
+    } else {
+      const isFirst = selectedImageIndex === 0;
+      newIndex = isFirst ? imageIds.length - 1 : selectedImageIndex - 1;
+    }
+    scrollToImage(newIndex);
+  };
+  const scrollToImage = newIndex => {
+    if (thumbnailsListRef.current && selectedImageIndex !== newIndex) {
+      thumbnailsListRef.current.scrollTo({
+        left: 150 * newIndex,
+        behavior: 'smooth'
+      });
+      setSelectedImageIndex(newIndex);
+    }
+  };
+  return _objectSpread(_objectSpread({}, props), {}, {
+    imageIds,
+    selectedImageId,
+    selectedImageIndex,
+    thumbnailsListRef,
+    priorityLimit,
+    scrollToImage,
+    mainImageButtonClick
+  });
+};
+export default useThumbnailCarousel;
+//# sourceMappingURL=useThumbnailCarousel.js.map

package/lib-es/variants/ThumbnailCarousel/useThumbnailCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThumbnailCarousel.js","names":["useState","useRef","useThumbnailCarousel","_ref","imageIds","priorityLimit","props","_objectWithoutProperties","_excluded","selectedImageIndex","setSelectedImageIndex","thumbnailsListRef","selectedImageId","mainImageButtonClick","next","newIndex","isLast","length","isFirst","scrollToImage","current","scrollTo","left","behavior","_objectSpread"],"sources":["../../../src/variants/ThumbnailCarousel/useThumbnailCarousel.js"],"sourcesContent":["import { useState, useRef } from 'react';\n\nconst useThumbnailCarousel = ({ imageIds, priorityLimit, ...props }) => {\n  const [selectedImageIndex, setSelectedImageIndex] = useState(0);\n  const thumbnailsListRef = useRef(null);\n  const selectedImageId = imageIds[selectedImageIndex];\n\n  const mainImageButtonClick = next => {\n    let newIndex;\n    if (next) {\n      const isLast = imageIds.length - 1 === selectedImageIndex;\n      newIndex = isLast ? 0 : selectedImageIndex + 1;\n    } else {\n      const isFirst = selectedImageIndex === 0;\n      newIndex = isFirst ? imageIds.length - 1 : selectedImageIndex - 1;\n    }\n    scrollToImage(newIndex);\n  };\n\n  const scrollToImage = newIndex => {\n    if (thumbnailsListRef.current && selectedImageIndex !== newIndex) {\n      thumbnailsListRef.current.scrollTo({\n        left: 150 * newIndex,\n        behavior: 'smooth'\n      });\n      setSelectedImageIndex(newIndex);\n    }\n  };\n\n  return {\n    ...props,\n    imageIds,\n    selectedImageId,\n    selectedImageIndex,\n    thumbnailsListRef,\n    priorityLimit,\n    scrollToImage,\n    mainImageButtonClick\n  };\n};\n\nexport default useThumbnailCarousel;\n"],"mappings":";;;;;AAAA,SAASA,QAAQ,EAAEC,MAAM,QAAQ,OAAO;AAExC,MAAMC,oBAAoB,GAAGC,IAAA,IAA2C;EAAA,IAA1C;MAAEC,QAAQ;MAAEC;IAAwB,CAAC,GAAAF,IAAA;IAAPG,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAC/D,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGV,QAAQ,CAAC,CAAC,CAAC;EAC/D,MAAMW,iBAAiB,GAAGV,MAAM,CAAC,IAAI,CAAC;EACtC,MAAMW,eAAe,GAAGR,QAAQ,CAACK,kBAAkB,CAAC;EAEpD,MAAMI,oBAAoB,GAAGC,IAAI,IAAI;IACnC,IAAIC,QAAQ;IACZ,IAAID,IAAI,EAAE;MACR,MAAME,MAAM,GAAGZ,QAAQ,CAACa,MAAM,GAAG,CAAC,KAAKR,kBAAkB;MACzDM,QAAQ,GAAGC,MAAM,GAAG,CAAC,GAAGP,kBAAkB,GAAG,CAAC;IAChD,CAAC,MAAM;MACL,MAAMS,OAAO,GAAGT,kBAAkB,KAAK,CAAC;MACxCM,QAAQ,GAAGG,OAAO,GAAGd,QAAQ,CAACa,MAAM,GAAG,CAAC,GAAGR,kBAAkB,GAAG,CAAC;IACnE;IACAU,aAAa,CAACJ,QAAQ,CAAC;EACzB,CAAC;EAED,MAAMI,aAAa,GAAGJ,QAAQ,IAAI;IAChC,IAAIJ,iBAAiB,CAACS,OAAO,IAAIX,kBAAkB,KAAKM,QAAQ,EAAE;MAChEJ,iBAAiB,CAACS,OAAO,CAACC,QAAQ,CAAC;QACjCC,IAAI,EAAE,GAAG,GAAGP,QAAQ;QACpBQ,QAAQ,EAAE;MACZ,CAAC,CAAC;MACFb,qBAAqB,CAACK,QAAQ,CAAC;IACjC;EACF,CAAC;EAED,OAAAS,aAAA,CAAAA,aAAA,KACKlB,KAAK;IACRF,QAAQ;IACRQ,eAAe;IACfH,kBAAkB;IAClBE,iBAAiB;IACjBN,aAAa;IACbc,aAAa;IACbN;EAAoB;AAExB,CAAC;AAED,eAAeX,oBAAoB","ignoreList":[]}

package/lib-es/variants/index.js

@@ -0,0 +1,21 @@
+import heroImage from './HeroImage';
+import infographic from './Infographic';
+import longformGallery from './LongformGallery';
+import longformRow from './LongformRow';
+import parallaxImageTextRight from './ParallaxImageTextRight';
+import thumbnailCarousel from './ThumbnailCarousel';
+import slideSummary from './SlideSummary';
+import floatingSideButton from './FloatingSideButton';
+import liveBlogList from './LiveBlogList';
+export default {
+  heroImage,
+  infographic,
+  longformGallery,
+  longformRow,
+  parallaxImageTextRight,
+  thumbnailCarousel,
+  slideSummary,
+  floatingSideButton,
+  liveBlogList
+};
+//# sourceMappingURL=index.js.map

package/lib-es/variants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["heroImage","infographic","longformGallery","longformRow","parallaxImageTextRight","thumbnailCarousel","slideSummary","floatingSideButton","liveBlogList"],"sources":["../../src/variants/index.js"],"sourcesContent":["import heroImage from './HeroImage';\nimport infographic from './Infographic';\nimport longformGallery from './LongformGallery';\nimport longformRow from './LongformRow';\nimport parallaxImageTextRight from './ParallaxImageTextRight';\nimport thumbnailCarousel from './ThumbnailCarousel';\nimport slideSummary from './SlideSummary';\nimport floatingSideButton from './FloatingSideButton';\nimport liveBlogList from './LiveBlogList';\n\nexport default {\n  heroImage,\n  infographic,\n  longformGallery,\n  longformRow,\n  parallaxImageTextRight,\n  thumbnailCarousel,\n  slideSummary,\n  floatingSideButton,\n  liveBlogList\n};\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,aAAa;AACnC,OAAOC,WAAW,MAAM,eAAe;AACvC,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,OAAOC,WAAW,MAAM,eAAe;AACvC,OAAOC,sBAAsB,MAAM,0BAA0B;AAC7D,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,OAAOC,YAAY,MAAM,gBAAgB;AACzC,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,OAAOC,YAAY,MAAM,gBAAgB;AAEzC,eAAe;EACbR,SAAS;EACTC,WAAW;EACXC,eAAe;EACfC,WAAW;EACXC,sBAAsB;EACtBC,iBAAiB;EACjBC,YAAY;EACZC,kBAAkB;EAClBC;AACF,CAAC","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blaze-cms/react-page-builder",
-  "version": "0.146.0-node18-core-styles-tooltips.45",
+  "version": "0.146.0-node18-tooltips.38",
   "description": "Blaze react page builder",
   "main": "lib/index.js",
   "module": "lib-es/index.js",
@@ -27,15 +27,15 @@
   },
   "license": "GPL-3.0",
   "dependencies": {
-    "@blaze-cms/core-auth-ui": "0.146.0-node18-core-styles-tooltips.38",
-    "@blaze-cms/core-errors": "0.146.0-node18-core-styles-tooltips.3",
-    "@blaze-cms/core-errors-ui": "0.146.0-node18-core-styles-tooltips.3",
+    "@blaze-cms/core-auth-ui": "0.146.0-node18-tooltips.32",
+    "@blaze-cms/core-errors": "0.146.0-node18-tooltips.0",
+    "@blaze-cms/core-errors-ui": "0.146.0-node18-tooltips.0",
     "@blaze-cms/image-cdn-react": "0.3.0-alpha.7",
-    "@blaze-cms/nextjs-components": "0.146.0-node18-core-styles-tooltips.45",
-    "@blaze-cms/plugin-search-ui": "0.146.0-node18-core-styles-tooltips.45",
-    "@blaze-cms/setup-ui": "0.146.0-node18-core-styles-tooltips.3",
-    "@blaze-cms/utils": "0.146.0-node18-core-styles-tooltips.38",
-    "@blaze-cms/utils-handlebars": "0.146.0-node18-core-styles-tooltips.45",
+    "@blaze-cms/nextjs-components": "0.146.0-node18-tooltips.38",
+    "@blaze-cms/plugin-search-ui": "0.146.0-node18-tooltips.37",
+    "@blaze-cms/setup-ui": "0.146.0-node18-tooltips.0",
+    "@blaze-cms/utils": "0.146.0-node18-tooltips.32",
+    "@blaze-cms/utils-handlebars": "0.146.0-node18-tooltips.38",
     "@blaze-react/badge": "^0.7.0",
     "@blaze-react/breadcrumb": "0.8.0-alpha.60",
     "@blaze-react/button": "0.8.0-alpha.82",
@@ -91,5 +91,6 @@
   "eslintIgnore": [
     "lib/*",
     "lib-es/*"
-  ]
+  ],
+  "gitHead": "c47206fe5d789c5d3828b10016d73894feac3ae9"
 }

package/src/components/Menu/Menu.js

@@ -11,7 +11,6 @@ import BlazeLink from '../BlazeLink';
 const Menu = ({
   children,
   collapse,
-  openActiveSubmenus,
   modifier,
   mobileMenuModifier,
   mobileMenuChildrenModifier,
@@ -52,7 +51,7 @@ const Menu = ({
   });
 
   return (
-    <MenuContext.Provider value={{ showMobileMenu, openActiveSubmenus }}>
+    <MenuContext.Provider value={{ showMobileMenu }}>
       <div className={menuWrapperClasses}>
         {collapse && (
           <div className="menu--mobile-wrapper">
@@ -100,7 +99,6 @@ const Menu = ({
 
 Menu.propTypes = {
   collapse: PropTypes.bool.isRequired,
-  openActiveSubmenus: PropTypes.bool.isRequired,
   logoOnMobile: PropTypes.bool.isRequired,
   logoOnDesktop: PropTypes.bool,
   logoOnMobileUrl: PropTypes.string,

package/src/components/Menu/MenuContext.js

@@ -1,5 +1,5 @@
 import React from 'react';
 
-const MenuContext = React.createContext({ showMobileMenu: false, openActiveSubmenus: false });
+const MenuContext = React.createContext({ showMobileMenu: false });
 
 export default MenuContext;

package/src/components/MenuItem/MenuItemRender.js

@@ -1,23 +1,17 @@
-/* eslint-disable jsx-a11y/no-static-element-interactions */
 import React, { useState, useContext, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { FaChevronDown, FaChevronUp } from 'react-icons/fa';
-import classnames from 'classnames';
 import { useRouter } from 'next/router';
 import { useStringTemplate } from '@blaze-cms/utils-handlebars';
-import { HOVER, MOUSE_ENTER, MOUSE_LEAVE, HIDDEN, CLICK } from '../../constants';
+import { HOVER, MOUSE_ENTER, MOUSE_LEAVE, HIDDEN } from '../../constants';
 import { hasChildren } from '../../helpers';
 import BlazeLink from '../BlazeLink';
 import MenuContext from '../Menu/MenuContext';
-import { injectHelperIntoTemplate, isUrlPathMatch, hasActiveChild } from './helpers';
+import { injectHelperIntoTemplate } from './helpers';
 
 const MenuItemRender = ({ children, eventType, text, modifier, url, parent }) => {
-  const router = useRouter();
-  const { showMobileMenu, openActiveSubmenus } = useContext(MenuContext);
-
-  const isHoverEvent = eventType === HOVER;
-  const isClickEvent = eventType === CLICK;
-
+  const [displayChildren, setDisplayChildren] = useState(false);
+  const { showMobileMenu } = useContext(MenuContext);
   const {
     loading: loadingText,
     data: [textToUse]
@@ -27,24 +21,14 @@ const MenuItemRender = ({ children, eventType, text, modifier, url, parent }) =>
     data: [urlToUse]
   } = useStringTemplate(parent, [injectHelperIntoTemplate(url, 'url_encode')]);
 
-  const isActive = router ? isUrlPathMatch(router.asPath, urlToUse) : false;
-  const isActiveParent = router ? hasActiveChild(router.asPath, children) : false;
-  const shouldPreOpen = openActiveSubmenus && isActiveParent && isClickEvent;
+  const router = useRouter();
+  const isHoverEvent = eventType === HOVER;
+  const childrenDisplayClass = displayChildren ? '' : HIDDEN;
   const hasValidChildren = hasChildren(children);
 
-  const [displayChildren, setDisplayChildren] = useState(shouldPreOpen);
-
   useEffect(() => {
-    if (!showMobileMenu && !shouldPreOpen) setDisplayChildren(false);
-  }, [
-    children,
-    isClickEvent,
-    loadingUrl,
-    openActiveSubmenus,
-    router,
-    shouldPreOpen,
-    showMobileMenu
-  ]);
+    if (!showMobileMenu) setDisplayChildren(false);
+  }, [showMobileMenu]);
 
   useEffect(() => {
     if (isHoverEvent) {
@@ -54,8 +38,6 @@ const MenuItemRender = ({ children, eventType, text, modifier, url, parent }) =>
 
   if (loadingUrl || loadingText) return '';
 
-  const childrenDisplayClass = displayChildren ? '' : HIDDEN;
-
   const handleItemEvent = ({ type }) => {
     if (isHoverEvent) {
       if (type === MOUSE_ENTER) {
@@ -73,25 +55,15 @@ const MenuItemRender = ({ children, eventType, text, modifier, url, parent }) =>
     }
   };
 
-  const menuItemLinkClassname = classnames('menu--item--link', {
-    'menu--item--link--active': isActive,
-    'menu--item--link--active-parent': isActiveParent
-  });
-
   return (
     <li className={modifier} onMouseEnter={handleItemEvent} onMouseLeave={handleItemEvent}>
       <div
-        className={menuItemLinkClassname}
+        className="menu--item--link"
         onClick={handleMobileClick}
         role={!urlToUse && hasValidChildren ? 'button' : undefined}
         tabIndex={!urlToUse && hasValidChildren ? 0 : undefined}>
-        {urlToUse ? (
-          <BlazeLink href={urlToUse}>{textToUse}</BlazeLink>
-        ) : (
-          <span role="button" onClick={handleItemEvent}>
-            {textToUse}
-          </span>
-        )}
+        {urlToUse ? <BlazeLink href={urlToUse}>{textToUse}</BlazeLink> : <span>{textToUse}</span>}
+
         {hasValidChildren && (
           <i
             role="button"

package/src/components/MenuItem/helpers/index.js

@@ -1,5 +1,3 @@
 import injectHelperIntoTemplate from './inject-helper-into-template';
-import isUrlPathMatch from './isUrlPathMatch';
-import hasActiveChild from './has-active-child';
 
-export { injectHelperIntoTemplate, isUrlPathMatch, hasActiveChild };
+export { injectHelperIntoTemplate };

package/tests/unit/src/components/MenuItem/MenuItem.test.js

@@ -19,11 +19,6 @@ jest.mock('next/router', () => ({
   useRouter: () => ({ asPath: '/' })
 }));
 
-// todo: add extra tests to support this util
-jest.mock('../../../../../src/components/MenuItem/helpers/has-active-child', () =>
-  jest.fn(() => false)
-);
-
 const componentProps = {
   id: 'id',
   name: 'mock name',

package/tests/unit/src/components/MenuItem/MenuItemRender.test.js

@@ -11,22 +11,14 @@ const MENU_ITEM_CHILDREN_CLASS = 'menu--item-children';
 
 let mockAsPathValue = '/';
 
-jest.mock('next/router', () => {
-  const router = { asPath: mockAsPathValue };
-  return {
-    useRouter: () => router
-  };
-});
+jest.mock('next/router', () => ({
+  useRouter: () => ({ asPath: mockAsPathValue })
+}));
 
 jest.mock('@blaze-cms/utils-handlebars', () => ({
   useStringTemplate: jest.fn((parent, [title]) => ({ loading: false, data: [title] }))
 }));
 
-// todo: add extra tests to support this util
-jest.mock('../../../../../src/components/MenuItem/helpers/has-active-child', () =>
-  jest.fn(() => false)
-);
-
 describe('MenuRender component', () => {
   it('renders menu item with link when URL is provided', () => {
     const { getByText } = render(<MenuRender eventType="click" text="Home" url="/home" />);

package/lib/components/MenuItem/helpers/has-active-child.js

@@ -1,19 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-require("core-js/modules/es.array.find.js");
-require("core-js/modules/es.object.to-string.js");
-var _isUrlPathMatch = _interopRequireDefault(require("./isUrlPathMatch"));
-var _helpers = require("../../../helpers");
-var hasActiveChild = function hasActiveChild(path, children) {
-  return (0, _helpers.hasChildren)(children) && children.props.children[1][0].props.component.items.find(function (menuItem) {
-    return (0, _isUrlPathMatch["default"])(path, menuItem.settings.url);
-  });
-};
-var _default = exports["default"] = hasActiveChild;
-//# sourceMappingURL=has-active-child.js.map

package/lib/components/MenuItem/helpers/has-active-child.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"has-active-child.js","names":["_isUrlPathMatch","_interopRequireDefault","require","_helpers","hasActiveChild","path","children","hasChildren","props","component","items","find","menuItem","isUrlPathMatch","settings","url","_default","exports"],"sources":["../../../../src/components/MenuItem/helpers/has-active-child.js"],"sourcesContent":["import isUrlPathMatch from './isUrlPathMatch';\nimport { hasChildren } from '../../../helpers';\n\nconst hasActiveChild = (path, children) =>\n  hasChildren(children) &&\n  children.props.children[1][0].props.component.items.find(menuItem =>\n    isUrlPathMatch(path, menuItem.settings.url)\n  );\n\nexport default hasActiveChild;\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,eAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAEA,IAAME,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,IAAI,EAAEC,QAAQ;EAAA,OACpC,IAAAC,oBAAW,EAACD,QAAQ,CAAC,IACrBA,QAAQ,CAACE,KAAK,CAACF,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAACE,KAAK,CAACC,SAAS,CAACC,KAAK,CAACC,IAAI,CAAC,UAAAC,QAAQ;IAAA,OAC/D,IAAAC,0BAAc,EAACR,IAAI,EAAEO,QAAQ,CAACE,QAAQ,CAACC,GAAG,CAAC;EAAA,CAC7C,CAAC;AAAA;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEWb,cAAc","ignoreList":[]}

package/lib/components/MenuItem/helpers/isUrlPathMatch.js

@@ -1,18 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.define-property.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-require("core-js/modules/es.regexp.constructor.js");
-require("core-js/modules/es.regexp.exec.js");
-require("core-js/modules/es.regexp.to-string.js");
-var isUrlPathMatch = function isUrlPathMatch(path, itemUrl) {
-  if (!itemUrl || !path) return false;
-  var reg = new RegExp(/^[^#?]+/);
-  var _path = reg.exec(path)[0];
-  return _path === itemUrl || _path === "/".concat(itemUrl);
-};
-var _default = exports["default"] = isUrlPathMatch;
-//# sourceMappingURL=isUrlPathMatch.js.map

package/lib/components/MenuItem/helpers/isUrlPathMatch.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"isUrlPathMatch.js","names":["isUrlPathMatch","path","itemUrl","reg","RegExp","_path","exec","concat","_default","exports"],"sources":["../../../../src/components/MenuItem/helpers/isUrlPathMatch.js"],"sourcesContent":["const isUrlPathMatch = (path, itemUrl) => {\n  if (!itemUrl || !path) return false;\n\n  const reg = new RegExp(/^[^#?]+/);\n  const _path = reg.exec(path)[0];\n\n  return _path === itemUrl || _path === `/${itemUrl}`;\n};\n\nexport default isUrlPathMatch;\n"],"mappings":";;;;;;;;;;AAAA,IAAMA,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,IAAI,EAAEC,OAAO,EAAK;EACxC,IAAI,CAACA,OAAO,IAAI,CAACD,IAAI,EAAE,OAAO,KAAK;EAEnC,IAAME,GAAG,GAAG,IAAIC,MAAM,CAAC,SAAS,CAAC;EACjC,IAAMC,KAAK,GAAGF,GAAG,CAACG,IAAI,CAACL,IAAI,CAAC,CAAC,CAAC,CAAC;EAE/B,OAAOI,KAAK,KAAKH,OAAO,IAAIG,KAAK,SAAAE,MAAA,CAASL,OAAO,CAAE;AACrD,CAAC;AAAC,IAAAM,QAAA,GAAAC,OAAA,cAEaT,cAAc","ignoreList":[]}

package/src/components/MenuItem/helpers/has-active-child.js

@@ -1,10 +0,0 @@
-import isUrlPathMatch from './isUrlPathMatch';
-import { hasChildren } from '../../../helpers';
-
-const hasActiveChild = (path, children) =>
-  hasChildren(children) &&
-  children.props.children[1][0].props.component.items.find(menuItem =>
-    isUrlPathMatch(path, menuItem.settings.url)
-  );
-
-export default hasActiveChild;

package/src/components/MenuItem/helpers/isUrlPathMatch.js

@@ -1,10 +0,0 @@
-const isUrlPathMatch = (path, itemUrl) => {
-  if (!itemUrl || !path) return false;
-
-  const reg = new RegExp(/^[^#?]+/);
-  const _path = reg.exec(path)[0];
-
-  return _path === itemUrl || _path === `/${itemUrl}`;
-};
-
-export default isUrlPathMatch;