@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com's products.
58 lines (46 loc) • 2.29 kB
Markdown
# LinkList
To implement LinkList component into your project you'll need to add the import:
```jsx
import LinkList from "@kiwicom/orbit-components/lib/LinkList";
```
After adding import into your project you can use it simply like:
```jsx
<LinkList direction="row">
<TextLink type="secondary">Flights</TextLink>
<TextLink type="secondary">Flights</TextLink>
<TextLink type="secondary">Flights</TextLink>
<TextLink type="secondary">Flights</TextLink>
</LinkList>
```
## Props
Table below contains all types of the props available in LinkList component.
| Name | Type | Default | Description |
| :----------- | :-------------------- | :--------- | :----------------------------------------------------------------- |
| **children** | `React.Node` | | The content of the LinkList |
| dataTest | `string` | | Optional prop for testing purposes. |
| id | `string` | | Set `id` for `LinkList` |
| direction | [`enum`](#enum) | `"column"` | The size of the LinkList. |
| indent | `boolean` | | Indenting LinkList item |
| spacing | [`spacing`](#spacing) | `"400"` | The spacing between LinkList children. |
| useMargin | `boolean` | `false` | If `true` will use `margin` for spacing, if `false` will use `gap` |
### enum
| direction |
| :--------- |
| `"row"` |
| `"column"` |
### spacing
| name | size on `992px - ∞` |
| :------- | :------------------ |
| `"none"` | `null` |
| `"50"` | `2px` |
| `"100"` | `4px` |
| `"150"` | `6px` |
| `"200"` | `8px` |
| `"300"` | `12px` |
| `"400"` | `16px` |
| `"500"` | `20px` |
| `"600"` | `24px` |
| `"800"` | `32px` |
| `"1000"` | `40px` |
| `"1200"` | `48px` |
| `"1600"` | `64px` |