sfc-utils 1.3.57 → 1.3.59

package/components/topper2.mjs

@@ -4,7 +4,7 @@ import WCMImage2 from "./wcmimage2.mjs"
 import CaptionCredit from "./captioncredit.mjs"
 import * as topperStyles from "../styles/modules/topper2.module.less"
 
-const Topper2 = ({ settings, wcmData, lazyloader }) => {
+const Topper2 = ({ settings, wcmData }) => {
   const { 
     Topper_Style, Title, Title_Style, Deck, Image, Image_Alt, Image_Caption, Image_Credits, 
     HeaderDek_Vertical_Position, HeaderDek_Vertical_Offset, HeaderDek_Horizontal_Offset, HeaderDek_Horizontal_Position, Inverted_Colors 
@@ -87,8 +87,8 @@ const Topper2 = ({ settings, wcmData, lazyloader }) => {
     }
   }
 
-  const ImageHTML = () => <WCMImage2 wcm={Image} alt={Image_Alt} isNotLazyloaded={false} wcmData={wcmData} lazyloader={lazyloader} isFullScreenTopper={false}/>
-  const FullScreenImageHTML = () => <WCMImage2 wcm={Image} alt={Image_Alt} isNotLazyloaded={false} ratio={calculateFullScreenImageRatio()} wcmData={wcmData} lazyloader={lazyloader} isFullScreenTopper={true}/>
+  const ImageHTML = () => <WCMImage2 wcm={Image} alt={Image_Alt} isNotLazyloaded={false} wcmData={wcmData} isFullScreenTopper={false}/>
+  const FullScreenImageHTML = () => <WCMImage2 wcm={Image} alt={Image_Alt} isNotLazyloaded={false} ratio={calculateFullScreenImageRatio()} wcmData={wcmData} isFullScreenTopper={true}/>
   
   const TopperHtml = () => {
     switch (Topper_Style) {
@@ -190,6 +190,7 @@ const Topper2 = ({ settings, wcmData, lazyloader }) => {
 
   const calculateFullScreenImageRatio = () => {
       // ratio needs to account for height of nav bar which is 37px
+    if (typeof window === "undefined") return "56.25%"
     const windowRatio = ((window.innerHeight-37) / window.innerWidth)*100;
     let fullScreenRatio = "56.25%"; // defaults to 16/9;
 

package/components/wcmimage2.mjs

@@ -17,7 +17,7 @@ const ImageHTML = ({fullPath, imageRez, alt, isFullScreenTopper}) => {
   )
 }
 
-const WCMImage = ({ wcm, alt, ratio, wcmData, lazyloader, isFullScreenTopper }) => {
+const WCMImage = ({ wcm, alt, ratio, wcmData, isFullScreenTopper }) => {
   // When the wrapping div is rendered, we're going to figure out the best size for this image to be
   let picRef = useRef(null)
   let [imageRez, setImageRez] = useState(0)
@@ -95,14 +95,9 @@ const WCMImage = ({ wcm, alt, ratio, wcmData, lazyloader, isFullScreenTopper })
     throw `WCMImage error: Image for ${wcm} needs an alt tag! Please add a good, descriptive alt tag. Suggestion from Mozilla: When choosing alt strings for your images, imagine what you would say when reading the page to someone over the phone without mentioning that there's an image on the page.`
   }
 
-  // Pull lazyloader HTML from index.js
-  const LazyLoaderHTML = lazyloader;
-
   return (
     <div ref={picRef}>
-        <LazyLoaderHTML>
           <ImageHTML fullPath={fullPath} imageRez={imageRez} alt={alt} isFullScreenTopper={isFullScreenTopper}/>
-        </LazyLoaderHTML>
     </div>
   )
 }
@@ -110,8 +105,7 @@ const WCMImage = ({ wcm, alt, ratio, wcmData, lazyloader, isFullScreenTopper })
 WCMImage.propTypes = {
   wcm: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
   alt: PropTypes.string.isRequired,
-  ratio: PropTypes.string,
-  lazyloader: PropTypes.element
+  ratio: PropTypes.string
 }
 
 export default WCMImage

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sfc-utils",
-  "version": "1.3.57",
+  "version": "1.3.59",
   "author": "ewagstaff <evanjwagstaff@gmail.com>",
   "dependencies": {
     "archieml": "^0.4.2",