@blaze-cms/react-page-builder 0.139.0-project-admin-customisations.0 → 0.139.0

package/lib-es/components/Carousel/hooks/useCarouselNavigation.js

@@ -0,0 +1,49 @@
+import { useState, useRef } from 'react';
+export function useCarouselNavigation({
+  imageIds,
+  displayCount
+}) {
+  const [showCount, setShowCount] = useState(displayCount);
+  const listRef = useRef(null);
+  const getListElement = () => {
+    if (!listRef.current) return null;
+    return listRef.current;
+  };
+  const moveScroll = (numberOfPixels, isNext) => {
+    const listElement = getListElement();
+    if (!listElement) return;
+    const totalDistance = listElement.scrollLeft + numberOfPixels;
+    const {
+      scrollLeft,
+      offsetWidth,
+      scrollWidth
+    } = listElement;
+    if (isNext && offsetWidth + scrollLeft >= scrollWidth) return;
+    const leftPosition = totalDistance < 0 ? 0 : Math.max(-scrollLeft, totalDistance);
+    listElement.scrollTo({
+      top: 0,
+      left: leftPosition,
+      behavior: 'smooth'
+    });
+  };
+  const handleNavigation = direction => {
+    setShowCount(false);
+    const listElement = getListElement();
+    if (!listElement) return;
+    const {
+      scrollWidth
+    } = listElement;
+    const offset = scrollWidth / imageIds.length;
+    direction ? moveScroll(offset, direction) : moveScroll(-offset, direction);
+  };
+  return {
+    listRef,
+    showCount,
+    handleNavigation,
+    direction: {
+      next: true,
+      back: false
+    }
+  };
+}
+//# sourceMappingURL=useCarouselNavigation.js.map

package/lib-es/components/Carousel/hooks/useCarouselNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCarouselNavigation.js","names":["useState","useRef","useCarouselNavigation","imageIds","displayCount","showCount","setShowCount","listRef","getListElement","current","moveScroll","numberOfPixels","isNext","listElement","totalDistance","scrollLeft","offsetWidth","scrollWidth","leftPosition","Math","max","scrollTo","top","left","behavior","handleNavigation","direction","offset","length","next","back"],"sources":["../../../../src/components/Carousel/hooks/useCarouselNavigation.js"],"sourcesContent":["import { useState, useRef } from 'react';\n\nexport function useCarouselNavigation({ imageIds, displayCount }) {\n  const [showCount, setShowCount] = useState(displayCount);\n  const listRef = useRef(null);\n\n  const getListElement = () => {\n    if (!listRef.current) return null;\n    return listRef.current;\n  };\n\n  const moveScroll = (numberOfPixels, isNext) => {\n    const listElement = getListElement();\n    if (!listElement) return;\n\n    const totalDistance = listElement.scrollLeft + numberOfPixels;\n    const { scrollLeft, offsetWidth, scrollWidth } = listElement;\n    if (isNext && offsetWidth + scrollLeft >= scrollWidth) return;\n\n    const leftPosition = totalDistance < 0 ? 0 : Math.max(-scrollLeft, totalDistance);\n\n    listElement.scrollTo({\n      top: 0,\n      left: leftPosition,\n      behavior: 'smooth'\n    });\n  };\n\n  const handleNavigation = direction => {\n    setShowCount(false);\n\n    const listElement = getListElement();\n    if (!listElement) return;\n\n    const { scrollWidth } = listElement;\n    const offset = scrollWidth / imageIds.length;\n\n    direction ? moveScroll(offset, direction) : moveScroll(-offset, direction);\n  };\n\n  return {\n    listRef,\n    showCount,\n    handleNavigation,\n    direction: {\n      next: true,\n      back: false\n    }\n  };\n}\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,MAAM,QAAQ,OAAO;AAExC,OAAO,SAASC,qBAAqBA,CAAC;EAAEC,QAAQ;EAAEC;AAAa,CAAC,EAAE;EAChE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGN,QAAQ,CAACI,YAAY,CAAC;EACxD,MAAMG,OAAO,GAAGN,MAAM,CAAC,IAAI,CAAC;EAE5B,MAAMO,cAAc,GAAGA,CAAA,KAAM;IAC3B,IAAI,CAACD,OAAO,CAACE,OAAO,EAAE,OAAO,IAAI;IACjC,OAAOF,OAAO,CAACE,OAAO;EACxB,CAAC;EAED,MAAMC,UAAU,GAAGA,CAACC,cAAc,EAAEC,MAAM,KAAK;IAC7C,MAAMC,WAAW,GAAGL,cAAc,CAAC,CAAC;IACpC,IAAI,CAACK,WAAW,EAAE;IAElB,MAAMC,aAAa,GAAGD,WAAW,CAACE,UAAU,GAAGJ,cAAc;IAC7D,MAAM;MAAEI,UAAU;MAAEC,WAAW;MAAEC;IAAY,CAAC,GAAGJ,WAAW;IAC5D,IAAID,MAAM,IAAII,WAAW,GAAGD,UAAU,IAAIE,WAAW,EAAE;IAEvD,MAAMC,YAAY,GAAGJ,aAAa,GAAG,CAAC,GAAG,CAAC,GAAGK,IAAI,CAACC,GAAG,CAAC,CAACL,UAAU,EAAED,aAAa,CAAC;IAEjFD,WAAW,CAACQ,QAAQ,CAAC;MACnBC,GAAG,EAAE,CAAC;MACNC,IAAI,EAAEL,YAAY;MAClBM,QAAQ,EAAE;IACZ,CAAC,CAAC;EACJ,CAAC;EAED,MAAMC,gBAAgB,GAAGC,SAAS,IAAI;IACpCpB,YAAY,CAAC,KAAK,CAAC;IAEnB,MAAMO,WAAW,GAAGL,cAAc,CAAC,CAAC;IACpC,IAAI,CAACK,WAAW,EAAE;IAElB,MAAM;MAAEI;IAAY,CAAC,GAAGJ,WAAW;IACnC,MAAMc,MAAM,GAAGV,WAAW,GAAGd,QAAQ,CAACyB,MAAM;IAE5CF,SAAS,GAAGhB,UAAU,CAACiB,MAAM,EAAED,SAAS,CAAC,GAAGhB,UAAU,CAAC,CAACiB,MAAM,EAAED,SAAS,CAAC;EAC5E,CAAC;EAED,OAAO;IACLnB,OAAO;IACPF,SAAS;IACToB,gBAAgB;IAChBC,SAAS,EAAE;MACTG,IAAI,EAAE,IAAI;MACVC,IAAI,EAAE;IACR;EACF,CAAC;AACH"}

package/lib-es/components/Image/ImageFactory.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { MainContext } from '@blaze-cms/nextjs-components';
+import { useStringTemplate } from '@blaze-cms/utils-handlebars';
 import Image from './Image';
 import { useGetImageIdFromRelation, useGetImages, useGetSingleEntitySchema } from '../../hooks';
 import { getImageIds, isUsingRelationImage as checkIfUsingRelationImage } from '../../helpers';
@@ -11,26 +12,31 @@ const ImageFactory = props => {
     parent: {
       itemId
     },
+    parent,
     entity,
     fetchFromRelation,
-    imageRelation
+    imageRelation,
+    imgSrc
   } = props;
   const {
     isPreview
   } = useContext(MainContext);
