@alicloud/console-components-search 0.2.40-beta.1 → 0.2.41-beta.0
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 +4 -4
- package/demos/demo1.demo.tsx +13 -0
- package/dist/index.js +15 -14
- package/es/searchTagList/index.js +2 -2
- package/es/style.js +1 -1
- package/lib/searchTagList/index.js +2 -2
- package/lib/style.js +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
# @alicloud/console-components-search
|
|
2
2
|
|
|
3
|
-
## 0.2.
|
|
3
|
+
## 0.2.41-beta.0
|
|
4
4
|
|
|
5
5
|
### Patch Changes
|
|
6
6
|
|
|
7
|
-
- fix: SearchFilter
|
|
7
|
+
- fix: 修复 SearchFilter 清除筛选条件入口被推到容器右侧的问题，恢复标签间距，支持清除入口随标签自然换行
|
|
8
8
|
|
|
9
|
-
## 0.2.40
|
|
9
|
+
## 0.2.40
|
|
10
10
|
|
|
11
11
|
### Patch Changes
|
|
12
12
|
|
|
13
|
-
- fix: SearchFilter
|
|
13
|
+
- fix: SearchFilter 搜索条件较长时仅截断值内容，支持通过 tagValueMaxWidth 自定义值最大宽度
|
|
14
14
|
|
|
15
15
|
## 0.2.37
|
|
16
16
|
|
package/demos/demo1.demo.tsx
CHANGED
|
@@ -180,6 +180,9 @@ const maxWidthDemoFilters = [
|
|
|
180
180
|
|
|
181
181
|
|
|
182
182
|
const Demo1: React.FC<{}> = (props) => {
|
|
183
|
+
const [shortFilters, setShortFilters] = useState<any>([
|
|
184
|
+
{ label: '模糊搜索', value: 'aaa', dataIndex: 'name' },
|
|
185
|
+
]);
|
|
183
186
|
const [filters, setFilters] = useState<any>([
|
|
184
187
|
{ label: '实例名称', value: 'xxxxxx', dataIndex: 'name' },
|
|
185
188
|
{ label: '超长搜索条件', value: 'search_filter_long_value_2026_08_18_should_only_truncate_the_value_part', dataIndex: 'longValue' },
|
|
@@ -242,6 +245,15 @@ const Demo1: React.FC<{}> = (props) => {
|
|
|
242
245
|
|
|
243
246
|
/>
|
|
244
247
|
|
|
248
|
+
<div style={{ marginTop: 8 }}>
|
|
249
|
+
<div>单个短值筛选条件</div>
|
|
250
|
+
<SearchFilter
|
|
251
|
+
dataSource={shortFilters}
|
|
252
|
+
onChange={(_, remainFilters) => setShortFilters(remainFilters)}
|
|
253
|
+
onClear={() => setShortFilters([])}
|
|
254
|
+
/>
|
|
255
|
+
</div>
|
|
256
|
+
|
|
245
257
|
<div style={{ marginTop: 8 }}>
|
|
246
258
|
<div>tagValueMaxWidth 默认值</div>
|
|
247
259
|
<SearchFilter
|
|
@@ -276,6 +288,7 @@ const Demo1: React.FC<{}> = (props) => {
|
|
|
276
288
|
onChange={(deletedFilter, remainFilters) => {
|
|
277
289
|
setFilters(remainFilters);
|
|
278
290
|
}}
|
|
291
|
+
onClear={() => setFilters([])}
|
|
279
292
|
/>
|
|
280
293
|
</div>
|
|
281
294
|
</div>
|
package/dist/index.js
CHANGED
|
@@ -85022,7 +85022,7 @@ var MenuContentWrap = styled_components_1.default.ul(templateObject_2 || (templa
|
|
|
85022
85022
|
exports.MenuContentWrap = MenuContentWrap;
|
|
85023
85023
|
var MultiBtnWarp = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding: \"0 4px\";\n text-align: \"center\";\n /* display: \"flex\"; */\n /* justify-content: \"start\"; */\n .pri-btn{\n margin-right: 8px;\n width: auto;\n min-width: auto;\n padding: 3px 12px;\n }\n .cancel-btn{\n padding: 3px 12px;\n width: auto;\n min-width: auto;\n }\n ", "btn", "small:not(.isOnlyIcon):not(", "btn-text) {\n min-width: auto;\n }\n"], ["\n padding: \"0 4px\";\n text-align: \"center\";\n /* display: \"flex\"; */\n /* justify-content: \"start\"; */\n .pri-btn{\n margin-right: 8px;\n width: auto;\n min-width: auto;\n padding: 3px 12px;\n }\n .cancel-btn{\n padding: 3px 12px;\n width: auto;\n min-width: auto;\n }\n ", "btn", "small:not(.isOnlyIcon):not(", "btn-text) {\n min-width: auto;\n }\n"])), prefix, prefix, prefix);
|
|
85024
85024
|
exports.MultiBtnWarp = MultiBtnWarp;
|
|
85025
|
-
var TagListWrap = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n --console-rc-search-tag-value-max-width: 320px;\n --console-rc-search-tag-close-spacing: 8px;\n --console-rc-search-tag-close-icon-width: 12px;\n --console-rc-search-tag-close-padding-right: var(--tag-size-m-padding-lr, 12px);\n display: flex;\n align-items: flex-start;\n min-width: 0;\n\n .search-tags-list{\n display: flex;\n flex: 1 1 auto;\n flex-wrap: wrap;\n align-items: flex-start;\n min-width: 0;\n }\n .search-tags-tag-wrap{\n display: inline-flex;\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n .search-tags-tag-wrap > .search-tags-tag,\n .search-tags-tag-wrap > .search-tags-tag-dot{\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n ", "tag-medium", "tag-closable {\n box-sizing: border-box;\n width: max-content;\n max-width: 100%;\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn {\n margin-left: var(--console-rc-search-tag-close-spacing);\n padding-right: var(--console-rc-search-tag-close-padding-right);\n }\n ", "tag-medium", "tag-closable > ", "tag-body {\n display: inline-block;\n width: auto;\n min-width: 0;\n max-width: none;\n vertical-align: middle;\n }\n .search-tags-tag-label,\n .search-tags-tag-label-text{\n display: inline-block;\n line-height: inherit;\n vertical-align: top;\n }\n .search-tags-tag-value{\n display: inline-block;\n line-height: inherit;\n max-width: min(100%, var(--console-rc-search-tag-value-max-width));\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: top;\n }\n .search-tags-tag-value-overflow{\n width: var(--console-rc-search-tag-value-max-width);\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before, ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{\n font-size: 16px;\n }\n && [class*='-icon-close']::before{\n color: #808080;\n font-size: 12px !important;\n }\n .remove-btn{\n flex: 0 0 auto;\n line-height: 24px;\n margin-
|
|
85025
|
+
var TagListWrap = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n --console-rc-search-tag-value-max-width: 320px;\n --console-rc-search-tag-close-spacing: 8px;\n --console-rc-search-tag-close-icon-width: 12px;\n --console-rc-search-tag-close-padding-right: var(--tag-size-m-padding-lr, 12px);\n display: flex;\n align-items: flex-start;\n min-width: 0;\n\n .search-tags-list{\n display: flex;\n flex: 1 1 auto;\n flex-wrap: wrap;\n align-items: flex-start;\n column-gap: 8px;\n min-width: 0;\n }\n .search-tags-tag-wrap{\n display: inline-flex;\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n .search-tags-tag-wrap > .search-tags-tag,\n .search-tags-tag-wrap > .search-tags-tag-dot{\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n ", "tag-medium", "tag-closable {\n box-sizing: border-box;\n width: max-content;\n max-width: 100%;\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn {\n margin-left: var(--console-rc-search-tag-close-spacing);\n padding-right: var(--console-rc-search-tag-close-padding-right);\n }\n ", "tag-medium", "tag-closable > ", "tag-body {\n display: inline-block;\n width: auto;\n min-width: 0;\n max-width: none;\n vertical-align: middle;\n }\n .search-tags-tag-label,\n .search-tags-tag-label-text{\n display: inline-block;\n line-height: inherit;\n vertical-align: top;\n }\n .search-tags-tag-value{\n display: inline-block;\n line-height: inherit;\n max-width: min(100%, var(--console-rc-search-tag-value-max-width));\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: top;\n }\n .search-tags-tag-value-overflow{\n width: var(--console-rc-search-tag-value-max-width);\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before, ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{\n font-size: 16px;\n }\n && [class*='-icon-close']::before{\n color: #808080;\n font-size: 12px !important;\n }\n .remove-btn{\n flex: 0 0 auto;\n line-height: 24px;\n margin-top: 4px;\n display: inline-block;\n vertical-align: middle;\n white-space: nowrap;\n cursor: pointer;\n }\n"], ["\n --console-rc-search-tag-value-max-width: 320px;\n --console-rc-search-tag-close-spacing: 8px;\n --console-rc-search-tag-close-icon-width: 12px;\n --console-rc-search-tag-close-padding-right: var(--tag-size-m-padding-lr, 12px);\n display: flex;\n align-items: flex-start;\n min-width: 0;\n\n .search-tags-list{\n display: flex;\n flex: 1 1 auto;\n flex-wrap: wrap;\n align-items: flex-start;\n column-gap: 8px;\n min-width: 0;\n }\n .search-tags-tag-wrap{\n display: inline-flex;\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n .search-tags-tag-wrap > .search-tags-tag,\n .search-tags-tag-wrap > .search-tags-tag-dot{\n width: max-content;\n max-width: 100%;\n min-width: 0;\n }\n ", "tag-medium", "tag-closable {\n box-sizing: border-box;\n width: max-content;\n max-width: 100%;\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn {\n margin-left: var(--console-rc-search-tag-close-spacing);\n padding-right: var(--console-rc-search-tag-close-padding-right);\n }\n ", "tag-medium", "tag-closable > ", "tag-body {\n display: inline-block;\n width: auto;\n min-width: 0;\n max-width: none;\n vertical-align: middle;\n }\n .search-tags-tag-label,\n .search-tags-tag-label-text{\n display: inline-block;\n line-height: inherit;\n vertical-align: top;\n }\n .search-tags-tag-value{\n display: inline-block;\n line-height: inherit;\n max-width: min(100%, var(--console-rc-search-tag-value-max-width));\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: top;\n }\n .search-tags-tag-value-overflow{\n width: var(--console-rc-search-tag-value-max-width);\n }\n ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before, ", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{\n font-size: 16px;\n }\n && [class*='-icon-close']::before{\n color: #808080;\n font-size: 12px !important;\n }\n .remove-btn{\n flex: 0 0 auto;\n line-height: 24px;\n margin-top: 4px;\n display: inline-block;\n vertical-align: middle;\n white-space: nowrap;\n cursor: pointer;\n }\n"])), prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix);
|
|
85026
85026
|
exports.TagListWrap = TagListWrap;
|
|
85027
85027
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
85028
85028
|
|
|
@@ -113542,19 +113542,20 @@ var SearchTagList = function (props) {
|
|
|
113542
113542
|
var isWindClass = (0, useCssVar_1.useWindTheme)();
|
|
113543
113543
|
var tagListStyle = tagValueMaxWidth === undefined ? style : __assign(__assign({}, style), { '--console-rc-search-tag-value-max-width': getMaxWidth(tagValueMaxWidth) });
|
|
113544
113544
|
return (react_1.default.createElement(style_1.TagListWrap, { prefix: prefix, className: (0, classnames_1.default)(constants_1.baseTagListClassName, className, isWindClass), style: tagListStyle },
|
|
113545
|
-
react_1.default.createElement("div", { className: "search-tags-list" },
|
|
113546
|
-
|
|
113547
|
-
|
|
113548
|
-
|
|
113549
|
-
|
|
113550
|
-
|
|
113551
|
-
|
|
113552
|
-
react_1.default.createElement(
|
|
113553
|
-
react_1.default.createElement(
|
|
113554
|
-
react_1.default.createElement(
|
|
113555
|
-
|
|
113556
|
-
|
|
113557
|
-
|
|
113545
|
+
react_1.default.createElement("div", { className: "search-tags-list" },
|
|
113546
|
+
processDataSource.map(function (tagItem) {
|
|
113547
|
+
if (isTagLikeDataStructure(tagItem.value)) {
|
|
113548
|
+
return renderTags(tagItem);
|
|
113549
|
+
}
|
|
113550
|
+
var key = tagItem.dataIndex + tagItem.value;
|
|
113551
|
+
var value = getFilterValue(tagItem);
|
|
113552
|
+
return renderWithBalloon(getBalloonContent(value), (react_1.default.createElement("span", { className: "search-tags-tag-wrap" },
|
|
113553
|
+
react_1.default.createElement(ClosableTag, { className: "search-tags-tag", type: "normal", size: "medium", onClose: function () { onRemoveFilter(tagItem); return true; } },
|
|
113554
|
+
react_1.default.createElement(react_1.default.Fragment, null,
|
|
113555
|
+
react_1.default.createElement("label", { className: "search-tags-tag-label" }, tagItem.label),
|
|
113556
|
+
react_1.default.createElement(TagValue_1.default, null, value))))), key);
|
|
113557
|
+
}),
|
|
113558
|
+
processDataSource.length > 0 && (react_1.default.createElement("a", { className: "remove-btn", onClick: onRemoveAllFilter }, message_1.default.clearFilter)))));
|
|
113558
113559
|
};
|
|
113559
113560
|
exports.default = console_components_1.ConfigProvider.config(SearchTagList);
|
|
113560
113561
|
|
|
@@ -180,9 +180,9 @@ var SearchTagList = function SearchTagList(props) {
|
|
|
180
180
|
}, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("label", {
|
|
181
181
|
className: "search-tags-tag-label"
|
|
182
182
|
}, tagItem.label), /*#__PURE__*/React.createElement(TagValue, null, value)))), key);
|
|
183
|
-
})
|
|
183
|
+
}), processDataSource.length > 0 && /*#__PURE__*/React.createElement("a", {
|
|
184
184
|
className: "remove-btn",
|
|
185
185
|
onClick: onRemoveAllFilter
|
|
186
|
-
}, message.clearFilter));
|
|
186
|
+
}, message.clearFilter)));
|
|
187
187
|
};
|
|
188
188
|
export default ConfigProvider.config(SearchTagList);
|
package/es/style.js
CHANGED
|
@@ -13,5 +13,5 @@ var MultiBtnWarp = styled.div.withConfig({
|
|
|
13
13
|
})(["padding:\"0 4px\";text-align:\"center\";.pri-btn{margin-right:8px;width:auto;min-width:auto;padding:3px 12px;}.cancel-btn{padding:3px 12px;width:auto;min-width:auto;}", "btn", "small:not(.isOnlyIcon):not(", "btn-text){min-width:auto;}"], prefix, prefix, prefix);
|
|
14
14
|
var TagListWrap = styled.div.withConfig({
|
|
15
15
|
componentId: "sc-1afc1cn-3"
|
|
16
|
-
})(["--console-rc-search-tag-value-max-width:320px;--console-rc-search-tag-close-spacing:8px;--console-rc-search-tag-close-icon-width:12px;--console-rc-search-tag-close-padding-right:var(--tag-size-m-padding-lr,12px);display:flex;align-items:flex-start;min-width:0;.search-tags-list{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:flex-start;min-width:0;}.search-tags-tag-wrap{display:inline-flex;width:max-content;max-width:100%;min-width:0;}.search-tags-tag-wrap > .search-tags-tag,.search-tags-tag-wrap > .search-tags-tag-dot{width:max-content;max-width:100%;min-width:0;}", "tag-medium", "tag-closable{box-sizing:border-box;width:max-content;max-width:100%;}", "tag-medium", "tag-closable > ", "tag-close-btn{margin-left:var(--console-rc-search-tag-close-spacing);padding-right:var(--console-rc-search-tag-close-padding-right);}", "tag-medium", "tag-closable > ", "tag-body{display:inline-block;width:auto;min-width:0;max-width:none;vertical-align:middle;}.search-tags-tag-label,.search-tags-tag-label-text{display:inline-block;line-height:inherit;vertical-align:top;}.search-tags-tag-value{display:inline-block;line-height:inherit;max-width:min(100%,var(--console-rc-search-tag-value-max-width));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top;}.search-tags-tag-value-overflow{width:var(--console-rc-search-tag-value-max-width);}", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before,", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{font-size:16px;}&& [class*='-icon-close']::before{color:#808080;font-size:12px !important;}.remove-btn{flex:0 0 auto;line-height:24px;margin-
|
|
16
|
+
})(["--console-rc-search-tag-value-max-width:320px;--console-rc-search-tag-close-spacing:8px;--console-rc-search-tag-close-icon-width:12px;--console-rc-search-tag-close-padding-right:var(--tag-size-m-padding-lr,12px);display:flex;align-items:flex-start;min-width:0;.search-tags-list{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:flex-start;column-gap:8px;min-width:0;}.search-tags-tag-wrap{display:inline-flex;width:max-content;max-width:100%;min-width:0;}.search-tags-tag-wrap > .search-tags-tag,.search-tags-tag-wrap > .search-tags-tag-dot{width:max-content;max-width:100%;min-width:0;}", "tag-medium", "tag-closable{box-sizing:border-box;width:max-content;max-width:100%;}", "tag-medium", "tag-closable > ", "tag-close-btn{margin-left:var(--console-rc-search-tag-close-spacing);padding-right:var(--console-rc-search-tag-close-padding-right);}", "tag-medium", "tag-closable > ", "tag-body{display:inline-block;width:auto;min-width:0;max-width:none;vertical-align:middle;}.search-tags-tag-label,.search-tags-tag-label-text{display:inline-block;line-height:inherit;vertical-align:top;}.search-tags-tag-value{display:inline-block;line-height:inherit;max-width:min(100%,var(--console-rc-search-tag-value-max-width));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top;}.search-tags-tag-value-overflow{width:var(--console-rc-search-tag-value-max-width);}", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before,", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{font-size:16px;}&& [class*='-icon-close']::before{color:#808080;font-size:12px !important;}.remove-btn{flex:0 0 auto;line-height:24px;margin-top:4px;display:inline-block;vertical-align:middle;white-space:nowrap;cursor:pointer;}"], prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix);
|
|
17
17
|
export { SearchWarp, MultiBtnWarp, TagListWrap, MenuContentWrap };
|
|
@@ -187,9 +187,9 @@ var SearchTagList = function SearchTagList(props) {
|
|
|
187
187
|
}, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("label", {
|
|
188
188
|
className: "search-tags-tag-label"
|
|
189
189
|
}, tagItem.label), /*#__PURE__*/_react.default.createElement(_TagValue.default, null, value)))), key);
|
|
190
|
-
})
|
|
190
|
+
}), processDataSource.length > 0 && /*#__PURE__*/_react.default.createElement("a", {
|
|
191
191
|
className: "remove-btn",
|
|
192
192
|
onClick: onRemoveAllFilter
|
|
193
|
-
}, _message.default.clearFilter));
|
|
193
|
+
}, _message.default.clearFilter)));
|
|
194
194
|
};
|
|
195
195
|
var _default = exports.default = _consoleComponents.ConfigProvider.config(SearchTagList);
|
package/lib/style.js
CHANGED
|
@@ -20,4 +20,4 @@ var MultiBtnWarp = exports.MultiBtnWarp = _styledComponents.default.div.withConf
|
|
|
20
20
|
})(["padding:\"0 4px\";text-align:\"center\";.pri-btn{margin-right:8px;width:auto;min-width:auto;padding:3px 12px;}.cancel-btn{padding:3px 12px;width:auto;min-width:auto;}", "btn", "small:not(.isOnlyIcon):not(", "btn-text){min-width:auto;}"], prefix, prefix, prefix);
|
|
21
21
|
var TagListWrap = exports.TagListWrap = _styledComponents.default.div.withConfig({
|
|
22
22
|
componentId: "sc-1afc1cn-3"
|
|
23
|
-
})(["--console-rc-search-tag-value-max-width:320px;--console-rc-search-tag-close-spacing:8px;--console-rc-search-tag-close-icon-width:12px;--console-rc-search-tag-close-padding-right:var(--tag-size-m-padding-lr,12px);display:flex;align-items:flex-start;min-width:0;.search-tags-list{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:flex-start;min-width:0;}.search-tags-tag-wrap{display:inline-flex;width:max-content;max-width:100%;min-width:0;}.search-tags-tag-wrap > .search-tags-tag,.search-tags-tag-wrap > .search-tags-tag-dot{width:max-content;max-width:100%;min-width:0;}", "tag-medium", "tag-closable{box-sizing:border-box;width:max-content;max-width:100%;}", "tag-medium", "tag-closable > ", "tag-close-btn{margin-left:var(--console-rc-search-tag-close-spacing);padding-right:var(--console-rc-search-tag-close-padding-right);}", "tag-medium", "tag-closable > ", "tag-body{display:inline-block;width:auto;min-width:0;max-width:none;vertical-align:middle;}.search-tags-tag-label,.search-tags-tag-label-text{display:inline-block;line-height:inherit;vertical-align:top;}.search-tags-tag-value{display:inline-block;line-height:inherit;max-width:min(100%,var(--console-rc-search-tag-value-max-width));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top;}.search-tags-tag-value-overflow{width:var(--console-rc-search-tag-value-max-width);}", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before,", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{font-size:16px;}&& [class*='-icon-close']::before{color:#808080;font-size:12px !important;}.remove-btn{flex:0 0 auto;line-height:24px;margin-
|
|
23
|
+
})(["--console-rc-search-tag-value-max-width:320px;--console-rc-search-tag-close-spacing:8px;--console-rc-search-tag-close-icon-width:12px;--console-rc-search-tag-close-padding-right:var(--tag-size-m-padding-lr,12px);display:flex;align-items:flex-start;min-width:0;.search-tags-list{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:flex-start;column-gap:8px;min-width:0;}.search-tags-tag-wrap{display:inline-flex;width:max-content;max-width:100%;min-width:0;}.search-tags-tag-wrap > .search-tags-tag,.search-tags-tag-wrap > .search-tags-tag-dot{width:max-content;max-width:100%;min-width:0;}", "tag-medium", "tag-closable{box-sizing:border-box;width:max-content;max-width:100%;}", "tag-medium", "tag-closable > ", "tag-close-btn{margin-left:var(--console-rc-search-tag-close-spacing);padding-right:var(--console-rc-search-tag-close-padding-right);}", "tag-medium", "tag-closable > ", "tag-body{display:inline-block;width:auto;min-width:0;max-width:none;vertical-align:middle;}.search-tags-tag-label,.search-tags-tag-label-text{display:inline-block;line-height:inherit;vertical-align:top;}.search-tags-tag-value{display:inline-block;line-height:inherit;max-width:min(100%,var(--console-rc-search-tag-value-max-width));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top;}.search-tags-tag-value-overflow{width:var(--console-rc-search-tag-value-max-width);}", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon:before,", "tag-medium", "tag-closable > ", "tag-close-btn ", "icon ", "icon-remote{font-size:16px;}&& [class*='-icon-close']::before{color:#808080;font-size:12px !important;}.remove-btn{flex:0 0 auto;line-height:24px;margin-top:4px;display:inline-block;vertical-align:middle;white-space:nowrap;cursor:pointer;}"], prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix, prefix);
|