Skip to content

Commit

Permalink
fix(assets): Fix types to be more accurate (#6530)
Browse files Browse the repository at this point in the history
* fix(assets): Fix types to be more accurate

* chore: changeset
  • Loading branch information
Princesseuh authored Mar 13, 2023
1 parent f55b482 commit acf78c5
Show file tree
Hide file tree
Showing 8 changed files with 38 additions and 23 deletions.
10 changes: 10 additions & 0 deletions .changeset/calm-tigers-stare.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
---
'astro': patch
---

Fix various inaccuracies with types related to the new Assets features:

- getConfiguredImageService wasn't present on the astro:assets types.
- ImageMetadata wasn't exported
- Fixed wrong module declaration for `avif`, `heic` and `heif` files.
- Add missing module declaration for SVGs imports
3 changes: 2 additions & 1 deletion packages/astro/client-base.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ declare module 'astro:assets' {
// Exporting things one by one is a bit cumbersome, not sure if there's a better way - erika, 2023-02-03
type AstroAssets = {
getImage: typeof import('./dist/assets/index.js').getImage;
getConfiguredImageService: typeof import('./dist/assets/index.js').getConfiguredImageService;
Image: typeof import('./components/Image.astro').default;
};

Expand All @@ -20,7 +21,7 @@ declare module 'astro:assets' {
export type RemoteImageProps = Simplify<
import('./dist/assets/types.js').RemoteImageProps<ImgAttributes>
>;
export const { getImage, Image }: AstroAssets;
export const { getImage, getConfiguredImageService, Image }: AstroAssets;
}

type MD = import('./dist/@types/astro').MarkdownInstance<Record<string, any>>;
Expand Down
21 changes: 7 additions & 14 deletions packages/astro/client-image.d.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
/// <reference path="./client-base.d.ts" />

type InputFormat = 'avif' | 'gif' | 'heic' | 'heif' | 'jpeg' | 'jpg' | 'png' | 'tiff' | 'webp';
// TODO: Merge this file with `client-base.d.ts` in 3.0, when the `astro:assets` feature isn't under a flag anymore.

type InputFormat = import('./dist/assets/types.js').InputFormat;

interface ImageMetadata {
src: string;
Expand All @@ -9,23 +11,10 @@ interface ImageMetadata {
format: InputFormat;
}

// images
declare module '*.avif' {
const metadata: ImageMetadata;
export default metadata;
}
declare module '*.gif' {
const metadata: ImageMetadata;
export default metadata;
}
declare module '*.heic' {
const metadata: ImageMetadata;
export default metadata;
}
declare module '*.heif' {
const metadata: ImageMetadata;
export default metadata;
}
declare module '*.jpeg' {
const metadata: ImageMetadata;
export default metadata;
Expand All @@ -46,3 +35,7 @@ declare module '*.webp' {
const metadata: ImageMetadata;
export default metadata;
}
declare module '*.svg' {
const metadata: ImageMetadata;
export default metadata;
}
2 changes: 1 addition & 1 deletion packages/astro/src/@types/astro.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export type {
ShikiConfig,
} from '@astrojs/markdown-remark';
export type { ExternalImageService, LocalImageService } from '../assets/services/service';
export type { ImageTransform } from '../assets/types';
export type { ImageMetadata, ImageTransform } from '../assets/types';
export type { SSRManifest } from '../core/app/types';
export type { AstroCookies } from '../core/cookies';

Expand Down
15 changes: 12 additions & 3 deletions packages/astro/src/assets/consts.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,18 @@
export const VIRTUAL_MODULE_ID = 'astro:assets';
export const VIRTUAL_SERVICE_ID = 'virtual:image-service';
/**
* Valid formats for optimizations in our base services.
* Certain formats can be imported (namely SVGs) but not optimized, so they are excluded from this list.
*/
export const VALID_INPUT_FORMATS = [
'heic',
'heif',
'avif',
// TODO: `image-size` does not support the following formats, so users can't import them.
// However, it would be immensely useful to add, for three reasons:
// - `heic` and `heif` are common formats, especially among Apple users.
// - AVIF is a common format on the web that's bound to become more and more common.
// - It's totally reasonable for an user's provided image service to want to support more image types.
//'heic',
//'heif',
//'avif',
'jpeg',
'jpg',
'png',
Expand Down
6 changes: 4 additions & 2 deletions packages/astro/src/assets/services/service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -88,8 +88,10 @@ export type BaseServiceTransform = {
* }
* ```
*
* This service only supports the following properties: `width`, `height`, `format` and `quality`.
* Additionally, remote URLs are passed as-is.
* This service adhere to the included services limitations:
* - Remote images are passed as is.
* - Only a limited amount of formats are supported.
* - For remote images, `width` and `height` are always required.
*
*/
export const baseService: Omit<LocalImageService, 'transform'> = {
Expand Down
2 changes: 1 addition & 1 deletion packages/astro/src/assets/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import type { ImageService } from './services/service.js';

export type ImageQualityPreset = 'low' | 'mid' | 'high' | 'max' | (string & {});
export type ImageQuality = ImageQualityPreset | number;
export type InputFormat = (typeof VALID_INPUT_FORMATS)[number] | (string & {});
export type InputFormat = (typeof VALID_INPUT_FORMATS)[number] | 'svg';
export type OutputFormat = (typeof VALID_OUTPUT_FORMATS)[number] | (string & {});

declare global {
Expand Down
2 changes: 1 addition & 1 deletion packages/astro/src/assets/vite-plugin-assets.ts
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ export default function assets({

// if no transforms were added, the original file will be returned as-is
let data = file;
let format = meta.format;
let format: string = meta.format;

if (transform) {
const result = await globalThis.astroAsset.imageService.transform(file, transform);
Expand Down

0 comments on commit acf78c5

Please sign in to comment.