@everymatrix/nuts-inbox-widget 1.77.29 → 1.77.30
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/dist/cjs/nuts-inbox-widget_3.cjs.entry.js +54 -20
- package/dist/collection/components/nuts-notification/nuts-notification.js +17 -8
- package/dist/collection/utils/utils.js +37 -12
- package/dist/esm/nuts-inbox-widget_3.entry.js +54 -20
- package/dist/nuts-inbox-widget/nuts-inbox-widget_3.entry.js +1 -1
- package/dist/types/utils/utils.d.ts +1 -1
- package/hydrate/index.js +49 -16
- package/hydrate/index.mjs +49 -16
- package/package.json +1 -1
|
@@ -42314,19 +42314,44 @@ function renderAbstractNodeToSVGElement(node, options) {
|
|
|
42314
42314
|
const MAX_NOTIFICATION_TEXT_LENGTH = 200;
|
|
42315
42315
|
const MAX_NOTIFICATION_LINES = 5;
|
|
42316
42316
|
|
|
42317
|
-
const truncate = (str,
|
|
42318
|
-
|
|
42319
|
-
|
|
42320
|
-
|
|
42321
|
-
|
|
42322
|
-
|
|
42323
|
-
|
|
42324
|
-
|
|
42325
|
-
|
|
42326
|
-
|
|
42327
|
-
|
|
42317
|
+
const truncate = (str, maxChars, maxLines) => {
|
|
42318
|
+
var _a, _b, _c;
|
|
42319
|
+
if (!str || maxChars < 0)
|
|
42320
|
+
return "";
|
|
42321
|
+
const parser = new DOMParser();
|
|
42322
|
+
const doc = parser.parseFromString(str, "text/html");
|
|
42323
|
+
let charCount = 0;
|
|
42324
|
+
let lineCount = 0;
|
|
42325
|
+
const walker = doc.createTreeWalker(doc.body, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT);
|
|
42326
|
+
while (walker.nextNode()) {
|
|
42327
|
+
const node = walker.currentNode;
|
|
42328
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
42329
|
+
const text = node.textContent || "";
|
|
42330
|
+
if (charCount + text.length > maxChars) {
|
|
42331
|
+
node.textContent = text.slice(0, maxChars - charCount) + "...";
|
|
42332
|
+
while (node.nextSibling) {
|
|
42333
|
+
(_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(node.nextSibling);
|
|
42334
|
+
}
|
|
42335
|
+
break;
|
|
42336
|
+
}
|
|
42337
|
+
charCount += text.length;
|
|
42338
|
+
}
|
|
42339
|
+
else {
|
|
42340
|
+
const tagName = node.nodeName.toLowerCase();
|
|
42341
|
+
if (tagName === "br" || /^h[1-6]$/.test(tagName) || tagName === "p") {
|
|
42342
|
+
lineCount++;
|
|
42343
|
+
if (lineCount >= maxLines) {
|
|
42344
|
+
const ellipsis = doc.createTextNode("...");
|
|
42345
|
+
(_b = node.parentNode) === null || _b === void 0 ? void 0 : _b.insertBefore(ellipsis, node.nextSibling);
|
|
42346
|
+
while (node.nextSibling) {
|
|
42347
|
+
(_c = node.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(node.nextSibling);
|
|
42348
|
+
}
|
|
42349
|
+
break;
|
|
42350
|
+
}
|
|
42351
|
+
}
|
|
42352
|
+
}
|
|
42328
42353
|
}
|
|
42329
|
-
return
|
|
42354
|
+
return doc.body.innerHTML;
|
|
42330
42355
|
};
|
|
42331
42356
|
|
|
42332
42357
|
const nutsNotificationCss = ":host{display:block}p{display:block;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px}.NotificationContainer{animation:show 600ms 100ms cubic-bezier(0.38, 0.97, 0.56, 0.76) forwards;transform-origin:top center;padding:15px;position:relative;display:flex;line-height:20px;justify-content:space-between;align-items:flex-start;border-radius:7px;margin:10px 15px;color:var(--emw--color-white, rgb(255, 255, 255));background:var(--emw--color-gray-400, rgb(35, 35, 43));font-weight:400;font-size:14px;gap:8px;cursor:pointer}@keyframes show{100%{opacity:1;transform:none}}.NotificationContainer .AvatarContainer{margin-right:10px;width:40px;min-width:40px;height:40px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:40px;border:1px solid var(--emw--color-gray-200, rgb(82, 82, 102));overflow:hidden}.NotificationContainer .AvatarContainer .Avatar{box-sizing:border-box;position:relative;display:flex;user-select:none;overflow:hidden;width:38px;min-width:38px;height:38px;border-radius:32px;text-decoration:none;border:0px;background-color:transparent;padding:0px;justify-content:center;align-items:center}.NotificationContainer .AvatarContainer .Avatar .AvatarImage{object-fit:cover;width:100%;height:100%;display:block}.NotificationContainer .AvatarContainer .Avatar svg{object-fit:cover;display:block}.NotificationContainer .ContentContainer{display:flex;flex-direction:column;word-break:break-word;text-align:justify}.NotificationContainer .RightActionsContainer{display:flex;flex-direction:column}.NotificationContainer .FlipX{transform:rotateX(180deg) translate(0, 4px)}.NotificationContainer .AccordionArrow{margin-left:4px;transition-duration:0.2s;transition-property:transform}.NotificationContainer .Date{min-width:55px;font-size:12px;font-weight:400;opacity:0.5;line-height:14.4px;color:var(--emw--color-gray-200, rgb(82, 82, 102))}.NotificationContainer .Settings{opacity:0.5;display:inline;cursor:pointer}.Unseen::before{content:\"\";position:absolute;inset:0px;width:5px;border-radius:7px 0px 0px 7px;background:linear-gradient(0deg, var(--emw--color-secondary-20, rgb(255, 81, 47)) 0%, var(--emw--color-secondary, rgb(221, 36, 118)) 100%)}.Unseen:hover .UnseenButton{display:none}.SettingsDropdown{z-index:999;position:absolute;background:var(--emw--color-gray-400, rgb(41, 41, 51));box-shadow:var(--emw--color-gray-20, rgba(0, 0, 0, 0.2)) 0px 5px 20px;border-radius:7px;padding:4px;border:none;transition-property:opacity;transition-duration:150ms;transition-timing-function:ease;opacity:1;width:max-content;display:flex;flex-direction:column;right:50px;top:50px}.SettingsDropdown svg{margin-right:10px}.SettingsDropdown button{font-family:inherit;border:0px;background-color:transparent;outline:0px;width:100%;text-align:left;text-decoration:none;box-sizing:border-box;padding:10px 12px;cursor:pointer;border-radius:7px;display:flex;align-items:center;color:var(--emw--color-white, rgb(255, 255, 255));font-weight:400;font-size:14px}.SettingsDropdown button:hover{background:var(--emw--color-gray-300, rgb(61, 61, 77));transition:300ms}.Wrapper{position:relative}";
|
|
@@ -42423,7 +42448,7 @@ const NutsNotification = class {
|
|
|
42423
42448
|
this.messageDeteled.emit(this.messageId);
|
|
42424
42449
|
};
|
|
42425
42450
|
this.notificationActionHandler = () => {
|
|
42426
|
-
var _a, _b, _c
|
|
42451
|
+
var _a, _b, _c;
|
|
42427
42452
|
if (this.notificationAction == 'default' || !this.notificationAction) {
|
|
42428
42453
|
if (this.redirectUrl.length > 0) {
|
|
42429
42454
|
window.location.href = this.redirectUrl;
|
|
@@ -42432,11 +42457,12 @@ const NutsNotification = class {
|
|
|
42432
42457
|
if (this.notificationAction == 'postMessage') {
|
|
42433
42458
|
window.postMessage({ type: 'NotificationRedirect', url: this.redirectUrl }, window.location.href);
|
|
42434
42459
|
}
|
|
42435
|
-
|
|
42436
|
-
|
|
42460
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
42461
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) <= this.maxTextLength &&
|
|
42462
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length <= this.maxLines) {
|
|
42437
42463
|
return;
|
|
42438
42464
|
}
|
|
42439
|
-
if (((
|
|
42465
|
+
if (((_b = this.displayedContent) === null || _b === void 0 ? void 0 : _b.length) !== ((_c = this.content) === null || _c === void 0 ? void 0 : _c.length) && this.displayedContent !== this.content) {
|
|
42440
42466
|
this.displayedContent = this.content;
|
|
42441
42467
|
this.dropdownArrowRef.classList.add('FlipX');
|
|
42442
42468
|
return;
|
|
@@ -42542,9 +42568,17 @@ const NutsNotification = class {
|
|
|
42542
42568
|
}
|
|
42543
42569
|
}
|
|
42544
42570
|
connectedCallback() {
|
|
42571
|
+
var _a;
|
|
42545
42572
|
this.messageSeen = this.seen;
|
|
42546
42573
|
this.messageRead = this.read;
|
|
42547
|
-
|
|
42574
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
42575
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) > this.maxTextLength ||
|
|
42576
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length) {
|
|
42577
|
+
this.displayedContent = truncate(this.content, this.maxTextLength, this.maxLines);
|
|
42578
|
+
}
|
|
42579
|
+
else {
|
|
42580
|
+
this.displayedContent = this.content;
|
|
42581
|
+
}
|
|
42548
42582
|
this.baseUrl = `${this.backendUrl}/v1/${this.operatorId}`;
|
|
42549
42583
|
}
|
|
42550
42584
|
render() {
|
|
@@ -42582,11 +42616,11 @@ const NutsNotification = class {
|
|
|
42582
42616
|
'blockquote'
|
|
42583
42617
|
]
|
|
42584
42618
|
});
|
|
42585
|
-
return (index.h("div", { key: '
|
|
42619
|
+
return (index.h("div", { key: 'cd323dec5da352d3fc988ff5ea6d5ffdf1ac63dc', class: "Wrapper" }, index.h("div", { key: '43360a47de85a81de9dea47526e3a05abaffd325', class: 'NotificationContainer' + (this.messageSeen ? '' : ' Unseen'), ref: this.assignRefToStylingContainer, onClick: this.notificationActionHandler }, this.badge ? (index.h("div", { class: "AvatarContainer" }, index.h("div", { class: "Avatar" }, ((_a = systemIcons[this.badge]) === null || _a === void 0 ? void 0 : _a.icon) ? (index.h("div", { innerHTML: systemIcons[this.badge].icon })) : (index.h("img", { class: "AvatarImage", src: this.badge }))))) : (''), index.h("div", { key: 'de5056636fd06587696fd508ad8798c42c209bbd', class: "ContentContainer" }, index.h("div", { key: '5b2fce80f04fe61a32d6d426c4b96808c6d8f4da', innerHTML: sanitizedNotificationBody }), index.h("p", { key: 'c64bc6625c14614d665e35c18cba82f58b0f4450', class: "Date" }, formatDistanceToNow(new Date(this.date), {
|
|
42586
42620
|
addSuffix: true,
|
|
42587
42621
|
locale: dateFnsLocale(this.language)
|
|
42588
|
-
}))), index.h("div", { key: '
|
|
42589
|
-
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>/gi)) || []).length > this.maxLines) && (index.h("div", { key: '
|
|
42622
|
+
}))), index.h("div", { key: 'dba3f1c12ec6875c9873c4b12a7dc56bff7e1063', class: "RightActionsContainer" }, index.h("div", { key: '1f972b847eb6670f103d31f270ed73c1e9c736ba', class: "Settings", onClick: this.toggleSettingsModal }, index.h("svg", { key: '82bd09c22dc5d80103b30aceaaefa015b15a3ea3', width: "24", height: "24", viewBox: "0 0 30 30", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'b1d08fbcf1b17af6aada23bb50d5fb2c049a5f91', d: "M20.625 15.5C20.625 16.5547 21.4453 17.375 22.5 17.375C23.5156 17.375 24.375 16.5547 24.375 15.5C24.375 14.4844 23.5156 13.625 22.5 13.625C21.4453 13.625 20.625 14.4844 20.625 15.5ZM9.375 15.5C9.375 14.4844 8.51562 13.625 7.5 13.625C6.44531 13.625 5.625 14.4844 5.625 15.5C5.625 16.5547 6.44531 17.375 7.5 17.375C8.51562 17.375 9.375 16.5547 9.375 15.5ZM16.875 15.5C16.875 14.4844 16.0156 13.625 15 13.625C13.9453 13.625 13.125 14.4844 13.125 15.5C13.125 16.5547 13.9453 17.375 15 17.375C16.0156 17.375 16.875 16.5547 16.875 15.5Z", fill: "currentColor" }))), (((_b = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] })) === null || _b === void 0 ? void 0 : _b.length) > this.maxTextLength ||
|
|
42623
|
+
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length > this.maxLines) && (index.h("div", { key: '5674e3a4b26604e16e6774cff3a8d18a0e12d709', class: "AccordionArrow", innerHTML: systemIcons.arrowDown.icon, ref: this.assignRefToDropdownArrow })))), this.showSettingsModal ? (index.h("div", { class: "SettingsDropdown" }, index.h("button", { onClick: this.toggleNotificationRead }, index.h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M14.9434 5.17969C14.2109 4.59375 13.625 4.125 10.1387 1.60547C9.64062 1.25391 8.67383 0.375 8 0.375V0.404297C7.9707 0.404297 7.9707 0.375 7.9707 0.375C7.29688 0.375 6.33008 1.25391 5.83203 1.60547C2.3457 4.125 1.75977 4.59375 1.02734 5.17969C0.675781 5.44336 0.5 5.85352 0.5 6.26367V13.9688C0.5 14.7598 1.11523 15.375 1.90625 15.375H14.0938C14.8555 15.375 15.5 14.7598 15.5 13.9688V6.26367C15.5 5.85352 15.2949 5.44336 14.9434 5.17969ZM9.37695 11.1562C8.9668 11.4785 8.46875 11.6543 8 11.6543C7.50195 11.6543 7.00391 11.4785 6.59375 11.1562L2.375 7.8457V6.49805C2.99023 6 3.72266 5.44336 6.94531 3.12891C7.0332 3.04102 7.15039 2.95312 7.26758 2.86523C7.41406 2.74805 7.73633 2.48438 8 2.33789C8.23438 2.48438 8.55664 2.74805 8.70312 2.86523C8.82031 2.95312 8.9375 3.04102 9.02539 3.12891C12.2188 5.44336 12.9805 6 13.625 6.49805V7.8457L9.37695 11.1562Z", fill: "currentColor" })), translate$1(this.messageRead ? 'markAsUnread' : 'markAsRead', this.language)), index.h("button", { onClick: this.deleteNotification }, index.h("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M4.375 15.4375C4.375 16.1758 4.94922 16.75 5.6875 16.75H13.5625C14.2734 16.75 14.875 16.1758 14.875 15.4375V6.25H4.375V15.4375ZM11.8125 8.4375C11.8125 8.21875 12.0039 8 12.25 8C12.4688 8 12.6875 8.21875 12.6875 8.4375V14.5625C12.6875 14.8086 12.4688 15 12.25 15C12.0039 15 11.8125 14.8086 11.8125 14.5625V8.4375ZM9.1875 8.4375C9.1875 8.21875 9.37891 8 9.625 8C9.84375 8 10.0625 8.21875 10.0625 8.4375V14.5625C10.0625 14.8086 9.84375 15 9.625 15C9.37891 15 9.1875 14.8086 9.1875 14.5625V8.4375ZM6.5625 8.4375C6.5625 8.21875 6.75391 8 7 8C7.21875 8 7.4375 8.21875 7.4375 8.4375V14.5625C7.4375 14.8086 7.21875 15 7 15C6.75391 15 6.5625 14.8086 6.5625 14.5625V8.4375ZM15.3125 3.625H12.25L11.9219 2.99609C11.8398 2.85938 11.7031 2.75 11.5391 2.75H7.68359C7.51953 2.75 7.38281 2.85938 7.30078 2.99609L7 3.625H3.9375C3.69141 3.625 3.5 3.84375 3.5 4.0625V4.9375C3.5 5.18359 3.69141 5.375 3.9375 5.375H15.3125C15.5312 5.375 15.75 5.18359 15.75 4.9375V4.0625C15.75 3.84375 15.5312 3.625 15.3125 3.625Z", fill: "currentColor" })), translate$1('removeMessage', this.language)))) : ('')));
|
|
42590
42624
|
}
|
|
42591
42625
|
get el() { return index.getElement(this); }
|
|
42592
42626
|
static get watchers() { return {
|
|
@@ -95,7 +95,7 @@ export class NutsNotification {
|
|
|
95
95
|
this.messageDeteled.emit(this.messageId);
|
|
96
96
|
};
|
|
97
97
|
this.notificationActionHandler = () => {
|
|
98
|
-
var _a, _b, _c
|
|
98
|
+
var _a, _b, _c;
|
|
99
99
|
if (!Build.isBrowser)
|
|
100
100
|
return;
|
|
101
101
|
if (this.notificationAction == 'default' || !this.notificationAction) {
|
|
@@ -106,11 +106,12 @@ export class NutsNotification {
|
|
|
106
106
|
if (this.notificationAction == 'postMessage') {
|
|
107
107
|
window.postMessage({ type: 'NotificationRedirect', url: this.redirectUrl }, window.location.href);
|
|
108
108
|
}
|
|
109
|
-
|
|
110
|
-
|
|
109
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
110
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) <= this.maxTextLength &&
|
|
111
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length <= this.maxLines) {
|
|
111
112
|
return;
|
|
112
113
|
}
|
|
113
|
-
if (((
|
|
114
|
+
if (((_b = this.displayedContent) === null || _b === void 0 ? void 0 : _b.length) !== ((_c = this.content) === null || _c === void 0 ? void 0 : _c.length) && this.displayedContent !== this.content) {
|
|
114
115
|
this.displayedContent = this.content;
|
|
115
116
|
this.dropdownArrowRef.classList.add('FlipX');
|
|
116
117
|
return;
|
|
@@ -216,9 +217,17 @@ export class NutsNotification {
|
|
|
216
217
|
}
|
|
217
218
|
}
|
|
218
219
|
connectedCallback() {
|
|
220
|
+
var _a;
|
|
219
221
|
this.messageSeen = this.seen;
|
|
220
222
|
this.messageRead = this.read;
|
|
221
|
-
|
|
223
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
224
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) > this.maxTextLength ||
|
|
225
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length) {
|
|
226
|
+
this.displayedContent = truncate(this.content, this.maxTextLength, this.maxLines);
|
|
227
|
+
}
|
|
228
|
+
else {
|
|
229
|
+
this.displayedContent = this.content;
|
|
230
|
+
}
|
|
222
231
|
this.baseUrl = `${this.backendUrl}/v1/${this.operatorId}`;
|
|
223
232
|
}
|
|
224
233
|
render() {
|
|
@@ -256,11 +265,11 @@ export class NutsNotification {
|
|
|
256
265
|
'blockquote'
|
|
257
266
|
]
|
|
258
267
|
});
|
|
259
|
-
return (h("div", { key: '
|
|
268
|
+
return (h("div", { key: 'cd323dec5da352d3fc988ff5ea6d5ffdf1ac63dc', class: "Wrapper" }, h("div", { key: '43360a47de85a81de9dea47526e3a05abaffd325', class: 'NotificationContainer' + (this.messageSeen ? '' : ' Unseen'), ref: this.assignRefToStylingContainer, onClick: this.notificationActionHandler }, this.badge ? (h("div", { class: "AvatarContainer" }, h("div", { class: "Avatar" }, ((_a = systemIcons[this.badge]) === null || _a === void 0 ? void 0 : _a.icon) ? (h("div", { innerHTML: systemIcons[this.badge].icon })) : (h("img", { class: "AvatarImage", src: this.badge }))))) : (''), h("div", { key: 'de5056636fd06587696fd508ad8798c42c209bbd', class: "ContentContainer" }, h("div", { key: '5b2fce80f04fe61a32d6d426c4b96808c6d8f4da', innerHTML: sanitizedNotificationBody }), h("p", { key: 'c64bc6625c14614d665e35c18cba82f58b0f4450', class: "Date" }, formatDistanceToNow(new Date(this.date), {
|
|
260
269
|
addSuffix: true,
|
|
261
270
|
locale: dateFnsLocale(this.language)
|
|
262
|
-
}))), h("div", { key: '
|
|
263
|
-
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>/gi)) || []).length > this.maxLines) && (h("div", { key: '
|
|
271
|
+
}))), h("div", { key: 'dba3f1c12ec6875c9873c4b12a7dc56bff7e1063', class: "RightActionsContainer" }, h("div", { key: '1f972b847eb6670f103d31f270ed73c1e9c736ba', class: "Settings", onClick: this.toggleSettingsModal }, h("svg", { key: '82bd09c22dc5d80103b30aceaaefa015b15a3ea3', width: "24", height: "24", viewBox: "0 0 30 30", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'b1d08fbcf1b17af6aada23bb50d5fb2c049a5f91', d: "M20.625 15.5C20.625 16.5547 21.4453 17.375 22.5 17.375C23.5156 17.375 24.375 16.5547 24.375 15.5C24.375 14.4844 23.5156 13.625 22.5 13.625C21.4453 13.625 20.625 14.4844 20.625 15.5ZM9.375 15.5C9.375 14.4844 8.51562 13.625 7.5 13.625C6.44531 13.625 5.625 14.4844 5.625 15.5C5.625 16.5547 6.44531 17.375 7.5 17.375C8.51562 17.375 9.375 16.5547 9.375 15.5ZM16.875 15.5C16.875 14.4844 16.0156 13.625 15 13.625C13.9453 13.625 13.125 14.4844 13.125 15.5C13.125 16.5547 13.9453 17.375 15 17.375C16.0156 17.375 16.875 16.5547 16.875 15.5Z", fill: "currentColor" }))), (((_b = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] })) === null || _b === void 0 ? void 0 : _b.length) > this.maxTextLength ||
|
|
272
|
+
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length > this.maxLines) && (h("div", { key: '5674e3a4b26604e16e6774cff3a8d18a0e12d709', class: "AccordionArrow", innerHTML: systemIcons.arrowDown.icon, ref: this.assignRefToDropdownArrow })))), this.showSettingsModal ? (h("div", { class: "SettingsDropdown" }, h("button", { onClick: this.toggleNotificationRead }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M14.9434 5.17969C14.2109 4.59375 13.625 4.125 10.1387 1.60547C9.64062 1.25391 8.67383 0.375 8 0.375V0.404297C7.9707 0.404297 7.9707 0.375 7.9707 0.375C7.29688 0.375 6.33008 1.25391 5.83203 1.60547C2.3457 4.125 1.75977 4.59375 1.02734 5.17969C0.675781 5.44336 0.5 5.85352 0.5 6.26367V13.9688C0.5 14.7598 1.11523 15.375 1.90625 15.375H14.0938C14.8555 15.375 15.5 14.7598 15.5 13.9688V6.26367C15.5 5.85352 15.2949 5.44336 14.9434 5.17969ZM9.37695 11.1562C8.9668 11.4785 8.46875 11.6543 8 11.6543C7.50195 11.6543 7.00391 11.4785 6.59375 11.1562L2.375 7.8457V6.49805C2.99023 6 3.72266 5.44336 6.94531 3.12891C7.0332 3.04102 7.15039 2.95312 7.26758 2.86523C7.41406 2.74805 7.73633 2.48438 8 2.33789C8.23438 2.48438 8.55664 2.74805 8.70312 2.86523C8.82031 2.95312 8.9375 3.04102 9.02539 3.12891C12.2188 5.44336 12.9805 6 13.625 6.49805V7.8457L9.37695 11.1562Z", fill: "currentColor" })), translate(this.messageRead ? 'markAsUnread' : 'markAsRead', this.language)), h("button", { onClick: this.deleteNotification }, h("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4.375 15.4375C4.375 16.1758 4.94922 16.75 5.6875 16.75H13.5625C14.2734 16.75 14.875 16.1758 14.875 15.4375V6.25H4.375V15.4375ZM11.8125 8.4375C11.8125 8.21875 12.0039 8 12.25 8C12.4688 8 12.6875 8.21875 12.6875 8.4375V14.5625C12.6875 14.8086 12.4688 15 12.25 15C12.0039 15 11.8125 14.8086 11.8125 14.5625V8.4375ZM9.1875 8.4375C9.1875 8.21875 9.37891 8 9.625 8C9.84375 8 10.0625 8.21875 10.0625 8.4375V14.5625C10.0625 14.8086 9.84375 15 9.625 15C9.37891 15 9.1875 14.8086 9.1875 14.5625V8.4375ZM6.5625 8.4375C6.5625 8.21875 6.75391 8 7 8C7.21875 8 7.4375 8.21875 7.4375 8.4375V14.5625C7.4375 14.8086 7.21875 15 7 15C6.75391 15 6.5625 14.8086 6.5625 14.5625V8.4375ZM15.3125 3.625H12.25L11.9219 2.99609C11.8398 2.85938 11.7031 2.75 11.5391 2.75H7.68359C7.51953 2.75 7.38281 2.85938 7.30078 2.99609L7 3.625H3.9375C3.69141 3.625 3.5 3.84375 3.5 4.0625V4.9375C3.5 5.18359 3.69141 5.375 3.9375 5.375H15.3125C15.5312 5.375 15.75 5.18359 15.75 4.9375V4.0625C15.75 3.84375 15.5312 3.625 15.3125 3.625Z", fill: "currentColor" })), translate('removeMessage', this.language)))) : ('')));
|
|
264
273
|
}
|
|
265
274
|
static get is() { return "nuts-notification"; }
|
|
266
275
|
static get originalStyleUrls() {
|
|
@@ -1,14 +1,39 @@
|
|
|
1
|
-
export const truncate = (str,
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export const truncate = (str, maxChars, maxLines) => {
|
|
2
|
+
var _a, _b, _c;
|
|
3
|
+
if (!str || maxChars < 0)
|
|
4
|
+
return "";
|
|
5
|
+
const parser = new DOMParser();
|
|
6
|
+
const doc = parser.parseFromString(str, "text/html");
|
|
7
|
+
let charCount = 0;
|
|
8
|
+
let lineCount = 0;
|
|
9
|
+
const walker = doc.createTreeWalker(doc.body, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT);
|
|
10
|
+
while (walker.nextNode()) {
|
|
11
|
+
const node = walker.currentNode;
|
|
12
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
13
|
+
const text = node.textContent || "";
|
|
14
|
+
if (charCount + text.length > maxChars) {
|
|
15
|
+
node.textContent = text.slice(0, maxChars - charCount) + "...";
|
|
16
|
+
while (node.nextSibling) {
|
|
17
|
+
(_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(node.nextSibling);
|
|
18
|
+
}
|
|
19
|
+
break;
|
|
20
|
+
}
|
|
21
|
+
charCount += text.length;
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
const tagName = node.nodeName.toLowerCase();
|
|
25
|
+
if (tagName === "br" || /^h[1-6]$/.test(tagName) || tagName === "p") {
|
|
26
|
+
lineCount++;
|
|
27
|
+
if (lineCount >= maxLines) {
|
|
28
|
+
const ellipsis = doc.createTextNode("...");
|
|
29
|
+
(_b = node.parentNode) === null || _b === void 0 ? void 0 : _b.insertBefore(ellipsis, node.nextSibling);
|
|
30
|
+
while (node.nextSibling) {
|
|
31
|
+
(_c = node.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(node.nextSibling);
|
|
32
|
+
}
|
|
33
|
+
break;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}
|
|
4
37
|
}
|
|
5
|
-
|
|
6
|
-
return str.slice(0, n - 1) + '...';
|
|
7
|
-
}
|
|
8
|
-
const matches = [...str.matchAll(/<br\s*\/?>|<\/p>/gi)];
|
|
9
|
-
if (matches.length >= l) {
|
|
10
|
-
const cutoffIndex = matches[l - 1].index;
|
|
11
|
-
return str.slice(0, cutoffIndex) + '...';
|
|
12
|
-
}
|
|
13
|
-
return str;
|
|
38
|
+
return doc.body.innerHTML;
|
|
14
39
|
};
|
|
@@ -42310,19 +42310,44 @@ function renderAbstractNodeToSVGElement(node, options) {
|
|
|
42310
42310
|
const MAX_NOTIFICATION_TEXT_LENGTH = 200;
|
|
42311
42311
|
const MAX_NOTIFICATION_LINES = 5;
|
|
42312
42312
|
|
|
42313
|
-
const truncate = (str,
|
|
42314
|
-
|
|
42315
|
-
|
|
42316
|
-
|
|
42317
|
-
|
|
42318
|
-
|
|
42319
|
-
|
|
42320
|
-
|
|
42321
|
-
|
|
42322
|
-
|
|
42323
|
-
|
|
42313
|
+
const truncate = (str, maxChars, maxLines) => {
|
|
42314
|
+
var _a, _b, _c;
|
|
42315
|
+
if (!str || maxChars < 0)
|
|
42316
|
+
return "";
|
|
42317
|
+
const parser = new DOMParser();
|
|
42318
|
+
const doc = parser.parseFromString(str, "text/html");
|
|
42319
|
+
let charCount = 0;
|
|
42320
|
+
let lineCount = 0;
|
|
42321
|
+
const walker = doc.createTreeWalker(doc.body, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT);
|
|
42322
|
+
while (walker.nextNode()) {
|
|
42323
|
+
const node = walker.currentNode;
|
|
42324
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
42325
|
+
const text = node.textContent || "";
|
|
42326
|
+
if (charCount + text.length > maxChars) {
|
|
42327
|
+
node.textContent = text.slice(0, maxChars - charCount) + "...";
|
|
42328
|
+
while (node.nextSibling) {
|
|
42329
|
+
(_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(node.nextSibling);
|
|
42330
|
+
}
|
|
42331
|
+
break;
|
|
42332
|
+
}
|
|
42333
|
+
charCount += text.length;
|
|
42334
|
+
}
|
|
42335
|
+
else {
|
|
42336
|
+
const tagName = node.nodeName.toLowerCase();
|
|
42337
|
+
if (tagName === "br" || /^h[1-6]$/.test(tagName) || tagName === "p") {
|
|
42338
|
+
lineCount++;
|
|
42339
|
+
if (lineCount >= maxLines) {
|
|
42340
|
+
const ellipsis = doc.createTextNode("...");
|
|
42341
|
+
(_b = node.parentNode) === null || _b === void 0 ? void 0 : _b.insertBefore(ellipsis, node.nextSibling);
|
|
42342
|
+
while (node.nextSibling) {
|
|
42343
|
+
(_c = node.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(node.nextSibling);
|
|
42344
|
+
}
|
|
42345
|
+
break;
|
|
42346
|
+
}
|
|
42347
|
+
}
|
|
42348
|
+
}
|
|
42324
42349
|
}
|
|
42325
|
-
return
|
|
42350
|
+
return doc.body.innerHTML;
|
|
42326
42351
|
};
|
|
42327
42352
|
|
|
42328
42353
|
const nutsNotificationCss = ":host{display:block}p{display:block;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px}.NotificationContainer{animation:show 600ms 100ms cubic-bezier(0.38, 0.97, 0.56, 0.76) forwards;transform-origin:top center;padding:15px;position:relative;display:flex;line-height:20px;justify-content:space-between;align-items:flex-start;border-radius:7px;margin:10px 15px;color:var(--emw--color-white, rgb(255, 255, 255));background:var(--emw--color-gray-400, rgb(35, 35, 43));font-weight:400;font-size:14px;gap:8px;cursor:pointer}@keyframes show{100%{opacity:1;transform:none}}.NotificationContainer .AvatarContainer{margin-right:10px;width:40px;min-width:40px;height:40px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:40px;border:1px solid var(--emw--color-gray-200, rgb(82, 82, 102));overflow:hidden}.NotificationContainer .AvatarContainer .Avatar{box-sizing:border-box;position:relative;display:flex;user-select:none;overflow:hidden;width:38px;min-width:38px;height:38px;border-radius:32px;text-decoration:none;border:0px;background-color:transparent;padding:0px;justify-content:center;align-items:center}.NotificationContainer .AvatarContainer .Avatar .AvatarImage{object-fit:cover;width:100%;height:100%;display:block}.NotificationContainer .AvatarContainer .Avatar svg{object-fit:cover;display:block}.NotificationContainer .ContentContainer{display:flex;flex-direction:column;word-break:break-word;text-align:justify}.NotificationContainer .RightActionsContainer{display:flex;flex-direction:column}.NotificationContainer .FlipX{transform:rotateX(180deg) translate(0, 4px)}.NotificationContainer .AccordionArrow{margin-left:4px;transition-duration:0.2s;transition-property:transform}.NotificationContainer .Date{min-width:55px;font-size:12px;font-weight:400;opacity:0.5;line-height:14.4px;color:var(--emw--color-gray-200, rgb(82, 82, 102))}.NotificationContainer .Settings{opacity:0.5;display:inline;cursor:pointer}.Unseen::before{content:\"\";position:absolute;inset:0px;width:5px;border-radius:7px 0px 0px 7px;background:linear-gradient(0deg, var(--emw--color-secondary-20, rgb(255, 81, 47)) 0%, var(--emw--color-secondary, rgb(221, 36, 118)) 100%)}.Unseen:hover .UnseenButton{display:none}.SettingsDropdown{z-index:999;position:absolute;background:var(--emw--color-gray-400, rgb(41, 41, 51));box-shadow:var(--emw--color-gray-20, rgba(0, 0, 0, 0.2)) 0px 5px 20px;border-radius:7px;padding:4px;border:none;transition-property:opacity;transition-duration:150ms;transition-timing-function:ease;opacity:1;width:max-content;display:flex;flex-direction:column;right:50px;top:50px}.SettingsDropdown svg{margin-right:10px}.SettingsDropdown button{font-family:inherit;border:0px;background-color:transparent;outline:0px;width:100%;text-align:left;text-decoration:none;box-sizing:border-box;padding:10px 12px;cursor:pointer;border-radius:7px;display:flex;align-items:center;color:var(--emw--color-white, rgb(255, 255, 255));font-weight:400;font-size:14px}.SettingsDropdown button:hover{background:var(--emw--color-gray-300, rgb(61, 61, 77));transition:300ms}.Wrapper{position:relative}";
|
|
@@ -42419,7 +42444,7 @@ const NutsNotification = class {
|
|
|
42419
42444
|
this.messageDeteled.emit(this.messageId);
|
|
42420
42445
|
};
|
|
42421
42446
|
this.notificationActionHandler = () => {
|
|
42422
|
-
var _a, _b, _c
|
|
42447
|
+
var _a, _b, _c;
|
|
42423
42448
|
if (this.notificationAction == 'default' || !this.notificationAction) {
|
|
42424
42449
|
if (this.redirectUrl.length > 0) {
|
|
42425
42450
|
window.location.href = this.redirectUrl;
|
|
@@ -42428,11 +42453,12 @@ const NutsNotification = class {
|
|
|
42428
42453
|
if (this.notificationAction == 'postMessage') {
|
|
42429
42454
|
window.postMessage({ type: 'NotificationRedirect', url: this.redirectUrl }, window.location.href);
|
|
42430
42455
|
}
|
|
42431
|
-
|
|
42432
|
-
|
|
42456
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
42457
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) <= this.maxTextLength &&
|
|
42458
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length <= this.maxLines) {
|
|
42433
42459
|
return;
|
|
42434
42460
|
}
|
|
42435
|
-
if (((
|
|
42461
|
+
if (((_b = this.displayedContent) === null || _b === void 0 ? void 0 : _b.length) !== ((_c = this.content) === null || _c === void 0 ? void 0 : _c.length) && this.displayedContent !== this.content) {
|
|
42436
42462
|
this.displayedContent = this.content;
|
|
42437
42463
|
this.dropdownArrowRef.classList.add('FlipX');
|
|
42438
42464
|
return;
|
|
@@ -42538,9 +42564,17 @@ const NutsNotification = class {
|
|
|
42538
42564
|
}
|
|
42539
42565
|
}
|
|
42540
42566
|
connectedCallback() {
|
|
42567
|
+
var _a;
|
|
42541
42568
|
this.messageSeen = this.seen;
|
|
42542
42569
|
this.messageRead = this.read;
|
|
42543
|
-
|
|
42570
|
+
const fullyStrippedContent = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] });
|
|
42571
|
+
if ((fullyStrippedContent === null || fullyStrippedContent === void 0 ? void 0 : fullyStrippedContent.length) > this.maxTextLength ||
|
|
42572
|
+
(((_a = this.content) === null || _a === void 0 ? void 0 : _a.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length) {
|
|
42573
|
+
this.displayedContent = truncate(this.content, this.maxTextLength, this.maxLines);
|
|
42574
|
+
}
|
|
42575
|
+
else {
|
|
42576
|
+
this.displayedContent = this.content;
|
|
42577
|
+
}
|
|
42544
42578
|
this.baseUrl = `${this.backendUrl}/v1/${this.operatorId}`;
|
|
42545
42579
|
}
|
|
42546
42580
|
render() {
|
|
@@ -42578,11 +42612,11 @@ const NutsNotification = class {
|
|
|
42578
42612
|
'blockquote'
|
|
42579
42613
|
]
|
|
42580
42614
|
});
|
|
42581
|
-
return (h("div", { key: '
|
|
42615
|
+
return (h("div", { key: 'cd323dec5da352d3fc988ff5ea6d5ffdf1ac63dc', class: "Wrapper" }, h("div", { key: '43360a47de85a81de9dea47526e3a05abaffd325', class: 'NotificationContainer' + (this.messageSeen ? '' : ' Unseen'), ref: this.assignRefToStylingContainer, onClick: this.notificationActionHandler }, this.badge ? (h("div", { class: "AvatarContainer" }, h("div", { class: "Avatar" }, ((_a = systemIcons[this.badge]) === null || _a === void 0 ? void 0 : _a.icon) ? (h("div", { innerHTML: systemIcons[this.badge].icon })) : (h("img", { class: "AvatarImage", src: this.badge }))))) : (''), h("div", { key: 'de5056636fd06587696fd508ad8798c42c209bbd', class: "ContentContainer" }, h("div", { key: '5b2fce80f04fe61a32d6d426c4b96808c6d8f4da', innerHTML: sanitizedNotificationBody }), h("p", { key: 'c64bc6625c14614d665e35c18cba82f58b0f4450', class: "Date" }, formatDistanceToNow(new Date(this.date), {
|
|
42582
42616
|
addSuffix: true,
|
|
42583
42617
|
locale: dateFnsLocale(this.language)
|
|
42584
|
-
}))), h("div", { key: '
|
|
42585
|
-
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>/gi)) || []).length > this.maxLines) && (h("div", { key: '
|
|
42618
|
+
}))), h("div", { key: 'dba3f1c12ec6875c9873c4b12a7dc56bff7e1063', class: "RightActionsContainer" }, h("div", { key: '1f972b847eb6670f103d31f270ed73c1e9c736ba', class: "Settings", onClick: this.toggleSettingsModal }, h("svg", { key: '82bd09c22dc5d80103b30aceaaefa015b15a3ea3', width: "24", height: "24", viewBox: "0 0 30 30", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'b1d08fbcf1b17af6aada23bb50d5fb2c049a5f91', d: "M20.625 15.5C20.625 16.5547 21.4453 17.375 22.5 17.375C23.5156 17.375 24.375 16.5547 24.375 15.5C24.375 14.4844 23.5156 13.625 22.5 13.625C21.4453 13.625 20.625 14.4844 20.625 15.5ZM9.375 15.5C9.375 14.4844 8.51562 13.625 7.5 13.625C6.44531 13.625 5.625 14.4844 5.625 15.5C5.625 16.5547 6.44531 17.375 7.5 17.375C8.51562 17.375 9.375 16.5547 9.375 15.5ZM16.875 15.5C16.875 14.4844 16.0156 13.625 15 13.625C13.9453 13.625 13.125 14.4844 13.125 15.5C13.125 16.5547 13.9453 17.375 15 17.375C16.0156 17.375 16.875 16.5547 16.875 15.5Z", fill: "currentColor" }))), (((_b = DOMPurify.sanitize(this.content, { ALLOWED_TAGS: [] })) === null || _b === void 0 ? void 0 : _b.length) > this.maxTextLength ||
|
|
42619
|
+
(((_c = this.content) === null || _c === void 0 ? void 0 : _c.match(/<br\s*\/?>|<\/p>|<\/h[1-6]>/gi)) || []).length > this.maxLines) && (h("div", { key: '5674e3a4b26604e16e6774cff3a8d18a0e12d709', class: "AccordionArrow", innerHTML: systemIcons.arrowDown.icon, ref: this.assignRefToDropdownArrow })))), this.showSettingsModal ? (h("div", { class: "SettingsDropdown" }, h("button", { onClick: this.toggleNotificationRead }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M14.9434 5.17969C14.2109 4.59375 13.625 4.125 10.1387 1.60547C9.64062 1.25391 8.67383 0.375 8 0.375V0.404297C7.9707 0.404297 7.9707 0.375 7.9707 0.375C7.29688 0.375 6.33008 1.25391 5.83203 1.60547C2.3457 4.125 1.75977 4.59375 1.02734 5.17969C0.675781 5.44336 0.5 5.85352 0.5 6.26367V13.9688C0.5 14.7598 1.11523 15.375 1.90625 15.375H14.0938C14.8555 15.375 15.5 14.7598 15.5 13.9688V6.26367C15.5 5.85352 15.2949 5.44336 14.9434 5.17969ZM9.37695 11.1562C8.9668 11.4785 8.46875 11.6543 8 11.6543C7.50195 11.6543 7.00391 11.4785 6.59375 11.1562L2.375 7.8457V6.49805C2.99023 6 3.72266 5.44336 6.94531 3.12891C7.0332 3.04102 7.15039 2.95312 7.26758 2.86523C7.41406 2.74805 7.73633 2.48438 8 2.33789C8.23438 2.48438 8.55664 2.74805 8.70312 2.86523C8.82031 2.95312 8.9375 3.04102 9.02539 3.12891C12.2188 5.44336 12.9805 6 13.625 6.49805V7.8457L9.37695 11.1562Z", fill: "currentColor" })), translate$1(this.messageRead ? 'markAsUnread' : 'markAsRead', this.language)), h("button", { onClick: this.deleteNotification }, h("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M4.375 15.4375C4.375 16.1758 4.94922 16.75 5.6875 16.75H13.5625C14.2734 16.75 14.875 16.1758 14.875 15.4375V6.25H4.375V15.4375ZM11.8125 8.4375C11.8125 8.21875 12.0039 8 12.25 8C12.4688 8 12.6875 8.21875 12.6875 8.4375V14.5625C12.6875 14.8086 12.4688 15 12.25 15C12.0039 15 11.8125 14.8086 11.8125 14.5625V8.4375ZM9.1875 8.4375C9.1875 8.21875 9.37891 8 9.625 8C9.84375 8 10.0625 8.21875 10.0625 8.4375V14.5625C10.0625 14.8086 9.84375 15 9.625 15C9.37891 15 9.1875 14.8086 9.1875 14.5625V8.4375ZM6.5625 8.4375C6.5625 8.21875 6.75391 8 7 8C7.21875 8 7.4375 8.21875 7.4375 8.4375V14.5625C7.4375 14.8086 7.21875 15 7 15C6.75391 15 6.5625 14.8086 6.5625 14.5625V8.4375ZM15.3125 3.625H12.25L11.9219 2.99609C11.8398 2.85938 11.7031 2.75 11.5391 2.75H7.68359C7.51953 2.75 7.38281 2.85938 7.30078 2.99609L7 3.625H3.9375C3.69141 3.625 3.5 3.84375 3.5 4.0625V4.9375C3.5 5.18359 3.69141 5.375 3.9375 5.375H15.3125C15.5312 5.375 15.75 5.18359 15.75 4.9375V4.0625C15.75 3.84375 15.5312 3.625 15.3125 3.625Z", fill: "currentColor" })), translate$1('removeMessage', this.language)))) : ('')));
|
|
42586
42620
|
}
|
|
42587
42621
|
get el() { return getElement(this); }
|
|
42588
42622
|
static get watchers() { return {
|