@synerise/ds-tags 0.5.1 → 0.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +32 -0
- package/dist/Tag/Tag.js +17 -31
- package/dist/Tag/Tag.styles.js +5 -5
- package/dist/Tags.js +32 -53
- package/dist/Tags.types.js +1 -0
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,38 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.6.3](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tags@0.6.2...@synerise/ds-tags@0.6.3) (2021-11-22)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @synerise/ds-tags
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [0.6.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tags@0.6.1...@synerise/ds-tags@0.6.2) (2021-11-16)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @synerise/ds-tags
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [0.6.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tags@0.5.1...@synerise/ds-tags@0.6.1) (2021-11-09)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @synerise/ds-tags
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
# [0.6.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tags@0.5.1...@synerise/ds-tags@0.6.0) (2021-11-09)
|
|
31
|
+
|
|
32
|
+
**Note:** Version bump only for package @synerise/ds-tags
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
6
38
|
## [0.5.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tags@0.5.0...@synerise/ds-tags@0.5.1) (2021-11-05)
|
|
7
39
|
|
|
8
40
|
**Note:** Version bump only for package @synerise/ds-tags
|
package/dist/Tag/Tag.js
CHANGED
|
@@ -1,18 +1,5 @@
|
|
|
1
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
-
|
|
7
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
8
|
-
|
|
9
|
-
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
10
|
-
|
|
11
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
-
|
|
13
1
|
import * as React from 'react';
|
|
14
|
-
import Icon from '@synerise/ds-icon';
|
|
15
|
-
import { CloseS } from '@synerise/ds-icon/dist/icons';
|
|
2
|
+
import Icon, { CloseS } from '@synerise/ds-icon';
|
|
16
3
|
import theme from '@synerise/ds-core/dist/js/DSProvider/ThemeProvider/theme';
|
|
17
4
|
import Tooltip from '@synerise/ds-tooltip/dist/Tooltip';
|
|
18
5
|
import { TagShape } from './Tag.types';
|
|
@@ -43,9 +30,8 @@ var Tag = function Tag(_ref) {
|
|
|
43
30
|
var isActionable = !disabled && isRemovable;
|
|
44
31
|
|
|
45
32
|
var _React$useState = React.useState(false),
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
setIconHover = _React$useState2[1];
|
|
33
|
+
iconHover = _React$useState[0],
|
|
34
|
+
setIconHover = _React$useState[1];
|
|
49
35
|
|
|
50
36
|
var onRemoveCall = function onRemoveCall() {
|
|
51
37
|
return !!onRemove && !!id && onRemove(id);
|
|
@@ -53,26 +39,26 @@ var Tag = function Tag(_ref) {
|
|
|
53
39
|
|
|
54
40
|
var renderPrefixel = function renderPrefixel() {
|
|
55
41
|
if (typeof prefixel === 'string' || typeof prefixel === 'number') {
|
|
56
|
-
return React.createElement(S.PrefixWrapper, {
|
|
42
|
+
return /*#__PURE__*/React.createElement(S.PrefixWrapper, {
|
|
57
43
|
iconHover: iconHover
|
|
58
44
|
}, prefixel);
|
|
59
45
|
}
|
|
60
46
|
|
|
61
|
-
return React.createElement(S.DefaultPrefixWrapper, {
|
|
47
|
+
return /*#__PURE__*/React.createElement(S.DefaultPrefixWrapper, {
|
|
62
48
|
iconHover: iconHover
|
|
63
49
|
}, prefixel);
|
|
64
50
|
};
|
|
65
51
|
|
|
66
52
|
var renderSuffixel = function renderSuffixel() {
|
|
67
53
|
if (typeof suffixel === 'string' || typeof suffixel === 'number') {
|
|
68
|
-
return React.createElement(S.SuffixWrapper, null, suffixel);
|
|
54
|
+
return /*#__PURE__*/React.createElement(S.SuffixWrapper, null, suffixel);
|
|
69
55
|
}
|
|
70
56
|
|
|
71
|
-
return React.createElement(S.DefaultSuffixWrapper, null, suffixel);
|
|
57
|
+
return /*#__PURE__*/React.createElement(S.DefaultSuffixWrapper, null, suffixel);
|
|
72
58
|
};
|
|
73
59
|
|
|
74
|
-
return React.createElement(S.Tag, {
|
|
75
|
-
className: "ds-tag "
|
|
60
|
+
return /*#__PURE__*/React.createElement(S.Tag, {
|
|
61
|
+
className: "ds-tag " + (className != null ? className : ''),
|
|
76
62
|
isStatusShape: isStatusShape,
|
|
77
63
|
shape: shape,
|
|
78
64
|
color: color,
|
|
@@ -81,21 +67,21 @@ var Tag = function Tag(_ref) {
|
|
|
81
67
|
disabled: disabled,
|
|
82
68
|
isActionable: isActionable,
|
|
83
69
|
onClick: onClick,
|
|
84
|
-
"data-testid": typeof id !== 'undefined' ? "tag-"
|
|
70
|
+
"data-testid": typeof id !== 'undefined' ? "tag-" + id : 'tag',
|
|
85
71
|
preffixel: !!prefixel,
|
|
86
72
|
suffixel: !!suffixel,
|
|
87
73
|
hasImage: !!image,
|
|
88
74
|
iconHover: iconHover,
|
|
89
75
|
asPill: asPill
|
|
90
|
-
}, React.createElement(S.Content, {
|
|
76
|
+
}, /*#__PURE__*/React.createElement(S.Content, {
|
|
91
77
|
iconHover: iconHover
|
|
92
|
-
}, image && isDefaultType && React.createElement("img", {
|
|
78
|
+
}, image && isDefaultType && /*#__PURE__*/React.createElement("img", {
|
|
93
79
|
src: image,
|
|
94
80
|
alt: ""
|
|
95
|
-
}), !!prefixel && renderPrefixel(), React.createElement(S.TagName, null, name), !!suffixel && renderSuffixel(), isRemovable && React.createElement(Tooltip, {
|
|
96
|
-
title: (texts
|
|
81
|
+
}), !!prefixel && renderPrefixel(), /*#__PURE__*/React.createElement(S.TagName, null, name), !!suffixel && renderSuffixel(), isRemovable && /*#__PURE__*/React.createElement(Tooltip, {
|
|
82
|
+
title: (texts == null ? void 0 : texts.deleteTooltip) || 'Delete',
|
|
97
83
|
visible: iconHover
|
|
98
|
-
}, React.createElement(S.RemoveButton, {
|
|
84
|
+
}, /*#__PURE__*/React.createElement(S.RemoveButton, {
|
|
99
85
|
onClick: onRemoveCall,
|
|
100
86
|
onMouseOver: function onMouseOver() {
|
|
101
87
|
setIconHover(true);
|
|
@@ -104,9 +90,9 @@ var Tag = function Tag(_ref) {
|
|
|
104
90
|
setIconHover(false);
|
|
105
91
|
},
|
|
106
92
|
"data-testid": "remove-btn"
|
|
107
|
-
}, React.createElement(Icon, {
|
|
93
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
108
94
|
className: "icon",
|
|
109
|
-
component: React.createElement(CloseS, null),
|
|
95
|
+
component: /*#__PURE__*/React.createElement(CloseS, null),
|
|
110
96
|
size: 24,
|
|
111
97
|
color: getColorText(theme, color)
|
|
112
98
|
})))));
|
package/dist/Tag/Tag.styles.js
CHANGED
|
@@ -38,7 +38,7 @@ var getFilterColor = function getFilterColor(props) {
|
|
|
38
38
|
};
|
|
39
39
|
|
|
40
40
|
var addonStyles = function addonStyles(props) {
|
|
41
|
-
return "\n border: 1px solid;\n border-radius: 10px;\n height: 50%;\n padding: 0 3px;\n border-color: "
|
|
41
|
+
return "\n border: 1px solid;\n border-radius: 10px;\n height: 50%;\n padding: 0 3px;\n border-color: " + props.theme.palette.white + ";\n font-size: 9px;\n line-height: 10px;\n text-align: center;\n";
|
|
42
42
|
};
|
|
43
43
|
|
|
44
44
|
export var TagName = styled.span.withConfig({
|
|
@@ -99,7 +99,7 @@ export var Content = styled.div.withConfig({
|
|
|
99
99
|
displayName: "Tagstyles__Content",
|
|
100
100
|
componentId: "h010xe-2"
|
|
101
101
|
})(["position:relative;display:flex;align-items:center;flex-grow:0;flex-shrink:1;", ""], function (props) {
|
|
102
|
-
return !!props.iconHover && "\n &&& {\n color:"
|
|
102
|
+
return !!props.iconHover && "\n &&& {\n color:" + props.theme.palette['red-600'] + ";\n }\n";
|
|
103
103
|
});
|
|
104
104
|
export var PrefixWrapper = styled.div.withConfig({
|
|
105
105
|
displayName: "Tagstyles__PrefixWrapper",
|
|
@@ -107,7 +107,7 @@ export var PrefixWrapper = styled.div.withConfig({
|
|
|
107
107
|
})(["", ";", ""], function (props) {
|
|
108
108
|
return addonStyles(props);
|
|
109
109
|
}, function (props) {
|
|
110
|
-
return !!props.iconHover && ".ant-scroll-number{ \n color: "
|
|
110
|
+
return !!props.iconHover && ".ant-scroll-number{ \n color: " + props.theme.palette['red-600'] + "!important;\n box-shadow: 0 0 0 1px " + props.theme.palette['red-600'] + "!important;\n }\n .ds-icon svg {\n fill: " + props.theme.palette['red-600'] + ";\n}";
|
|
111
111
|
});
|
|
112
112
|
export var SuffixWrapper = styled.div.withConfig({
|
|
113
113
|
displayName: "Tagstyles__SuffixWrapper",
|
|
@@ -123,7 +123,7 @@ export var DefaultPrefixWrapper = styled.div.withConfig({
|
|
|
123
123
|
displayName: "Tagstyles__DefaultPrefixWrapper",
|
|
124
124
|
componentId: "h010xe-6"
|
|
125
125
|
})(["", ""], function (props) {
|
|
126
|
-
return !!props.iconHover && ".ant-scroll-number{ \n color: "
|
|
126
|
+
return !!props.iconHover && ".ant-scroll-number{ \n color: " + props.theme.palette['red-600'] + "!important;\n box-shadow: 0 0 0 1px " + props.theme.palette['red-600'] + "!important;\n }\n.ds-icon svg {\n fill: " + props.theme.palette['red-600'] + ";\n}";
|
|
127
127
|
});
|
|
128
128
|
export var Tag = styled.div.withConfig({
|
|
129
129
|
displayName: "Tagstyles__Tag",
|
|
@@ -133,7 +133,7 @@ export var Tag = styled.div.withConfig({
|
|
|
133
133
|
}, function (props) {
|
|
134
134
|
return insertShapeStyles(props);
|
|
135
135
|
}, function (props) {
|
|
136
|
-
return !!props.iconHover && "\n &&&:before{\n background-color:"
|
|
136
|
+
return !!props.iconHover && "\n &&&:before{\n background-color:" + props.theme.palette['red-050'] + ";\n }\n";
|
|
137
137
|
}, function (props) {
|
|
138
138
|
return !!props.disabled && css(["opacity:0.4;cursor:not-allowed;"]);
|
|
139
139
|
}, function (props) {
|
package/dist/Tags.js
CHANGED
|
@@ -1,30 +1,9 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
|
|
3
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
4
|
-
|
|
5
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
6
|
-
|
|
7
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
|
|
8
|
-
|
|
9
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
10
|
-
|
|
11
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
12
|
-
|
|
13
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
14
|
-
|
|
15
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
16
|
-
|
|
17
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
18
|
-
|
|
19
|
-
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
20
|
-
|
|
21
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
22
|
-
|
|
23
3
|
import * as React from 'react';
|
|
24
4
|
import { withTheme } from 'styled-components';
|
|
25
5
|
import Dropdown from '@synerise/ds-dropdown';
|
|
26
|
-
import Icon from '@synerise/ds-icon';
|
|
27
|
-
import { Add3M, SearchM, SettingsM } from '@synerise/ds-icon/dist/icons';
|
|
6
|
+
import Icon, { Add3M, SearchM, SettingsM } from '@synerise/ds-icon';
|
|
28
7
|
import Result from '@synerise/ds-result';
|
|
29
8
|
import * as S from './Tags.styles';
|
|
30
9
|
import Tag from './Tag/Tag';
|
|
@@ -51,17 +30,15 @@ var Tags = function Tags(_ref) {
|
|
|
51
30
|
onManageTagClick = _ref.onManageTagClick;
|
|
52
31
|
|
|
53
32
|
var _React$useState = React.useState(false),
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
setAddingState = _React$useState2[1];
|
|
33
|
+
isAdding = _React$useState[0],
|
|
34
|
+
setAddingState = _React$useState[1];
|
|
57
35
|
|
|
58
|
-
var _React$
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
setSearchQuery = _React$useState4[1];
|
|
36
|
+
var _React$useState2 = React.useState(''),
|
|
37
|
+
searchQuery = _React$useState2[0],
|
|
38
|
+
setSearchQuery = _React$useState2[1];
|
|
62
39
|
|
|
63
|
-
var addIcon = React.createElement(S.AddIconWrapper, null, React.createElement(Icon, {
|
|
64
|
-
component: React.createElement(Add3M, null),
|
|
40
|
+
var addIcon = /*#__PURE__*/React.createElement(S.AddIconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
|
|
41
|
+
component: /*#__PURE__*/React.createElement(Add3M, null),
|
|
65
42
|
size: 24,
|
|
66
43
|
color: theme.palette['grey-500']
|
|
67
44
|
}));
|
|
@@ -108,7 +85,7 @@ var Tags = function Tags(_ref) {
|
|
|
108
85
|
};
|
|
109
86
|
|
|
110
87
|
var onPoolTagSelect = function onPoolTagSelect(tag) {
|
|
111
|
-
onSelectedChange && selected && onSelectedChange([].concat(
|
|
88
|
+
onSelectedChange && selected && onSelectedChange([].concat(selected, [tag]), {
|
|
112
89
|
type: 'ADD',
|
|
113
90
|
tag: tag
|
|
114
91
|
});
|
|
@@ -120,33 +97,35 @@ var Tags = function Tags(_ref) {
|
|
|
120
97
|
reset();
|
|
121
98
|
};
|
|
122
99
|
|
|
123
|
-
var dropdownOverlay = React.createElement(S.Overlay, {
|
|
100
|
+
var dropdownOverlay = /*#__PURE__*/React.createElement(S.Overlay, {
|
|
124
101
|
"data-testid": "dropdown"
|
|
125
|
-
}, React.createElement(S.DropdownSearch, {
|
|
102
|
+
}, /*#__PURE__*/React.createElement(S.DropdownSearch, {
|
|
126
103
|
value: searchQuery,
|
|
127
104
|
onSearchChange: setSearchQuery,
|
|
128
105
|
placeholder: texts && texts.searchPlaceholder || '',
|
|
129
|
-
iconLeft: React.createElement(Icon, {
|
|
130
|
-
component: React.createElement(SearchM, null),
|
|
106
|
+
iconLeft: /*#__PURE__*/React.createElement(Icon, {
|
|
107
|
+
component: /*#__PURE__*/React.createElement(SearchM, null),
|
|
131
108
|
color: theme.palette['grey-600']
|
|
132
109
|
}),
|
|
133
110
|
onClearInput: function onClearInput() {
|
|
134
111
|
return setSearchQuery('');
|
|
135
112
|
},
|
|
136
113
|
clearTooltip: texts && texts.clearTooltip
|
|
137
|
-
}), React.createElement(S.DropdownContainer, {
|
|
114
|
+
}), /*#__PURE__*/React.createElement(S.DropdownContainer, {
|
|
138
115
|
maxHeight: maxHeight,
|
|
139
116
|
style: {
|
|
140
117
|
padding: '12px'
|
|
141
118
|
}
|
|
142
|
-
}, isCreatable && React.createElement(React.Fragment, null, React.createElement(S.CreateTagDropdownButton, {
|
|
119
|
+
}, isCreatable && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.CreateTagDropdownButton, {
|
|
143
120
|
type: "ghost",
|
|
144
121
|
onClick: onCreateNewTag,
|
|
145
122
|
marginless: !isSeperated
|
|
146
|
-
}, addIcon, React.createElement("span", null, texts && texts.createTagButtonLabel), React.createElement("strong", null, searchQuery)), isSeperated && React.createElement(S.Seperator, null)), !emptyPool && React.createElement(S.DropdownTagsContainer, {
|
|
123
|
+
}, addIcon, /*#__PURE__*/React.createElement("span", null, texts && texts.createTagButtonLabel), /*#__PURE__*/React.createElement("strong", null, searchQuery)), isSeperated && /*#__PURE__*/React.createElement(S.Seperator, null)), !emptyPool && /*#__PURE__*/React.createElement(S.DropdownTagsContainer, {
|
|
147
124
|
isCreatable: !!isCreatable
|
|
148
125
|
}, selectablePool && selectablePool.map(function (tag) {
|
|
149
|
-
return (
|
|
126
|
+
return (
|
|
127
|
+
/*#__PURE__*/
|
|
128
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
150
129
|
React.createElement(Tag, _extends({}, tag, {
|
|
151
130
|
key: tag.id,
|
|
152
131
|
shape: tagShape,
|
|
@@ -156,11 +135,11 @@ var Tags = function Tags(_ref) {
|
|
|
156
135
|
texts: texts
|
|
157
136
|
}))
|
|
158
137
|
);
|
|
159
|
-
})), emptyPool && !isCreatable && !manageLink && React.createElement(S.DropdownNoTags, null, texts && texts.dropdownNoTags), emptyPool && isCreatable && React.createElement(Result, {
|
|
138
|
+
})), emptyPool && !isCreatable && !manageLink && /*#__PURE__*/React.createElement(S.DropdownNoTags, null, texts && texts.dropdownNoTags), emptyPool && isCreatable && /*#__PURE__*/React.createElement(Result, {
|
|
160
139
|
type: "no-results",
|
|
161
140
|
noSearchResults: true,
|
|
162
|
-
description: (texts
|
|
163
|
-
})), manageLink && selectablePool && !selectablePool.length && React.createElement(Dropdown.BottomAction, {
|
|
141
|
+
description: (texts == null ? void 0 : texts.noResultsLabel) || 'No results'
|
|
142
|
+
})), manageLink && selectablePool && !selectablePool.length && /*#__PURE__*/React.createElement(Dropdown.BottomAction, {
|
|
164
143
|
onClickAction: function onClickAction() {
|
|
165
144
|
onManageTagClick && onManageTagClick();
|
|
166
145
|
},
|
|
@@ -168,22 +147,22 @@ var Tags = function Tags(_ref) {
|
|
|
168
147
|
padding: '0 8px',
|
|
169
148
|
cursor: 'auto'
|
|
170
149
|
}
|
|
171
|
-
}, React.createElement(S.ManageLinkButton, {
|
|
150
|
+
}, /*#__PURE__*/React.createElement(S.ManageLinkButton, {
|
|
172
151
|
type: "ghost",
|
|
173
152
|
mode: "icon-label",
|
|
174
153
|
href: manageLink,
|
|
175
154
|
onlyChild: !!(emptyPool && !isCreatable)
|
|
176
|
-
}, React.createElement(Icon, {
|
|
177
|
-
component: React.createElement(SettingsM, null),
|
|
155
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
156
|
+
component: /*#__PURE__*/React.createElement(SettingsM, null),
|
|
178
157
|
size: 20,
|
|
179
158
|
color: theme.palette['grey-500']
|
|
180
159
|
}), ' ', texts && texts.manageLinkLabel)));
|
|
181
|
-
return React.createElement(S.Container, {
|
|
182
|
-
className: "ds-tags "
|
|
160
|
+
return /*#__PURE__*/React.createElement(S.Container, {
|
|
161
|
+
className: "ds-tags " + (className || ''),
|
|
183
162
|
style: style,
|
|
184
163
|
"data-testid": "tags"
|
|
185
|
-
}, React.createElement(S.SelectedTags, null, selected && selected.map(function (tag) {
|
|
186
|
-
return React.createElement(Tag, _extends({
|
|
164
|
+
}, /*#__PURE__*/React.createElement(S.SelectedTags, null, selected && selected.map(function (tag) {
|
|
165
|
+
return /*#__PURE__*/React.createElement(Tag, _extends({
|
|
187
166
|
key: tag.id,
|
|
188
167
|
shape: tagShape,
|
|
189
168
|
removable: removable,
|
|
@@ -192,17 +171,17 @@ var Tags = function Tags(_ref) {
|
|
|
192
171
|
texts: texts,
|
|
193
172
|
asPill: asPill
|
|
194
173
|
}, tag));
|
|
195
|
-
}), addable && React.createElement(Dropdown, {
|
|
174
|
+
}), addable && /*#__PURE__*/React.createElement(Dropdown, {
|
|
196
175
|
trigger: ['click'],
|
|
197
176
|
placement: overlayPlacement,
|
|
198
177
|
visible: isAdding,
|
|
199
178
|
onVisibleChange: setAddingState,
|
|
200
179
|
overlay: dropdownOverlay,
|
|
201
180
|
overlayStyle: overlayStyle
|
|
202
|
-
}, React.createElement(S.AddButton, {
|
|
181
|
+
}, /*#__PURE__*/React.createElement(S.AddButton, {
|
|
203
182
|
type: "ghost",
|
|
204
183
|
marginless: selected && !selected.length ? true : undefined
|
|
205
|
-
}, addIcon, texts && texts.addButtonLabel && React.createElement("span", null, texts.addButtonLabel)))));
|
|
184
|
+
}, addIcon, texts && texts.addButtonLabel && /*#__PURE__*/React.createElement("span", null, texts.addButtonLabel)))));
|
|
206
185
|
};
|
|
207
186
|
|
|
208
187
|
Tags.defaultProps = {
|
package/dist/Tags.types.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-tags",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.3",
|
|
4
4
|
"description": "Tags UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -32,10 +32,10 @@
|
|
|
32
32
|
],
|
|
33
33
|
"types": "dist/index.d.ts",
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@synerise/ds-button": "^0.
|
|
36
|
-
"@synerise/ds-dropdown": "^0.
|
|
37
|
-
"@synerise/ds-icon": "^0.
|
|
38
|
-
"@synerise/ds-search-bar": "^0.
|
|
35
|
+
"@synerise/ds-button": "^0.16.2",
|
|
36
|
+
"@synerise/ds-dropdown": "^0.17.3",
|
|
37
|
+
"@synerise/ds-icon": "^0.46.2",
|
|
38
|
+
"@synerise/ds-search-bar": "^0.5.2"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"@synerise/ds-core": "*",
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@synerise/ds-utils": "^0.19.0"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "2468359677783819939fb9f1ef5acc36667ecd1a"
|
|
48
48
|
}
|