+  const {
+    data: [imgSrcToUse]
+  } = useStringTemplate(parent, [imgSrc]);
+  const skipSingleEntitySchema = !entity || !!imgSrcToUse;
   const isUsingRelationImage = checkIfUsingRelationImage(entity, fetchFromRelation, imageRelation);
   const {
     data: {
-      getEntitySchema = {}
+      getEntitySchema: {
+        actions = {}
+      } = {}
     } = {}
-  } = useGetSingleEntitySchema(entity, !entity);
-  const {
-    actions = {}
-  } = getEntitySchema;
+  } = useGetSingleEntitySchema(entity, skipSingleEntitySchema);
   const {
     data: relationData,
     loading: relationLoading
-  } = useGetImageIdFromRelation(itemId, imageRelation, actions, isUsingRelationImage, isPreview);
+  } = useGetImageIdFromRelation(itemId, imageRelation, actions, isUsingRelationImage, isPreview, !!imgSrcToUse);
   const updatedImageIds = relationLoading ? null : getImageIds(imageRelation, relationData, imageId);
   const imageIds = updatedImageIds && updatedImageIds.length === 1 ? updatedImageIds[0] : updatedImageIds;
   const {
@@ -40,9 +46,13 @@ const ImageFactory = props => {
     } = {},
     loading,
     error
-  } = useGetImages(imageIds, updatedImageIds && updatedImageIds.length > 1);
+  } = useGetImages(imageIds, updatedImageIds && updatedImageIds.length > 1, !!imgSrcToUse);
   if (error) return error.message;
   if (loading) return '';
