npm - @progress/kendo-angular-common - Versions diffs - 22.1.0-develop.7 → 22.1.0-develop.9 - Mend

@progress/kendo-angular-common 22.1.0-develop.7 → 22.1.0-develop.9

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.

Files changed (5) hide show

package/fesm2022/progress-kendo-angular-common.mjs +331 -96
package/package.json +2 -2
package/watermark/utils.d.ts +0 -34
package/watermark/validation.d.ts +2 -2
package/watermark/watermark.component.d.ts +14 -30

package/fesm2022/progress-kendo-angular-common.mjs CHANGED Viewed

@@ -3,13 +3,13 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, Directive, Injectable, Component, ViewChild, HostBinding, Optional, isDevMode } from '@angular/core';
+import { EventEmitter, Output, Input, Directive, Injectable, Component, HostBinding, ViewChild, Optional, isDevMode } from '@angular/core';
 import { detectDesktopBrowser, detectMobileOS } from '@progress/kendo-common';
 import { take, auditTime } from 'rxjs/operators';
 import { Draggable } from '@progress/kendo-draggable';
 import { merge, fromEvent, from, Subscription } from 'rxjs';
-import { NgStyle } from '@angular/common';
-import { getLicenseStatus } from '@progress/kendo-licensing';
+import { NgStyle, NgTemplateOutlet } from '@angular/common';
+import { registerLicenseMessage, getLicenseStatus } from '@progress/kendo-licensing';
 /**
  * @hidden
@@ -1051,40 +1051,6 @@ const watermarkStyles = `
     pointerEvents: none;
     backgroundImage: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAYAAABccqhmAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAABVxSURBVHgB7Z3tVRtJE4WL9zgANgLLGRCCnAGOADmCxRGgDFAGYiOADKQMIAGO9J8ji42g37mjqlUjBgOanpn+uM85sjC2sKzbVd1dVV0tQgghhBBCCCGEEEIIKRPn3Gn1GAlJmmN1pP558J6OX9540ejh4WGlX09OTk7+EZIclXYXlY43+vVflY7PH3wd9c+AY/Wvvcb9/b0bjUYOz/hBQpICmh1oOPrEa6l/4rTR337AhIMgTSqtzg+0m8gnof7p0mD8EzmGhkFwJiR6np6e7luLL9Q/RTDTBzF+7wfWg2CxWOCHjYVET6XTdLPZrFuLL9Q/NeCkoVUQ4/d+6Ijev1yof1rAUVMvQgjJHebrSRu+CEmWo/O8hISgCjStKpgiGoDWed4AUP/hwGf++Pi4hQYyFHgDzBP3T7A8b0uo/zD4+sMBy1CwWKR/YjF+fS/Uv2di0t/eEAdBT0QnvlD/PolR/xoOgu4JUd7bFdS/e6I1foODoFuqz3M2mUziFF+of5dEb/xGwyAYCwmCVuPNYv5MqX94Yl75NWKD4PLyEm92KqQoqH9Y8Bnis0zC+A14LbxxVqiVCfUPh678plxNFYQe5pjRgAgpDAv4IOAHJyCEkDJoiPaeCyG5UA1oRIYWHNivSSbV0wLq/zbQXz+bS8kV/AeZJ35NCcYPqH8zvv4VS8kVFou8phTjB9T/NcVt+zgI9rjQDRwTgPrvKcn5v4CDYIfT/vtFiS/UHxRr/AYHwQ4t9DiVwihZ/+KN36ATKJsS9U+utr9r/EGQdQSUNFKa/geZkImQ/2rHlznnQDG7oX9b9Xwl5AUl6G9oLcSSxl8Q/p4P13YJIaQMisvzEkJ2lJjnJyQY3lnoJGfNUvP8oUhZf7c70s2eCG1wL7uhRJ0iQnCveiDIhzf7t/f9IvP8IUhJfx/b9rErUkvgRVPIE1fv6xrvbzweu7OzM3d7e4v3OhfSilT092HMJzCxF4u43eWctfFvt1uHu9nxXvF1CWmtroldfx9W+HVErINAjX+M65ngAPxnOAJ1AiMhrUjBCdD4Oya2QYBlPwx8vV47WwFg+a+XZbrz83NzANz/ByBmJ0Dj74lYBgECfrbnt6U/DB/vC7388L2rqyu8vzshwYjRCdD4e8YfBLidVgYA0X7M9jB8PGazmbu5ualnfiz9dSAsufwPTwz6+5jjp/H3CD5ofPB9343u9v3u6+U+0jyY7eEA8Hx3d4c/QjvvMyGdMZT+TeA9wBHR+DPHUn3T6bRe7uMxn89tn18v/TH7O17gQEheYM9vEX7M9hbsg/FbHED3/IPPSISQgNhyE0au+7x7PPtOQFcB3PMTMjTYf4cyRN3zL2DgMHgs/7XU99acgDIWEgUh9W/4uWMh8QKBvCh8qxSR7fmxt0eEv8kJ6MzP8/2REFL/g59bp/o0xsMAb6xAnBB5Yr+6D3X9KOpBxP/ACWA0jFnoEw+h9D/4mYd5/pGQeAlRLFK95tJy+35578PDQ+0E9LAPi3wixAUsFmKRT6I0DIIPzdJuf6R3i+UeZnsz/nqjPx47/fMpZ/54OVb/g5/BZi4pY4Pgo8s2d3CkF0Z/cXFRL/+Xy2W9BdBUH4/5JsBn9W94PZu5pI77QzMOjepiNp/j71hO//fv31sr7qmtfT73i3xWjnvAZHhH/4nquXrLwB2bueSJ27Vmvodhq4df4BmzvQb3IPxWl/zgRl/DwZA4GrhdYFUHfbHE1y0enXsJ2FLfCnggvjqBejDoTI8o38ocgJAscNq8BY4fv/Uf+J46gjkdQcbA+19fXzs7zQfR8TWcgH+kFw/u+fMDKz/o3OQETk9PLcWLPSBbeeWELd91eb+CcTc5gXr6r9J8PNKbF/7S3z+6DYcvDasBOv6M0GUduNDfv+cEYPhjIVmA+I3Vc4gaOQzfHAECvb4joAPICCzlrIJP93h/dAIYDBQ/L8wBNC37rXUblv5CB5AfGvi5h6F7Ed9GJ2CZP0b780O1vreVnnhOAFsBOoCMscg/HMBbTsCO+grJFkvvHmYCSnYA/5MMcbsiH6TykNgfr9fry58/f0oltFxcXMj379+l+h42gBcnJyfr6iXfq1nhJ56FZIeuAq+fn59Xv379Oq0CgVJNBEIydAAavLv98ePHeSX4bfX1OQSv9noQ/a7y9A8HTuAcTqB63FSPZyE5Mq3GwOW3b99kNpu9+5e/fv2Kp3+FpAW8vB3cwbLOOvZYfl9LfGdW9KOn+mZCskZXhCuL9vtLfjvshd97hWArpn8TxGn5rhZzOL/gB19DYBzzxcEeTQEtGfArB7c7xbmyVu4YExoTuNcYEL6eCkkTxHYOmna4wzQfvq8z/+o949e940hIkjTp5/ZXjm/1+VQfr856UP/EcLtqr9s/OQENDl5+wPhH3nHQZK6mJjucNvNo2w+A+icC0jaY4a2LT5MT+Mye3+l58JSupiY7XIA2XtQ/IZw2f7D9v+X6D53AZ/f8LqGrqckOF7CNF/VPAF3Or6xvv53r951Amx5+DYOAXWEjxXXQxov6R4zTSzusht8OfABE+r3U39y1iPbbIODVX3ED4/Tagk8kENQ/QiyaC1Fg7PX6frm0Mk6/wUOQ8l799+j9I0cDwcF1ov4R4Xbde2vjxi92ogsPzPrY92szD7buJiQn3K6+v17q2yxvlV1u3+TRAn4jIYTkAfbymOWx1AcwfHMEXp5/JISQ9PEDd867ohvGbvt+cwRe6+5ee7ltNpuVf7yYdA8+68fHxy0+exkY6t8RGnSxJX19yAd7fWvhjEs7NOCHb2D9/+AGqO3HQGSeuD/8PD/GggwM9e8IBPCwr7ciHnzA6NrqtW5+4QRkIByLRXrDRXhXH/XvCKRccEuPX8mHD9jr7Vc7AV32D9rJh4Oge2I0foP6d8QHnADO9kdxYw8HQXfEbPwG9e+It5yAlvdG1beNgyA8KRi/Qf07oskJIEYQw8x/SMMgGAs5CmR0UjF+g/oHwh00YzAn0OZgT1/YINBU5VTIUeCzw2eYivEb1L8l7o1mDm7X220a48x/iNtVLE4dC5OOxu2794wlMaj/kbgAzRwIIQmS4p6PEBKIp6enexo/IYWCPdNms1nnbPxat7BwvH/+P7Dt08/kUjKH+hcOxGeeeI8f86lYSuZQ/8JhsciehoBv9rMi9VdcwZcucBCkVeEXmuL1dy0vbciBkgdBycZvFKs/8/x7ShwENP49xelP8V9T0iBgncdritGfxv82/iDIORJ+EAGfCKnJXn8a//to7fgy51y45sCX1P812erPZR8hBVMZ/Ax9+2j8hBSIHumcpXikkxBCBsXtz8QnUyXndvfz8Sx8AFLUnwTEveyKE32KyAK+7IYThqT0V88/o+cPBz7TVPLEJdb2d00y+pv4elHHTEgwUigWYaq3O6LXn56/e2IeBDT+7olWf4rfHzEOAurfH9HpT/H7J6ZBQP37Jxr9Kf5w+IMAt9PKQOB6NurfP4Prjyg/jX9Y8JnDAHE/vQwE/m0MQOrfP4PqX/3jp15Dj4kQQspCK5SK7OZDCCGEEBIfbneH4kgCoT9vLCQJguqPaD8CDdXzlZDogaEuFotgKSLL9uBnYmAJiZqg+vupPlzbJSR6YKSh8sSODVyTI5j+LO9NlxDFIqzzSJfW+jPPnz4Ng+DDGRvqnz5t9GeePxNsEHx2+U798+BY/e3FzPNnwLE6Uv88oI6EEEIIIYQQQgghhBBCCCGEEEIIIYQQQkiRoHyQxz/T51gdqX8evKfjlzdeNHp4eFjp15OTk5N/hCQHjoFWOt7o139VOj5/8HXUPwOO1f+/02ApXEhJmmnTzIP6p49r28wlRFMJMgwhmnlQ/3RB854g/RwaBgF7wkVOyGYe1D9N0L4vWDMXGwTaFHIsJGpgpF5TyIm0hPqnR6XTdLPZrF2oZi7aVIDePxFgqCH1ov6EEEIIITHRtl7jixBCkuToPH8ocGMQrihmiqh/8Jnjau6hrwen/sPQOs8fAgxA5on7xxcfBigDQf2HIUSdR6g3wmKRnolGfKH+QxCT/vaGOAh6Ijrxhfr3SYz613AQdE+04gv174Ng5b1dwUHQHTEbv0H9u6X6PGeTySTu69oaBsFYSCui9/we1L87tBpzFv1naoPg8vISA2AqpBX4DPFZxm78BvUn9awF8R07yrRGPf80pdmU+hNCyJHoYa4ZHSghhWEBXwT84ASEEFIGDdmec8mJ6j+EyNAiu/9YACC+fjaXkinU/21SSPW2BuIzT/waX/yKpWQK9W+mCOMHLBZ5TfbLPg/q/5pijN/gINhTnPhC/X1cwAauScFBUKbxG9R/h9P7F0rTv6bkQVCy8Rt0Aju00OtUSqTEQZBSbX/X0AmQF4Mg5wi4cRAJn0jhlKY/aUBrx5c558ANzYUvafx7StAfqxv0UKyer4QQUg5+zAfXdgkhpAxKqvMghHgUm+cPhdufhU/Oa+qRTp6Jb0HK+oOi8/whcC+74SSTIrJlH7vitCMl/RHcqx4I8uHN/u19v9w8f1swi6aWJ+aeLxyp6F+9r2u8v/F47M7Oztzt7S3e61xIe1IqFmGFX3hi19/tLuesjX+73brFYlG/V3xdQlq7F1JwAjT+7ohVfzX+Ma5ngwPwn+EI1AmMhLQnZidA4++e2PTHsh8Gvl6vna0AsPzXy1Ld+fm5OQDu/0MRoxOg8fdHLPoj4Gd7flv6w/DxvtDLD9+7urrC+7sTEhZ/EOB2WhkYE57G3w8x6I9oP2Z7GD4es9nM3dzc1DM/lv46FpZc/ncEBgEMD7XVMjB4DxiINP7+GEp/t7/voF7uI0WJ2R4OAM93d3f4I7TzPhNCSD5Yqm86ndbLfTzm87nt8+ulP2Z/x+vQCMkL7Pktwo/Z3oJ9MH6LA+ief/AVKSEkILbdgJHr3v4ez74T0FUA9/wxgP1XF0Lozx0LiZqQ+uuefwEDh8Fj+a+lvrfmBJSxkOGBEF4UNliKyFJ9usdjgCdSQupve37s7RHhb3ICOvPzfH8swDhD54kb8vwjIVESSn+/ug91/SjqQcT/wAlgNhiz0CcyQhaLsMgnPULoX73m0nL7fnnvw8ND7QT0sA+LfGKlYRB82ks7NnNIlmP1d/sjvVtsJTDbm/HXG/3x2OmfTznzR44NgmOX7Y7NHJLms/q7gyO9MPqLi4t6+b9cLustgKb6eMw3FdwfmjFggKg3X71l4I7NHJLmHf3PVPs5/o7l9H///r214p7a2udzv8hn5RgDShsN3Czg1SE4lom6xKO4heB2rdnvYdi6QljgGbO9BvfgOLa65Ac3+hpOBinjtHkDhMdv/Qe+p45gTkeQL7bUtwIeaK5OoJ4MdKZHlG9lDkBIPsDzQ/QmJ3B6emopHqwB2corQzDDX19fOzvNh7GAr+EE/CO9eHDPnxH+0t8/ugnBpWE1QOHzwpbvurxfwbibnEA9/VdpPh7pzQjs3yyfK2rkMHxzBAj0+I6ADiAvdFsHLvT37zkBGP5YSB6YA2ha9lvrJiz9hQ4gO7CVswo+jfH80QlgMqD2GaKC35unF88JYCtAB5AnGvi9h6F7GZ9GJ2CZP0b7M8XSO4eZADqAvLHIPxzAW07AjvpKYfxPCkBngevn5+fVr1+/TqtAoFQDQUieuF2RD1J5SOyP1+v15c+fP6Vy9HJxcSHfv3+X6nsIAF2cnJysq5d8r1YAP/EshVGEA6iYVkZ/+e3bN5nNZu/+5a9fv+LpXyHJocG72x8/fpxXDv+2+vocDr+K9cDp31UrvYcDJ3AOJ1A9bqrHs5D80BlhZdF+f8lvhz3we68QZMX0T3pglWcHd6Cjdeyx/L6W+M6s6EdP9c2ElIHbneJaWStnFIRoTOBe94D4eiokSZyW72oxl/MLfvA1jB6642CPpoCXDPhljO79RwffG6kj2OrzqT5e1Xo3vZ7EC2K7B0073GGaD9/XmX/1nvFT/4Rx2syjbT+AIW+gIZ/D7ao9b//kBDQ4ePkB46f+qeICtPFy2g8gpavJSwZpW8zw1sWnyQl8Zs9P/RPFBWzj5RK6mrxkTCfb/1uu/9AJfHbPT/0Tw3XQxqthELArcETocn5lffvtXL/vBNr08KP+CQFxvLbQEwmEDQJe/RQXTi/tsBp+O/AFEOn3Un9z1yLaT/0TQgNBwb20Zg/o/SPBsjkwShh7vb5fLq2M22/wEqS8V/+9sRBChsXtuvfWxo1f7EQnHpj1se/XZh5s3U1ITrhdfX+91LdZ3io73b7JqwX8RkIIyQPs5THLY6kPYPjmCLw8/0hI3iAd8/j4uN1sNisZGLwH/3gpCYcfuHPeFd0wdtv3myPwWnf32suR+veMn+fHBy8DA0fEPHF4NOhmS/r6kA/2+tbCHZd2aMAP38D6/8ENUNtP/XvERXhXn2OxSCcggId9vRXx4LNF12avdfsLJyADQf17IkbjNzgIwoOUK27p8Sv58Nl6vf1qJ6DL/kE7+VD/jonZ+A0OgvB8wAngbH8UN/ZQ/45IwfgNDoLwvOUEtLw3qr6N1D8wiOimYvxGwyAYC2lFkxNAjCCGmf8Q6h8QRHeR7knF+A0bBJqqmgr5NO6gGYc5gTYHe/qC+gfC7bv3jCUx3K5ibepYmPJp3BvNXNyut+M0xpn/EOpPyBG4AM1cCCEJkmLMhxASiKenp3saf4Fg2Vc9FsjpSuZo3hr/115r1lMAe+bNZrPO2fip/wH+nq9iKZkD8ZknLhfq79EQ8MneK7JYpGyov5JShV9oOAjKvnSjeP1LNn6j5EHgWl7akgPF6k/j31PiIGCef09x+jPP+5qSBgGd/2uKcgIHEdCJkBp/EOSaCaHxv00J+tdoDnRJ8V+jtePLHGshaPzvk7P+pGC47SOkYCqDn6FvH42fkAJxuyPdaN01FlIGbnc/37TkFE8o3L4nAmvHCyQ5/S3gw24oYXAvuyKxbLgwktK/xNr+rsFqKpU8sa78Zlz5hSMZ/Znq6Y4UikVMf72oYyYkGNHrT+PvnpgHAVd+3ROt/jT+/ohxEFD//ohOf4rfPzENAurfP1E5AVzPRPH7xx8EuJ1WBoDGPxyH+ruhjlTjbnR9AxMhvYLPHA4YGkjPIMpP4x+WIfUnhYMZx2voMRFCSFlohVqR3XwIIaQc3O5OtrGQJFC9RkKKRCsyRxICi/YuFgvs986ERA3Eh1ahUkT4GQg0Vc9XQqInqP6ODRyTA046VJ7Y1x/XdgmJnmD6M8+bLiGKRVjemy6t9WeeN30aBsGHI/bUP33a6M88bybYIPjs9o3658Gx+tuLmefNgGN1pP55QB0JIYQQQgghhBBCCJGy+T9ftRg+rVNPfAAAAABJRU5ErkJggg==');
 `;
-/**
- * @hidden
- */
-const bannerStyles = {
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    position: 'fixed',
-    top: '16px',
-    right: '16px',
-    padding: '12px',
-    borderRadius: '4px',
-    boxShadow: '0px 4px 5px 0px rgba(0, 0, 0, 0.04), 0px 2px 4px 0px rgba(0, 0, 0, 0.03)',
-    fontSize: '14px',
-    fontWeight: 400,
-    lineHeight: '20px',
-    backgroundColor: '#FFC000',
-    color: '#1E1E1E',
-    zIndex: 20000
-};
-/**
- * @hidden
- */
-const buttonStyles = {
-    display: 'inline-flex',
-    position: 'relative',
-    border: 'none',
-    borderRadius: '4px',
-    padding: '5px',
-    backgroundColor: 'transparent',
-    transition: 'color 0.2s ease-in-out',
-    outline: 'none',
-    cursor: 'pointer'
-};
 /**
  * @hidden
  */
