Socket
Socket
Sign inDemoInstall

gatsby-image

Package Overview
Dependencies
Maintainers
2
Versions
310
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

gatsby-image - npm Package Compare versions

Comparing version 1.0.38 to 1.0.39

index.d.ts

2

package.json
{
"name": "gatsby-image",
"description": "Lazy-loading React image component with optional support for the blur-up effect.",
"version": "1.0.38",
"version": "1.0.39",
"author": "Kyle Mathews <mathews.kyle@gmail.com>",

@@ -6,0 +6,0 @@ "bugs": {

@@ -246,19 +246,20 @@ # gatsby-image

| Name | Type | Description |
| ----------------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------- |
| `resolutions` | `object` | Data returned from the `resolutions` query |
| `sizes` | `object` | Data returned from the `sizes` query |
| `fadeIn` | `bool` | Defaults to fading in the image on load |
| `title` | `string` | Passed to the `img` element |
| `alt` | `string` | Passed to the `img` element |
| `className` | `string|object` | Passed to the wrapper element. Object is needed to support Glamor's css prop |
| `outerWrapperClassName` | `string|object` | Passed to the outer wrapper element. Object is needed to support Glamor's css prop |
| `style` | `object` | Spread into the default styles in the wrapper element |
| `imgStyle` | `object` | Spread into the default styles for the actual `img` element |
| `position` | `string` | Defaults to `relative`. Pass in `absolute` to make the component `absolute` positioned |
| Name | Type | Description |
| ----------------------- | --------------- | --------------------------------------------------------------------------------------------------------------------------- |
| `resolutions` | `object` | Data returned from the `resolutions` query |
| `sizes` | `object` | Data returned from the `sizes` query |
| `fadeIn` | `bool` | Defaults to fading in the image on load |
| `title` | `string` | Passed to the `img` element |
| `alt` | `string` | Passed to the `img` element |
| `className` | `string|object` | Passed to the wrapper element. Object is needed to support Glamor's css prop |
| `outerWrapperClassName` | `string|object` | Passed to the outer wrapper element. Object is needed to support Glamor's css prop |
| `style` | `object` | Spread into the default styles in the wrapper element |
| `imgStyle` | `object` | Spread into the default styles for the actual `img` element |
| `position` | `string` | Defaults to `relative`. Pass in `absolute` to make the component `absolute` positioned |
| `backgroundColor` | `string|bool` | Set a colored background placeholder. If true, uses "lightgray" for the color. You can also pass in any valid color string. |
| `onLoad` | `func` | A callback that is called when the full-size image has loaded. |
| `Tag` | `string` | Which HTML tag to use for wrapping elements. Defaults to `div`. |
| `onLoad` | `func` | A callback that is called when the full-size image has loaded. |
| `Tag` | `string` | Which HTML tag to use for wrapping elements. Defaults to `div`. |
## Image processing arguments
[gatsby-plugin-sharp](/packages/gatsby-plugin-sharp) supports many additional arguments for transforming your images like

@@ -265,0 +266,0 @@ `quality`,`sizeByPixelDensity`,`pngCompressionLevel`,`cropFocus`,`greyscale` and many more. See its documentation for more.

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc