mirror of
https://github.com/withastro/astro.git
synced 2024-12-16 21:46:22 -05:00
36e30a3309
* feat: expose and rename `inferSize` * feat: separate `ISize` type * feat: reformat function to use `ImageMetadata` * nit(assets): re-use image-metadata code for remote images * chore: changeset * chore: changeset * feat(assets): Export from `astro:assets` * fix: proper errors * fix: dont export from astro/assets * fix: ests * Update .changeset/large-geese-play.md Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> * fix: ests * Update .changeset/large-geese-play.md Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> --------- Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com> Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
20 lines
755 B
Markdown
20 lines
755 B
Markdown
---
|
|
"astro": minor
|
|
---
|
|
|
|
Adds a new `inferRemoteSize()` function that can be used to infer the dimensions of a remote image.
|
|
|
|
Previously, the ability to infer these values was only available by adding the [`inferSize`] attribute to the `<Image>` and `<Picture>` components or `getImage()`. Now, you can also access this data outside of these components.
|
|
|
|
This is useful for when you need to know the dimensions of an image for styling purposes or to calculate different densities for responsive images.
|
|
|
|
```astro
|
|
---
|
|
import { inferRemoteSize, Image } from 'astro:assets';
|
|
|
|
const imageUrl = 'https://...';
|
|
const { width, height } = await inferRemoteSize(imageUrl);
|
|
---
|
|
|
|
<Image src={imageUrl} width={width / 2} height={height} densities={[1.5, 2]} />
|
|
```
|