2.3.0-alpha.3f3ee76e • Published 8 years ago

@crave/farmblocks-link v2.3.0-alpha.3f3ee76e

Weekly downloads
18
License
MIT
Repository
github
Last release
8 years ago

logo-farmblocks

Farmblocks-Links

A React component to create links. See Storybook

Installation

npm install @crave/farmblocks-link

Design Spec

See it on zeplin: https://scene.zeplin.io/project/595a9cd3b401bf1876faab27/screen/59ee42d9ed214b77c54c4e1f https://scene.zeplin.io/project/595a9cd3b401bf1876faab27/screen/59ee42d9b95cec4ea9ed4e14 https://scene.zeplin.io/project/595a9cd3b401bf1876faab27/screen/59ee42dab95cec4ea9ed4e48 https://scene.zeplin.io/project/595a9cd3b401bf1876faab27/screen/59ee42dac5418ce9dc27ffa2 https://scene.zeplin.io/project/595a9cd3b401bf1876faab27/screen/59ee42da064e270badd9be38

Usage

A Link renders a stylized <a> tag, which has to have a href value or a function to handle onClick, as well as a children element.

import React from "react";
import ReactDOM from "react-dom";
import Link from "@crave/farmblocks-link";
import { linkTypes } from "@crave/farmblocks-link";

const root = document.createElement("div");

ReactDOM.render(
  <Link href="#" type={linkTypes.NEUTRAL} size="14" lineHeight="1.14">
    This is a link!
  </Link>,
  root
);

document.body.appendChild(root);

API

PropertyDescriptionType
childrenthe contents of the cardReact.Node
hrefan URI to a desired destinationstring
typethe type of link (reflects on color and text-decoration)one of "FEATURED", "NEUTRAL", "NORMAL" or "WHITE" from linkTypes.js
disabledindicates a disabled linkboolean
tooltipTexta text for a tooltip presented onMouseOver in disabled linksstring
tooltipAlignalign position for a tooltip presented onMouseOver in disabled linksstring (one of "left" or "right")
onClicka function to handle an onClick eventfunction
leftIconan icon to be placed on the left side of the linkstring
rightIconan icon to be placed on the right side of the linkstring
externalan indication of an external link (an icon will be placed on the right side of the link)boolean
sizea font-size css value for childrennumber
lineHeighta line-height css value for childrennumber or string

License

MIT

6.0.11

4 years ago

6.0.10

4 years ago

6.0.9

5 years ago

6.0.6

5 years ago

6.0.5

5 years ago

6.0.3

5 years ago

6.0.4

5 years ago

6.0.2

5 years ago

6.0.1

5 years ago

6.0.0

6 years ago

5.1.6

6 years ago

5.1.5

6 years ago

5.1.4

6 years ago

5.1.3

6 years ago

5.1.2

6 years ago

5.1.1

6 years ago

5.1.0

6 years ago

5.0.3

6 years ago

5.0.2

6 years ago

5.0.1

6 years ago

5.0.0

6 years ago

4.2.6

6 years ago

4.2.5

6 years ago

4.2.4

7 years ago

4.2.3

7 years ago

4.2.2

7 years ago

4.2.2-alpha.26

7 years ago

4.2.1

7 years ago

4.2.0

7 years ago

4.1.2-alpha.1

7 years ago

4.1.1

7 years ago

4.1.1-alpha.13

7 years ago

4.1.1-alpha.12

7 years ago

4.1.0

7 years ago

4.0.4

7 years ago

4.0.3

7 years ago

4.0.2

7 years ago

4.0.1

7 years ago

4.0.0

7 years ago

3.1.8

7 years ago

3.1.7

7 years ago

3.1.6

7 years ago

3.1.5

7 years ago

3.1.4

7 years ago

3.1.3

7 years ago

3.1.2

7 years ago

3.1.1

7 years ago

3.1.0

7 years ago

3.0.2-alpha.45

7 years ago

3.0.1

7 years ago

3.0.0

8 years ago

2.2.4

8 years ago

2.2.3

8 years ago

2.2.2

8 years ago

2.2.1

8 years ago

2.2.0

8 years ago

2.1.6

8 years ago

2.1.5

8 years ago

2.1.4

8 years ago

2.1.3

8 years ago

2.1.2

8 years ago

2.1.1

8 years ago

2.1.0

8 years ago

2.0.5

8 years ago

2.0.4

8 years ago

2.0.3

8 years ago

2.0.2

8 years ago

2.0.1

8 years ago

2.0.0

8 years ago

1.1.4

8 years ago

1.1.3

8 years ago

1.1.2

8 years ago

1.1.1

8 years ago

1.1.0

8 years ago