@snack-uikit/tag 0.6.0 → 0.6.2
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 +19 -0
- package/dist/components/Tag/Tag.js +1 -1
- package/dist/helperComponents/TagList/TagList.js +1 -1
- package/dist/helperComponents/TagMore/TagMore.js +1 -1
- package/dist/helperComponents/TagRowSimple/TagRowSimple.js +1 -1
- package/dist/helperComponents/TagRowTruncated/TagRowTruncated.js +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
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.2 (2023-12-18)
|
|
7
|
+
|
|
8
|
+
### Only dependencies have been changed
|
|
9
|
+
* [@snack-uikit/icons@0.19.2](https://git.sbercloud.tech/sbercloud-ui/tokens-design-system/snack-uikit/-/blob/master/packages/icons/CHANGELOG.md)
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
## 0.6.1 (2023-12-14)
|
|
16
|
+
|
|
17
|
+
### Only dependencies have been changed
|
|
18
|
+
* [@snack-uikit/icons@0.19.1](https://git.sbercloud.tech/sbercloud-ui/tokens-design-system/snack-uikit/-/blob/master/packages/icons/CHANGELOG.md)
|
|
19
|
+
* [@snack-uikit/popover-private@0.12.1](https://git.sbercloud.tech/sbercloud-ui/tokens-design-system/snack-uikit/-/blob/master/packages/popover-private/CHANGELOG.md)
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
6
25
|
# 0.6.0 (2023-12-14)
|
|
7
26
|
|
|
8
27
|
|
|
@@ -18,5 +18,5 @@ import { ICON_SIZE } from './constants';
|
|
|
18
18
|
import styles from './styles.module.css';
|
|
19
19
|
export function Tag(_a) {
|
|
20
20
|
var { label, size = SIZE.Xs, appearance = APPEARANCE.Neutral, onDelete, className } = _a, rest = __rest(_a, ["label", "size", "appearance", "onDelete", "className"]);
|
|
21
|
-
return (_jsxs("span", Object.assign({}, extractSupportProps(rest), { className: cn(styles.tag, className), "data-size": size, "data-appearance": appearance, "data-removable": Boolean(onDelete)
|
|
21
|
+
return (_jsxs("span", Object.assign({}, extractSupportProps(rest), { className: cn(styles.tag, className), "data-size": size, "data-appearance": appearance, "data-removable": Boolean(onDelete), children: [_jsx("span", { className: styles.label, children: label }), onDelete && (_jsx("button", { type: 'button', className: styles.tagButton, onClick: onDelete, "data-test-id": 'tag-remove-button', children: size === SIZE.Xs ? (_jsx(CrossSVG, { size: ICON_SIZE[size], className: styles.icon })) : (_jsx(CrossSVG, { size: ICON_SIZE[size], className: styles.icon })) }))] })));
|
|
22
22
|
}
|
|
@@ -3,7 +3,7 @@ import { Tag } from '../../components';
|
|
|
3
3
|
import { SIZE } from '../../constants';
|
|
4
4
|
function renderTag(size, handleRemoveItem, setRef) {
|
|
5
5
|
return function TagRowItem(item, index) {
|
|
6
|
-
return (_jsx("div",
|
|
6
|
+
return (_jsx("div", { ref: setRef === null || setRef === void 0 ? void 0 : setRef(item, index), children: _jsx(Tag, { label: item.label, appearance: item.color, size: size, onDelete: handleRemoveItem === null || handleRemoveItem === void 0 ? void 0 : handleRemoveItem(item) }) }, item.label));
|
|
7
7
|
};
|
|
8
8
|
}
|
|
9
9
|
export function TagList({ items, size = SIZE.Xs, onItemRemove, setTagRef }) {
|
|
@@ -6,5 +6,5 @@ import { SIZE } from '../../constants';
|
|
|
6
6
|
import { TagRowSimple } from '../TagRowSimple';
|
|
7
7
|
import styles from './styles.module.css';
|
|
8
8
|
export function TagMore({ items, text = '', size = SIZE.Xs, buttonRef, onItemRemove }) {
|
|
9
|
-
return (_jsx(PopoverPrivate,
|
|
9
|
+
return (_jsx(PopoverPrivate, { placement: 'bottom-end', trigger: 'hoverAndFocusVisible', triggerClassName: styles.triggerClassName, popoverContent: _jsx("div", { className: styles.tagRowDroplistContainer, "data-size": size, children: _jsx(Scroll, { className: styles.tagRowDroplistScroll, size: 's', barHideStrategy: 'move', resize: 'none', children: _jsx(TagRowSimple, { items: items, size: size, onItemRemove: onItemRemove, "data-test-id": TAG_ROW_TEST_IDS.droplistTagsWrapper }) }) }), hasArrow: false, children: _jsx("button", { type: 'button', className: styles.button, ref: buttonRef, "data-size": size, "data-test-id": TAG_ROW_TEST_IDS.moreButton, children: `${text}${items.length}` }) }));
|
|
10
10
|
}
|
|
@@ -16,5 +16,5 @@ import { TagList } from '../TagList';
|
|
|
16
16
|
import styles from './styles.module.css';
|
|
17
17
|
export function TagRowSimple(_a) {
|
|
18
18
|
var { items, size, onItemRemove, setTagRef, className } = _a, rest = __rest(_a, ["items", "size", "onItemRemove", "setTagRef", "className"]);
|
|
19
|
-
return (_jsx("div", Object.assign({ className: cn(styles.tagRowSimpleWrapper, className) }, extractSupportProps(rest), { "data-size": size
|
|
19
|
+
return (_jsx("div", Object.assign({ className: cn(styles.tagRowSimpleWrapper, className) }, extractSupportProps(rest), { "data-size": size, children: _jsx(TagList, { items: items, size: size, onItemRemove: onItemRemove, setTagRef: setTagRef }) })));
|
|
20
20
|
}
|
|
@@ -83,5 +83,5 @@ export function TagRowTruncated(_a) {
|
|
|
83
83
|
setVisibleTags(newVisibleTags);
|
|
84
84
|
setHiddenTags(newHiddenTags);
|
|
85
85
|
}, [items, rowLimit, maxWidth, onItemRemove, gapWidth, firstVisibleTagWidth]);
|
|
86
|
-
return (_jsxs("div", Object.assign({ className: cn(styles.wrapper, className) }, extractSupportProps(rest), { "data-size": size
|
|
86
|
+
return (_jsxs("div", Object.assign({ className: cn(styles.wrapper, className) }, extractSupportProps(rest), { "data-size": size, children: [_jsx("div", { className: styles.hiddenRow, ref: hiddenRowElementRef, "data-size": size, children: _jsx(TagList, { items: items, size: size, onItemRemove: onItemRemove, setTagRef: setTagElement }) }), _jsx("div", { className: styles.hiddenMoreButton, ref: hiddenMoreButtonWrapperRef, children: _jsx(TagMore, { items: items, text: moreButtonLabel, size: size, buttonRef: hiddenMoreButtonRef }) }), _jsxs("div", { className: styles.visibleRow, "data-size": size, "data-test-id": TAG_ROW_TEST_IDS.visibleTagsWrapper, children: [_jsx(TagList, { items: visibleTags, size: size, onItemRemove: onItemRemove }), hiddenTags.length > 0 && (_jsx(TagMore, { items: hiddenTags, text: moreButtonLabel, size: size, onItemRemove: onItemRemove }))] })] })));
|
|
87
87
|
}
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
6
|
"title": "Tag",
|
|
7
|
-
"version": "0.6.
|
|
7
|
+
"version": "0.6.2",
|
|
8
8
|
"sideEffects": [
|
|
9
9
|
"*.css",
|
|
10
10
|
"*.woff",
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
"license": "Apache-2.0",
|
|
33
33
|
"scripts": {},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@snack-uikit/icons": "0.19.
|
|
36
|
-
"@snack-uikit/popover-private": "0.12.
|
|
35
|
+
"@snack-uikit/icons": "0.19.2",
|
|
36
|
+
"@snack-uikit/popover-private": "0.12.1",
|
|
37
37
|
"@snack-uikit/scroll": "0.5.0",
|
|
38
38
|
"@snack-uikit/utils": "3.2.0",
|
|
39
39
|
"classnames": "2.3.2"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "50ef9bb113ec40897ffb3eeae62539ce82ade899"
|
|
42
42
|
}
|