Commit graph

24 commits

Author SHA1 Message Date
Caleb Jasik
ebb40f5cb0
@astrojs/image: Add fetchpriority to Picture types (#7059)
* Add `fetchpriority` to `Picture` types

* Add changeset
2023-05-11 14:40:53 +02:00
Alper Doğan
99479e6b95
Optional Sizes prop on Picture component (#6773) 2023-04-10 14:09:02 +02:00
Charles F. Munat
460f9e7329
Fix duplicate alt attribute on Picture component. (#6157)
* Fix duplicate alt attribute on Picture component.

* Create tidy-buses-mate.md

---------

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
2023-02-06 20:25:17 -06:00
wulinsheng123
9fdecb5606
fix: #5979 (#6142)
* fix: #5979

* Update lazy-plums-sit.md

---------

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
2023-02-06 13:28:08 -06:00
Happydev
006405d33c
Refactor Props of Image and Picture component to support type checking (#5788)
* correct props type

* refactor Picture and Image typings

* add missing `alt` property

* add changeset

* apply suggestions

* correct `astro/types` import

Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com>

* apply suggestions

* convert to type import

Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com>
2023-01-18 02:41:50 +00:00
Tony Sullivan
b77200f423
removes default content-visibility styles from image components (#5180) 2022-10-24 18:30:02 +00:00
Emmanuel Chucks
ed2dfdae5b
fix: updates <Picture /> to pass HTML attributes down to the <img /> element (#5038)
* fix: also pass attrs to underlying img

`class` for direct img styling, `width` & `height` to prevent layout shift, etc need to be passed to the underlying img tag to work.

* remove redundant attr from picture tag

* revert to previous commit

- seemed to break some tests
- can't deal with fixing that right now, maybe later

* only passing attributes to the img

* adding a note to the README

* chore: add changeset

Co-authored-by: Tony Sullivan <tony.f.sullivan@outlook.com>
2022-10-20 19:42:36 +00:00
Gerard de Brieder
944d24e9ee
Update Picture.astro so it no longer passes height and width attributes (#4797)
* Update Picture.astro

the image variable of getPicture contains a width and height property, which we usually require. In this case, the image is wrapped in a picture tag and the img tag itself should not have a width and height property as this will break the responsiveness of the image provided by the picture tag.

* added changeset

* fixing SSG picture tests that were expecting img dimensions

Co-authored-by: Tony Sullivan <tony.f.sullivan@outlook.com>
2022-09-22 21:01:38 +00:00
Oussama Bennaci
1e5d8ba9af
[@astrojs/image] support additional resize options (#4438)
* working draft

* more sharp params

* add changeset

* fix typing

* wip

* add missing docblocks

* update lock file

* remove enlargement and reduction resize options

* add tests

* Add docs

* support crop options in pictures

* cleanup

* define crop types in docs

* cleanup

* remove kernel option

Co-authored-by: Tony Sullivan <tony.f.sullivan@outlook.com>
2022-09-09 20:13:59 +00:00
Valentin Bersier
e4348a4eb4
@astrojs/image: add a background option/prop to replace the alpha layer (#4642)
* Added `background` option and prop.
This optional color specifies which background to use when removing the
alpha channel if the output format doesn't support transparency.

* Modified existing tests

* Fixed wrong dimensions in tests

* Fixing a few instances of jpeg vs jpg

* Added color checking

* working on the tests

* tests are now passing

* Adding tests

* Added tests for background color

* no need to test with subpath

* Added fixture

* Renamed test fixture for background-color

* skipping test until fixed

* Typo

* Working on tests

* tests are passing

* Updated readme and added changeset

* Updated lockfile

* Updated lockfile

* Updated lockfile

Co-authored-by: Tony Sullivan <tony.f.sullivan@outlook.com>
2022-09-07 17:22:11 +00:00
Tony Sullivan
db70afdcd5
[@astrojs/image] Fixes a regression in remote image filenames (#4649)
* fixes a bug in filename creation for remote images without a file extension

* chore: add changeset
2022-09-07 13:56:07 +00:00
tony-sull
c62257f0b0 [ci] format 2022-09-01 21:26:15 +00:00
Jan Müller
72c760e9b8
feat(image): throw if alt text is missing (#4511)
* feat(image): throw if no `alt` is provided

* chore: add changeset

* docs(image): update README

* updated alt text stuff throughout

* fixing with-mdx test suite

* warn for missing alt text, will throw an error in a future release

* final README tweaks

Co-authored-by: Tony Sullivan <tony.f.sullivan@outlook.com>
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
2022-09-01 21:24:07 +00:00
FredKSchott
4de35f3b70 [ci] format 2022-08-06 04:39:26 +00:00
tony-sull
57770bbae2 [ci] format 2022-07-27 15:41:22 +00:00
Tony Sullivan
a397b981f5
Fixes type definitions @astrojs/image and adds more documentation to the README (#4045)
* WIP: moving to a static .d.ts types file

* fixing named exports for getImage and getPicture

* removing the exports.astro map for now

* WIP: adding readme docs for component attributes

* Adding docs for getImage and getPicture

* leaning fully on TSC to build .d.ts files

* finally found the solution for proper ESM import types

* adding a note to the README for tsconfig updates

* chore: add changesets

* typo

* docs: removing the "Images in Markdown" example

* removing the need for publishing src to NPM

* fix: make type re-export explicit

* updating image module defs to match InputFormat

* using astro syntax highlighting for README code blocks

* nit: missing backtick in README

* make sure Astro component directives aren't recommended twice
2022-07-27 15:39:05 +00:00
Tony Sullivan
ef9345767b
WIP: [image] Fixing SSR support and improving error validation (#4013)
* fix: SSR builds were hitting an undefined error and skipping the step for copying original assets

* chore: update lockfile

* chore: adding better error validation to getImage and getPicture

* refactor: cleaning up index.ts

* refactor: moving SSG build generation logic out of the integration

* splitting build to ssg & ssr helpers, re-enabling SSR image build tests

* sharp should automatically rotate based on EXIF

* cleaning up how static images are tracked for SSG builds

* undo unrelated mod.d.ts change

* chore: add changeset
2022-07-22 23:01:56 +00:00
Tony Sullivan
eaf187f2c4
Fixing TypeScript type definitions for image components (#3980)
* moving back to importing from components directory

* exporting components with a .ts file instead of .js

* chore: changeset
2022-07-20 00:33:11 +00:00
Tony Sullivan
d73c04a9e5
<Picture> component should pass all unknown attributes to the <img> element (#3961)
* <Picture /> should pass all unrecognized props down to the <img> element

* chore: add changeset

* Adding test coverage for custom <img> attributes

* chore: adding a README note for passing attributes to the picture's img

* Revert "<Picture /> should pass all unrecognized props down to the <img> element"

This reverts commit ce3e33930f.

* Picture should pass alt text to the img
2022-07-19 19:21:58 +00:00
Tony Sullivan
f961412862
Updating the <Picture /> component to default to async image decoding (#3876)
* defaulting pictures to use decoding=async

* chore: add changeset
2022-07-09 18:44:31 +00:00
Tony Sullivan
89d76753a0
Adds a new <Picture> component to the image integration (#3866)
* moving all normalization logic out of the Image component

* refactor: only require loaders to provide the image src

* Adding a `<Picture />` component

* fixing types.ts imports

* refactor: moving getImage to it's own file

* updating component types to use astroHTML.JSX

* Revert "updating component types to use astroHTML.JSX"

This reverts commit 6e5f578da8.

* going back to letting loaders add extra HTML attributes

* Always use lazy loading and async decoding

* Cleaning up the Picture component

* Adding test coverage for <Picture>

* updating the README

* using JSX types for the Image and Picture elements

* chore: adding changeset

* Update packages/integrations/image/src/get-image.ts

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>

* allow users to override loading and async on the <img>

* renaming config to constants, exporting getPicture()

* found the right syntax to import astro-jsx

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
2022-07-08 21:37:55 +00:00
Tony Sullivan
5ccccace0c
Updates how the new Image component is exported to support older versions of Astro (#3812)
* don't use typescript for the components named export file

* Adding a readme example for images in markdown

* chore: add changeset
2022-07-04 14:52:32 +00:00
Tony Sullivan
d143d24c72
Updates the images integration to automatically mark optimizeDeps for sharp (#3795)
* including src in npm publish

* bugfix: always round dimensions before passing to sharp.resize

* automatically add optimizeDeps vite config

* chore: changeset
2022-07-01 19:56:43 +00:00
Tony Sullivan
e8593e7ead
Adds an @astrojs/image integration for optimizing images (#3694)
* initial commit

* WIP: starting to define interfaces for images and transformers

* WIP: basic sharp service to test out the API setup

* adding a few tests for sharp.toImageSrc

* Adding tests for sharp.parseImageSrc

* hooking up basic SSR support

* updating image services to return width/height

* simplifying config setup for v1

* hooking up basic SSR + SSG support (dev & build)

* refactor: a bit of code cleanup and commenting

* WIP: migrating local files to ESM + vite plugin

* WIP: starting to hook up user-provided loaderEntryPoints

* chore: update lock file

* chore: update merged lockfile

* refactor: code cleanup and type docs

* pulling over the README template for first-party integrations

* moving metadata out to the loader

* updating the test for the refactored import

* revert: remove unrelated webapi formatting

* revert: remove unrelated change

* fixing up the existing sharp tests

* fix: vite plugin wasn't dynamically loading the image service properly

* refactor: minor API renaming, removing last hard-coded use of sharp loader

* don't manipulate src for hosted image services

* Adding support for automatically calculating dimensions by aspect ratio, if needed

* a few bug fixes + renaming the aspect ratio search param to "ar"

* Adding ETag support, removing need for loaders to parse file metadata

* using the battle tested `etag` package

* Adding support for dynamically calculating partial sizes

* refactor: moving to the packages/integrations dir, Astro Labs TBD later

* refactor: renaming parse/serialize functions

* Adding tests for SSG image optimizations

* refactor: clean up outdated names related to ImageProps

* nit: reusing cached SSG filename

* chore: update pnpm lock file

* handling file URLs when resolving local image imports

* updating image file resolution to use file URLs

* increasing test timeout for image build tests

* fixing eslint error in sharp test

* adding slash for windows compat in src URLs

* chore: update lockfile after merge

* Adding README content

* adding a readme call to action for configuration options

* review: A few of the quick updates from the PR review

* hack: adds a one-off check to allow query params for the _image route

* Adds support for src={import("...")}, and named component exports

* adding SSR tests

* nit: adding a bit more comments

* limiting the query params in SSG dev to the images integration
2022-07-01 15:47:48 +00:00