@@ -1095,19 +1061,45 @@ let bannerPresentOnPage = false;
  * @hidden
  */
 class WatermarkOverlayComponent {
-    watermarkStyle = watermarkStyles;
     licenseMessage;
     banner;
+    watermarkStyle = watermarkStyles;
     isOpen = true;
+    isMobile = false;
+    isNarrow = false;
+    isCloseHovered = false;
     bannerMounted = false;
-    bannerStyles = bannerStyles;
-    buttonStyles = buttonStyles;
+    get messages() {
+        return [
+            this.primaryMessage, ...this.extraMessages
+        ];
+    }
+    extraMessages = [];
+    get primaryMessage() {
+        return this.licenseMessage || {
+            severity: 'ERROR',
+            productName: '',
+            code: '',
+            message: '',
+            notificationTitle: 'License key missing for Kendo UI for Angular.',
+            notificationBody: `We couldn't verify your <a href="${this.licenseKeyUrl}">license key</a> for Kendo UI for Angular.` +
+                `Please see the browser console for details and resolution steps.`
+        };
+    }
     licenseKeyUrl = licenseKeyUrl;
+    unsubscribeLicenseMessage = () => {
+        /* noop */
+    };
+    unsubscribeResize = () => {
+        /* noop */
+    };
     ngOnInit() {
-        if (!bannerPresentOnPage) {
-            this.bannerMounted = true;
-            bannerPresentOnPage = true;
+        if (bannerPresentOnPage || !this.licenseMessage) {
+            return;
         }
+        this.subscribeLicenseMessage();
+        this.subscribeResize();
+        bannerPresentOnPage = true;
     }
     ngAfterViewInit() {
         if (this.isBannerRendered) {
@@ -1115,6 +1107,8 @@ class WatermarkOverlayComponent {
         }
     }
     ngOnDestroy() {
+        this.unsubscribeLicenseMessage();
+        this.unsubscribeResize();
         if (this.isBannerRendered) {
             document.body.removeChild(this.banner.nativeElement);
         }
@@ -1125,77 +1119,318 @@ class WatermarkOverlayComponent {
     get isBannerRendered() {
         return isDocumentAvailable() && !!this.banner?.nativeElement;
     }
+    subscribeLicenseMessage() {
+        this.unsubscribeLicenseMessage = registerLicenseMessage(this.licenseMessage, 'KENDOUIANGULAR', ({ message }) => {
+            // Add messages from other suites
+            this.extraMessages.push(message);
+        }, () => {
+            // Show our own message dialog
+            this.bannerMounted = true;
+        });
+    }
+    subscribeResize() {
+        const handleResize = () => {
+            this.isMobile = window.innerWidth < 500;
+            this.isNarrow = window.innerWidth < 768;
+        };
+        window.addEventListener('resize', handleResize);
+        this.unsubscribeResize = () => window.removeEventListener('resize', handleResize);
+    }
+    // Used in tests to reset the static presence check flag
+    resetPresenceCheck() {
+        bannerPresentOnPage = false;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: WatermarkOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.18", type: WatermarkOverlayComponent, isStandalone: true, selector: "div[kendoWatermarkOverlay]", inputs: { licenseMessage: "licenseMessage" }, host: { properties: { "style": "this.watermarkStyle" } }, viewQueries: [{ propertyName: "banner", first: true, predicate: ["banner"], descendants: true }], ngImport: i0, template: `
-        @if (isOpen && bannerMounted) {
-          <div #banner [ngStyle]="bannerStyles">
-            <span [ngStyle]="{ display: 'flex', alignSelf: 'center', marginRight: '8px' }">
-              <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
-                <path fill-rule="evenodd" clip-rule="evenodd" d="M8 1L0 15H16L8 1ZM7 6V11H9V6H7ZM7 14V12H9V14H7Z" fill="#1E1E1E"/>
-              </svg>
-            </span>
-            @if (licenseMessage) {
-              <span [innerHtml]="licenseMessage"></span>
-            }
-            @if (!licenseMessage) {
-              <span>
-                We couldn't verify your <a [href]="licenseKeyUrl">license key</a> for Kendo UI for Angular. Please see the browser
-                console for details and resolution steps.
-              </span>
-            }
-            <div [ngStyle]="{ display: 'flex', alignItems: 'center', marginLeft: '24px' }">
-              <button title='Close' [ngStyle]="buttonStyles" (click)="closeBanner()">
-                <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
-                  <path d="M13 4.41562L9.41563 8L13 11.5844L11.5844 13L8 9.41563L4.41562 13L3 11.5844L6.58437 8L3 4.41562L4.41562 3L8 6.58437L11.5844 3L13 4.41562Z" fill="#1E1E1E"/>
+        <ng-template #buttonTemplate>
+            <button [ngStyle]="{
+                backgroundColor: isCloseHovered ? '#3d3d3d14' : 'transparent',
+                border: 'none',
+                borderRadius: '4px',
+                cursor: 'pointer',
+                display: 'flex',
+                padding: '4px',
+                position: isMobile ? 'absolute' : 'static',
+                top: isMobile ? '12px' : 'auto',
+                right: isMobile ? '12px' : 'auto',
+            }"
+            title="Close" (click)="closeBanner()" (mouseenter)="isCloseHovered = true" (mouseleave)="isCloseHovered = false">
+                <svg width="20" height="20" viewBox="0 0 16 16" fill="none">
+                    <path
+                        d="M11.9309 3.1838C12.1754 2.93933 12.5712 2.93937 12.8157 3.1838C13.0601 3.4283 13.0601 3.82407 12.8157 4.06857L8.885 7.99923L12.8166 11.9309C13.0611 12.1754 13.0611 12.5721 12.8166 12.8166C12.5721 13.0611 12.1754 13.0611 11.9309 12.8166L7.99925 8.88497L4.06859 12.8166C3.8241 13.0611 3.42732 13.0611 3.18285 12.8166C2.93862 12.5721 2.93851 12.1753 3.18285 11.9309L7.11449 7.99923L3.18382 4.06857C2.93947 3.82413 2.93955 3.42829 3.18382 3.1838C3.42831 2.9393 3.82508 2.9393 4.06957 3.1838L7.99925 7.11349L11.9309 3.1838Z"
+                        fill="#212529"
+                    />
                 </svg>
-              </button>
+            </button>
+        </ng-template>
+        @if (isOpen && bannerMounted) {
+            <div #banner [ngStyle]="{
+                position: 'fixed',
+                top: isNarrow ? '0' : '16px',
+                left: '50%',
+                transform: 'translateX(-50%)',
+                display: 'flex',
+                flexDirection: isMobile ? 'column' : 'row',
+                justifyContent: 'center',
+                alignItems: isMobile ? 'flex-start' : 'center',
+                borderRadius: isNarrow ? '0' : '6px',
+                borderLeft: '6px solid #FFC000',
+                borderTop: '1px solid #00000029',
+                borderRight: '1px solid #00000029',
+                borderBottom: '1px solid #00000029',
+                boxSizing: 'border-box',
+                fontSize: '14px',
+                lineHeight: '20px',
+                color: '#1E1E1E',
+                zIndex: 2000,
+                boxShadow: '0px 4px 5px 0px #0000000A, 0px 2px 4px 0px #00000008',
+                maxWidth: isNarrow ? 'none' : '768px',
+                width: '100%',
+                backgroundColor: '#fff',
+                padding: isMobile ? '12px' : '0',
+            }">
+                @if (isMobile) {
+                    <ng-container *ngTemplateOutlet="buttonTemplate"></ng-container>
+                }
+                <span [ngStyle]="{
+                        display: 'flex',
+                        alignSelf: isMobile ? 'flex-start' : 'center',
+                        padding: isMobile ? '0 0 12px 0' : '9px 12px',
+                    }">
+                    <svg
+                        width="32"
+                        height="32"
+                        viewBox="0 0 32 32"
+                        fill="none"
+                        xmlns="http://www.w3.org/2000/svg"
+                    >
+                        <path
+                            fillRule="evenodd"
+                            clipRule="evenodd"
+                            d="M22.702 2.1821C24.3149 2.51082 25.8077 3.27291 27.0199 4.38645C28.2321 5.49999 29.1179 6.92286 29.582 8.5021C30.012 9.9501 30.076 11.4821 29.768 12.9621C29.3228 14.9898 28.2025 16.8063 26.5904 18.1143C24.9783 19.4223 22.9699 20.1443 20.894 20.1621C20.018 20.1621 19.146 20.0361 18.308 19.7821L16.708 21.6581L15.95 22.0081H14V25.0081L13 26.0081H10V29.0081L9 30.0081H3L2 29.0081V24.3941L2.292 23.6881L12.24 13.7401C11.9577 12.8308 11.8226 11.8821 11.84 10.9301C11.8582 9.59817 12.1701 8.28666 12.7533 7.08907C13.3365 5.89147 14.1767 4.83728 15.214 4.00164C16.2514 3.166 17.4603 2.56949 18.7546 2.25464C20.0489 1.93978 21.3967 1.91633 22.702 2.1821ZM25.338 16.5821C26.5944 15.5647 27.4681 14.1509 27.816 12.5721L27.824 12.5821C28.0718 11.4277 28.0272 10.2297 27.6943 9.09691C27.3614 7.96412 26.7507 6.93248 25.9177 6.09572C25.0847 5.25896 24.0558 4.64361 22.9246 4.30557C21.7933 3.96753 20.5955 3.91753 19.44 4.1601C17.8816 4.506 16.4837 5.36334 15.4688 6.59561C14.454 7.82789 13.8806 9.36426 13.84 10.9601C13.82 11.8721 13.98 12.7761 14.318 13.6201L14.098 14.7061L4 24.8081V28.0081H8V25.0081L9 24.0081H12V21.0081L13 20.0081H15.49L17.242 17.9761L18.364 17.6961C19.1728 18.0121 20.0337 18.1736 20.902 18.1721C22.5181 18.1597 24.082 17.5991 25.338 16.5821ZM23.662 11.1181C23.8197 10.9002 23.9318 10.6527 23.9916 10.3905C24.0515 10.1283 24.0578 9.85665 24.0103 9.59192C23.9627 9.32718 23.8622 9.07476 23.7148 8.84975C23.5675 8.62474 23.3762 8.43177 23.1526 8.28238C22.9289 8.133 22.6774 8.03026 22.4131 7.98033C22.1488 7.93039 21.8771 7.93428 21.6144 7.99176C21.3516 8.04925 21.1031 8.15914 20.8838 8.31487C20.6645 8.4706 20.4789 8.66896 20.338 8.8981C20.067 9.33887 19.9774 9.86752 20.088 10.373C20.1985 10.8784 20.5007 11.3214 20.931 11.6087C21.3613 11.8961 21.8862 12.0055 22.3954 11.914C22.9047 11.8226 23.3587 11.5373 23.662 11.1181Z"
+                            fill="black"
+                        />
+                        <path
+                            d="M23.1299 16.0186L31.1387 31.0273L31.0068 31.25H14.9932L14.8604 31.0273L22.8955 16.0186H23.1299Z"
+                            fill="#FFC000"
+                            stroke="black"
+                            strokeWidth="1.5"
+                        />
+                        <rect x="22.25" y="21.2686" width="1.5" height="5" rx="0.75" fill="black" />
+                        <path
+                            d="M24 28.2686C24 27.7163 23.5523 27.2686 23 27.2686C22.4479 27.2687 22 27.7164 22 28.2686C22 28.8207 22.4479 29.2684 23 29.2686C23.5523 29.2686 24 28.8208 24 28.2686Z"
+                            fill="black"
+                        />
+                    </svg>
+                </span>
+                <div [ngStyle]="{
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: '12px',
+                        padding: isMobile ? '0 0 12px 0' : '12px',
+                        flex: isMobile ? 'none' : '1'}">
+                    @for (msg of messages; track msg.message) {
+                        <div [ngStyle]="{
+                            display: 'flex',
+                            flexDirection: 'column',
+                            gap: '4px',
+                            flex: isMobile ? 'none' : '1'}">
+                        @if (msg.notificationTitle) {
+                            <span
+                                [ngStyle]="{
+                                fontFamily: 'system-ui, sans-serif',
+                                fontWeight: 700,
+                                fontSize: '14px',
+                                lineHeight: '142%'}"
+                            >
+                                {{ msg.notificationTitle }}
+                            </span>
+                        }
+                        <span
+                            [ngStyle]="{
+                            fontFamily: 'system-ui, sans-serif',
+                            fontSize: '14px',
+                            lineHeight: '20px',
+                            }"
+                            [innerHTML]="msg.notificationBody || msg.notificationMessage"
+                        >
+                        </span>
+                        </div>
+                    }
+                </div>
+                @if (!isMobile) {
+                    <div
+                        [ngStyle]="{
+                            display: 'flex',
+                            alignItems: 'center',
+                            padding: isMobile ? '0' : '9px 12px',
+                            gap: '16px',
+                            marginLeft: isMobile ? '0' : 'auto',
+                            width: isMobile ? '100%' : 'auto',
+                        }"
+                    >
+                        <ng-container *ngTemplateOutlet="buttonTemplate"></ng-container>
+                    </div>
+                }
             </div>