+  if (imgSrcToUse) return /*#__PURE__*/React.createElement(Image, _extends({}, props, {
+    imageUrl: imgSrcToUse,
+    shouldRenderImgTag: true
+  }));
   const files = getFile ? [getFile] : getFiles;
   return files.map(({
     id,

package/lib-es/components/Image/ImageFactory.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageFactory.js","names":["React","useContext","PropTypes","MainContext","Image","useGetImageIdFromRelation","useGetImages","useGetSingleEntitySchema","getImageIds","isUsingRelationImage","checkIfUsingRelationImage","ImageFactory","props","imageId","parent","itemId","entity","fetchFromRelation","imageRelation","isPreview","data","getEntitySchema","actions","relationData","loading","relationLoading","updatedImageIds","imageIds","length","getFile","getFiles","error","message","files","map","id","imageData","url","imageUrl","createElement","_extends","key","propTypes","string","bool","array","object","defaultProps"],"sources":["../../../src/components/Image/ImageFactory.js"],"sourcesContent":["import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { MainContext } from '@blaze-cms/nextjs-components';\nimport Image from './Image';\nimport { useGetImageIdFromRelation, useGetImages, useGetSingleEntitySchema } from '../../hooks';\nimport { getImageIds, isUsingRelationImage as checkIfUsingRelationImage } from '../../helpers';\n\nconst ImageFactory = props => {\n  const {\n    imageId,\n    parent: { itemId },\n    entity,\n    fetchFromRelation,\n    imageRelation\n  } = props;\n  const { isPreview } = useContext(MainContext);\n  const isUsingRelationImage = checkIfUsingRelationImage(entity, fetchFromRelation, imageRelation);\n  const { data: { getEntitySchema = {} } = {} } = useGetSingleEntitySchema(entity, !entity);\n  const { actions = {} } = getEntitySchema;\n  const { data: relationData, loading: relationLoading } = useGetImageIdFromRelation(\n    itemId,\n    imageRelation,\n    actions,\n    isUsingRelationImage,\n    isPreview\n  );\n\n  const updatedImageIds = relationLoading\n    ? null\n    : getImageIds(imageRelation, relationData, imageId);\n  const imageIds =\n    updatedImageIds && updatedImageIds.length === 1 ? updatedImageIds[0] : updatedImageIds;\n  const { data: { getFile, getFiles = [] } = {}, loading, error } = useGetImages(\n    imageIds,\n    updatedImageIds && updatedImageIds.length > 1\n  );\n  if (error) return error.message;\n  if (loading) return '';\n\n  const files = getFile ? [getFile] : getFiles;\n  return files.map(({ id, data: imageData = {}, url: imageUrl = '' }) => {\n    if (!imageUrl) return null;\n    return <Image key={id} {...props} imageData={imageData} imageUrl={imageUrl} />;\n  });\n};\n\nImageFactory.propTypes = {\n  entity: PropTypes.string,\n  fetchFromRelation: PropTypes.bool,\n  imageId: PropTypes.string,\n  imageRelation: PropTypes.array,\n  parent: PropTypes.object\n};\n\nImageFactory.defaultProps = {\n  entity: '',\n  fetchFromRelation: false,\n  imageId: '',\n  imageRelation: [],\n  parent: {}\n};\n\nexport default ImageFactory;\n"],"mappings":"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"}
+{"version":3,"file":"ImageFactory.js","names":["React","useContext","PropTypes","MainContext","useStringTemplate","Image","useGetImageIdFromRelation","useGetImages","useGetSingleEntitySchema","getImageIds","isUsingRelationImage","checkIfUsingRelationImage","ImageFactory","props","imageId","parent","itemId","entity","fetchFromRelation","imageRelation","imgSrc","isPreview","data","imgSrcToUse","skipSingleEntitySchema","getEntitySchema","actions","relationData","loading","relationLoading","updatedImageIds","imageIds","length","getFile","getFiles","error","message","createElement","_extends","imageUrl","shouldRenderImgTag","files","map","id","imageData","url","key","propTypes","string","bool","array","object","defaultProps"],"sources":["../../../src/components/Image/ImageFactory.js"],"sourcesContent":["import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { MainContext } from '@blaze-cms/nextjs-components';\nimport { useStringTemplate } from '@blaze-cms/utils-handlebars';\nimport Image from './Image';\nimport { useGetImageIdFromRelation, useGetImages, useGetSingleEntitySchema } from '../../hooks';\nimport { getImageIds, isUsingRelationImage as checkIfUsingRelationImage } from '../../helpers';\n\nconst ImageFactory = props => {\n  const {\n    imageId,\n    parent: { itemId },\n    parent,\n    entity,\n    fetchFromRelation,\n    imageRelation,\n    imgSrc\n  } = props;\n  const { isPreview } = useContext(MainContext);\n  const {\n    data: [imgSrcToUse]\n  } = useStringTemplate(parent, [imgSrc]);\n\n  const skipSingleEntitySchema = !entity || !!imgSrcToUse;\n  const isUsingRelationImage = checkIfUsingRelationImage(entity, fetchFromRelation, imageRelation);\n  const { data: { getEntitySchema: { actions = {} } = {} } = {} } = useGetSingleEntitySchema(\n    entity,\n    skipSingleEntitySchema\n  );\n  const { data: relationData, loading: relationLoading } = useGetImageIdFromRelation(\n    itemId,\n    imageRelation,\n    actions,\n    isUsingRelationImage,\n    isPreview,\n    !!imgSrcToUse\n  );\n\n  const updatedImageIds = relationLoading\n    ? null\n    : getImageIds(imageRelation, relationData, imageId);\n  const imageIds =\n    updatedImageIds && updatedImageIds.length === 1 ? updatedImageIds[0] : updatedImageIds;\n  const { data: { getFile, getFiles = [] } = {}, loading, error } = useGetImages(\n    imageIds,\n    updatedImageIds && updatedImageIds.length > 1,\n    !!imgSrcToUse\n  );\n  if (error) return error.message;\n  if (loading) return '';\n\n  if (imgSrcToUse) return <Image {...props} imageUrl={imgSrcToUse} shouldRenderImgTag />;\n\n  const files = getFile ? [getFile] : getFiles;\n\n  return files.map(({ id, data: imageData = {}, url: imageUrl = '' }) => {\n    if (!imageUrl) return null;\n    return <Image key={id} {...props} imageData={imageData} imageUrl={imageUrl} />;\n  });\n};\n\nImageFactory.propTypes = {\n  entity: PropTypes.string,\n  fetchFromRelation: PropTypes.bool,\n  imageId: PropTypes.string,\n  imageRelation: PropTypes.array,\n  parent: PropTypes.object\n};\n\nImageFactory.defaultProps = {\n  entity: '',\n  fetchFromRelation: false,\n  imageId: '',\n  imageRelation: [],\n  parent: {}\n};\n\nexport default ImageFactory;\n"],"mappings":"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"}

package/lib-es/components/Image/ImageRender.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-const _excluded = ["alt", "imageUrl", "handleEnableLightbox", "toggleLightbox", "displayLightbox", "enableLightbox", "caption", "lightboxImgProps", "name", "metaTitle", "heroModifier", "style", "isHero", "priority", "sizeKey"];
+const _excluded = ["alt", "imageUrl", "handleEnableLightbox", "toggleLightbox", "displayLightbox", "enableLightbox", "caption", "lightboxImgProps", "name", "metaTitle", "heroModifier", "style", "isHero", "priority", "sizeKey", "shouldRenderImgTag"];
 import React from 'react';
 import PropTypes from 'prop-types';
 import Head from 'next/head';
@@ -22,14 +22,20 @@ const ImageRender = _ref => {
       style,
       isHero,
       priority,
-      sizeKey
+      sizeKey,
+      shouldRenderImgTag
     } = _ref,
     otherProps = _objectWithoutProperties(_ref, _excluded);
   const imageStyle = enableLightbox ? {
     cursor: 'pointer'
   } : style;
   const HeadComponent = priority ? Head : null;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ResponsiveImage, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, shouldRenderImgTag ? /*#__PURE__*/React.createElement("img", {
+    style: imageStyle,
+    src: imageUrl,
+    alt: alt,
+    onClick: handleEnableLightbox
+  }) : /*#__PURE__*/React.createElement(ResponsiveImage, {
     sizeKey: sizeKey,
     alt: alt,
     src: imageUrl,

package/lib-es/components/Image/ImageRender.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageRender.js","names":["React","PropTypes","Head","ResponsiveImage","Lightbox","ImageRender","_ref","alt","imageUrl","handleEnableLightbox","toggleLightbox","displayLightbox","enableLightbox","caption","lightboxImgProps","name","metaTitle","heroModifier","style","isHero","priority","sizeKey","otherProps","_objectWithoutProperties","_excluded","imageStyle","cursor","HeadComponent","createElement","Fragment","src","onClick","_extends","closeModal","imgWrapperProps","propTypes","bool","isRequired","string","func","object","defaultProps"],"sources":["../../../src/components/Image/ImageRender.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Head from 'next/head';\nimport { ResponsiveImage } from '@blaze-cms/image-cdn-react';\nimport Lightbox from './Lightbox';\n\nconst ImageRender = ({\n  alt,\n  imageUrl,\n  handleEnableLightbox,\n  toggleLightbox,\n  displayLightbox,\n  enableLightbox,\n  caption,\n  lightboxImgProps,\n  name,\n  metaTitle,\n  heroModifier,\n  style,\n  isHero,\n  priority,\n  sizeKey,\n  ...otherProps\n}) => {\n  const imageStyle = enableLightbox ? { cursor: 'pointer' } : style;\n  const HeadComponent = priority ? Head : null;\n\n  return (\n    <>\n      <ResponsiveImage\n        sizeKey={sizeKey}\n        alt={alt}\n        src={imageUrl}\n        onClick={handleEnableLightbox}\n        style={imageStyle}\n        HeadComponent={HeadComponent}\n      />\n      {displayLightbox && (\n        <Lightbox\n          imageUrl={imageUrl}\n          alt={alt}\n          priority={priority}\n          closeModal={toggleLightbox}\n          caption={caption}\n          imgWrapperProps={lightboxImgProps}\n          name={metaTitle || name}\n          {...otherProps}\n        />\n      )}\n    </>\n  );\n};\n\nImageRender.propTypes = {\n  displayLightbox: PropTypes.bool.isRequired,\n  enableLightbox: PropTypes.bool.isRequired,\n  alt: PropTypes.string,\n  caption: PropTypes.string,\n  imageUrl: PropTypes.string.isRequired,\n  name: PropTypes.string,\n  heroModifier: PropTypes.string,\n  metaTitle: PropTypes.string,\n  handleEnableLightbox: PropTypes.func.isRequired,\n  toggleLightbox: PropTypes.func.isRequired,\n  lightboxImgProps: PropTypes.object.isRequired,\n  style: PropTypes.object,\n  isHero: PropTypes.bool,\n  priority: PropTypes.bool,\n  sizeKey: PropTypes.string\n};\n\nImageRender.defaultProps = {\n  name: '',\n  metaTitle: '',\n  heroModifier: '',\n  alt: '',\n  caption: '',\n  isHero: false,\n  priority: false,\n  style: {},\n  sizeKey: ''\n};\n\nexport default ImageRender;\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,IAAI,MAAM,WAAW;AAC5B,SAASC,eAAe,QAAQ,4BAA4B;AAC5D,OAAOC,QAAQ,MAAM,YAAY;AAEjC,MAAMC,WAAW,GAAGC,IAAA,IAiBd;EAAA,IAjBe;MACnBC,GAAG;MACHC,QAAQ;MACRC,oBAAoB;MACpBC,cAAc;MACdC,eAAe;MACfC,cAAc;MACdC,OAAO;MACPC,gBAAgB;MAChBC,IAAI;MACJC,SAAS;MACTC,YAAY;MACZC,KAAK;MACLC,MAAM;MACNC,QAAQ;MACRC;IAEF,CAAC,GAAAf,IAAA;IADIgB,UAAU,GAAAC,wBAAA,CAAAjB,IAAA,EAAAkB,SAAA;EAEb,MAAMC,UAAU,GAAGb,cAAc,GAAG;IAAEc,MAAM,EAAE;EAAU,CAAC,GAAGR,KAAK;EACjE,MAAMS,aAAa,GAAGP,QAAQ,GAAGlB,IAAI,GAAG,IAAI;EAE5C,oBACEF,KAAA,CAAA4B,aAAA,CAAA5B,KAAA,CAAA6B,QAAA,qBACE7B,KAAA,CAAA4B,aAAA,CAACzB,eAAe;IACdkB,OAAO,EAAEA,OAAQ;IACjBd,GAAG,EAAEA,GAAI;IACTuB,GAAG,EAAEtB,QAAS;IACduB,OAAO,EAAEtB,oBAAqB;IAC9BS,KAAK,EAAEO,UAAW;IAClBE,aAAa,EAAEA;EAAc,CAC9B,CAAC,EACDhB,eAAe,iBACdX,KAAA,CAAA4B,aAAA,CAACxB,QAAQ,EAAA4B,QAAA;IACPxB,QAAQ,EAAEA,QAAS;IACnBD,GAAG,EAAEA,GAAI;IACTa,QAAQ,EAAEA,QAAS;IACnBa,UAAU,EAAEvB,cAAe;IAC3BG,OAAO,EAAEA,OAAQ;IACjBqB,eAAe,EAAEpB,gBAAiB;IAClCC,IAAI,EAAEC,SAAS,IAAID;EAAK,GACpBO,UAAU,CACf,CAEH,CAAC;AAEP,CAAC;AAEDjB,WAAW,CAAC8B,SAAS,GAAG;EACtBxB,eAAe,EAAEV,SAAS,CAACmC,IAAI,CAACC,UAAU;EAC1CzB,cAAc,EAAEX,SAAS,CAACmC,IAAI,CAACC,UAAU;EACzC9B,GAAG,EAAEN,SAAS,CAACqC,MAAM;EACrBzB,OAAO,EAAEZ,SAAS,CAACqC,MAAM;EACzB9B,QAAQ,EAAEP,SAAS,CAACqC,MAAM,CAACD,UAAU;EACrCtB,IAAI,EAAEd,SAAS,CAACqC,MAAM;EACtBrB,YAAY,EAAEhB,SAAS,CAACqC,MAAM;EAC9BtB,SAAS,EAAEf,SAAS,CAACqC,MAAM;EAC3B7B,oBAAoB,EAAER,SAAS,CAACsC,IAAI,CAACF,UAAU;EAC/C3B,cAAc,EAAET,SAAS,CAACsC,IAAI,CAACF,UAAU;EACzCvB,gBAAgB,EAAEb,SAAS,CAACuC,MAAM,CAACH,UAAU;EAC7CnB,KAAK,EAAEjB,SAAS,CAACuC,MAAM;EACvBrB,MAAM,EAAElB,SAAS,CAACmC,IAAI;EACtBhB,QAAQ,EAAEnB,SAAS,CAACmC,IAAI;EACxBf,OAAO,EAAEpB,SAAS,CAACqC;AACrB,CAAC;AAEDjC,WAAW,CAACoC,YAAY,GAAG;EACzB1B,IAAI,EAAE,EAAE;EACRC,SAAS,EAAE,EAAE;EACbC,YAAY,EAAE,EAAE;EAChBV,GAAG,EAAE,EAAE;EACPM,OAAO,EAAE,EAAE;EACXM,MAAM,EAAE,KAAK;EACbC,QAAQ,EAAE,KAAK;EACfF,KAAK,EAAE,CAAC,CAAC;EACTG,OAAO,EAAE;AACX,CAAC;AAED,eAAehB,WAAW"}
+{"version":3,"file":"ImageRender.js","names":["React","PropTypes","Head","ResponsiveImage","Lightbox","ImageRender","_ref","alt","imageUrl","handleEnableLightbox","toggleLightbox","displayLightbox","enableLightbox","caption","lightboxImgProps","name","metaTitle","heroModifier","style","isHero","priority","sizeKey","shouldRenderImgTag","otherProps","_objectWithoutProperties","_excluded","imageStyle","cursor","HeadComponent","createElement","Fragment","src","onClick","_extends","closeModal","imgWrapperProps","propTypes","bool","isRequired","string","func","object","defaultProps"],"sources":["../../../src/components/Image/ImageRender.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Head from 'next/head';\nimport { ResponsiveImage } from '@blaze-cms/image-cdn-react';\nimport Lightbox from './Lightbox';\n\nconst ImageRender = ({\n  alt,\n  imageUrl,\n  handleEnableLightbox,\n  toggleLightbox,\n  displayLightbox,\n  enableLightbox,\n  caption,\n  lightboxImgProps,\n  name,\n  metaTitle,\n  heroModifier,\n  style,\n  isHero,\n  priority,\n  sizeKey,\n  shouldRenderImgTag,\n  ...otherProps\n}) => {\n  const imageStyle = enableLightbox ? { cursor: 'pointer' } : style;\n  const HeadComponent = priority ? Head : null;\n\n  return (\n    <>\n      {shouldRenderImgTag ? (\n        <img style={imageStyle} src={imageUrl} alt={alt} onClick={handleEnableLightbox} />\n      ) : (\n        <ResponsiveImage\n          sizeKey={sizeKey}\n          alt={alt}\n          src={imageUrl}\n          onClick={handleEnableLightbox}\n          style={imageStyle}\n          HeadComponent={HeadComponent}\n        />\n      )}\n\n      {displayLightbox && (\n        <Lightbox\n          imageUrl={imageUrl}\n          alt={alt}\n          priority={priority}\n          closeModal={toggleLightbox}\n          caption={caption}\n          imgWrapperProps={lightboxImgProps}\n          name={metaTitle || name}\n          {...otherProps}\n        />\n      )}\n    </>\n  );\n};\n\nImageRender.propTypes = {\n  displayLightbox: PropTypes.bool.isRequired,\n  enableLightbox: PropTypes.bool.isRequired,\n  alt: PropTypes.string,\n  caption: PropTypes.string,\n  imageUrl: PropTypes.string.isRequired,\n  name: PropTypes.string,\n  heroModifier: PropTypes.string,\n  metaTitle: PropTypes.string,\n  handleEnableLightbox: PropTypes.func.isRequired,\n  toggleLightbox: PropTypes.func.isRequired,\n  lightboxImgProps: PropTypes.object.isRequired,\n  style: PropTypes.object,\n  isHero: PropTypes.bool,\n  priority: PropTypes.bool,\n  sizeKey: PropTypes.string\n};\n\nImageRender.defaultProps = {\n  name: '',\n  metaTitle: '',\n  heroModifier: '',\n  alt: '',\n  caption: '',\n  isHero: false,\n  priority: false,\n  style: {},\n  sizeKey: ''\n};\n\nexport default ImageRender;\n"],"mappings":"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"}

package/lib-es/components/Layout/Layout.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-const _excluded = ["type", "children", "settings", "modifier", "backgroundImage", "tagType", "dataNoSnippet", "sticky"];
+const _excluded = ["type", "children", "settings", "modifier", "backgroundImage", "tagType", "dataNoSnippet", "sticky", "VariantComponent"];
 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 React from 'react';
@@ -21,7 +21,8 @@ const Layout = React.forwardRef((_ref, ref) => {
       backgroundImage,
       tagType,
       dataNoSnippet,
-      sticky
+      sticky,
+      VariantComponent
     } = _ref,
     otherProps = _objectWithoutProperties(_ref, _excluded);
   const {
@@ -45,7 +46,8 @@ const Layout = React.forwardRef((_ref, ref) => {
   if (type === COLUMN && !hasChildren(children)) return null;
   const otherWrapperProps = {};
   if (dataNoSnippet) otherWrapperProps['data-nosnippet'] = true;
-  return /*#__PURE__*/React.createElement(Wrapper, _extends({
+  const WrapperComponent = VariantComponent || Wrapper;
+  return /*#__PURE__*/React.createElement(WrapperComponent, _extends({
     ref: ref,
     tagType: tagType,
     className: type,
@@ -65,6 +67,7 @@ Layout.propTypes = {
   backgroundImage: PropTypes.string,
   tagType: PropTypes.string,
   dataNoSnippet: PropTypes.bool,
+  VariantComponent: PropTypes.func,
   children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
 };
 Layout.defaultProps = {
@@ -75,7 +78,8 @@ Layout.defaultProps = {
   modifier: '',
   tagType: '',
   dataNoSnippet: false,
-  sticky: false
+  sticky: false,
+  VariantComponent: null
 };
 export default Layout;
 //# sourceMappingURL=Layout.js.map

package/lib-es/components/Layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","names":["React","PropTypes","Wrapper","getClassModifiers","useGetImages","getStylesToUpdate","checkIfRowHasColumns","renderChildren","hasChildren","COLUMN","Layout","forwardRef","_ref","ref","type","children","settings","modifier","backgroundImage","tagType","dataNoSnippet","sticky","otherProps","_objectWithoutProperties","_excluded","data","getFile","url","style","title","classModifiers","_objectSpread","additionalRowModifier","otherWrapperProps","createElement","_extends","className","modifiers","propTypes","string","isRequired","bool","shape","oneOfType","arrayOf","node","defaultProps"],"sources":["../../../src/components/Layout/Layout.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Wrapper from '../Wrapper';\nimport { getClassModifiers } from '../../utils';\nimport { useGetImages } from '../../hooks';\nimport { getStylesToUpdate, checkIfRowHasColumns } from './helpers';\nimport { renderChildren, hasChildren } from '../../helpers';\nimport { COLUMN } from '../../constants';\n\nconst Layout = React.forwardRef(\n  (\n    {\n      type,\n      children,\n      settings,\n      modifier,\n      backgroundImage,\n      tagType,\n      dataNoSnippet,\n      sticky,\n      ...otherProps\n    },\n    ref\n  ) => {\n    const {\n      data: { getFile: { url = null } = {} }\n    } = useGetImages(backgroundImage);\n\n    const style = getStylesToUpdate({ backgroundImage: url });\n    const { title } = settings;\n\n    const classModifiers = getClassModifiers(type, { modifier, sticky, ...otherProps });\n    const additionalRowModifier = checkIfRowHasColumns(type, children) ? ' display-row' : '';\n\n    if (type === COLUMN && !hasChildren(children)) return null;\n\n    const otherWrapperProps = {};\n    if (dataNoSnippet) otherWrapperProps['data-nosnippet'] = true;\n\n    return (\n      <Wrapper\n        ref={ref}\n        tagType={tagType}\n        className={type}\n        modifiers={`${classModifiers}${additionalRowModifier}`}\n        style={style}\n        {...otherWrapperProps}>\n        {title && <h2 className=\"heading heading--section\">{title}</h2>}\n        {renderChildren(children, otherProps)}\n      </Wrapper>\n    );\n  }\n);\n\nLayout.propTypes = {\n  type: PropTypes.string.isRequired,\n  sticky: PropTypes.bool,\n  settings: PropTypes.shape({\n    title: PropTypes.string\n  }),\n  modifier: PropTypes.string,\n  backgroundImage: PropTypes.string,\n  tagType: PropTypes.string,\n  dataNoSnippet: PropTypes.bool,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired\n};\n\nLayout.defaultProps = {\n  settings: {\n    title: ''\n  },\n  backgroundImage: '',\n  modifier: '',\n  tagType: '',\n  dataNoSnippet: false,\n  sticky: false\n};\n\nexport default Layout;\n"],"mappings":"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"}
+{"version":3,"file":"Layout.js","names":["React","PropTypes","Wrapper","getClassModifiers","useGetImages","getStylesToUpdate","checkIfRowHasColumns","renderChildren","hasChildren","COLUMN","Layout","forwardRef","_ref","ref","type","children","settings","modifier","backgroundImage","tagType","dataNoSnippet","sticky","VariantComponent","otherProps","_objectWithoutProperties","_excluded","data","getFile","url","style","title","classModifiers","_objectSpread","additionalRowModifier","otherWrapperProps","WrapperComponent","createElement","_extends","className","modifiers","propTypes","string","isRequired","bool","shape","func","oneOfType","arrayOf","node","defaultProps"],"sources":["../../../src/components/Layout/Layout.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Wrapper from '../Wrapper';\nimport { getClassModifiers } from '../../utils';\nimport { useGetImages } from '../../hooks';\nimport { getStylesToUpdate, checkIfRowHasColumns } from './helpers';\nimport { renderChildren, hasChildren } from '../../helpers';\nimport { COLUMN } from '../../constants';\n\nconst Layout = React.forwardRef(\n  (\n    {\n      type,\n      children,\n      settings,\n      modifier,\n      backgroundImage,\n      tagType,\n      dataNoSnippet,\n      sticky,\n      VariantComponent,\n      ...otherProps\n    },\n    ref\n  ) => {\n    const {\n      data: { getFile: { url = null } = {} }\n    } = useGetImages(backgroundImage);\n    const style = getStylesToUpdate({ backgroundImage: url });\n    const { title } = settings;\n    const classModifiers = getClassModifiers(type, { modifier, sticky, ...otherProps });\n    const additionalRowModifier = checkIfRowHasColumns(type, children) ? ' display-row' : '';\n\n    if (type === COLUMN && !hasChildren(children)) return null;\n\n    const otherWrapperProps = {};\n    if (dataNoSnippet) otherWrapperProps['data-nosnippet'] = true;\n\n    const WrapperComponent = VariantComponent || Wrapper;\n\n    return (\n      <WrapperComponent\n        ref={ref}\n        tagType={tagType}\n        className={type}\n        modifiers={`${classModifiers}${additionalRowModifier}`}\n        style={style}\n        {...otherWrapperProps}>\n        {title && <h2 className=\"heading heading--section\">{title}</h2>}\n        {renderChildren(children, otherProps)}\n      </WrapperComponent>\n    );\n  }\n);\n\nLayout.propTypes = {\n  type: PropTypes.string.isRequired,\n  sticky: PropTypes.bool,\n  settings: PropTypes.shape({\n    title: PropTypes.string\n  }),\n  modifier: PropTypes.string,\n  backgroundImage: PropTypes.string,\n  tagType: PropTypes.string,\n  dataNoSnippet: PropTypes.bool,\n  VariantComponent: PropTypes.func,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired\n};\n\nLayout.defaultProps = {\n  settings: {\n    title: ''\n  },\n  backgroundImage: '',\n  modifier: '',\n  tagType: '',\n  dataNoSnippet: false,\n  sticky: false,\n  VariantComponent: null\n};\n\nexport default Layout;\n"],"mappings":"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"}

package/lib-es/components/List/components/Full/FullRender.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-const _excluded = ["orderedListData", "omitWrappers", "paginationType"],
-  _excluded2 = ["id"];
+const _excluded = ["orderedListData", "omitWrappers", "paginationType", "graphqlEntityMap"],
+  _excluded2 = ["id", "__typename"];
 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 React, { Fragment, useContext } from 'react';
@@ -19,7 +19,8 @@ const FullRender = _ref => {
   let {
       orderedListData,
       omitWrappers,
-      paginationType
+      paginationType,
+      graphqlEntityMap
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   const contextProps = useContext(MainContext);
@@ -49,7 +50,8 @@ const FullRender = _ref => {
     className: "list list--full"
   }, orderedListData.map((_ref2, i) => {
     let {
-        id
+        id,
+        __typename: dataEntity
       } = _ref2,
       entityProps = _objectWithoutProperties(_ref2, _excluded2);
     const shouldRenderBanner = !!bannerProps && checkIfShouldRenderBanner(i, bannerProps);
@@ -57,6 +59,7 @@ const FullRender = _ref => {
     return /*#__PURE__*/React.createElement(FullRenderItem, _extends({
       key: id
     }, props, entityProps, {
+      entity: graphqlEntityMap[dataEntity],
       index: i,
       itemId: id,
       pageBuilderID: pageBuilderID,
@@ -77,7 +80,8 @@ FullRender.propTypes = {
   entity: PropTypes.string.isRequired,
   omitWrappers: PropTypes.bool,
   hasBanner: PropTypes.bool,
-  banner: PropTypes.object
+  banner: PropTypes.object,
+  graphqlEntityMap: PropTypes.object.isRequired
 };
 FullRender.defaultProps = {
   omitWrappers: false,

package/lib-es/components/List/components/Full/FullRender.js.map

@@ -1 +1 @@
-{"version":3,"file":"FullRender.js","names":["React","Fragment","useContext","MainContext","MainContextProvider","PropTypes","uuid","FullRenderItem","ListPagination","LOAD_MORE","BANNER","Wrapper","checkIfShouldRenderBanner","FullRender","_ref","orderedListData","omitWrappers","paginationType","props","_objectWithoutProperties","_excluded","contextProps","pageBuilderID","parent","entity","propsToDisplay","banner","hasBanner","bannerProps","_objectSpread","type","bannerIndex","WrapperToUse","createElement","value","isPreview","className","map","_ref2","i","id","entityProps","_excluded2","shouldRenderBanner","_extends","key","index","itemId","propTypes","array","isRequired","string","object","bool","defaultProps"],"sources":["../../../../../src/components/List/components/Full/FullRender.js"],"sourcesContent":["import React, { Fragment, useContext } from 'react';\nimport { MainContext, MainContextProvider } from '@blaze-cms/nextjs-components';\nimport PropTypes from 'prop-types';\nimport uuid from 'uuid/v1';\nimport FullRenderItem from './FullRenderItem';\nimport ListPagination from '../Pagination';\nimport { LOAD_MORE } from '../../../../constants';\nimport { BANNER } from '../../constants';\nimport Wrapper from '../../../Wrapper';\nimport { checkIfShouldRenderBanner } from '../helpers';\n\nconst FullRender = ({ orderedListData, omitWrappers, paginationType, ...props }) => {\n  const contextProps = useContext(MainContext);\n  const pageBuilderID = uuid();\n  const { parent, entity, propsToDisplay, banner, hasBanner } = props;\n  const bannerProps = banner\n    ? { hasBanner, parent, entity, propsToDisplay, ...banner, type: BANNER }\n    : null;\n  let bannerIndex = 0;\n  const WrapperToUse = omitWrappers ? Fragment : Wrapper;\n\n  return (\n    <MainContextProvider value={{ ...contextProps, isPreview: false }}>\n      <WrapperToUse className=\"list list--full\">\n        {orderedListData.map(({ id, ...entityProps }, i) => {\n          const shouldRenderBanner = !!bannerProps && checkIfShouldRenderBanner(i, bannerProps);\n          if (shouldRenderBanner) bannerIndex += 1;\n\n          return (\n            <FullRenderItem\n              key={id}\n              {...props}\n              {...entityProps}\n              index={i}\n              itemId={id}\n              pageBuilderID={pageBuilderID}\n              entityProps={entityProps}\n              shouldRenderBanner={shouldRenderBanner}\n              bannerProps={bannerProps}\n              bannerIndex={bannerIndex}\n            />\n          );\n        })}\n      </WrapperToUse>\n\n      {paginationType === LOAD_MORE && (\n        <ListPagination paginationType={paginationType} {...props} />\n      )}\n    </MainContextProvider>\n  );\n};\n\nFullRender.propTypes = {\n  orderedListData: PropTypes.array.isRequired,\n  paginationType: PropTypes.string.isRequired,\n  parent: PropTypes.object.isRequired,\n  propsToDisplay: PropTypes.array.isRequired,\n  entity: PropTypes.string.isRequired,\n  omitWrappers: PropTypes.bool,\n  hasBanner: PropTypes.bool,\n  banner: PropTypes.object\n};\n\nFullRender.defaultProps = {\n  omitWrappers: false,\n  hasBanner: false,\n  banner: null\n};\n\nexport default FullRender;\n"],"mappings":"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"}
+{"version":3,"file":"FullRender.js","names":["React","Fragment","useContext","MainContext","MainContextProvider","PropTypes","uuid","FullRenderItem","ListPagination","LOAD_MORE","BANNER","Wrapper","checkIfShouldRenderBanner","FullRender","_ref","orderedListData","omitWrappers","paginationType","graphqlEntityMap","props","_objectWithoutProperties","_excluded","contextProps","pageBuilderID","parent","entity","propsToDisplay","banner","hasBanner","bannerProps","_objectSpread","type","bannerIndex","WrapperToUse","createElement","value","isPreview","className","map","_ref2","i","id","__typename","dataEntity","entityProps","_excluded2","shouldRenderBanner","_extends","key","index","itemId","propTypes","array","isRequired","string","object","bool","defaultProps"],"sources":["../../../../../src/components/List/components/Full/FullRender.js"],"sourcesContent":["import React, { Fragment, useContext } from 'react';\nimport { MainContext, MainContextProvider } from '@blaze-cms/nextjs-components';\nimport PropTypes from 'prop-types';\nimport uuid from 'uuid/v1';\nimport FullRenderItem from './FullRenderItem';\nimport ListPagination from '../Pagination';\nimport { LOAD_MORE } from '../../../../constants';\nimport { BANNER } from '../../constants';\nimport Wrapper from '../../../Wrapper';\nimport { checkIfShouldRenderBanner } from '../helpers';\n\nconst FullRender = ({\n  orderedListData,\n  omitWrappers,\n  paginationType,\n  graphqlEntityMap,\n  ...props\n}) => {\n  const contextProps = useContext(MainContext);\n  const pageBuilderID = uuid();\n  const { parent, entity, propsToDisplay, banner, hasBanner } = props;\n  const bannerProps = banner\n    ? { hasBanner, parent, entity, propsToDisplay, ...banner, type: BANNER }\n    : null;\n  let bannerIndex = 0;\n  const WrapperToUse = omitWrappers ? Fragment : Wrapper;\n\n  return (\n    <MainContextProvider value={{ ...contextProps, isPreview: false }}>\n      <WrapperToUse className=\"list list--full\">\n        {orderedListData.map(({ id, __typename: dataEntity, ...entityProps }, i) => {\n          const shouldRenderBanner = !!bannerProps && checkIfShouldRenderBanner(i, bannerProps);\n          if (shouldRenderBanner) bannerIndex += 1;\n\n          return (\n            <FullRenderItem\n              key={id}\n              {...props}\n              {...entityProps}\n              entity={graphqlEntityMap[dataEntity]}\n              index={i}\n              itemId={id}\n              pageBuilderID={pageBuilderID}\n              entityProps={entityProps}\n              shouldRenderBanner={shouldRenderBanner}\n              bannerProps={bannerProps}\n              bannerIndex={bannerIndex}\n            />\n          );\n        })}\n      </WrapperToUse>\n\n      {paginationType === LOAD_MORE && (\n        <ListPagination paginationType={paginationType} {...props} />\n      )}\n    </MainContextProvider>\n  );\n};\n\nFullRender.propTypes = {\n  orderedListData: PropTypes.array.isRequired,\n  paginationType: PropTypes.string.isRequired,\n  parent: PropTypes.object.isRequired,\n  propsToDisplay: PropTypes.array.isRequired,\n  entity: PropTypes.string.isRequired,\n  omitWrappers: PropTypes.bool,\n  hasBanner: PropTypes.bool,\n  banner: PropTypes.object,\n  graphqlEntityMap: PropTypes.object.isRequired\n};\n\nFullRender.defaultProps = {\n  omitWrappers: false,\n  hasBanner: false,\n  banner: null\n};\n\nexport default FullRender;\n"],"mappings":"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"}

package/lib-es/components/SearchContent/SearchContent.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { useRouter } from 'next/router';
 import { useDebounceSearch } from '@blaze-cms/plugin-search-ui';
@@ -6,7 +6,6 @@ import SearchContentResults from './SearchContentResults';
 import SearchContentToggleIcon from './SearchContentToggleIcon';
 const SearchContent = ({
   entities,
-  searchInputAlignment,
   searchInputWrapperMobile,
   searchInputWrapperDesktop,
   isMobile,
@@ -14,7 +13,9 @@ const SearchContent = ({
   modifier,
   collapsedSearch
 }) => {
+  const searchContentRef = useRef(null);
   const [collapsed, setCollapsed] = useState(collapsedSearch);
+  const [showResults, setShowResults] = useState(false);
   const router = useRouter();
   const {
     results,
@@ -27,14 +28,33 @@ const SearchContent = ({
     resultKeys: 'id, name, image { url }, url'
   });
   useEffect(() => {
-    const handleRouteChange = () => setSearchTerm('');
+    const handleRouteChange = () => {
+      setSearchTerm('');
+      setShowResults(false);
+      if (collapsedSearch) setCollapsed(true);
+    };
     router.events.on('routeChangeStart', handleRouteChange);
     return () => {
       router.events.off('routeChangeStart', handleRouteChange);
     };
-  }, [router.events, setSearchTerm]);
+  }, [collapsedSearch, router.events, setSearchTerm]);
+  useEffect(() => {
+    const handleClickOutside = event => {
+      if (searchContentRef.current && !searchContentRef.current.contains(event.target)) {
+        setShowResults(false);
+        if (collapsedSearch) {
+          setCollapsed(true);
+          setSearchTerm('');
+        }
+      }
+    };
+    document.addEventListener('click', handleClickOutside);
+    return () => {
+      document.removeEventListener('click', handleClickOutside);
+    };
+  }, [collapsedSearch, setSearchTerm]);
   const responsiveClasses = isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop;
-  const handleClick = (e, url) => {
+  const handleNavigation = (e, url) => {
     e.preventDefault();
     router.push(url);
   };
@@ -43,63 +63,48 @@ const SearchContent = ({
       router.push(`/search?search_term=${e.target.value}`);
     }
   };
-  const handleOnBlur = () => {
-    if (!collapsedSearch) return;
-    if (!debouncedSearchTerm || debouncedSearchTerm === '') setCollapsed(true);
-  };
-  const handleClearSearchResults = () => {
-    setSearchTerm('');
+  const handleIconClick = () => {
+    const isCloseIcon = collapsedSearch ? !collapsed : debouncedSearchTerm;
+    if (collapsedSearch) setCollapsed(!collapsed);
+    if (isCloseIcon) {
+      setSearchTerm('');
+      setShowResults(false);
+    } else {
+      setShowResults(true);
+    }
   };
   const className = ['search-content', modifier, responsiveClasses].filter(Boolean).join(' ');
-  return collapsed ? /*#__PURE__*/React.createElement("div", {
-    className: className
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "search-content--collapse__wrapper"
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "search-content--collapse__label"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "search-content--collapse__icon_wrapper"
-  }, /*#__PURE__*/React.createElement("svg", {
-    className: "search-content--collapse__icon",
-    viewBox: "0 0 20 20"
-  }, /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    d: "M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z",
-    clipRule: "evenodd"
-  }))), /*#__PURE__*/React.createElement("input", {
-    onFocus: () => setCollapsed(false),
-    onChange: e => setSearchTerm(e.target.value),
-    type: "text",
-    name: "search",
-    className: "search-content--collapse__input"
-  })))) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: className
+  const searchModifier = collapsed ? 'search-content--collapse' : 'search-content--expanded';
+  return /*#__PURE__*/React.createElement("div", {
+    className: className,
+    ref: searchContentRef
   }, /*#__PURE__*/React.createElement("div", {
-    className: "search-content--expanded__wrapper"
+    className: `${searchModifier}__wrapper`
   }, /*#__PURE__*/React.createElement("label", {
-    className: "search-content--expanded__label"
+    className: `${searchModifier}__label`
   }, /*#__PURE__*/React.createElement("span", {
-    className: "search-content--expanded__icon_wrapper"
+    className: `${searchModifier}__icon_wrapper`
   }, /*#__PURE__*/React.createElement(SearchContentToggleIcon, {
-    results: results,
-    onClear: handleClearSearchResults
-  })), /*#__PURE__*/React.createElement("input", {
+    searchTerm: debouncedSearchTerm,
+    onClick: handleIconClick,
+    useCloseIcon: collapsedSearch ? !collapsed : debouncedSearchTerm
+  })), !collapsed && /*#__PURE__*/React.createElement("input", {
+    className: `${searchModifier}__input`,
     type: "text",
     name: "search",
-    onChange: e => setSearchTerm(e.target.value),
-    onKeyPress: handleKeyPress,
-    className: "search-content--expanded__input",
     placeholder: placeholder,
     value: searchTerm,
-    onBlur: handleOnBlur
-  }))), /*#__PURE__*/React.createElement(SearchContentResults, {
+    onChange: e => setSearchTerm(e.target.value),
+    onKeyPress: handleKeyPress,
+    onFocus: () => setShowResults(true),
+    "data-testid": "search-content-input"
+  }))), showResults && /*#__PURE__*/React.createElement(SearchContentResults, {
     results: results,
     debouncedSearchTerm: debouncedSearchTerm,
-    handleClick: handleClick
-  })));
+    handleClick: handleNavigation
+  }));
 };
 SearchContent.propTypes = {
-  searchInputAlignment: PropTypes.string,
   searchInputWrapperMobile: PropTypes.string,
   searchInputWrapperDesktop: PropTypes.string,
   placeholder: PropTypes.string,
@@ -109,7 +114,6 @@ SearchContent.propTypes = {
   collapsedSearch: PropTypes.bool
 };
 SearchContent.defaultProps = {
-  searchInputAlignment: '',
   searchInputWrapperMobile: '',
   searchInputWrapperDesktop: '',
   placeholder: '',

package/lib-es/components/SearchContent/SearchContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchContent.js","names":["React","useState","useEffect","PropTypes","useRouter","useDebounceSearch","SearchContentResults","SearchContentToggleIcon","SearchContent","entities","searchInputAlignment","searchInputWrapperMobile","searchInputWrapperDesktop","isMobile","placeholder","modifier","collapsedSearch","collapsed","setCollapsed","router","results","searchTerm","setSearchTerm","debouncedSearchTerm","initialSearchTerm","resultKeys","handleRouteChange","events","on","off","responsiveClasses","handleClick","e","url","preventDefault","push","handleKeyPress","key","target","value","handleOnBlur","handleClearSearchResults","className","filter","Boolean","join","createElement","viewBox","fillRule","d","clipRule","onFocus","onChange","type","name","Fragment","onClear","onKeyPress","onBlur","propTypes","string","bool","array","isRequired","defaultProps"],"sources":["../../../src/components/SearchContent/SearchContent.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { useRouter } from 'next/router';\nimport { useDebounceSearch } from '@blaze-cms/plugin-search-ui';\nimport SearchContentResults from './SearchContentResults';\nimport SearchContentToggleIcon from './SearchContentToggleIcon';\n\nconst SearchContent = ({\n  entities,\n  searchInputAlignment,\n  searchInputWrapperMobile,\n  searchInputWrapperDesktop,\n  isMobile,\n  placeholder,\n  modifier,\n  collapsedSearch\n}) => {\n  const [collapsed, setCollapsed] = useState(collapsedSearch);\n  const router = useRouter();\n\n  const { results, searchTerm, setSearchTerm, debouncedSearchTerm } = useDebounceSearch({\n    entities,\n    initialSearchTerm: '',\n    resultKeys: 'id, name, image { url }, url'\n  });\n\n  useEffect(\n    () => {\n      const handleRouteChange = () => setSearchTerm('');\n      router.events.on('routeChangeStart', handleRouteChange);\n\n      return () => {\n        router.events.off('routeChangeStart', handleRouteChange);\n      };\n    },\n    [router.events, setSearchTerm]\n  );\n\n  const responsiveClasses = isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop;\n\n  const handleClick = (e, url) => {\n    e.preventDefault();\n    router.push(url);\n  };\n\n  const handleKeyPress = e => {\n    if (e.key === 'Enter' && e.target.value !== '') {\n      router.push(`/search?search_term=${e.target.value}`);\n    }\n  };\n\n  const handleOnBlur = () => {\n    if (!collapsedSearch) return;\n    if (!debouncedSearchTerm || debouncedSearchTerm === '') setCollapsed(true);\n  };\n\n  const handleClearSearchResults = () => {\n    setSearchTerm('');\n  };\n\n  const className = ['search-content', modifier, responsiveClasses].filter(Boolean).join(' ');\n  return collapsed ? (\n    <div className={className}>\n      <div className=\"search-content--collapse__wrapper\">\n        <label className=\"search-content--collapse__label\">\n          <span className=\"search-content--collapse__icon_wrapper\">\n            <svg className=\"search-content--collapse__icon\" viewBox=\"0 0 20 20\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </span>\n          <input\n            onFocus={() => setCollapsed(false)}\n            onChange={e => setSearchTerm(e.target.value)}\n            type=\"text\"\n            name=\"search\"\n            className=\"search-content--collapse__input\"\n          />\n        </label>\n      </div>\n    </div>\n  ) : (\n    <>\n      <div className={className}>\n        <div className=\"search-content--expanded__wrapper\">\n          <label className=\"search-content--expanded__label\">\n            <span className=\"search-content--expanded__icon_wrapper\">\n              <SearchContentToggleIcon results={results} onClear={handleClearSearchResults} />\n            </span>\n            <input\n              type=\"text\"\n              name=\"search\"\n              onChange={e => setSearchTerm(e.target.value)}\n              onKeyPress={handleKeyPress}\n              className=\"search-content--expanded__input\"\n              placeholder={placeholder}\n              value={searchTerm}\n              onBlur={handleOnBlur}\n            />\n          </label>\n        </div>\n        <SearchContentResults\n          results={results}\n          debouncedSearchTerm={debouncedSearchTerm}\n          handleClick={handleClick}\n        />\n      </div>\n    </>\n  );\n};\n\nSearchContent.propTypes = {\n  searchInputAlignment: PropTypes.string,\n  searchInputWrapperMobile: PropTypes.string,\n  searchInputWrapperDesktop: PropTypes.string,\n  placeholder: PropTypes.string,\n  isMobile: PropTypes.bool,\n  entities: PropTypes.array.isRequired,\n  modifier: PropTypes.string,\n  collapsedSearch: PropTypes.bool\n};\n\nSearchContent.defaultProps = {\n  searchInputAlignment: '',\n  searchInputWrapperMobile: '',\n  searchInputWrapperDesktop: '',\n  placeholder: '',\n  isMobile: false,\n  modifier: '',\n  collapsedSearch: false\n};\n\nexport default SearchContent;\n"],"mappings":"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"}
+{"version":3,"file":"SearchContent.js","names":["React","useState","useEffect","useRef","PropTypes","useRouter","useDebounceSearch","SearchContentResults","SearchContentToggleIcon","SearchContent","entities","searchInputWrapperMobile","searchInputWrapperDesktop","isMobile","placeholder","modifier","collapsedSearch","searchContentRef","collapsed","setCollapsed","showResults","setShowResults","router","results","searchTerm","setSearchTerm","debouncedSearchTerm","initialSearchTerm","resultKeys","handleRouteChange","events","on","off","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","responsiveClasses","handleNavigation","e","url","preventDefault","push","handleKeyPress","key","value","handleIconClick","isCloseIcon","className","filter","Boolean","join","searchModifier","createElement","ref","onClick","useCloseIcon","type","name","onChange","onKeyPress","onFocus","handleClick","propTypes","string","bool","array","isRequired","defaultProps"],"sources":["../../../src/components/SearchContent/SearchContent.js"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { useRouter } from 'next/router';\nimport { useDebounceSearch } from '@blaze-cms/plugin-search-ui';\nimport SearchContentResults from './SearchContentResults';\nimport SearchContentToggleIcon from './SearchContentToggleIcon';\n\nconst SearchContent = ({\n  entities,\n  searchInputWrapperMobile,\n  searchInputWrapperDesktop,\n  isMobile,\n  placeholder,\n  modifier,\n  collapsedSearch\n}) => {\n  const searchContentRef = useRef(null);\n  const [collapsed, setCollapsed] = useState(collapsedSearch);\n  const [showResults, setShowResults] = useState(false);\n  const router = useRouter();\n\n  const { results, searchTerm, setSearchTerm, debouncedSearchTerm } = useDebounceSearch({\n    entities,\n    initialSearchTerm: '',\n    resultKeys: 'id, name, image { url }, url'\n  });\n\n  useEffect(\n    () => {\n      const handleRouteChange = () => {\n        setSearchTerm('');\n        setShowResults(false);\n        if (collapsedSearch) setCollapsed(true);\n      };\n      router.events.on('routeChangeStart', handleRouteChange);\n\n      return () => {\n        router.events.off('routeChangeStart', handleRouteChange);\n      };\n    },\n    [collapsedSearch, router.events, setSearchTerm]\n  );\n\n  useEffect(\n    () => {\n      const handleClickOutside = event => {\n        if (searchContentRef.current && !searchContentRef.current.contains(event.target)) {\n          setShowResults(false);\n          if (collapsedSearch) {\n            setCollapsed(true);\n            setSearchTerm('');\n          }\n        }\n      };\n\n      document.addEventListener('click', handleClickOutside);\n\n      return () => {\n        document.removeEventListener('click', handleClickOutside);\n      };\n    },\n    [collapsedSearch, setSearchTerm]\n  );\n\n  const responsiveClasses = isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop;\n\n  const handleNavigation = (e, url) => {\n    e.preventDefault();\n    router.push(url);\n  };\n\n  const handleKeyPress = e => {\n    if (e.key === 'Enter' && e.target.value !== '') {\n      router.push(`/search?search_term=${e.target.value}`);\n    }\n  };\n\n  const handleIconClick = () => {\n    const isCloseIcon = collapsedSearch ? !collapsed : debouncedSearchTerm;\n\n    if (collapsedSearch) setCollapsed(!collapsed);\n\n    if (isCloseIcon) {\n      setSearchTerm('');\n      setShowResults(false);\n    } else {\n      setShowResults(true);\n    }\n  };\n\n  const className = ['search-content', modifier, responsiveClasses].filter(Boolean).join(' ');\n  const searchModifier = collapsed ? 'search-content--collapse' : 'search-content--expanded';\n\n  return (\n    <div className={className} ref={searchContentRef}>\n      <div className={`${searchModifier}__wrapper`}>\n        <label className={`${searchModifier}__label`}>\n          <span className={`${searchModifier}__icon_wrapper`}>\n            <SearchContentToggleIcon\n              searchTerm={debouncedSearchTerm}\n              onClick={handleIconClick}\n              useCloseIcon={collapsedSearch ? !collapsed : debouncedSearchTerm}\n            />\n          </span>\n          {!collapsed && (\n            <input\n              className={`${searchModifier}__input`}\n              type=\"text\"\n              name=\"search\"\n              placeholder={placeholder}\n              value={searchTerm}\n              onChange={e => setSearchTerm(e.target.value)}\n              onKeyPress={handleKeyPress}\n              onFocus={() => setShowResults(true)}\n              data-testid=\"search-content-input\"\n            />\n          )}\n        </label>\n      </div>\n      {showResults && (\n        <SearchContentResults\n          results={results}\n          debouncedSearchTerm={debouncedSearchTerm}\n          handleClick={handleNavigation}\n        />\n      )}\n    </div>\n  );\n};\n\nSearchContent.propTypes = {\n  searchInputWrapperMobile: PropTypes.string,\n  searchInputWrapperDesktop: PropTypes.string,\n  placeholder: PropTypes.string,\n  isMobile: PropTypes.bool,\n  entities: PropTypes.array.isRequired,\n  modifier: PropTypes.string,\n  collapsedSearch: PropTypes.bool\n};\n\nSearchContent.defaultProps = {\n  searchInputWrapperMobile: '',\n  searchInputWrapperDesktop: '',\n  placeholder: '',\n  isMobile: false,\n  modifier: '',\n  collapsedSearch: false\n};\n\nexport default SearchContent;\n"],"mappings":"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"}