Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Adds a new <Picture> component to the image integration #3866

Merged
merged 22 commits into from
Jul 8, 2022
Merged

Adds a new <Picture> component to the image integration #3866

merged 22 commits into from
Jul 8, 2022

Conversation

tony-sull
Copy link
Contributor

Changes

  • adds a new <Picture /> component for generative responsive <picture> elements with multiple source sizes and image formats
  • moves logic for automatically calculating <img /> dimensions into the getImage() API for easier reuse
  • uses JSX type definitions for <Image> and <Picture> components

Testing

  • tests added for the new <Picture /> component
  • adds tests for inlined import()s
  • existing tests cleaned up a bit

Docs

README updated

@changeset-bot
Copy link

changeset-bot bot commented Jul 8, 2022 •
edited
Loading

🦋 Changeset detected

Latest commit: 51f1e44

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@astrojs/image Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the pkg: integration Related to any renderer integration (scope) label Jul 8, 2022
@tony-sull tony-sull changed the title Feat/image improvements Adds a new <Picture> component to the image integration Jul 8, 2022
@tony-sull tony-sull marked this pull request as ready for review July 8, 2022 20:10
matthewp
matthewp approved these changes Jul 8, 2022
View reviewed changes
Copy link
Contributor

@matthewp matthewp left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Love all the tests!

natemoo-re
natemoo-re reviewed Jul 8, 2022
View reviewed changes
Copy link
Member

@natemoo-re natemoo-re left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Amazing update, great tests! Just had a few suggestions.

packages/integrations/image/components/Image.astro Outdated Show resolved Hide resolved
packages/integrations/image/components/Picture.astro Outdated Show resolved Hide resolved
packages/integrations/image/src/config.ts Outdated Show resolved Hide resolved
packages/integrations/image/src/get-image.ts Outdated Show resolved Hide resolved
packages/integrations/image/src/types.ts Outdated Show resolved Hide resolved
natemoo-re
natemoo-re approved these changes Jul 8, 2022
View reviewed changes
Copy link
Member

@natemoo-re natemoo-re left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, very excited for this!

@tony-sull tony-sull merged commit 89d7675 into main Jul 8, 2022
@tony-sull tony-sull deleted the feat/image-improvements branch July 8, 2022 21:37
@astrobot-houston astrobot-houston mentioned this pull request Jul 8, 2022
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@Princesseuh Princesseuh Princesseuh left review comments

@natemoo-re natemoo-re natemoo-re approved these changes

@matthewp matthewp matthewp approved these changes

Assignees
No one assigned
Labels
pkg: integration Related to any renderer integration (scope)
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
4 participants
@tony-sull @matthewp @Princesseuh @natemoo-re