-          </div>
         }
-        `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: WatermarkOverlayComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'div[kendoWatermarkOverlay]',
                     template: `
-        @if (isOpen && bannerMounted) {
-          <div #banner [ngStyle]="bannerStyles">
-            <span [ngStyle]="{ display: 'flex', alignSelf: 'center', marginRight: '8px' }">
-              <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
-                <path fill-rule="evenodd" clip-rule="evenodd" d="M8 1L0 15H16L8 1ZM7 6V11H9V6H7ZM7 14V12H9V14H7Z" fill="#1E1E1E"/>
-              </svg>
-            </span>
-            @if (licenseMessage) {
-              <span [innerHtml]="licenseMessage"></span>
-            }
-            @if (!licenseMessage) {
-              <span>
-                We couldn't verify your <a [href]="licenseKeyUrl">license key</a> for Kendo UI for Angular. Please see the browser
-                console for details and resolution steps.
-              </span>
-            }
-            <div [ngStyle]="{ display: 'flex', alignItems: 'center', marginLeft: '24px' }">
-              <button title='Close' [ngStyle]="buttonStyles" (click)="closeBanner()">
-                <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
-                  <path d="M13 4.41562L9.41563 8L13 11.5844L11.5844 13L8 9.41563L4.41562 13L3 11.5844L6.58437 8L3 4.41562L4.41562 3L8 6.58437L11.5844 3L13 4.41562Z" fill="#1E1E1E"/>
+        <ng-template #buttonTemplate>
+            <button [ngStyle]="{
+                backgroundColor: isCloseHovered ? '#3d3d3d14' : 'transparent',
+                border: 'none',
+                borderRadius: '4px',
+                cursor: 'pointer',
+                display: 'flex',
+                padding: '4px',
+                position: isMobile ? 'absolute' : 'static',
+                top: isMobile ? '12px' : 'auto',
+                right: isMobile ? '12px' : 'auto',
+            }"
+            title="Close" (click)="closeBanner()" (mouseenter)="isCloseHovered = true" (mouseleave)="isCloseHovered = false">
+                <svg width="20" height="20" viewBox="0 0 16 16" fill="none">
+                    <path
+                        d="M11.9309 3.1838C12.1754 2.93933 12.5712 2.93937 12.8157 3.1838C13.0601 3.4283 13.0601 3.82407 12.8157 4.06857L8.885 7.99923L12.8166 11.9309C13.0611 12.1754 13.0611 12.5721 12.8166 12.8166C12.5721 13.0611 12.1754 13.0611 11.9309 12.8166L7.99925 8.88497L4.06859 12.8166C3.8241 13.0611 3.42732 13.0611 3.18285 12.8166C2.93862 12.5721 2.93851 12.1753 3.18285 11.9309L7.11449 7.99923L3.18382 4.06857C2.93947 3.82413 2.93955 3.42829 3.18382 3.1838C3.42831 2.9393 3.82508 2.9393 4.06957 3.1838L7.99925 7.11349L11.9309 3.1838Z"
+                        fill="#212529"
+                    />
                 </svg>
