# clay-link

> Clay Link Component

Latest version **2.24.1** (published 2022-05-30) · BSD-3-Clause license · 0 weekly downloads

## Install

```sh
npm install clay-link
pnpm add clay-link
yarn add clay-link
bun add clay-link
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: no vulnerabilities; high maintenance score.

Warnings: low downloads; no types; no esm support.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 2.24.1 |
| Published | 2022-05-30 |
| First published | 2017-09-29 |
| Weekly downloads | 0 |
| License | BSD-3-Clause |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=0.12.0 |
| Dependencies | 7 |
| Unpacked size | 93.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 244 |
| Maintainers | tinycarol, edalgrin, pat270, liferay, bryceosterhaus, carloslancha, diegonvs, matuzalemteles, izaera, gagranta, p2kmgcl, marko.cikos, kresimircoko, jbalsas |
| Keywords | clay, metal |

## Links

- npm: https://www.npmjs.com/package/clay-link
- Repository: https://github.com/liferay/clay.git#master
- Homepage: https://github.com/liferay/clay/tree/master#readme
- Issues: https://github.com/liferay/clay/issues
- npm.io page: https://npm.io/package/clay-link

## Dependencies (7)

- [metal](https://npm.io/package/metal.md) ^2.16.0
- [clay-icon](https://npm.io/package/clay-icon.md) ^2.24.1
- [metal-soy](https://npm.io/package/metal-soy.md) ^2.16.0
- [metal-state](https://npm.io/package/metal-state.md) ^2.16.0
- [clay-component](https://npm.io/package/clay-component.md) ^2.24.1
- [metal-component](https://npm.io/package/metal-component.md) ^2.16.0
- [metal-web-component](https://npm.io/package/metal-web-component.md) ^2.16.0

## Recent versions

- 2.24.1 (latest) — 2022-05-30
- 2.24.0 — 2022-03-21
- 2.23.4 — 2022-02-24
- 2.23.3 — 2022-01-13
- 2.23.2 — 2021-12-16
- 2.23.1 — 2021-12-14
- 2.22.4 — 2021-06-16
- 2.22.2 — 2021-02-11
- 2.22.1 — 2021-01-27
- 2.22.0 — 2020-12-09
- 2.21.4 — 2020-08-11
- 2.21.3 — 2020-05-21
- 2.21.2 — 2020-04-23
- 2.21.0 — 2020-03-20
- 2.20.2 — 2020-01-28
- … 78 more at https://npm.io/package/clay-link/versions

## README

# clay-link

A reusable Metal Clay component that renders an anchor tag with a set list of attributes. It provides a consistent API across components that use links.

Rendering a Link:
```javascript
new metal.ClayLink({
	href: 'http://www.metaljs.com/',
	icon: {
		alignment: 'right',
		spritemap: 'path/to/svg/icons.svg',
		symbol: 'add-cell'
	},
	id: 'myLinkId',
	label: '<span>My Other Link Label</span>',
	target: '_blank'
});
```

Rendering a Link with a Click Event:
```javascript
new metal.ClayLink({
	events: {
		click: {
			fn: 'toggle'
		}
	},
	href: 'http://www.metaljs.com/',
	icon: {
		alignment: 'right',
		spritemap: 'path/to/svg/icons.svg',
		symbol: 'add-cell'
	},
	id: 'myLinkId',
	label: '<span>My Other Link Label</span>',
	target: '_blank'
});
```

```javascript
new metal.ClayLink({
	events: {
		click: {
			fn: function(event) {
				event.preventDefault();
				// do my custom stuff
			}
		}
	},
	href: 'http://www.metaljs.com/',
	icon: {
		alignment: 'right',
		spritemap: 'path/to/svg/icons.svg',
		symbol: 'add-cell'
	},
	id: 'myLinkId',
	label: '<span>My Other Link Label</span>',
	target: '_blank'
});
```

## Setup

1. See [metal-clay-components/README.md](https://github.com/metal/metal-clay-components/blob/master/README.md)

2. Build the code:

  ```
  npm run build
  ```

3. Watch task:

  ```
  npm run watch
  ```

## Contribute

We'd love to get contributions from you! Please, check our [Contributing Guidelines](https://github.com/metal/metal-clay-components/blob/master/CONTRIBUTING.md) to see how you can help us improve.

---
_Source: https://npm.io/package/clay-link · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._