Skip to content
This repository has been archived by the owner on Aug 13, 2023. It is now read-only.

Migrate Image component from Simorgh #225

Merged
merged 12 commits into from
Dec 19, 2018
5 changes: 5 additions & 0 deletions packages/components/psammead-image/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
# Psammead Image Changelog

| Version | Description |
|---------|-------------|
| 0.1.0 | [PR#225](https://github.com/BBC-News/psammead/pull/225) Create initial package, pulled in from [Simorgh](https://github.com/BBC-News/simorgh). |
39 changes: 39 additions & 0 deletions packages/components/psammead-image/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
# psammead-image · [![GitHub license](https://img.shields.io/badge/license-Apache%202.0-blue.svg)](https://github.com/BBC-News/psammead/blob/latest/LICENSE) [![npm version](https://img.shields.io/npm/v/@bbc/psammead-image.svg)](https://www.npmjs.com/package/@bbc/psammead-image) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/BBC-News/psammead/blob/latest/CONTRIBUTING.md)

## Description
The `psammead-image` component is a styled `img` element.

## Usage

ChrisBAshton marked this conversation as resolved.
Show resolved Hide resolved
```jsx
import Image from '@bbc/psammead-image';

const Wrapper = (src, alt, width, height) => (
<Image src={src} alt={alt} width={width} height={height} />
);
```

| Prop | Type |
|:---------|:--------------|
| `alt` | string |
| `height` | number/string |
| `src` | string |
| `width` | number/string |

## Accessibility notes

This component requires an `alt` property to describe the image. This `alt` text is crucial for users of Assistive Technology, and by any user whose internet connection is so slow the browser decides to render the text instead of the image.

Some images are purely presentational - in these cases, an `alt` attribute must still be passed, but the value would be an empty string: `""`.

## Contributing

Psammead is completely open source. We are grateful for any contributions, whether they be new components, bug fixes or general improvements. Please see our primary contributing guide which can be found at [the root of the Psammead respository](https://github.com/BBC-News/psammead/blob/latest/CONTRIBUTING.md).

### [Code of Conduct](https://github.com/BBC-News/psammead/blob/latest/CODE_OF_CONDUCT.md)

We welcome feedback and help on this work. By participating in this project, you agree to abide by the [code of conduct](https://github.com/BBC-News/psammead/blob/latest/CODE_OF_CONDUCT.md). Please take a moment to read it.

### License

Psammead is [Apache 2.0 licensed](https://github.com/BBC-News/psammead/blob/latest/LICENSE).
Loading