-              </button>
+            </button>
+        </ng-template>
+        @if (isOpen && bannerMounted) {
+            <div #banner [ngStyle]="{
+                position: 'fixed',
+                top: isNarrow ? '0' : '16px',
+                left: '50%',
+                transform: 'translateX(-50%)',
+                display: 'flex',
+                flexDirection: isMobile ? 'column' : 'row',
+                justifyContent: 'center',
+                alignItems: isMobile ? 'flex-start' : 'center',
+                borderRadius: isNarrow ? '0' : '6px',
+                borderLeft: '6px solid #FFC000',
+                borderTop: '1px solid #00000029',
+                borderRight: '1px solid #00000029',
+                borderBottom: '1px solid #00000029',
+                boxSizing: 'border-box',
+                fontSize: '14px',
+                lineHeight: '20px',
+                color: '#1E1E1E',
+                zIndex: 2000,
+                boxShadow: '0px 4px 5px 0px #0000000A, 0px 2px 4px 0px #00000008',
+                maxWidth: isNarrow ? 'none' : '768px',
+                width: '100%',
+                backgroundColor: '#fff',
+                padding: isMobile ? '12px' : '0',
+            }">
+                @if (isMobile) {
+                    <ng-container *ngTemplateOutlet="buttonTemplate"></ng-container>
+                }
+                <span [ngStyle]="{
+                        display: 'flex',
+                        alignSelf: isMobile ? 'flex-start' : 'center',
+                        padding: isMobile ? '0 0 12px 0' : '9px 12px',
+                    }">
+                    <svg
+                        width="32"
+                        height="32"
+                        viewBox="0 0 32 32"
+                        fill="none"
+                        xmlns="http://www.w3.org/2000/svg"
+                    >
+                        <path
+                            fillRule="evenodd"
+                            clipRule="evenodd"
+                            d="M22.702 2.1821C24.3149 2.51082 25.8077 3.27291 27.0199 4.38645C28.2321 5.49999 29.1179 6.92286 29.582 8.5021C30.012 9.9501 30.076 11.4821 29.768 12.9621C29.3228 14.9898 28.2025 16.8063 26.5904 18.1143C24.9783 19.4223 22.9699 20.1443 20.894 20.1621C20.018 20.1621 19.146 20.0361 18.308 19.7821L16.708 21.6581L15.95 22.0081H14V25.0081L13 26.0081H10V29.0081L9 30.0081H3L2 29.0081V24.3941L2.292 23.6881L12.24 13.7401C11.9577 12.8308 11.8226 11.8821 11.84 10.9301C11.8582 9.59817 12.1701 8.28666 12.7533 7.08907C13.3365 5.89147 14.1767 4.83728 15.214 4.00164C16.2514 3.166 17.4603 2.56949 18.7546 2.25464C20.0489 1.93978 21.3967 1.91633 22.702 2.1821ZM25.338 16.5821C26.5944 15.5647 27.4681 14.1509 27.816 12.5721L27.824 12.5821C28.0718 11.4277 28.0272 10.2297 27.6943 9.09691C27.3614 7.96412 26.7507 6.93248 25.9177 6.09572C25.0847 5.25896 24.0558 4.64361 22.9246 4.30557C21.7933 3.96753 20.5955 3.91753 19.44 4.1601C17.8816 4.506 16.4837 5.36334 15.4688 6.59561C14.454 7.82789 13.8806 9.36426 13.84 10.9601C13.82 11.8721 13.98 12.7761 14.318 13.6201L14.098 14.7061L4 24.8081V28.0081H8V25.0081L9 24.0081H12V21.0081L13 20.0081H15.49L17.242 17.9761L18.364 17.6961C19.1728 18.0121 20.0337 18.1736 20.902 18.1721C22.5181 18.1597 24.082 17.5991 25.338 16.5821ZM23.662 11.1181C23.8197 10.9002 23.9318 10.6527 23.9916 10.3905C24.0515 10.1283 24.0578 9.85665 24.0103 9.59192C23.9627 9.32718 23.8622 9.07476 23.7148 8.84975C23.5675 8.62474 23.3762 8.43177 23.1526 8.28238C22.9289 8.133 22.6774 8.03026 22.4131 7.98033C22.1488 7.93039 21.8771 7.93428 21.6144 7.99176C21.3516 8.04925 21.1031 8.15914 20.8838 8.31487C20.6645 8.4706 20.4789 8.66896 20.338 8.8981C20.067 9.33887 19.9774 9.86752 20.088 10.373C20.1985 10.8784 20.5007 11.3214 20.931 11.6087C21.3613 11.8961 21.8862 12.0055 22.3954 11.914C22.9047 11.8226 23.3587 11.5373 23.662 11.1181Z"
+                            fill="black"
+                        />
+                        <path
+                            d="M23.1299 16.0186L31.1387 31.0273L31.0068 31.25H14.9932L14.8604 31.0273L22.8955 16.0186H23.1299Z"
+                            fill="#FFC000"
+                            stroke="black"
+                            strokeWidth="1.5"
+                        />
+                        <rect x="22.25" y="21.2686" width="1.5" height="5" rx="0.75" fill="black" />
+                        <path
+                            d="M24 28.2686C24 27.7163 23.5523 27.2686 23 27.2686C22.4479 27.2687 22 27.7164 22 28.2686C22 28.8207 22.4479 29.2684 23 29.2686C23.5523 29.2686 24 28.8208 24 28.2686Z"
+                            fill="black"
+                        />
+                    </svg>
+                </span>
+                <div [ngStyle]="{
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: '12px',
+                        padding: isMobile ? '0 0 12px 0' : '12px',
+                        flex: isMobile ? 'none' : '1'}">
+                    @for (msg of messages; track msg.message) {
+                        <div [ngStyle]="{
+                            display: 'flex',
+                            flexDirection: 'column',
+                            gap: '4px',
+                            flex: isMobile ? 'none' : '1'}">
+                        @if (msg.notificationTitle) {
+                            <span
+                                [ngStyle]="{
+                                fontFamily: 'system-ui, sans-serif',
+                                fontWeight: 700,
+                                fontSize: '14px',
+                                lineHeight: '142%'}"
+                            >
+                                {{ msg.notificationTitle }}
+                            </span>
+                        }
+                        <span
+                            [ngStyle]="{
+                            fontFamily: 'system-ui, sans-serif',
+                            fontSize: '14px',
+                            lineHeight: '20px',
+                            }"
+                            [innerHTML]="msg.notificationBody || msg.notificationMessage"
+                        >
+                        </span>
+                        </div>
+                    }
+                </div>
+                @if (!isMobile) {
+                    <div
+                        [ngStyle]="{
+                            display: 'flex',
+                            alignItems: 'center',
+                            padding: isMobile ? '0' : '9px 12px',
+                            gap: '16px',
+                            marginLeft: isMobile ? '0' : 'auto',
+                            width: isMobile ? '100%' : 'auto',
+                        }"
+                    >
+                        <ng-container *ngTemplateOutlet="buttonTemplate"></ng-container>
+                    </div>
+                }
             </div>
