From 08e0aa1be204b6c7255b857095fb6d628431822c Mon Sep 17 00:00:00 2001
From: Matt Schwartz <mschwartz10@gmail.com>
Date: Wed, 12 Aug 2020 03:27:16 -0500
Subject: [PATCH] fix(gatsby-image): Fix typings for fixed and fluid props
 (#24767)

Co-authored-by: Matt Kane <m@mk.gg>
---
 packages/gatsby-image/index.d.ts              | 20 ++++++++++++++++---
 .../gatsby-image/withIEPolyfill/index.d.ts    |  2 +-
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/packages/gatsby-image/index.d.ts b/packages/gatsby-image/index.d.ts
index e4f1eec6344ee..c88fc622870bf 100644
--- a/packages/gatsby-image/index.d.ts
+++ b/packages/gatsby-image/index.d.ts
@@ -24,11 +24,15 @@ export interface FluidObject {
   media?: string
 }
 
-interface GatsbyImageProps {
+interface GatsbyImageOptionalProps {
+  /**
+   * @deprecated Use `fixed`
+   */
   resolutions?: FixedObject
+  /**
+   * @deprecated Use `fluid`
+   */
   sizes?: FluidObject
-  fixed?: FixedObject | FixedObject[]
-  fluid?: FluidObject | FluidObject[]
   fadeIn?: boolean
   durationFadeIn?: number
   title?: string
@@ -49,6 +53,16 @@ interface GatsbyImageProps {
   loading?: `auto` | `lazy` | `eager`
   draggable?: boolean
 }
+  
+interface GatsbyImageFluidProps extends GatsbyImageOptionalProps {
+  fluid: FluidObject | FluidObject[]
+}
+
+interface GatsbyImageFixedProps extends GatsbyImageOptionalProps {
+  fixed: FixedObject | FixedObject[]
+}
+
+export type GatsbyImageProps = GatsbyImageFluidProps | GatsbyImageFixedProps
 
 export default class GatsbyImage extends React.Component<
   GatsbyImageProps,
diff --git a/packages/gatsby-image/withIEPolyfill/index.d.ts b/packages/gatsby-image/withIEPolyfill/index.d.ts
index 54c745305d976..8365de1624cdf 100644
--- a/packages/gatsby-image/withIEPolyfill/index.d.ts
+++ b/packages/gatsby-image/withIEPolyfill/index.d.ts
@@ -2,7 +2,7 @@ import * as React from "react"
 
 import GatsbyImage, { GatsbyImageProps } from "../index"
 
-interface GatsbyImageWithIEPolyfillProps extends GatsbyImageProps {
+type GatsbyImageWithIEPolyfillProps = GatsbyImageProps & {
   objectFit?: `fill` | `contain` | `cover` | `none` | `scale-down`
   objectPosition?: string
 }