0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-23 21:53:55 -05:00
astro/packages/integrations/image/components/Image.astro
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

33 lines
826 B
Text

---
// @ts-ignore
import { getImage } from '../dist/index.js';
import type { ImgHTMLAttributes } from './index.js';
import type { ImageMetadata, TransformOptions, OutputFormat } from '../dist/index.js';
interface LocalImageProps extends
Omit<TransformOptions, 'src'>,
Omit<ImgHTMLAttributes, | 'src' | 'width' | 'height'> {
src: ImageMetadata | Promise<{ default: ImageMetadata }>;
}
interface RemoteImageProps extends TransformOptions, astroHTML.JSX.ImgHTMLAttributes {
src: string;
format: OutputFormat;
width: number;
height: number;
}
export type Props = LocalImageProps | RemoteImageProps;
const { loading = "lazy", decoding = "async", ...props } = Astro.props as Props;
const attrs = await getImage(props);
---
<img {...attrs} {loading} {decoding} />
<style>
img {
content-visibility: auto;
}
</style>