-          </div>
         }
-        `,
+    `,
                     standalone: true,
-                    imports: [NgStyle]
+                    imports: [NgStyle, NgTemplateOutlet]
                 }]
-        }], propDecorators: { watermarkStyle: [{
-                type: HostBinding,
-                args: ['style']
-            }], licenseMessage: [{
+        }], propDecorators: { licenseMessage: [{
                 type: Input
             }], banner: [{
                 type: ViewChild,
                 args: ['banner']
+            }], watermarkStyle: [{
+                type: HostBinding,
+                args: ['style']
             }] } });
 const allowed = ['telerik.com', 'progress.com', 'stackblitz.io', 'csb.app'];
@@ -1212,8 +1447,8 @@ function shouldShowValidationUI(isPackageValid) {
  * Returns the notification message to display, if any.
  */
 function getLicenseMessage(meta) {
-    const message = getLicenseStatus(meta).message;
-    return message?.notificationMessage;
+    const status = getLicenseStatus(meta);
+    return status?.message;
 }
 /**

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-common",
-  "version": "22.1.0-develop.7",
+  "version": "22.1.0-develop.9",
   "description": "Kendo UI for Angular - Utility Package",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -23,7 +23,7 @@
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-draggable": "^3.0.2",
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "22.1.0-develop.7"
+    "@progress/kendo-angular-schematics": "22.1.0-develop.9"
   },
   "publishConfig": {
     "access": "public"

package/watermark/utils.d.ts CHANGED Viewed

@@ -6,40 +6,6 @@
  * @hidden
  */
 export declare const watermarkStyles = "\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    opacity: 0.2;\n    zIndex: 101;\n    pointerEvents: none;\n    backgroundImage: url('data:image/png;base64,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');\n";
-/**
- * @hidden
- */
-export declare const bannerStyles: {
-    display: string;
-    justifyContent: string;
-    alignItems: string;
-    position: string;
-    top: string;
-    right: string;
-    padding: string;
-    borderRadius: string;
-    boxShadow: string;
-    fontSize: string;
-    fontWeight: number;
-    lineHeight: string;
-    backgroundColor: string;
-    color: string;
-    zIndex: number;
-};
-/**
- * @hidden
- */
-export declare const buttonStyles: {
-    display: string;
-    position: string;
-    border: string;
-    borderRadius: string;
-    padding: string;
-    backgroundColor: string;
-    transition: string;
-    outline: string;
-    cursor: string;
-};
 /**
  * @hidden
  */

package/watermark/validation.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { PackageMetadata } from "@progress/kendo-licensing";
+import { LicenseMessage, PackageMetadata } from "@progress/kendo-licensing";
 /**
  * @hidden
  */
@@ -12,4 +12,4 @@ export declare function shouldShowValidationUI(isPackageValid: boolean): boolean
  *
  * Returns the notification message to display, if any.
  */
-export declare function getLicenseMessage(meta: PackageMetadata): string | undefined;
+export declare function getLicenseMessage(meta: PackageMetadata): LicenseMessage | undefined;

package/watermark/watermark.component.d.ts CHANGED Viewed

@@ -3,50 +3,34 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { AfterViewInit, ElementRef, OnDestroy, OnInit } from '@angular/core';
+import { LicenseMessage } from '@progress/kendo-licensing';
 import * as i0 from "@angular/core";
 /**
  * @hidden
  */
 export declare class WatermarkOverlayComponent implements OnInit, AfterViewInit, OnDestroy {
-    watermarkStyle: string;
-    licenseMessage?: string;
+    licenseMessage?: LicenseMessage;
     banner: ElementRef;
+    watermarkStyle: string;
     isOpen: boolean;
+    isMobile: boolean;
+    isNarrow: boolean;
+    isCloseHovered: boolean;
     bannerMounted: boolean;
-    bannerStyles: {
-        display: string;
-        justifyContent: string;
-        alignItems: string;
-        position: string;
-        top: string;
-        right: string;
-        padding: string;
-        borderRadius: string;
-        boxShadow: string;
-        fontSize: string;
-        fontWeight: number;
-        lineHeight: string;
-        backgroundColor: string;
-        color: string;
-        zIndex: number;
-    };
-    buttonStyles: {
-        display: string;
-        position: string;
-        border: string;
-        borderRadius: string;
-        padding: string;
-        backgroundColor: string;
-        transition: string;
-        outline: string;
-        cursor: string;
-    };
+    get messages(): LicenseMessage[];
+    extraMessages: LicenseMessage[];
+    get primaryMessage(): LicenseMessage;
     licenseKeyUrl: string;
+    private unsubscribeLicenseMessage;
+    private unsubscribeResize;
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     closeBanner(): void;
     get isBannerRendered(): boolean;
+    private subscribeLicenseMessage;
+    private subscribeResize;
+    resetPresenceCheck(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<WatermarkOverlayComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<WatermarkOverlayComponent, "div[kendoWatermarkOverlay]", never, { "licenseMessage": { "alias": "licenseMessage"; "required": false; }; }, {}, never, never, true, never>;
 }