Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@chakra-xui/image

chakra-xui3MIT1.0.2TypeScript support: included

React component for progressive image loading

react, progressive, lazyloading, component, chakra xui, image, loading

readme

@chakra-xui/image

The Image component is used to display images.

Installation

yarn add @chakra-xui/image

Import component

import { Image } from "@chakra-xui/image"

Basic Usage

import React from 'react'
import { Image } from '@chakra-xui/image'const Example = () => (
  <Image src="photo.png"  fallbackSrc="placeholdit.com/200x200" alt="A Placeholder Image" />
)

Fallback support

You can provide a fallback image for when there is an error loading the src of the image. You can also opt out of this behavior by passing the ignoreFallback prop.

<Image
  src="photo.png"
  fallbackSrc="placeholdit.com/200x200"
  alt="A Placeholder Image"
/>

changelog

Change Log

1.0.2

Patch Changes

1.0.1

Patch Changes

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0 (2020-11-13)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-rc.8 (2020-10-29)

Bug Fixes

  • toast: allow custom render in update (eb8bff9), closes #2362

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-rc.7 (2020-10-25)

Note: Version bump only for package @chakra-xui/image

1.0.0-rc.6 (2020-10-25)

Note: Version bump only for package @chakra-xui/image

1.0.0-rc.5 (2020-09-27)

Note: Version bump only for package @chakra-xui/image

1.0.0-rc.4 (2020-09-25)

Note: Version bump only for package @chakra-xui/image

1.0.0-rc.3 (2020-08-30)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-rc.2 (2020-08-09)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-rc.1 (2020-08-06)

Bug Fixes

  • ssr issue with image hook (3352c10)

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-rc.0 (2020-07-26)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.7 (2020-07-26)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.6 (2020-07-15)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.5 (2020-07-15)

Note: Version bump only for package @chakra-xui/image

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.4 (2020-07-01)

Bug Fixes

Features

  • image: image lazy loading support (6649f2b)

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.3 (2020-06-28)

Bug Fixes

Change Log

All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.

1.0.0-next.2 (2020-06-21)

Bug Fixes