michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Optional Sizes prop on Picture component (#6773)

Browse source
This commit is contained in:
Alper Doğan 2023-04-10 15:09:02 +03:00 committed by GitHub
parent a5601a3cd3
commit 99479e6b95
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/breezy-roses-smash.md Normal file
View file

@ -0,0 +1,5 @@
---
'@astrojs/image': patch
---
Make sizes prop optional on Image component

3
packages/integrations/image/components/Picture.astro
View file

@ -2,6 +2,7 @@
import { getPicture } from '../dist/index.js'; import { getPicture } from '../dist/index.js';
import { warnForMissingAlt } from './index.js'; import { warnForMissingAlt } from './index.js';
import type { PictureComponentLocalImageProps, PictureComponentRemoteImageProps } from './index.js'; import type { PictureComponentLocalImageProps, PictureComponentRemoteImageProps } from './index.js';
import type { GetPictureResult } from '../src/lib/get-picture.js';
export type Props = PictureComponentLocalImageProps | PictureComponentRemoteImageProps; export type Props = PictureComponentLocalImageProps | PictureComponentRemoteImageProps;
@ -24,7 +25,7 @@ if (alt === undefined || alt === null) {
warnForMissingAlt(); warnForMissingAlt();
} }
const { image, sources } = await getPicture({ const { image, sources }: GetPictureResult = await getPicture({
src, src,
widths, widths,
formats, formats,

4
packages/integrations/image/components/index.ts
View file

@ -31,8 +31,8 @@ export interface PictureComponentLocalImageProps
src: ImageMetadata | Promise<{ default: ImageMetadata }>; src: ImageMetadata | Promise<{ default: ImageMetadata }>;
/** Defines an alternative text description of the image. Set to an empty string (alt="") if the image is not a key part of the content (it's decoration or a tracking pixel). */ /** Defines an alternative text description of the image. Set to an empty string (alt="") if the image is not a key part of the content (it's decoration or a tracking pixel). */
alt: string; alt: string;
sizes: HTMLImageElement['sizes'];
widths: number[]; widths: number[];
sizes?: HTMLImageElement['sizes'];
formats?: OutputFormat[]; formats?: OutputFormat[];
} }
@ -43,9 +43,9 @@ export interface PictureComponentRemoteImageProps
src: string; src: string;
/** Defines an alternative text description of the image. Set to an empty string (alt="") if the image is not a key part of the content (it's decoration or a tracking pixel). */ /** Defines an alternative text description of the image. Set to an empty string (alt="") if the image is not a key part of the content (it's decoration or a tracking pixel). */
alt: string; alt: string;
sizes: HTMLImageElement['sizes'];
widths: number[]; widths: number[];
aspectRatio: TransformOptions['aspectRatio']; aspectRatio: TransformOptions['aspectRatio'];
sizes?: HTMLImageElement['sizes'];
formats?: OutputFormat[]; formats?: OutputFormat[];
background?: TransformOptions['background']; background?: TransformOptions['background'];
} }