diff --git a/packages/contentful/src/ContentfulVisual.tsx b/packages/contentful/src/ContentfulVisual.tsx index ac0ef45..7683e5f 100644 --- a/packages/contentful/src/ContentfulVisual.tsx +++ b/packages/contentful/src/ContentfulVisual.tsx @@ -1,4 +1,3 @@ -import type { ReactElement } from 'react' import ReactVisual from '@react-visual/react' import { ContentfulAsset, ContentfulVisualProps } from './types/contentfulVisualTypes' import { @@ -17,7 +16,7 @@ import { // Render a Visual using Contentful data export default function ContentfulVisual( props: ContentfulVisualProps -): ReactElement | null { +): JSX.Element | null { // Destructure some props const { diff --git a/packages/next/src/NextVisual.tsx b/packages/next/src/NextVisual.tsx index a707800..90297df 100644 --- a/packages/next/src/NextVisual.tsx +++ b/packages/next/src/NextVisual.tsx @@ -3,8 +3,6 @@ import _Image from "next/image"; const Image = ("default" in _Image ? _Image.default : _Image) as typeof _Image; -import type { ReactElement } from 'react' - import { makeImagePlaceholder } from './lib/placeholder' import { VisualWrapper, @@ -17,7 +15,7 @@ import { NextVisualProps } from './types/nextVisualTypes' // Render a Sanity image via Next/Image export default function NextVisual( props: NextVisualProps -): ReactElement | null { +): JSX.Element | null { // Destructure props const { @@ -82,8 +80,15 @@ export default function NextVisual( // An image rendered within the Visual function NextImage({ - src, sizes, alt, fit, position, priority, loader, placeholderData -}: any): ReactElement { + src, + sizes, + alt, + fit, + position, + priority, + loader, + placeholderData, +}: any): JSX.Element { return ( !!url).length == 0) return + if (mediaSrcEntries.filter(([url]) => !!url).length == 0) return null; // Make the hash mediaSrcs = Object.fromEntries(mediaSrcEntries) @@ -41,7 +37,7 @@ export default function LazyVideo( } else { if (videoLoader) srcUrl = videoLoader({ src }) else if (typeof src == 'string') srcUrl = src - if (!srcUrl) return // If no url could be built, abort + if (!srcUrl) return null; // If no url could be built, abort } // Render client component diff --git a/packages/react/src/PictureImage.tsx b/packages/react/src/PictureImage.tsx index f09f4e9..0d30c85 100644 --- a/packages/react/src/PictureImage.tsx +++ b/packages/react/src/PictureImage.tsx @@ -1,4 +1,3 @@ -import type { ReactElement } from 'react' import type { PictureImageProps } from './types/pictureImageTypes' import type { ImageLoader, SourceMedia, SourceType } from './types/reactVisualTypes' import { deviceSizes, imageSizes } from './lib/sizes' @@ -14,10 +13,7 @@ type ImageSourceProps = { media?: SourceMedia } -export default function PictureImage( - props: PictureImageProps -): ReactElement { - +export default function PictureImage(props: PictureImageProps): JSX.Element { // Destructure props const { src, @@ -94,12 +90,15 @@ function makeSrcUrl( // Make a source tag with srcset for the provided type and/or media attribute function Source({ - widths, imageLoader, sizes, src, type, media -}: ImageSourceProps): ReactElement { - const srcSet = makeSrcSet(widths, imageLoader, { src, type, media }) - return ( - - ) + widths, + imageLoader, + sizes, + src, + type, + media, +}: ImageSourceProps): JSX.Element { + const srcSet = makeSrcSet(widths, imageLoader, { src, type, media }); + return ; } // Make a srcset string from an array of width integers using the imageLoader diff --git a/packages/react/src/ReactVisual.tsx b/packages/react/src/ReactVisual.tsx index c6e6ddc..83c0403 100644 --- a/packages/react/src/ReactVisual.tsx +++ b/packages/react/src/ReactVisual.tsx @@ -1,5 +1,3 @@ -import type { ReactElement } from 'react' - import VisualWrapper from './VisualWrapper' import LazyVideo from './LazyVideo' import PictureImage from './PictureImage' @@ -10,7 +8,7 @@ import { fillStyles } from './lib/styles' export default function ReactVisual( props: ReactVisualProps -): ReactElement | null { +): JSX.Element | null { // Destructure props const { diff --git a/packages/react/src/VisualWrapper.tsx b/packages/react/src/VisualWrapper.tsx index eb24adc..28185b8 100644 --- a/packages/react/src/VisualWrapper.tsx +++ b/packages/react/src/VisualWrapper.tsx @@ -1,4 +1,4 @@ -import type { CSSProperties, ReactElement } from 'react' +import type { CSSProperties } from 'react' import { fillStyles, cx } from './lib/styles' import { isNumeric } from './lib/values' import type { VisualWrapperProps } from './types/visualWrapperTypes' @@ -13,11 +13,18 @@ type MakeResponsiveAspectsProps = Pick