2017-11-23 14:18:38 +02:00
|
|
|
import React from 'react';
|
2017-12-06 17:35:22 +02:00
|
|
|
import { Margin } from 'styled-components-spacing';
|
|
|
|
|
2018-02-05 17:12:47 +02:00
|
|
|
import { TagItem, KeyValue } from 'joyent-ui-toolkit';
|
2017-12-06 17:35:22 +02:00
|
|
|
|
2017-12-21 21:20:22 +02:00
|
|
|
export const AddForm = props => (
|
|
|
|
<KeyValue {...props} method="add" input="input" type="tag" expanded />
|
|
|
|
);
|
2017-12-06 17:35:22 +02:00
|
|
|
|
2017-12-21 21:20:22 +02:00
|
|
|
export const EditForm = props => (
|
|
|
|
<KeyValue {...props} method="edit" input="input" type="tag" expanded />
|
|
|
|
);
|
2017-12-06 17:35:22 +02:00
|
|
|
|
2018-01-23 16:33:55 +02:00
|
|
|
export default ({ norMargin, name, value, onClick, onRemoveClick, active }) => (
|
|
|
|
<Margin
|
|
|
|
right={norMargin ? 0 : 1}
|
|
|
|
bottom={norMargin ? 0 : 1}
|
|
|
|
key={`${name}-${value}`}
|
|
|
|
>
|
2018-01-11 22:26:42 +02:00
|
|
|
<TagItem onClick={onClick} active={active} onRemoveClick={onRemoveClick}>
|
|
|
|
{name ? `${name}: ${value}` : value}
|
2017-12-21 21:20:22 +02:00
|
|
|
</TagItem>
|
|
|
|
</Margin>
|
|
|
|
);
|