@carbon/ibm-products-web-components 0.21.1 → 0.22.0-rc.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/custom-elements.json +102 -15
- package/es/components/about-modal/about-modal.d.ts +19 -3
- package/es/components/about-modal/about-modal.js +33 -2
- package/es/components/about-modal/about-modal.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body-item.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/es/components/interstitial-screen/interstitial-screen-body.js +30 -6
- package/es/components/interstitial-screen/interstitial-screen-body.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/es/components/interstitial-screen/interstitial-screen-footer.js +32 -3
- package/es/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/es/components/interstitial-screen/interstitial-screen-header.js +17 -1
- package/es/components/interstitial-screen/interstitial-screen-header.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/es/components/interstitial-screen/interstitial-screen.js +45 -22
- package/es/components/interstitial-screen/interstitial-screen.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/es/components/interstitial-screen/interstitial-screen.test.js +329 -0
- package/es/components/interstitial-screen/interstitial-screen.test.js.map +1 -0
- package/es/components/notification-panel/notification-panel.d.ts +6 -1
- package/es/components/notification-panel/notification-panel.js +27 -8
- package/es/components/notification-panel/notification-panel.js.map +1 -1
- package/es/components/notification-panel/notification-panel.test.js +53 -0
- package/es/components/notification-panel/notification-panel.test.js.map +1 -1
- package/es/components/options-tile/options-tile.d.ts +9 -2
- package/es/components/options-tile/options-tile.js +26 -12
- package/es/components/options-tile/options-tile.js.map +1 -1
- package/es/components/options-tile/options-tile.scss.js +1 -1
- package/es/components/options-tile/options-tile.test.js +7 -7
- package/es/components/options-tile/options-tile.test.js.map +1 -1
- package/es/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/es/components/page-header/_story-assets/set-of-tags/index.js +9 -0
- package/es/components/page-header/_story-assets/set-of-tags/index.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.js +260 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js +13 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.js +44 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.js.map +1 -0
- package/es/components/page-header/context.d.ts +1 -0
- package/es/components/page-header/context.js +1 -0
- package/es/components/page-header/context.js.map +1 -1
- package/es/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/es/components/page-header/page-header-breadcrumb.js +14 -2
- package/es/components/page-header/page-header-breadcrumb.js.map +1 -1
- package/es/components/page-header/page-header-content.d.ts +1 -0
- package/es/components/page-header/page-header-content.js +12 -2
- package/es/components/page-header/page-header-content.js.map +1 -1
- package/es/components/page-header/page-header-title-breadcrumb.js +6 -0
- package/es/components/page-header/page-header-title-breadcrumb.js.map +1 -1
- package/es/components/page-header/page-header.d.ts +2 -0
- package/es/components/page-header/page-header.js +33 -1
- package/es/components/page-header/page-header.js.map +1 -1
- package/es/components/page-header/page-header.scss.js +1 -1
- package/es/components/side-panel/_story-assets/index.js +4 -0
- package/es/components/side-panel/_story-assets/index.js.map +1 -1
- package/es/components/side-panel/side-panel.d.ts +12 -13
- package/es/components/side-panel/side-panel.js +59 -89
- package/es/components/side-panel/side-panel.js.map +1 -1
- package/es/components/side-panel/side-panel.scss.js +1 -1
- package/es/components/truncated-text/truncated-text.js +25 -7
- package/es/components/truncated-text/truncated-text.js.map +1 -1
- package/es/components/truncated-text/truncated-text.scss.js +1 -1
- package/es/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js +11 -0
- package/es/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js.map +1 -0
- package/es/packages/ibm-products-web-components/package.json.js +1 -1
- package/es/utilities/carousel/carousel.d.ts +6 -0
- package/es/utilities/carousel/carousel.js +133 -2
- package/es/utilities/carousel/carousel.js.map +1 -1
- package/es/utilities/carousel/types.d.ts +1 -0
- package/es-custom/components/about-modal/about-modal.d.ts +19 -3
- package/es-custom/components/about-modal/about-modal.js +33 -2
- package/es-custom/components/about-modal/about-modal.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body-item.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-body.js +30 -6
- package/es-custom/components/interstitial-screen/interstitial-screen-body.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js +32 -3
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-header.js +17 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-header.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/es-custom/components/interstitial-screen/interstitial-screen.js +45 -22
- package/es-custom/components/interstitial-screen/interstitial-screen.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/es-custom/components/interstitial-screen/interstitial-screen.test.js +329 -0
- package/es-custom/components/interstitial-screen/interstitial-screen.test.js.map +1 -0
- package/es-custom/components/notification-panel/notification-panel.d.ts +6 -1
- package/es-custom/components/notification-panel/notification-panel.js +27 -8
- package/es-custom/components/notification-panel/notification-panel.js.map +1 -1
- package/es-custom/components/notification-panel/notification-panel.test.js +53 -0
- package/es-custom/components/notification-panel/notification-panel.test.js.map +1 -1
- package/es-custom/components/options-tile/options-tile.d.ts +9 -2
- package/es-custom/components/options-tile/options-tile.js +26 -12
- package/es-custom/components/options-tile/options-tile.js.map +1 -1
- package/es-custom/components/options-tile/options-tile.scss.js +1 -1
- package/es-custom/components/options-tile/options-tile.test.js +7 -7
- package/es-custom/components/options-tile/options-tile.test.js.map +1 -1
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.js +9 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.js +260 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js +13 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.js +44 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.js.map +1 -0
- package/es-custom/components/page-header/context.d.ts +1 -0
- package/es-custom/components/page-header/context.js +1 -0
- package/es-custom/components/page-header/context.js.map +1 -1
- package/es-custom/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/es-custom/components/page-header/page-header-breadcrumb.js +14 -2
- package/es-custom/components/page-header/page-header-breadcrumb.js.map +1 -1
- package/es-custom/components/page-header/page-header-content.d.ts +1 -0
- package/es-custom/components/page-header/page-header-content.js +12 -2
- package/es-custom/components/page-header/page-header-content.js.map +1 -1
- package/es-custom/components/page-header/page-header-title-breadcrumb.js +6 -0
- package/es-custom/components/page-header/page-header-title-breadcrumb.js.map +1 -1
- package/es-custom/components/page-header/page-header.d.ts +2 -0
- package/es-custom/components/page-header/page-header.js +33 -1
- package/es-custom/components/page-header/page-header.js.map +1 -1
- package/es-custom/components/page-header/page-header.scss.js +1 -1
- package/es-custom/components/side-panel/_story-assets/index.js +4 -0
- package/es-custom/components/side-panel/_story-assets/index.js.map +1 -1
- package/es-custom/components/side-panel/side-panel.d.ts +12 -13
- package/es-custom/components/side-panel/side-panel.js +59 -89
- package/es-custom/components/side-panel/side-panel.js.map +1 -1
- package/es-custom/components/side-panel/side-panel.scss.js +1 -1
- package/es-custom/components/truncated-text/truncated-text.js +25 -7
- package/es-custom/components/truncated-text/truncated-text.js.map +1 -1
- package/es-custom/components/truncated-text/truncated-text.scss.js +1 -1
- package/es-custom/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js +11 -0
- package/es-custom/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js.map +1 -0
- package/es-custom/packages/ibm-products-web-components/package.json.js +1 -1
- package/es-custom/utilities/carousel/carousel.d.ts +6 -0
- package/es-custom/utilities/carousel/carousel.js +133 -2
- package/es-custom/utilities/carousel/carousel.js.map +1 -1
- package/es-custom/utilities/carousel/types.d.ts +1 -0
- package/lib/components/about-modal/about-modal.d.ts +19 -3
- package/lib/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/lib/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/lib/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/lib/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/lib/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/lib/components/notification-panel/notification-panel.d.ts +6 -1
- package/lib/components/options-tile/options-tile.d.ts +9 -2
- package/lib/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/lib/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/lib/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/lib/components/page-header/context.d.ts +1 -0
- package/lib/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/lib/components/page-header/page-header-content.d.ts +1 -0
- package/lib/components/page-header/page-header.d.ts +2 -0
- package/lib/components/side-panel/side-panel.d.ts +12 -13
- package/lib/utilities/carousel/carousel.d.ts +6 -0
- package/lib/utilities/carousel/types.d.ts +1 -0
- package/package.json +4 -3
- package/scss/components/interstitial-screen/interstitial-screen-body-item.scss +1 -1
- package/scss/components/interstitial-screen/interstitial-screen-body.scss +0 -1
- package/scss/components/interstitial-screen/interstitial-screen-footer.scss +0 -1
- package/scss/components/options-tile/options-tile.scss +8 -2
- package/scss/components/options-tile/story-styles.scss +21 -0
- package/scss/components/page-header/_story-assets/set-of-tags/set-of-tags.scss +94 -0
- package/scss/components/page-header/page-header.scss +69 -33
- package/scss/components/truncated-text/truncated-text.scss +4 -0
@@ -0,0 +1,260 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
|
8
|
+
import { __decorate } from 'tslib';
|
9
|
+
import { LitElement, nothing, html } from 'lit';
|
10
|
+
import { state, property, query, customElement } from 'lit/decorators.js';
|
11
|
+
import '@carbon/web-components/es-custom/components/tag/index.js';
|
12
|
+
import '@carbon/web-components/es-custom/components/link/index.js';
|
13
|
+
import '@carbon/web-components/es-custom/components/modal/index.js';
|
14
|
+
import '@carbon/web-components/es-custom/components/search/index.js';
|
15
|
+
import { createOverflowHandler as L } from '../../../../node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js';
|
16
|
+
import '../../../../node_modules/@carbon/utilities/es/documentLang/documentLang.js';
|
17
|
+
import styles from './set-of-tags.scss.js';
|
18
|
+
|
19
|
+
/**
|
20
|
+
* @license
|
21
|
+
*
|
22
|
+
* Copyright IBM Corp. 2025, 2025
|
23
|
+
*
|
24
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
25
|
+
* LICENSE file in the root directory of this source tree.
|
26
|
+
*/
|
27
|
+
const blockClass = `c4p--set-of-tags`;
|
28
|
+
let SetOfTags = class SetOfTags extends LitElement {
|
29
|
+
constructor() {
|
30
|
+
super(...arguments);
|
31
|
+
this.hiddenTags = [];
|
32
|
+
this.tagsData = [];
|
33
|
+
this.isPopoverOpen = false;
|
34
|
+
this.modalOpen = false;
|
35
|
+
this.searchString = '';
|
36
|
+
this.handleDocumentClick = (event) => {
|
37
|
+
if (event.target !== this) {
|
38
|
+
this.isPopoverOpen = false;
|
39
|
+
}
|
40
|
+
};
|
41
|
+
this.handleDismiss = (e, tag) => {
|
42
|
+
var _a, _b, _c;
|
43
|
+
e.stopPropagation();
|
44
|
+
e.preventDefault();
|
45
|
+
this.tagsData = this.tagsData.filter((t) => t.text !== tag.text);
|
46
|
+
(_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('[data-hidden]:not([data-offset])').forEach((el) => el.removeAttribute('data-hidden'));
|
47
|
+
const remaining = this.hiddenTags.filter((t) => t.text !== tag.text);
|
48
|
+
if (this.hiddenTags.length === 2 && remaining[0]) {
|
49
|
+
(_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(`#${remaining[0].text}`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('data-hidden');
|
50
|
+
}
|
51
|
+
};
|
52
|
+
}
|
53
|
+
connectedCallback() {
|
54
|
+
super.connectedCallback();
|
55
|
+
this.style.visibility = 'hidden';
|
56
|
+
}
|
57
|
+
firstUpdated() {
|
58
|
+
// setup overflow handler by observing offset by default
|
59
|
+
// dynamic changes in offset sizes re-initializes the handler to account for the new offset size
|
60
|
+
this.resizeObserver = new ResizeObserver(() => {
|
61
|
+
this.setupOverflowHandler();
|
62
|
+
});
|
63
|
+
this.resizeObserver.observe(this.offset);
|
64
|
+
// On first render, all elements are initially visible. so hiding `this` visibility in connectedCallback
|
65
|
+
// The handler runs on the second render to hide specific elements as needed.
|
66
|
+
// The following line restores visibility after layout settles, allowing for smoother transitions.
|
67
|
+
setTimeout(() => {
|
68
|
+
this.style.visibility = 'visible';
|
69
|
+
});
|
70
|
+
document.addEventListener('click', this.handleDocumentClick);
|
71
|
+
}
|
72
|
+
updated(changedProperties) {
|
73
|
+
var _a;
|
74
|
+
// setup overflow handler whenever tags data changes to account for the new item sizes
|
75
|
+
if (changedProperties.has('tagsData')) {
|
76
|
+
const previousIsPopoverOpen = this.isPopoverOpen;
|
77
|
+
this.updateComplete.then(() => {
|
78
|
+
this.hiddenTags = [];
|
79
|
+
this.isPopoverOpen = previousIsPopoverOpen;
|
80
|
+
this.setupOverflowHandler();
|
81
|
+
});
|
82
|
+
}
|
83
|
+
if (!this.hiddenTags.length) {
|
84
|
+
const lastItem = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-hidden]:not([data-offset])');
|
85
|
+
lastItem === null || lastItem === void 0 ? void 0 : lastItem.removeAttribute('data-hidden');
|
86
|
+
}
|
87
|
+
}
|
88
|
+
disconnectedCallback() {
|
89
|
+
var _a, _b;
|
90
|
+
super.disconnectedCallback();
|
91
|
+
(_a = this.overflowHandler) === null || _a === void 0 ? void 0 : _a.disconnect();
|
92
|
+
(_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
|
93
|
+
document.removeEventListener('click', this.handleDocumentClick);
|
94
|
+
}
|
95
|
+
setupOverflowHandler() {
|
96
|
+
var _a;
|
97
|
+
if (!this.container) {
|
98
|
+
return;
|
99
|
+
}
|
100
|
+
// Disconnect existing handler if any
|
101
|
+
(_a = this.overflowHandler) === null || _a === void 0 ? void 0 : _a.disconnect();
|
102
|
+
this.overflowHandler = L({
|
103
|
+
container: this.container,
|
104
|
+
onChange: (_, hiddenItems) => {
|
105
|
+
const filteredChildren = Array.from(this.container.children).filter((child) => !child.hasAttribute('data-offset') &&
|
106
|
+
!child.hasAttribute('data-fixed'));
|
107
|
+
this.hiddenTags = hiddenItems.map((hiddenItem) => {
|
108
|
+
const index = filteredChildren.indexOf(hiddenItem);
|
109
|
+
return this.tagsData[index];
|
110
|
+
});
|
111
|
+
},
|
112
|
+
});
|
113
|
+
}
|
114
|
+
handleTogglePopover(event) {
|
115
|
+
if (event instanceof PointerEvent ||
|
116
|
+
(event instanceof KeyboardEvent && [' ', 'Enter'].includes(event.key))) {
|
117
|
+
this.isPopoverOpen = !this.isPopoverOpen;
|
118
|
+
}
|
119
|
+
}
|
120
|
+
render() {
|
121
|
+
var _a;
|
122
|
+
return html ` <div class=${blockClass}>
|
123
|
+
${this.tagsData.map((tag) => html `
|
124
|
+
<span id=${tag === null || tag === void 0 ? void 0 : tag.text}>
|
125
|
+
${(tag === null || tag === void 0 ? void 0 : tag.onClose)
|
126
|
+
? html `<cds-custom-dismissible-tag
|
127
|
+
@cds-custom-dismissible-tag-beingclosed=${(e) => this.handleDismiss(e, tag)}
|
128
|
+
text=${tag === null || tag === void 0 ? void 0 : tag.text}
|
129
|
+
tag-title="Provide a custom title to the tag"
|
130
|
+
type=${tag.type}
|
131
|
+
size=${tag.size}
|
132
|
+
></cds-custom-dismissible-tag>`
|
133
|
+
: html `<cds-custom-tag type=${tag.type} size=${tag.size}
|
134
|
+
>${tag === null || tag === void 0 ? void 0 : tag.text}</cds-custom-tag
|
135
|
+
>`}
|
136
|
+
</span>
|
137
|
+
`)}
|
138
|
+
<span data-offset ?data-hidden=${this.hiddenTags.length === 0}>
|
139
|
+
<cds-custom-popover
|
140
|
+
?open=${this.isPopoverOpen}
|
141
|
+
?highContrast=${true}
|
142
|
+
align=${document.dir === 'rtl' ? 'bottom-left' : 'bottom-right'}
|
143
|
+
>
|
144
|
+
<cds-custom-operational-tag
|
145
|
+
size=${(_a = this.tagsData[0]) === null || _a === void 0 ? void 0 : _a.size}
|
146
|
+
title="+${this.hiddenTags.length}"
|
147
|
+
text="+${this.hiddenTags.length}"
|
148
|
+
@click=${this.handleTogglePopover}
|
149
|
+
@keydown=${this.handleTogglePopover}
|
150
|
+
></cds-custom-operational-tag>
|
151
|
+
<cds-custom-popover-content>
|
152
|
+
<div class="${`${blockClass}__popover-container`}">
|
153
|
+
${this.hiddenTags.length > 0
|
154
|
+
? this.hiddenTags.slice(0, 10).map((tag) => tag.onClose
|
155
|
+
? html `
|
156
|
+
<div>
|
157
|
+
<cds-custom-dismissible-tag
|
158
|
+
@cds-custom-dismissible-tag-beingclosed=${(e) => this.handleDismiss(e, tag)}
|
159
|
+
text=${tag === null || tag === void 0 ? void 0 : tag.text}
|
160
|
+
tag-title="Provide a custom title to the tag"
|
161
|
+
type=${tag.type}
|
162
|
+
size=${tag.size}
|
163
|
+
></cds-custom-dismissible-tag>
|
164
|
+
</div>
|
165
|
+
`
|
166
|
+
: html `<p class="${blockClass}__popover-tag">
|
167
|
+
${tag === null || tag === void 0 ? void 0 : tag.text}
|
168
|
+
</p>`)
|
169
|
+
: nothing}
|
170
|
+
${this.hiddenTags.length > 10
|
171
|
+
? html `
|
172
|
+
<cds-custom-link
|
173
|
+
class="${blockClass}__view-all"
|
174
|
+
@click=${() => (this.modalOpen = true)}
|
175
|
+
@keydown=${(e) => {
|
176
|
+
if (e.key === ' ') {
|
177
|
+
this.modalOpen = true;
|
178
|
+
}
|
179
|
+
}}
|
180
|
+
>
|
181
|
+
View all tags
|
182
|
+
</cds-custom-link>
|
183
|
+
`
|
184
|
+
: nothing}
|
185
|
+
</div>
|
186
|
+
</cds-custom-popover-content>
|
187
|
+
</cds-custom-popover>
|
188
|
+
</span>
|
189
|
+
</div>
|
190
|
+
${this.hiddenTags.length > 10
|
191
|
+
? html `<cds-custom-modal
|
192
|
+
?open=${this.modalOpen}
|
193
|
+
size="sm"
|
194
|
+
@cds-custom-modal-closed=${(_) => (this.modalOpen = false)}
|
195
|
+
>
|
196
|
+
<cds-custom-modal-header>
|
197
|
+
<cds-custom-modal-close-button></cds-custom-modal-close-button>
|
198
|
+
<cds-custom-modal-heading>All tags</cds-custom-modal-heading>
|
199
|
+
<cds-custom-search
|
200
|
+
size="lg"
|
201
|
+
close-button-label-text="Clear search input"
|
202
|
+
value="${this.searchString}"
|
203
|
+
class="${blockClass}__modal-tags-search"
|
204
|
+
label-text="Search"
|
205
|
+
placeholder="Search all tags"
|
206
|
+
type="text"
|
207
|
+
@cds-custom-search-input=${(e) => (this.searchString = e.detail.value)}
|
208
|
+
></cds-custom-search>
|
209
|
+
</cds-custom-modal-header>
|
210
|
+
<cds-custom-modal-body>
|
211
|
+
<div class="${blockClass}__modal-tags-container">
|
212
|
+
${this.tagsData
|
213
|
+
.filter((tag) => tag.text &&
|
214
|
+
new RegExp(this.searchString, 'i').test(tag.text))
|
215
|
+
.map((tag) => tag.onClose
|
216
|
+
? html `<cds-custom-dismissible-tag
|
217
|
+
@cds-custom-dismissible-tag-beingclosed=${(e) => this.handleDismiss(e, tag)}
|
218
|
+
text=${tag === null || tag === void 0 ? void 0 : tag.text}
|
219
|
+
tag-title="Provide a custom title to the tag"
|
220
|
+
type=${tag.type}
|
221
|
+
size=${tag.size}
|
222
|
+
></cds-custom-dismissible-tag>`
|
223
|
+
: html `<cds-custom-tag type=${tag.type} size=${tag.size}
|
224
|
+
>${tag === null || tag === void 0 ? void 0 : tag.text}</cds-custom-tag
|
225
|
+
>`)}
|
226
|
+
</div>
|
227
|
+
</cds-custom-modal-body>
|
228
|
+
</cds-custom-modal>`
|
229
|
+
: nothing}`;
|
230
|
+
}
|
231
|
+
};
|
232
|
+
SetOfTags.styles = styles;
|
233
|
+
__decorate([
|
234
|
+
state()
|
235
|
+
], SetOfTags.prototype, "hiddenTags", void 0);
|
236
|
+
__decorate([
|
237
|
+
property({ type: Array, attribute: 'tags-data', reflect: true })
|
238
|
+
], SetOfTags.prototype, "tagsData", void 0);
|
239
|
+
__decorate([
|
240
|
+
query(`.${blockClass}`)
|
241
|
+
], SetOfTags.prototype, "container", void 0);
|
242
|
+
__decorate([
|
243
|
+
query('[data-offset]')
|
244
|
+
], SetOfTags.prototype, "offset", void 0);
|
245
|
+
__decorate([
|
246
|
+
state()
|
247
|
+
], SetOfTags.prototype, "isPopoverOpen", void 0);
|
248
|
+
__decorate([
|
249
|
+
state()
|
250
|
+
], SetOfTags.prototype, "modalOpen", void 0);
|
251
|
+
__decorate([
|
252
|
+
state()
|
253
|
+
], SetOfTags.prototype, "searchString", void 0);
|
254
|
+
SetOfTags = __decorate([
|
255
|
+
customElement('set-of-tags')
|
256
|
+
], SetOfTags);
|
257
|
+
var SetOfTags$1 = SetOfTags;
|
258
|
+
|
259
|
+
export { SetOfTags$1 as default };
|
260
|
+
//# sourceMappingURL=set-of-tags.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"set-of-tags.js","sources":["../../../../../src/components/page-header/_story-assets/set-of-tags/set-of-tags.ts"],"sourcesContent":[null],"names":["createOverflowHandler"],"mappings":"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"}
|