@natec/mef-dev-ui-kit 16.0.2 → 16.2.0

package/README.md

@@ -1,7 +1,8 @@
 # @natec/mef-dev-ui-kit
 
 ## Description
-This is Ui-kit-lib to create plugins according to the template and visual on the platform [mefdev.com](https://preview.mef.dev/) with the help of ready made solutions.It provides users with the opportunity to explore and test various components and functionalities of the library before using them in their own projects.
+This is Ui-kit-lib to create plugins according to the template and visual on the platform [preview.mef.dev](https://preview.mef.dev/) with the help of ready made solutions.It provides users with the opportunity to explore and test various components and functionalities of the library before using them in their own projects.
+
 How to create your first Ui-package click [here](https://mef.dev/dev_guides/first_ui_plugin.md)
 
 Also you can check displaying of all the elements together here [UI-kit-demo](https://mef.dev/ui_kit_demo).

package/esm2022/lib/markup-kit/card/card/card.component.mjs

@@ -92,12 +92,12 @@ export class CardComponent {
     imgClick() {
         this.router.navigate(['/', this.imgUrl.toString()]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CardComponent, selector: "mefdev-card", inputs: { card_type: "card_type", img: "img", imgUrl: "imgUrl", description: "description" }, queries: [{ propertyName: "card_title", first: true, predicate: ["card_title"], descendants: true }, { propertyName: "card_footer", first: true, predicate: ["card_footer"], descendants: true }], ngImport: i0, template: "\r\n    <pgcard\r\n    MinimalHeader=\"true\"\r\n    TimeOut=\"2500\"\r\n    [Refresh]=\"false\"\r\n    [Close]=\"false\">\r\n\r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title body-1\" [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <div class=\"plugin-type\">\r\n        {{ card_type }}\r\n      </div>\r\n\r\n      <div class=\"row\">\r\n        <div class=\"col-12\">\r\n          <div class=\"m-l-2 card-description\">\r\n            <div *ngIf=\"!description || description == ''\" class=\"card-no-description\"> {{'No plugin description'}}</div>\r\n            <p>\r\n              {{description}}\r\n            </p>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-12 mt-3 text-center card-img\"\r\n        [ngStyle]=\"{'background-color': img ? 'transparent' : '#fff'}\">\r\n          <div *ngIf=\"!img || img == ''\" >\r\n            <img src=\"assets/images/md_icon.png\"\r\n            style=\"max-width: 110px; max-height: 110px;\"/>\r\n          </div>\r\n          <div *ngIf=\"img\" >\r\n            <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n              style=\"max-width: 260px; max-height: 150px;\"\r\n              onclick=\"imgClick()\"\r\n            />\r\n          </div>\r\n\r\n        </div>\r\n      </div>\r\n      <div class=\"row mb-3 mt-3\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </pgcard>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,.plugin-type,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,.card-title span,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,.card-description,.card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-default{background-color:#eaeaea;border-radius:5px}.card-header{height:72px}.card-title{width:70%}.plugin-type{right:20px;top:25px;position:absolute;background-color:#cf0106;border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}.card-description{height:40px;overflow-y:clip;color:#4d4d4d}.card-no-description{overflow-y:clip;height:60px;color:#929292}.card-img{padding:0;height:130px;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.pgCard, selector: "pgcard", inputs: ["Title", "Type", "MinimalHeader", "ProgressType", "ProgressColor", "Refresh", "RefreshColor", "Maximize", "Close", "Toggle", "HeaderClass", "BodyClass", "AdditionalClasses", "Controls", "ShowMessage", "Message", "Loading", "TimeOut", "CardBorderStyle"], outputs: ["onRefresh"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CardComponent, selector: "mefdev-card", inputs: { card_type: "card_type", img: "img", imgUrl: "imgUrl", description: "description" }, queries: [{ propertyName: "card_title", first: true, predicate: ["card_title"], descendants: true }, { propertyName: "card_footer", first: true, predicate: ["card_footer"], descendants: true }], ngImport: i0, template: "\r\n    <pgcard\r\n    MinimalHeader=\"true\"\r\n    TimeOut=\"2500\"\r\n    [Refresh]=\"false\"\r\n    [Close]=\"false\">\r\n\r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title body-1\" [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <div class=\"plugin-type\">\r\n        {{ card_type }}\r\n      </div>\r\n\r\n      <div class=\"row\">\r\n        <div class=\"col-12\">\r\n          <div class=\"m-l-2 card-description\">\r\n            <div *ngIf=\"!description || description == ''\" class=\"card-no-description\"> {{'No plugin description'}}</div>\r\n            <p>\r\n              {{description}}\r\n            </p>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-12 mt-3 text-center card-img\"\r\n        [ngStyle]=\"{'background-color': img ? 'transparent' : '#fff'}\">\r\n          <div *ngIf=\"!img || img == ''\" >\r\n            <img src=\"assets/images/md_icon.png\"\r\n            style=\"max-width: 110px; max-height: 110px;\"/>\r\n          </div>\r\n          <div *ngIf=\"img\" >\r\n            <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n              style=\"max-width: 260px; max-height: 150px;\"\r\n              onclick=\"imgClick()\"\r\n            />\r\n          </div>\r\n\r\n        </div>\r\n      </div>\r\n      <div class=\"row mb-3 mt-3\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </pgcard>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,.plugin-type,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,.card-title span,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,.card-description,.card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-default{background-color:#eaeaea;border-radius:5px}.card-header{height:72px}.card-title{width:70%}.plugin-type{right:20px;top:25px;position:absolute;background-color:#cf0106;border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}.card-description{height:40px;overflow-y:clip;color:#4d4d4d}.card-no-description{overflow-y:clip;height:60px;color:#929292}.card-img{padding:0;height:130px;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.pgCard, selector: "pgcard", inputs: ["Title", "Type", "MinimalHeader", "ProgressType", "ProgressColor", "Refresh", "RefreshColor", "Maximize", "Close", "Toggle", "HeaderClass", "BodyClass", "AdditionalClasses", "Controls", "ShowMessage", "Message", "Loading", "TimeOut", "CardBorderStyle"], outputs: ["onRefresh"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mefdev-card', template: "\r\n    <pgcard\r\n    MinimalHeader=\"true\"\r\n    TimeOut=\"2500\"\r\n    [Refresh]=\"false\"\r\n    [Close]=\"false\">\r\n\r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title body-1\" [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <div class=\"plugin-type\">\r\n        {{ card_type }}\r\n      </div>\r\n\r\n      <div class=\"row\">\r\n        <div class=\"col-12\">\r\n          <div class=\"m-l-2 card-description\">\r\n            <div *ngIf=\"!description || description == ''\" class=\"card-no-description\"> {{'No plugin description'}}</div>\r\n            <p>\r\n              {{description}}\r\n            </p>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-12 mt-3 text-center card-img\"\r\n        [ngStyle]=\"{'background-color': img ? 'transparent' : '#fff'}\">\r\n          <div *ngIf=\"!img || img == ''\" >\r\n            <img src=\"assets/images/md_icon.png\"\r\n            style=\"max-width: 110px; max-height: 110px;\"/>\r\n          </div>\r\n          <div *ngIf=\"img\" >\r\n            <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n              style=\"max-width: 260px; max-height: 150px;\"\r\n              onclick=\"imgClick()\"\r\n            />\r\n          </div>\r\n\r\n        </div>\r\n      </div>\r\n      <div class=\"row mb-3 mt-3\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </pgcard>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,.plugin-type,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,.card-title span,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,.card-description,.card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-default{background-color:#eaeaea;border-radius:5px}.card-header{height:72px}.card-title{width:70%}.plugin-type{right:20px;top:25px;position:absolute;background-color:#cf0106;border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}.card-description{height:40px;overflow-y:clip;color:#4d4d4d}.card-no-description{overflow-y:clip;height:60px;color:#929292}.card-img{padding:0;height:130px;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"] }]
+            args: [{ selector: 'mefdev-card', template: "\r\n    <pgcard\r\n    MinimalHeader=\"true\"\r\n    TimeOut=\"2500\"\r\n    [Refresh]=\"false\"\r\n    [Close]=\"false\">\r\n\r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title body-1\" [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <div class=\"plugin-type\">\r\n        {{ card_type }}\r\n      </div>\r\n\r\n      <div class=\"row\">\r\n        <div class=\"col-12\">\r\n          <div class=\"m-l-2 card-description\">\r\n            <div *ngIf=\"!description || description == ''\" class=\"card-no-description\"> {{'No plugin description'}}</div>\r\n            <p>\r\n              {{description}}\r\n            </p>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-12 mt-3 text-center card-img\"\r\n        [ngStyle]=\"{'background-color': img ? 'transparent' : '#fff'}\">\r\n          <div *ngIf=\"!img || img == ''\" >\r\n            <img src=\"assets/images/md_icon.png\"\r\n            style=\"max-width: 110px; max-height: 110px;\"/>\r\n          </div>\r\n          <div *ngIf=\"img\" >\r\n            <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n              style=\"max-width: 260px; max-height: 150px;\"\r\n              onclick=\"imgClick()\"\r\n            />\r\n          </div>\r\n\r\n        </div>\r\n      </div>\r\n      <div class=\"row mb-3 mt-3\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </pgcard>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,.plugin-type,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,.card-title span,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,.card-description,.card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-default{background-color:#eaeaea;border-radius:5px}.card-header{height:72px}.card-title{width:70%}.plugin-type{right:20px;top:25px;position:absolute;background-color:#cf0106;border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}.card-description{height:40px;overflow-y:clip;color:#4d4d4d}.card-no-description{overflow-y:clip;height:60px;color:#929292}.card-img{padding:0;height:130px;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { card_title: [{
                 type: ContentChild,
                 args: ["card_title"]

package/esm2022/lib/markup-kit/card/card-long/card-long.component.mjs

@@ -137,12 +137,12 @@ export class CardLongComponent {
     imgClick() {
         this.router.navigate(['/', this.imgUrl.toString()]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardLongComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CardLongComponent, selector: "medev-card-long", inputs: { type_text: "type_text", type_color: "type_color", img: "img", imgUrl: "imgUrl", description: "description" }, queries: [{ propertyName: "title", first: true, predicate: ["title"], descendants: true }, { propertyName: "params", first: true, predicate: ["params"], descendants: true }, { propertyName: "second_col", first: true, predicate: ["second_col"], descendants: true }, { propertyName: "third_col", first: true, predicate: ["third_col"], descendants: true }], ngImport: i0, template: "\r\n    <pgcard \r\n    MinimalHeader=\"true\" \r\n    TimeOut=\"2500\" \r\n    [Refresh]=\"false\" \r\n    [Close]=\"false\"\r\n    >\r\n      \r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title\" [ngTemplateOutlet]=\"title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <ng-template #CardExtraControls>\r\n        <div class=\"plugin-type\" \r\n        [ngClass] = \"{\r\n            'b-color-Light-Gray-1': type_color === 'UNSET',\r\n            'b-color-Red': type_color === 'RED',\r\n            'b-color-Green': type_color === 'GREEN'}\">\r\n          {{type_text}}\r\n        </div>\r\n      </ng-template>\r\n\r\n      <div class=\"row h-100 m-b-10\">\r\n        <div class=\"col-lg-3 col-12 card-col\">\r\n          <div class=\"row\">\r\n            <div class=\"col-12 card-img m-b-10\">\r\n              <div *ngIf=\"!img || img == ''\" >\r\n                <img src=\"assets/images/md_icon.png\"\r\n                style=\"max-width: 110px; max-height: 110px;\"/>\r\n              </div>\r\n              <div *ngIf=\"img\">\r\n                <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n                  height=\"110px\" \r\n                  style=\"max-width: 110px; max-height: 110px;\"\r\n                  onclick=\"imgClick()\"\r\n                />\r\n              </div>    \r\n            </div>\r\n            <div class=\"col-12 m-t-2 body-6 text-dark params-block\">\r\n              <ng-template [ngTemplateOutlet]=\"params\"></ng-template> \r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"col-lg-5 col-12 card-col\">\r\n          <ng-template [ngTemplateOutlet]=\"second_col\"></ng-template> \r\n        </div>\r\n        \r\n        <div class=\"col-lg-4 col-12 card-col mt-lg-0 mt-5\">\r\n            <ng-template [ngTemplateOutlet]=\"third_col\"></ng-template> \r\n        </div>  \r\n\r\n      </div>\r\n    </pgcard>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,:host::ng-deep .card-title span,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,:host::ng-deep .plugin-type,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,:host::ng-deep .card-description,:host::ng-deep .card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}:host::ng-deep .params-block .row{margin-top:.75em}:host::ng-deep .params-block .row:last-child{margin-bottom:.75em}:host::ng-deep .card-col{min-height:220px}:host::ng-deep .header-link{opacity:1}:host::ng-deep .card-default{background-color:#f3f3f3;border-radius:5px}:host::ng-deep .card-title{width:80%;color:#000}:host::ng-deep .plugin-type{border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}:host::ng-deep .card-description{height:40px;overflow-y:clip;color:#4d4d4d}:host::ng-deep .card-no-description{overflow-y:clip;height:60px;color:#929292}:host::ng-deep .card-img{padding:0;height:130px;background-color:#fff;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.pgCard, selector: "pgcard", inputs: ["Title", "Type", "MinimalHeader", "ProgressType", "ProgressColor", "Refresh", "RefreshColor", "Maximize", "Close", "Toggle", "HeaderClass", "BodyClass", "AdditionalClasses", "Controls", "ShowMessage", "Message", "Loading", "TimeOut", "CardBorderStyle"], outputs: ["onRefresh"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardLongComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CardLongComponent, selector: "medev-card-long", inputs: { type_text: "type_text", type_color: "type_color", img: "img", imgUrl: "imgUrl", description: "description" }, queries: [{ propertyName: "title", first: true, predicate: ["title"], descendants: true }, { propertyName: "params", first: true, predicate: ["params"], descendants: true }, { propertyName: "second_col", first: true, predicate: ["second_col"], descendants: true }, { propertyName: "third_col", first: true, predicate: ["third_col"], descendants: true }], ngImport: i0, template: "\r\n    <pgcard \r\n    MinimalHeader=\"true\" \r\n    TimeOut=\"2500\" \r\n    [Refresh]=\"false\" \r\n    [Close]=\"false\"\r\n    >\r\n      \r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title\" [ngTemplateOutlet]=\"title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <ng-template #CardExtraControls>\r\n        <div class=\"plugin-type\" \r\n        [ngClass] = \"{\r\n            'b-color-Light-Gray-1': type_color === 'UNSET',\r\n            'b-color-Red': type_color === 'RED',\r\n            'b-color-Green': type_color === 'GREEN'}\">\r\n          {{type_text}}\r\n        </div>\r\n      </ng-template>\r\n\r\n      <div class=\"row h-100 m-b-10\">\r\n        <div class=\"col-lg-3 col-12 card-col\">\r\n          <div class=\"row\">\r\n            <div class=\"col-12 card-img m-b-10\">\r\n              <div *ngIf=\"!img || img == ''\" >\r\n                <img src=\"assets/images/md_icon.png\"\r\n                style=\"max-width: 110px; max-height: 110px;\"/>\r\n              </div>\r\n              <div *ngIf=\"img\">\r\n                <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n                  height=\"110px\" \r\n                  style=\"max-width: 110px; max-height: 110px;\"\r\n                  onclick=\"imgClick()\"\r\n                />\r\n              </div>    \r\n            </div>\r\n            <div class=\"col-12 m-t-2 body-6 text-dark params-block\">\r\n              <ng-template [ngTemplateOutlet]=\"params\"></ng-template> \r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"col-lg-5 col-12 card-col\">\r\n          <ng-template [ngTemplateOutlet]=\"second_col\"></ng-template> \r\n        </div>\r\n        \r\n        <div class=\"col-lg-4 col-12 card-col mt-lg-0 mt-5\">\r\n            <ng-template [ngTemplateOutlet]=\"third_col\"></ng-template> \r\n        </div>  \r\n\r\n      </div>\r\n    </pgcard>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,:host::ng-deep .card-title span,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,:host::ng-deep .plugin-type,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,:host::ng-deep .card-description,:host::ng-deep .card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}:host::ng-deep .params-block .row{margin-top:.75em}:host::ng-deep .params-block .row:last-child{margin-bottom:.75em}:host::ng-deep .card-col{min-height:220px}:host::ng-deep .header-link{opacity:1}:host::ng-deep .card-default{background-color:#f3f3f3;border-radius:5px}:host::ng-deep .card-title{width:80%;color:#000}:host::ng-deep .plugin-type{border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}:host::ng-deep .card-description{height:40px;overflow-y:clip;color:#4d4d4d}:host::ng-deep .card-no-description{overflow-y:clip;height:60px;color:#929292}:host::ng-deep .card-img{padding:0;height:130px;background-color:#fff;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.pgCard, selector: "pgcard", inputs: ["Title", "Type", "MinimalHeader", "ProgressType", "ProgressColor", "Refresh", "RefreshColor", "Maximize", "Close", "Toggle", "HeaderClass", "BodyClass", "AdditionalClasses", "Controls", "ShowMessage", "Message", "Loading", "TimeOut", "CardBorderStyle"], outputs: ["onRefresh"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardLongComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardLongComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'medev-card-long', template: "\r\n    <pgcard \r\n    MinimalHeader=\"true\" \r\n    TimeOut=\"2500\" \r\n    [Refresh]=\"false\" \r\n    [Close]=\"false\"\r\n    >\r\n      \r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title\" [ngTemplateOutlet]=\"title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <ng-template #CardExtraControls>\r\n        <div class=\"plugin-type\" \r\n        [ngClass] = \"{\r\n            'b-color-Light-Gray-1': type_color === 'UNSET',\r\n            'b-color-Red': type_color === 'RED',\r\n            'b-color-Green': type_color === 'GREEN'}\">\r\n          {{type_text}}\r\n        </div>\r\n      </ng-template>\r\n\r\n      <div class=\"row h-100 m-b-10\">\r\n        <div class=\"col-lg-3 col-12 card-col\">\r\n          <div class=\"row\">\r\n            <div class=\"col-12 card-img m-b-10\">\r\n              <div *ngIf=\"!img || img == ''\" >\r\n                <img src=\"assets/images/md_icon.png\"\r\n                style=\"max-width: 110px; max-height: 110px;\"/>\r\n              </div>\r\n              <div *ngIf=\"img\">\r\n                <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n                  height=\"110px\" \r\n                  style=\"max-width: 110px; max-height: 110px;\"\r\n                  onclick=\"imgClick()\"\r\n                />\r\n              </div>    \r\n            </div>\r\n            <div class=\"col-12 m-t-2 body-6 text-dark params-block\">\r\n              <ng-template [ngTemplateOutlet]=\"params\"></ng-template> \r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"col-lg-5 col-12 card-col\">\r\n          <ng-template [ngTemplateOutlet]=\"second_col\"></ng-template> \r\n        </div>\r\n        \r\n        <div class=\"col-lg-4 col-12 card-col mt-lg-0 mt-5\">\r\n            <ng-template [ngTemplateOutlet]=\"third_col\"></ng-template> \r\n        </div>  \r\n\r\n      </div>\r\n    </pgcard>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,:host::ng-deep .card-title span,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,:host::ng-deep .plugin-type,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,:host::ng-deep .card-description,:host::ng-deep .card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}:host::ng-deep .params-block .row{margin-top:.75em}:host::ng-deep .params-block .row:last-child{margin-bottom:.75em}:host::ng-deep .card-col{min-height:220px}:host::ng-deep .header-link{opacity:1}:host::ng-deep .card-default{background-color:#f3f3f3;border-radius:5px}:host::ng-deep .card-title{width:80%;color:#000}:host::ng-deep .plugin-type{border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}:host::ng-deep .card-description{height:40px;overflow-y:clip;color:#4d4d4d}:host::ng-deep .card-no-description{overflow-y:clip;height:60px;color:#929292}:host::ng-deep .card-img{padding:0;height:130px;background-color:#fff;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"] }]
+            args: [{ selector: 'medev-card-long', template: "\r\n    <pgcard \r\n    MinimalHeader=\"true\" \r\n    TimeOut=\"2500\" \r\n    [Refresh]=\"false\" \r\n    [Close]=\"false\"\r\n    >\r\n      \r\n      <ng-template #CardTitle>\r\n        <ng-template class=\"card-title\" [ngTemplateOutlet]=\"title\"></ng-template>\r\n      </ng-template>\r\n\r\n      <ng-template #CardExtraControls>\r\n        <div class=\"plugin-type\" \r\n        [ngClass] = \"{\r\n            'b-color-Light-Gray-1': type_color === 'UNSET',\r\n            'b-color-Red': type_color === 'RED',\r\n            'b-color-Green': type_color === 'GREEN'}\">\r\n          {{type_text}}\r\n        </div>\r\n      </ng-template>\r\n\r\n      <div class=\"row h-100 m-b-10\">\r\n        <div class=\"col-lg-3 col-12 card-col\">\r\n          <div class=\"row\">\r\n            <div class=\"col-12 card-img m-b-10\">\r\n              <div *ngIf=\"!img || img == ''\" >\r\n                <img src=\"assets/images/md_icon.png\"\r\n                style=\"max-width: 110px; max-height: 110px;\"/>\r\n              </div>\r\n              <div *ngIf=\"img\">\r\n                <img src=\"{{img}}\" alt=\"\" class=\"image-responsive-height img-middle\"\r\n                  height=\"110px\" \r\n                  style=\"max-width: 110px; max-height: 110px;\"\r\n                  onclick=\"imgClick()\"\r\n                />\r\n              </div>    \r\n            </div>\r\n            <div class=\"col-12 m-t-2 body-6 text-dark params-block\">\r\n              <ng-template [ngTemplateOutlet]=\"params\"></ng-template> \r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"col-lg-5 col-12 card-col\">\r\n          <ng-template [ngTemplateOutlet]=\"second_col\"></ng-template> \r\n        </div>\r\n        \r\n        <div class=\"col-lg-4 col-12 card-col mt-lg-0 mt-5\">\r\n            <ng-template [ngTemplateOutlet]=\"third_col\"></ng-template> \r\n        </div>  \r\n\r\n      </div>\r\n    </pgcard>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,:host::ng-deep .card-title span,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,:host::ng-deep .plugin-type,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,:host::ng-deep .card-description,:host::ng-deep .card-no-description,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}:host::ng-deep .params-block .row{margin-top:.75em}:host::ng-deep .params-block .row:last-child{margin-bottom:.75em}:host::ng-deep .card-col{min-height:220px}:host::ng-deep .header-link{opacity:1}:host::ng-deep .card-default{background-color:#f3f3f3;border-radius:5px}:host::ng-deep .card-title{width:80%;color:#000}:host::ng-deep .plugin-type{border-radius:5px 0 0 5px;margin-right:-20px;height:28px;padding:5px 15px;color:#fff}:host::ng-deep .card-description{height:40px;overflow-y:clip;color:#4d4d4d}:host::ng-deep .card-no-description{overflow-y:clip;height:60px;color:#929292}:host::ng-deep .card-img{padding:0;height:130px;background-color:#fff;display:flex;align-items:center;justify-content:center;width:-webkit-fill-available;margin-right:calc(var(--bs-gutter-x) * .5);margin-left:calc(var(--bs-gutter-x) * .5)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { title: [{
                 type: ContentChild,
                 args: ["title"]

package/esm2022/lib/markup-kit/card/card-simple/card-simple.component.mjs

@@ -34,10 +34,10 @@ export class CardSimpleComponent {
     constructor() { }
     ngOnInit() {
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardSimpleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CardSimpleComponent, selector: "medev-card-simple", inputs: { isDisabled: ["disabled", "isDisabled"] }, queries: [{ propertyName: "card_title", first: true, predicate: ["card_title"], descendants: true }], ngImport: i0, template: "<div class=\"card-simple\" [ngClass]=\"{ 'unused-block':isDisabled }\">\r\n    <div class=\"row m-2 body-1\" *ngIf=\"card_title\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n        </div>\r\n    </div>\r\n    <div class=\"row m-2\">\r\n        <div class=\"col-12\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.card-simple{background-color:#f3f3f3;padding:.5em;border-radius:5px}.unused-block{opacity:.6;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardSimpleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CardSimpleComponent, selector: "medev-card-simple", inputs: { isDisabled: ["disabled", "isDisabled"] }, queries: [{ propertyName: "card_title", first: true, predicate: ["card_title"], descendants: true }], ngImport: i0, template: "<div class=\"card-simple\" [ngClass]=\"{ 'unused-block':isDisabled }\">\r\n    <div class=\"row m-2 body-1\" *ngIf=\"card_title\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n        </div>\r\n    </div>\r\n    <div class=\"row m-2\">\r\n        <div class=\"col-12\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.card-simple{background-color:#f3f3f3;padding:.5em;border-radius:5px}.unused-block{opacity:.6;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CardSimpleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CardSimpleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'medev-card-simple', template: "<div class=\"card-simple\" [ngClass]=\"{ 'unused-block':isDisabled }\">\r\n    <div class=\"row m-2 body-1\" *ngIf=\"card_title\">\r\n        <div class=\"col-12\">\r\n            <ng-template [ngTemplateOutlet]=\"card_title\"></ng-template>\r\n        </div>\r\n    </div>\r\n    <div class=\"row m-2\">\r\n        <div class=\"col-12\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.card-simple{background-color:#f3f3f3;padding:.5em;border-radius:5px}.unused-block{opacity:.6;pointer-events:none}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { isDisabled: [{

package/esm2022/lib/markup-kit/card/card.module.mjs

@@ -9,17 +9,17 @@ import { CardSimpleComponent } from './card-simple/card-simple.component';
 import * as i0 from "@angular/core";
 export const mefDevCardComponents = [CardComponent, CardLongComponent, CardSimpleComponent];
 export class MefDevCardModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: MefDevCardModule, declarations: [CardComponent, CardLongComponent, CardSimpleComponent], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: MefDevCardModule, declarations: [CardComponent, CardLongComponent, CardSimpleComponent], imports: [CommonModule,
             MefDevCollapseModule,
             MefDevSelectModule,
             pgCardModule], exports: [CardComponent, CardLongComponent, CardSimpleComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCardModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCardModule, imports: [CommonModule,
             MefDevCollapseModule,
             MefDevSelectModule,
             pgCardModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCardModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: mefDevCardComponents,

package/esm2022/lib/markup-kit/collapse/collapse/collapse.component.mjs

@@ -95,8 +95,8 @@ export class CollapseComponent {
         this._el = this._elementRef.nativeElement;
         this._collapseSet.addTab(this);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CollapseComponent, deps: [{ token: i1.CollapseSetComponent, host: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CollapseComponent, selector: "mefdev-collapse", inputs: { Disabled: "Disabled", Active: "Active" }, outputs: { stateChange: "stateChange" }, host: { properties: { "class.card": "true", "class.card-default": "true", "class.m-b-0": "true", "class.disabled": "this.Disabled" } }, queries: [{ propertyName: "CardTitle", first: true, predicate: ["CardTitle"], descendants: true }], ngImport: i0, template: "<div class=\"row mt-2 card-title\" [attr.aria-expanded]=\"_active\" (click)=\"clickHeader($event)\" role=\"tab\"\r\nhref=\"javascript:;\" [ngClass]=\"{'collapsed':!_active}\">\r\n  <div class=\"col\">\r\n    <ng-template [ngTemplateOutlet]=\"CardTitle\"></ng-template>\r\n  </div>\r\n  <div class=\"col\">\r\n    <i class=\"fa fa-angle-down float-end \" aria-hidden=\"true\" *ngIf=\"!_active\"></i>\r\n    <i class=\"fa fa-angle-up float-end \" aria-hidden=\"true\" *ngIf=\"_active\"></i>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"collapse\" [ngClass]=\"{'show':true,'active':_active,'inactive':!_active}\" [@collapseState]=\"_active?'active':'inactive'\">\r\n    <div *ngIf=\"_active\" \r\n     class=\"card-body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,.card-title,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-title{background-color:#f3f3f3;padding:17px;margin:0;color:#000}.collapse{background-color:#f3f3f3}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CollapseComponent, deps: [{ token: i1.CollapseSetComponent, host: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CollapseComponent, selector: "mefdev-collapse", inputs: { Disabled: "Disabled", Active: "Active" }, outputs: { stateChange: "stateChange" }, host: { properties: { "class.card": "true", "class.card-default": "true", "class.m-b-0": "true", "class.disabled": "this.Disabled" } }, queries: [{ propertyName: "CardTitle", first: true, predicate: ["CardTitle"], descendants: true }], ngImport: i0, template: "<div class=\"row mt-2 card-title\" [attr.aria-expanded]=\"_active\" (click)=\"clickHeader($event)\" role=\"tab\"\r\nhref=\"javascript:;\" [ngClass]=\"{'collapsed':!_active}\">\r\n  <div class=\"col\">\r\n    <ng-template [ngTemplateOutlet]=\"CardTitle\"></ng-template>\r\n  </div>\r\n  <div class=\"col\">\r\n    <i class=\"fa fa-angle-down float-end \" aria-hidden=\"true\" *ngIf=\"!_active\"></i>\r\n    <i class=\"fa fa-angle-up float-end \" aria-hidden=\"true\" *ngIf=\"_active\"></i>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"collapse\" [ngClass]=\"{'show':true,'active':_active,'inactive':!_active}\" [@collapseState]=\"_active?'active':'inactive'\">\r\n    <div *ngIf=\"_active\" \r\n     class=\"card-body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,.card-title,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-title{background-color:#f3f3f3;padding:17px;margin:0;color:#000}.collapse{background-color:#f3f3f3}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
             trigger('collapseState', [
                 state('inactive', style({
                     opacity: '0',
@@ -111,7 +111,7 @@ export class CollapseComponent {
             ])
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CollapseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CollapseComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mefdev-collapse', animations: [
                         trigger('collapseState', [
@@ -130,7 +130,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         '[class.card]': 'true',
                         '[class.card-default]': 'true',
                         '[class.m-b-0]': 'true'
-                    }, template: "<div class=\"row mt-2 card-title\" [attr.aria-expanded]=\"_active\" (click)=\"clickHeader($event)\" role=\"tab\"\r\nhref=\"javascript:;\" [ngClass]=\"{'collapsed':!_active}\">\r\n  <div class=\"col\">\r\n    <ng-template [ngTemplateOutlet]=\"CardTitle\"></ng-template>\r\n  </div>\r\n  <div class=\"col\">\r\n    <i class=\"fa fa-angle-down float-end \" aria-hidden=\"true\" *ngIf=\"!_active\"></i>\r\n    <i class=\"fa fa-angle-up float-end \" aria-hidden=\"true\" *ngIf=\"_active\"></i>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"collapse\" [ngClass]=\"{'show':true,'active':_active,'inactive':!_active}\" [@collapseState]=\"_active?'active':'inactive'\">\r\n    <div *ngIf=\"_active\" \r\n     class=\"card-body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,.card-title,h3{font-family:montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,h6{font-family:montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-title{background-color:#f3f3f3;padding:17px;margin:0;color:#000}.collapse{background-color:#f3f3f3}\n"] }]
+                    }, template: "<div class=\"row mt-2 card-title\" [attr.aria-expanded]=\"_active\" (click)=\"clickHeader($event)\" role=\"tab\"\r\nhref=\"javascript:;\" [ngClass]=\"{'collapsed':!_active}\">\r\n  <div class=\"col\">\r\n    <ng-template [ngTemplateOutlet]=\"CardTitle\"></ng-template>\r\n  </div>\r\n  <div class=\"col\">\r\n    <i class=\"fa fa-angle-down float-end \" aria-hidden=\"true\" *ngIf=\"!_active\"></i>\r\n    <i class=\"fa fa-angle-up float-end \" aria-hidden=\"true\" *ngIf=\"_active\"></i>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"collapse\" [ngClass]=\"{'show':true,'active':_active,'inactive':!_active}\" [@collapseState]=\"_active?'active':'inactive'\">\r\n    <div *ngIf=\"_active\" \r\n     class=\"card-body\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n</div>", styles: [".color-Dark-Gray-1{color:#373737!important}.color-Dark-Gray-2{color:#4d4d4d!important}.color-Red{color:#cf0106!important}.color-Green{color:#28b446!important}.color-Light-Gray-1{color:#929292!important}.color-Light-Gray-2{color:#eaeaea!important}.color-Light-Gray-3{color:#f3f3f3!important}.color-White{color:#fff!important}.color-Link{color:#0185cf!important}.b-color-Dark-Gray-1{background-color:#373737!important}.b-color-Dark-Gray-2{background-color:#4d4d4d!important}.b-color-Red{background-color:#cf0106!important}.b-color-Green{background-color:#28b446!important}.b-color-Light-Gray-1{background-color:#929292!important}.b-color-Light-Gray-2{background-color:#eaeaea!important}.b-color-Light-Gray-3{background-color:#f3f3f3!important}.b-color-White{background-color:#fff!important}.b-color-Link{background-color:#0185cf!important}.h1,h1{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;text-transform:uppercase;color:#000}.h2,h2{font-family:Montserrat;font-size:24px;line-height:29px;font-weight:700;color:#000}.h3,.card-title,h3{font-family:Montserrat;font-size:14px;line-height:20px;font-weight:400;text-transform:uppercase;color:#000}.h4,h4{font-family:Montserrat;font-weight:300;font-size:13px;line-height:20px;text-transform:uppercase;color:#000}.h5,h5{font-family:Montserrat;font-weight:600;font-size:13px;line-height:20px;color:#000}.h6,h6{font-family:Montserrat;font-weight:500;font-size:12px;line-height:20px;text-transform:capitalize;color:#000}.body-1,body-1{font-family:Lato;font-size:18px;line-height:20px;font-weight:700;color:#000}.body-2,body-2{font-family:Lato;font-size:16px;line-height:28px;font-weight:400;color:#000}.body-3,body-3{font-family:Lato;font-size:14px;line-height:22px;font-weight:700;color:#000}.body-4,body-4{font-family:Lato;font-size:14px;line-height:22px;font-weight:400;color:#000}.body-5,body-5{font-family:Lato;font-weight:600;font-size:13px;line-height:18px;color:#000}.body-6,body-6{font-family:Lato;font-size:13px;line-height:16px;font-weight:400;color:#000}.card-title{background-color:#f3f3f3;padding:17px;margin:0;color:#000}.collapse{background-color:#f3f3f3}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.CollapseSetComponent, decorators: [{
                     type: Host
                 }] }, { type: i0.ElementRef }]; }, propDecorators: { CardTitle: [{

package/esm2022/lib/markup-kit/collapse/collapse-set/collapse-set.component.mjs

@@ -86,10 +86,10 @@ export class CollapseSetComponent {
     addTab(collapse) {
         this.panels.push(collapse);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CollapseSetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CollapseSetComponent, selector: "mefdev-collapse-set", inputs: { expandAny: "expandAny", Accordion: "Accordion", Horizontal: "Horizontal" }, ngImport: i0, template: "<div class=\"card-group\" [class.horizontal]=\"Horizontal\">\r\n    <ng-content></ng-content>\r\n</div>", styles: [""], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CollapseSetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CollapseSetComponent, selector: "mefdev-collapse-set", inputs: { expandAny: "expandAny", Accordion: "Accordion", Horizontal: "Horizontal" }, ngImport: i0, template: "<div class=\"card-group\" [class.horizontal]=\"Horizontal\">\r\n    <ng-content></ng-content>\r\n</div>", styles: [""], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CollapseSetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CollapseSetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mefdev-collapse-set', encapsulation: ViewEncapsulation.None, template: "<div class=\"card-group\" [class.horizontal]=\"Horizontal\">\r\n    <ng-content></ng-content>\r\n</div>" }]
         }], propDecorators: { expandAny: [{

package/esm2022/lib/markup-kit/collapse/collapse.module.mjs

@@ -10,11 +10,11 @@ export class MefDevCollapseModule {
             ngModule: MefDevCollapseModule
         };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: MefDevCollapseModule, declarations: [CollapseSetComponent, CollapseComponent], imports: [CommonModule], exports: [CollapseSetComponent, CollapseComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCollapseModule, imports: [CommonModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: MefDevCollapseModule, declarations: [CollapseSetComponent, CollapseComponent], imports: [CommonModule], exports: [CollapseSetComponent, CollapseComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCollapseModule, imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevCollapseModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevCollapseModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: mefDevCollapseModuleComponents,

package/esm2022/lib/markup-kit/modals/fill/fill.component.mjs

@@ -1,7 +1,7 @@
 import { Component, ContentChild, EventEmitter, Input, Output, ViewChild } from '@angular/core';
+import { animate, style, transition, trigger } from '@angular/animations';
 import * as i0 from "@angular/core";
-import * as i1 from "ngx-bootstrap/modal";
-import * as i2 from "@angular/common";
+import * as i1 from "@angular/common";
 /**
   * Fill Component for a modal window.
   *
@@ -23,6 +23,8 @@ import * as i2 from "@angular/common";
   * <example-url>https://mef.dev/ui_kit_demo/view/modals/fill</example-url>
   */
 export class FillComponent {
+    visible = false;
+    dialog;
     /**
     * The header template of the modal window.
     * ```
@@ -45,17 +47,10 @@ export class FillComponent {
     * ```
     */
     modal_footer;
-    /**
-     * Reference to the ModalDirective element from ngx-bootstrap.
-     */
-    fadInModal;
     /**
      * Input parameter that determines whether to show the modal window.
      */
     set show(val) {
-        if (!this.fadInModal) {
-            return;
-        }
         if (val) {
             this.showModal();
         }
@@ -65,53 +60,78 @@ export class FillComponent {
     }
     ;
     /**
-     * Event emitter triggered when the modal window is closed.
-     * Emits a boolean value indicating whether the modal window is closed.
+     * Event emitted when the modal is change state.
+     * Emits a boolean value indicating if the modal is closed(false), or open(true).
      * Example:
      * ```
-     * <mefdev-fill-modal (isClouse)="onModalClosed($event)"></mefdev-fill-modal>
+     * <mefdev-fill-modal (visibleChange)="onModalClosed($event)"></mefdev-fill-modal>
      * ```
      */
-    isClouse = new EventEmitter();
+    visibleChange = new EventEmitter();
     constructor() { }
     ngOnInit() {
     }
     /**
-   * Event emitter for when the modal is closed.
-   */
-    modalIsCloused() {
-        this.isClouse.emit(true);
+     * Shows the modal state.
+     * Return a boolean value indicating if the modal is closed(false), or open(true)
+     */
+    getModalState() {
+        return this.visible;
     }
     /**
-    * Shows the modal window.
-    */
+     * Shows the modal.
+     * Call this method to open the modal window.
+     */
     showModal() {
-        this.fadInModal?.show();
+        this.visible = true;
+        this.visibleChange.emit(this.visible);
     }
     /**
-     * Hides the modal window.
+     * Hides the modal.
+     * Call this method to close the modal window.
      */
     hideModal() {
-        this.fadInModal?.hide();
+        this.visible = false;
+        this.visibleChange.emit(this.visible);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FillComponent, selector: "mefdev-fill-modal", inputs: { show: "show" }, outputs: { isClouse: "isClouse" }, queries: [{ propertyName: "modal_header", first: true, predicate: ["modal_header"], descendants: true }, { propertyName: "modal_footer", first: true, predicate: ["modal_footer"], descendants: true }], viewQueries: [{ propertyName: "fadInModal", first: true, predicate: ["fadInModal"], descendants: true }], ngImport: i0, template: " <div bsModal #fadInModal=\"bs-modal\" class=\"modal fade fill-in\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\" (onHide)=\"modalIsCloused()\">\r\n    <button type=\"button\" class=\"close\" (click)=\"fadInModal.hide()\" aria-hidden=\"true\">\r\n      <i class=\"pg pg-close\"></i>\r\n    </button>\r\n    <div class=\"modal-dialog \">\r\n      <div class=\"modal-content\">\r\n        <div class=\"modal-header\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_header\"></ng-template>\r\n        </div>  \r\n        <div class=\"modal-body\">\r\n          <ng-content></ng-content>\r\n        </div>  \r\n        <div class=\"modal-footer\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>", styles: [""], dependencies: [{ kind: "directive", type: i1.ModalDirective, selector: "[bsModal]", inputs: ["config", "closeInterceptor"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["bs-modal"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: FillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: FillComponent, selector: "mefdev-fill-modal", inputs: { show: "show" }, outputs: { visibleChange: "visibleChange" }, queries: [{ propertyName: "modal_header", first: true, predicate: ["modal_header"], descendants: true }, { propertyName: "modal_footer", first: true, predicate: ["modal_footer"], descendants: true }], viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], ngImport: i0, template: "<button *ngIf=\"visible\" (click)=\"hideModal()\" aria-label=\"Close\" class=\"dialog__close-btn\">X</button>\r\n<div [@dialog] *ngIf=\"visible\" class=\"dialog\" #dialog>\r\n\t<div class=\"modal-content\">\r\n    <div class=\"modal-header clearfix text-left\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_header\"></ng-template>\r\n      </div>\r\n      <div class=\"modal-body\">\r\n          <ng-content></ng-content>\r\n      </div>\r\n      <div class=\"modal-footer\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_footer\"></ng-template>\r\n      </div>\r\n  </div>\r\n</div>\r\n<div *ngIf=\"visible\" class=\"overlay\" (click)=\"hideModal()\"></div>\r\n", styles: [".overlay{position:fixed;inset:0;background-color:#ffffffd9;z-index:999}.dialog{z-index:1000;position:fixed;right:0;left:0;top:0;margin-left:auto;margin-right:auto;height:100%;min-height:200px;min-width:520px;max-width:90%;width:-moz-fit-content;width:fit-content;background-color:#ffffffd9;padding:12px;overflow-y:auto;display:flex;align-items:center}.dialog__close-btn{border:0;background:none;color:#2d2d2d;position:absolute;top:8px;right:8px;font-size:1.2em;z-index:1001}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
+            trigger('dialog', [
+                transition('void => *', [
+                    style({ transform: 'scale3d(.3, .3, .3)' }),
+                    animate(100)
+                ]),
+                transition('* => void', [
+                    animate(100, style({ transform: 'scale3d(.0, .0, .0)' }))
+                ])
+            ])
+        ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FillComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: FillComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mefdev-fill-modal', template: " <div bsModal #fadInModal=\"bs-modal\" class=\"modal fade fill-in\" tabindex=\"-1\" role=\"dialog\" aria-hidden=\"true\" (onHide)=\"modalIsCloused()\">\r\n    <button type=\"button\" class=\"close\" (click)=\"fadInModal.hide()\" aria-hidden=\"true\">\r\n      <i class=\"pg pg-close\"></i>\r\n    </button>\r\n    <div class=\"modal-dialog \">\r\n      <div class=\"modal-content\">\r\n        <div class=\"modal-header\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_header\"></ng-template>\r\n        </div>  \r\n        <div class=\"modal-body\">\r\n          <ng-content></ng-content>\r\n        </div>  \r\n        <div class=\"modal-footer\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_footer\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { modal_header: [{
+            args: [{ selector: 'mefdev-fill-modal', animations: [
+                        trigger('dialog', [
+                            transition('void => *', [
+                                style({ transform: 'scale3d(.3, .3, .3)' }),
+                                animate(100)
+                            ]),
+                            transition('* => void', [
+                                animate(100, style({ transform: 'scale3d(.0, .0, .0)' }))
+                            ])
+                        ])
+                    ], template: "<button *ngIf=\"visible\" (click)=\"hideModal()\" aria-label=\"Close\" class=\"dialog__close-btn\">X</button>\r\n<div [@dialog] *ngIf=\"visible\" class=\"dialog\" #dialog>\r\n\t<div class=\"modal-content\">\r\n    <div class=\"modal-header clearfix text-left\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_header\"></ng-template>\r\n      </div>\r\n      <div class=\"modal-body\">\r\n          <ng-content></ng-content>\r\n      </div>\r\n      <div class=\"modal-footer\">\r\n          <ng-template [ngTemplateOutlet]=\"modal_footer\"></ng-template>\r\n      </div>\r\n  </div>\r\n</div>\r\n<div *ngIf=\"visible\" class=\"overlay\" (click)=\"hideModal()\"></div>\r\n", styles: [".overlay{position:fixed;inset:0;background-color:#ffffffd9;z-index:999}.dialog{z-index:1000;position:fixed;right:0;left:0;top:0;margin-left:auto;margin-right:auto;height:100%;min-height:200px;min-width:520px;max-width:90%;width:-moz-fit-content;width:fit-content;background-color:#ffffffd9;padding:12px;overflow-y:auto;display:flex;align-items:center}.dialog__close-btn{border:0;background:none;color:#2d2d2d;position:absolute;top:8px;right:8px;font-size:1.2em;z-index:1001}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { dialog: [{
+                type: ViewChild,
+                args: ['dialog', { static: false }]
+            }], modal_header: [{
                 type: ContentChild,
                 args: ["modal_header"]
             }], modal_footer: [{
                 type: ContentChild,
                 args: ["modal_footer"]
-            }], fadInModal: [{
-                type: ViewChild,
-                args: ['fadInModal', { static: false }]
             }], show: [{
                 type: Input
-            }], isClouse: [{
+            }], visibleChange: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQtbGliL3NyYy9saWIvbWFya3VwLWtpdC9tb2RhbHMvZmlsbC9maWxsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3VpLWtpdC1saWIvc3JjL2xpYi9tYXJrdXAta2l0L21vZGFscy9maWxsL2ZpbGwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQWUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBS3JIOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBbUJJO0FBTUosTUFBTSxPQUFPLGFBQWE7SUFFeEI7Ozs7Ozs7OztNQVNFO0lBQzRCLFlBQVksQ0FBb0I7SUFFOUQ7Ozs7Ozs7OztNQVNFO0lBQzRCLFlBQVksQ0FBb0I7SUFFOUQ7O09BRUc7SUFDeUMsVUFBVSxDQUFrQjtJQUV4RTs7T0FFRztJQUNILElBQWEsSUFBSSxDQUFDLEdBQVk7UUFDNUIsSUFBRyxDQUFDLElBQUksQ0FBQyxVQUFVLEVBQUM7WUFDbEIsT0FBTztTQUNSO1FBQ0QsSUFBRyxHQUFHLEVBQUM7WUFDTCxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7U0FDbEI7YUFDRztZQUNGLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztTQUNsQjtJQUNILENBQUM7SUFBQSxDQUFDO0lBRUY7Ozs7Ozs7T0FPRztJQUNPLFFBQVEsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBRWpELGdCQUFnQixDQUFDO0lBRWpCLFFBQVE7SUFDUixDQUFDO0lBRUM7O0tBRUM7SUFDSCxjQUFjO1FBQ1osSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDM0IsQ0FBQztJQUVBOztNQUVFO0lBQ0gsU0FBUztRQUNQLElBQUksQ0FBQyxVQUFVLEVBQUUsSUFBSSxFQUFFLENBQUM7SUFDMUIsQ0FBQztJQUVEOztPQUVHO0lBQ0ksU0FBUztRQUNkLElBQUksQ0FBQyxVQUFVLEVBQUUsSUFBSSxFQUFFLENBQUM7SUFDMUIsQ0FBQzt1R0FoRlUsYUFBYTsyRkFBYixhQUFhLHlhQzlCMUIsMnhCQWlCUTs7MkZEYUssYUFBYTtrQkFMekIsU0FBUzsrQkFDRSxtQkFBbUI7MEVBZ0JDLFlBQVk7c0JBQXpDLFlBQVk7dUJBQUMsY0FBYztnQkFZRSxZQUFZO3NCQUF6QyxZQUFZO3VCQUFDLGNBQWM7Z0JBS2dCLFVBQVU7c0JBQXJELFNBQVM7dUJBQUMsWUFBWSxFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRTtnQkFLN0IsSUFBSTtzQkFBaEIsS0FBSztnQkFvQkksUUFBUTtzQkFBakIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgQ29udGVudENoaWxkLCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCwgVGVtcGxhdGVSZWYsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBNb2RhbERpcmVjdGl2ZSB9IGZyb20gJ25neC1ib290c3RyYXAvbW9kYWwnO1xyXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tIFwiQGFuZ3VsYXIvY29tbW9uXCI7IC8vIGFkZCBmb3Igc3RhdGljIGFuYWxpemVyIGJ1ZyBmaXhcclxuXHJcblxyXG4vKipcclxuICAqIEZpbGwgQ29tcG9uZW50IGZvciBhIG1vZGFsIHdpbmRvdy5cclxuICAqXHJcbiAgKiBFeGFtcGxlIG9mIHVzYWdlOlxyXG4gICogYGBgXHJcbiAgKiA8bWVmZGV2LWZpbGwtbW9kYWwgI3Bpbl9tb2RhbD5cclxuICAqICAgPCEtLSBNb2RhbCBoZWFkZXIgY29udGVudCAtLT5cclxuICAqICAgPG5nLXRlbXBsYXRlICNtb2RhbF9oZWFkZXI+XHJcbiAgKiAgICAgPCEtLSBIZWFkZXIgY29udGVudCBnb2VzIGhlcmUgLS0+XHJcbiAgKiAgIDwvbmctdGVtcGxhdGU+XHJcbiAgKlxyXG4gICogICA8IS0tIE1vZGFsIGZvb3RlciBjb250ZW50IC0tPlxyXG4gICogICA8bmctdGVtcGxhdGUgI21vZGFsX2Zvb3Rlcj5cclxuICAqICAgICA8IS0tIEZvb3RlciBjb250ZW50IGdvZXMgaGVyZSAtLT5cclxuICAqICAgPC9uZy10ZW1wbGF0ZT5cclxuICAqIDwvbWVmZGV2LWZpbGwtbW9kYWw+XHJcbiAgKiBgYGBcclxuICAqXHJcbiAgKiA8ZXhhbXBsZS11cmw+aHR0cHM6Ly9tZWYuZGV2L3VpX2tpdF9kZW1vL3ZpZXcvbW9kYWxzL2ZpbGw8L2V4YW1wbGUtdXJsPlxyXG4gICovXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbWVmZGV2LWZpbGwtbW9kYWwnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9maWxsLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9maWxsLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIEZpbGxDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuICAvKipcclxuICAqIFRoZSBoZWFkZXIgdGVtcGxhdGUgb2YgdGhlIG1vZGFsIHdpbmRvdy5cclxuICAqIGBgYFxyXG4gICogPG1lZmRldi1maWxsLW1vZGFsICNwaW5fbW9kYWw+XHJcbiAgICogICA8bmctdGVtcGxhdGUgI21vZGFsX2hlYWRlcj5cclxuICAgKiAgICAgPCEtLSBIZWFkZXIgY29udGVudCBnb2VzIGhlcmUgLS0+XHJcbiAgICogICA8L25nLXRlbXBsYXRlPiBcclxuICAgKiA8L21lZmRldi1maWxsLW1vZGFsPlxyXG4gICogYGBgXHJcbiAgKi9cclxuICBAQ29udGVudENoaWxkKFwibW9kYWxfaGVhZGVyXCIpIG1vZGFsX2hlYWRlcjogVGVtcGxhdGVSZWY8dm9pZD47IFxyXG5cclxuICAvKipcclxuICAqIFRoZSBmb290ZXIgdGVtcGxhdGUgb2YgdGhlIG1vZGFsIHdpbmRvdy5cclxuICAqIGBgYFxyXG4gICogPG1lZmRldi1maWxsLW1vZGFsICNwaW5fbW9kYWw+XHJcbiAgICogICA8bmctdGVtcGxhdGUgI21vZGFsX2Zvb3Rlcj5cclxuICAgKiAgICAgPCEtLSBGb290ZXIgY29udGVudCBnb2VzIGhlcmUgLS0+XHJcbiAgICogICA8L25nLXRlbXBsYXRlPiBcclxuICAgKiA8L21lZmRldi1maWxsLW1vZGFsPlxyXG4gICogYGBgXHJcbiAgKi9cclxuICBAQ29udGVudENoaWxkKFwibW9kYWxfZm9vdGVyXCIpIG1vZGFsX2Zvb3RlcjogVGVtcGxhdGVSZWY8dm9pZD47XHJcbiAgXHJcbiAgLyoqXHJcbiAgICogUmVmZXJlbmNlIHRvIHRoZSBNb2RhbERpcmVjdGl2ZSBlbGVtZW50IGZyb20gbmd4LWJvb3RzdHJhcC5cclxuICAgKi9cclxuICBAVmlld0NoaWxkKCdmYWRJbk1vZGFsJywgeyBzdGF0aWM6IGZhbHNlIH0pIGZhZEluTW9kYWw/OiBNb2RhbERpcmVjdGl2ZTtcclxuICAgIFxyXG4gIC8qKlxyXG4gICAqIElucHV0IHBhcmFtZXRlciB0aGF0IGRldGVybWluZXMgd2hldGhlciB0byBzaG93IHRoZSBtb2RhbCB3aW5kb3cuXHJcbiAgICovXHJcbiAgQElucHV0KCkgc2V0IHNob3codmFsOiBib29sZWFuKXtcclxuICAgIGlmKCF0aGlzLmZhZEluTW9kYWwpe1xyXG4gICAgICByZXR1cm47XHJcbiAgICB9XHJcbiAgICBpZih2YWwpe1xyXG4gICAgICB0aGlzLnNob3dNb2RhbCgpO1xyXG4gICAgfVxyXG4gICAgZWxzZXtcclxuICAgICAgdGhpcy5oaWRlTW9kYWwoKTtcclxuICAgIH1cclxuICB9O1xyXG5cclxuICAvKipcclxuICAgKiBFdmVudCBlbWl0dGVyIHRyaWdnZXJlZCB3aGVuIHRoZSBtb2RhbCB3aW5kb3cgaXMgY2xvc2VkLlxyXG4gICAqIEVtaXRzIGEgYm9vbGVhbiB2YWx1ZSBpbmRpY2F0aW5nIHdoZXRoZXIgdGhlIG1vZGFsIHdpbmRvdyBpcyBjbG9zZWQuXHJcbiAgICogRXhhbXBsZTpcclxuICAgKiBgYGBcclxuICAgKiA8bWVmZGV2LWZpbGwtbW9kYWwgKGlzQ2xvdXNlKT1cIm9uTW9kYWxDbG9zZWQoJGV2ZW50KVwiPjwvbWVmZGV2LWZpbGwtbW9kYWw+XHJcbiAgICogYGBgXHJcbiAgICovXHJcbiAgQE91dHB1dCgpIGlzQ2xvdXNlID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xyXG5cclxuICBjb25zdHJ1Y3RvcigpIHsgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICB9XHJcblxyXG4gICAgLyoqXHJcbiAgICogRXZlbnQgZW1pdHRlciBmb3Igd2hlbiB0aGUgbW9kYWwgaXMgY2xvc2VkLlxyXG4gICAqL1xyXG4gIG1vZGFsSXNDbG91c2VkKCl7XHJcbiAgICB0aGlzLmlzQ2xvdXNlLmVtaXQodHJ1ZSk7XHJcbiAgfVxyXG5cclxuICAgLyoqXHJcbiAgICogU2hvd3MgdGhlIG1vZGFsIHdpbmRvdy5cclxuICAgKi9cclxuICBzaG93TW9kYWwoKSB7XHJcbiAgICB0aGlzLmZhZEluTW9kYWw/LnNob3coKTtcclxuICB9XHJcblxyXG4gIC8qKlxyXG4gICAqIEhpZGVzIHRoZSBtb2RhbCB3aW5kb3cuXHJcbiAgICovXHJcbiAgcHVibGljIGhpZGVNb2RhbCgpe1xyXG4gICAgdGhpcy5mYWRJbk1vZGFsPy5oaWRlKCk7XHJcbiAgfVxyXG59XHJcbiIsIiA8ZGl2IGJzTW9kYWwgI2ZhZEluTW9kYWw9XCJicy1tb2RhbFwiIGNsYXNzPVwibW9kYWwgZmFkZSBmaWxsLWluXCIgdGFiaW5kZXg9XCItMVwiIHJvbGU9XCJkaWFsb2dcIiBhcmlhLWhpZGRlbj1cInRydWVcIiAob25IaWRlKT1cIm1vZGFsSXNDbG91c2VkKClcIj5cclxuICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIGNsYXNzPVwiY2xvc2VcIiAoY2xpY2spPVwiZmFkSW5Nb2RhbC5oaWRlKClcIiBhcmlhLWhpZGRlbj1cInRydWVcIj5cclxuICAgICAgPGkgY2xhc3M9XCJwZyBwZy1jbG9zZVwiPjwvaT5cclxuICAgIDwvYnV0dG9uPlxyXG4gICAgPGRpdiBjbGFzcz1cIm1vZGFsLWRpYWxvZyBcIj5cclxuICAgICAgPGRpdiBjbGFzcz1cIm1vZGFsLWNvbnRlbnRcIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibW9kYWwtaGVhZGVyXCI+XHJcbiAgICAgICAgICA8bmctdGVtcGxhdGUgW25nVGVtcGxhdGVPdXRsZXRdPVwibW9kYWxfaGVhZGVyXCI+PC9uZy10ZW1wbGF0ZT5cclxuICAgICAgICA8L2Rpdj4gIFxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJtb2RhbC1ib2R5XCI+XHJcbiAgICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XHJcbiAgICAgICAgPC9kaXY+ICBcclxuICAgICAgICA8ZGl2IGNsYXNzPVwibW9kYWwtZm9vdGVyXCI+XHJcbiAgICAgICAgICA8bmctdGVtcGxhdGUgW25nVGVtcGxhdGVPdXRsZXRdPVwibW9kYWxfZm9vdGVyXCI+PC9uZy10ZW1wbGF0ZT5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICA8L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQtbGliL3NyYy9saWIvbWFya3VwLWtpdC9tb2RhbHMvZmlsbC9maWxsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3VpLWtpdC1saWIvc3JjL2xpYi9tYXJrdXAta2l0L21vZGFscy9maWxsL2ZpbGwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQWUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRWpJLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQzs7O0FBRzFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBbUJJO0FBaUJKLE1BQU0sT0FBTyxhQUFhO0lBQ2QsT0FBTyxHQUFZLEtBQUssQ0FBQztJQUVlLE1BQU0sQ0FBYztJQUd0RTs7Ozs7Ozs7O01BU0U7SUFDNEIsWUFBWSxDQUFvQjtJQUU5RDs7Ozs7Ozs7O01BU0U7SUFDNEIsWUFBWSxDQUFvQjtJQUU5RDs7T0FFRztJQUNILElBQWEsSUFBSSxDQUFDLEdBQVk7UUFDNUIsSUFBRyxHQUFHLEVBQUM7WUFDTCxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7U0FDbEI7YUFDRztZQUNGLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztTQUNsQjtJQUNILENBQUM7SUFBQSxDQUFDO0lBRUY7Ozs7Ozs7T0FPRztJQUNPLGFBQWEsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBR3RELGdCQUFnQixDQUFDO0lBRWpCLFFBQVE7SUFDUixDQUFDO0lBRUQ7OztPQUdHO0lBQ0gsYUFBYTtRQUNYLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQztJQUN0QixDQUFDO0lBRUQ7OztPQUdHO0lBQ0ksU0FBUztRQUNkLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN4QyxDQUFDO0lBRUQ7OztPQUdHO0lBQ0ksU0FBUztRQUNkLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDO1FBQ3JCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN4QyxDQUFDO3VHQWxGVSxhQUFhOzJGQUFiLGFBQWEsMmFDekMxQix1cUJBZUEsbXhCRGNjO1lBQ1YsT0FBTyxDQUFDLFFBQVEsRUFBRTtnQkFDaEIsVUFBVSxDQUFDLFdBQVcsRUFBRTtvQkFDdEIsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLHFCQUFxQixFQUFFLENBQUM7b0JBQzNDLE9BQU8sQ0FBQyxHQUFHLENBQUM7aUJBQ2IsQ0FBQztnQkFDRixVQUFVLENBQUMsV0FBVyxFQUFFO29CQUN0QixPQUFPLENBQUMsR0FBRyxFQUFFLEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxxQkFBcUIsRUFBRSxDQUFDLENBQUM7aUJBQzFELENBQUM7YUFDSCxDQUFDO1NBQ0g7OzJGQUVVLGFBQWE7a0JBaEJ6QixTQUFTOytCQUNFLG1CQUFtQixjQUdqQjt3QkFDVixPQUFPLENBQUMsUUFBUSxFQUFFOzRCQUNoQixVQUFVLENBQUMsV0FBVyxFQUFFO2dDQUN0QixLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUscUJBQXFCLEVBQUUsQ0FBQztnQ0FDM0MsT0FBTyxDQUFDLEdBQUcsQ0FBQzs2QkFDYixDQUFDOzRCQUNGLFVBQVUsQ0FBQyxXQUFXLEVBQUU7Z0NBQ3RCLE9BQU8sQ0FBQyxHQUFHLEVBQUUsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLHFCQUFxQixFQUFFLENBQUMsQ0FBQzs2QkFDMUQsQ0FBQzt5QkFDSCxDQUFDO3FCQUNIOzBFQUtpRCxNQUFNO3NCQUF2RCxTQUFTO3VCQUFDLFFBQVEsRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUU7Z0JBYVIsWUFBWTtzQkFBekMsWUFBWTt1QkFBQyxjQUFjO2dCQVlFLFlBQVk7c0JBQXpDLFlBQVk7dUJBQUMsY0FBYztnQkFLZixJQUFJO3NCQUFoQixLQUFLO2dCQWlCSSxhQUFhO3NCQUF0QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBDb250ZW50Q2hpbGQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBUZW1wbGF0ZVJlZiwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjsgLy8gYWRkIGZvciBzdGF0aWMgYW5hbGl6ZXIgYnVnIGZpeFxyXG5pbXBvcnQgeyBhbmltYXRlLCBzdHlsZSwgdHJhbnNpdGlvbiwgdHJpZ2dlciB9IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnO1xyXG5cclxuXHJcbi8qKlxyXG4gICogRmlsbCBDb21wb25lbnQgZm9yIGEgbW9kYWwgd2luZG93LlxyXG4gICpcclxuICAqIEV4YW1wbGUgb2YgdXNhZ2U6XHJcbiAgKiBgYGBcclxuICAqIDxtZWZkZXYtZmlsbC1tb2RhbCAjcGluX21vZGFsPlxyXG4gICogICA8IS0tIE1vZGFsIGhlYWRlciBjb250ZW50IC0tPlxyXG4gICogICA8bmctdGVtcGxhdGUgI21vZGFsX2hlYWRlcj5cclxuICAqICAgICA8IS0tIEhlYWRlciBjb250ZW50IGdvZXMgaGVyZSAtLT5cclxuICAqICAgPC9uZy10ZW1wbGF0ZT5cclxuICAqXHJcbiAgKiAgIDwhLS0gTW9kYWwgZm9vdGVyIGNvbnRlbnQgLS0+XHJcbiAgKiAgIDxuZy10ZW1wbGF0ZSAjbW9kYWxfZm9vdGVyPlxyXG4gICogICAgIDwhLS0gRm9vdGVyIGNvbnRlbnQgZ29lcyBoZXJlIC0tPlxyXG4gICogICA8L25nLXRlbXBsYXRlPlxyXG4gICogPC9tZWZkZXYtZmlsbC1tb2RhbD5cclxuICAqIGBgYFxyXG4gICpcclxuICAqIDxleGFtcGxlLXVybD5odHRwczovL21lZi5kZXYvdWlfa2l0X2RlbW8vdmlldy9tb2RhbHMvZmlsbDwvZXhhbXBsZS11cmw+XHJcbiAgKi9cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdtZWZkZXYtZmlsbC1tb2RhbCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2ZpbGwuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2ZpbGwuY29tcG9uZW50LnNjc3MnXSxcclxuICBhbmltYXRpb25zOiBbXHJcbiAgICB0cmlnZ2VyKCdkaWFsb2cnLCBbXHJcbiAgICAgIHRyYW5zaXRpb24oJ3ZvaWQgPT4gKicsIFtcclxuICAgICAgICBzdHlsZSh7IHRyYW5zZm9ybTogJ3NjYWxlM2QoLjMsIC4zLCAuMyknIH0pLFxyXG4gICAgICAgIGFuaW1hdGUoMTAwKVxyXG4gICAgICBdKSxcclxuICAgICAgdHJhbnNpdGlvbignKiA9PiB2b2lkJywgW1xyXG4gICAgICAgIGFuaW1hdGUoMTAwLCBzdHlsZSh7IHRyYW5zZm9ybTogJ3NjYWxlM2QoLjAsIC4wLCAuMCknIH0pKVxyXG4gICAgICBdKVxyXG4gICAgXSlcclxuICBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBGaWxsQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBwcm90ZWN0ZWQgdmlzaWJsZTogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICBAVmlld0NoaWxkKCdkaWFsb2cnLCB7IHN0YXRpYzogZmFsc2UgfSkgcHJvdGVjdGVkIGRpYWxvZz86IEVsZW1lbnRSZWY7XHJcblxyXG5cclxuICAvKipcclxuICAqIFRoZSBoZWFkZXIgdGVtcGxhdGUgb2YgdGhlIG1vZGFsIHdpbmRvdy5cclxuICAqIGBgYFxyXG4gICogPG1lZmRldi1maWxsLW1vZGFsICNwaW5fbW9kYWw+XHJcbiAgICogICA8bmctdGVtcGxhdGUgI21vZGFsX2hlYWRlcj5cclxuICAgKiAgICAgPCEtLSBIZWFkZXIgY29udGVudCBnb2VzIGhlcmUgLS0+XHJcbiAgICogICA8L25nLXRlbXBsYXRlPlxyXG4gICAqIDwvbWVmZGV2LWZpbGwtbW9kYWw+XHJcbiAgKiBgYGBcclxuICAqL1xyXG4gIEBDb250ZW50Q2hpbGQoXCJtb2RhbF9oZWFkZXJcIikgbW9kYWxfaGVhZGVyOiBUZW1wbGF0ZVJlZjx2b2lkPjtcclxuXHJcbiAgLyoqXHJcbiAgKiBUaGUgZm9vdGVyIHRlbXBsYXRlIG9mIHRoZSBtb2RhbCB3aW5kb3cuXHJcbiAgKiBgYGBcclxuICAqIDxtZWZkZXYtZmlsbC1tb2RhbCAjcGluX21vZGFsPlxyXG4gICAqICAgPG5nLXRlbXBsYXRlICNtb2RhbF9mb290ZXI+XHJcbiAgICogICAgIDwhLS0gRm9vdGVyIGNvbnRlbnQgZ29lcyBoZXJlIC0tPlxyXG4gICAqICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgKiA8L21lZmRldi1maWxsLW1vZGFsPlxyXG4gICogYGBgXHJcbiAgKi9cclxuICBAQ29udGVudENoaWxkKFwibW9kYWxfZm9vdGVyXCIpIG1vZGFsX2Zvb3RlcjogVGVtcGxhdGVSZWY8dm9pZD47XHJcblxyXG4gIC8qKlxyXG4gICAqIElucHV0IHBhcmFtZXRlciB0aGF0IGRldGVybWluZXMgd2hldGhlciB0byBzaG93IHRoZSBtb2RhbCB3aW5kb3cuXHJcbiAgICovXHJcbiAgQElucHV0KCkgc2V0IHNob3codmFsOiBib29sZWFuKXtcclxuICAgIGlmKHZhbCl7XHJcbiAgICAgIHRoaXMuc2hvd01vZGFsKCk7XHJcbiAgICB9XHJcbiAgICBlbHNle1xyXG4gICAgICB0aGlzLmhpZGVNb2RhbCgpO1xyXG4gICAgfVxyXG4gIH07XHJcblxyXG4gIC8qKlxyXG4gICAqIEV2ZW50IGVtaXR0ZWQgd2hlbiB0aGUgbW9kYWwgaXMgY2hhbmdlIHN0YXRlLlxyXG4gICAqIEVtaXRzIGEgYm9vbGVhbiB2YWx1ZSBpbmRpY2F0aW5nIGlmIHRoZSBtb2RhbCBpcyBjbG9zZWQoZmFsc2UpLCBvciBvcGVuKHRydWUpLlxyXG4gICAqIEV4YW1wbGU6XHJcbiAgICogYGBgXHJcbiAgICogPG1lZmRldi1maWxsLW1vZGFsICh2aXNpYmxlQ2hhbmdlKT1cIm9uTW9kYWxDbG9zZWQoJGV2ZW50KVwiPjwvbWVmZGV2LWZpbGwtbW9kYWw+XHJcbiAgICogYGBgXHJcbiAgICovXHJcbiAgQE91dHB1dCgpIHZpc2libGVDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XHJcblxyXG5cclxuICBjb25zdHJ1Y3RvcigpIHsgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICB9XHJcblxyXG4gIC8qKlxyXG4gICAqIFNob3dzIHRoZSBtb2RhbCBzdGF0ZS5cclxuICAgKiBSZXR1cm4gYSBib29sZWFuIHZhbHVlIGluZGljYXRpbmcgaWYgdGhlIG1vZGFsIGlzIGNsb3NlZChmYWxzZSksIG9yIG9wZW4odHJ1ZSlcclxuICAgKi9cclxuICBnZXRNb2RhbFN0YXRlKCk6IGJvb2xlYW57XHJcbiAgICByZXR1cm4gdGhpcy52aXNpYmxlO1xyXG4gIH1cclxuXHJcbiAgLyoqXHJcbiAgICogU2hvd3MgdGhlIG1vZGFsLlxyXG4gICAqIENhbGwgdGhpcyBtZXRob2QgdG8gb3BlbiB0aGUgbW9kYWwgd2luZG93LlxyXG4gICAqL1xyXG4gIHB1YmxpYyBzaG93TW9kYWwoKXtcclxuICAgIHRoaXMudmlzaWJsZSA9IHRydWU7XHJcbiAgICB0aGlzLnZpc2libGVDaGFuZ2UuZW1pdCh0aGlzLnZpc2libGUpO1xyXG4gIH1cclxuXHJcbiAgLyoqXHJcbiAgICogSGlkZXMgdGhlIG1vZGFsLlxyXG4gICAqIENhbGwgdGhpcyBtZXRob2QgdG8gY2xvc2UgdGhlIG1vZGFsIHdpbmRvdy5cclxuICAgKi9cclxuICBwdWJsaWMgaGlkZU1vZGFsKCl7XHJcbiAgICB0aGlzLnZpc2libGUgPSBmYWxzZTtcclxuICAgIHRoaXMudmlzaWJsZUNoYW5nZS5lbWl0KHRoaXMudmlzaWJsZSk7XHJcbiAgfVxyXG59XHJcbiIsIjxidXR0b24gKm5nSWY9XCJ2aXNpYmxlXCIgKGNsaWNrKT1cImhpZGVNb2RhbCgpXCIgYXJpYS1sYWJlbD1cIkNsb3NlXCIgY2xhc3M9XCJkaWFsb2dfX2Nsb3NlLWJ0blwiPlg8L2J1dHRvbj5cclxuPGRpdiBbQGRpYWxvZ10gKm5nSWY9XCJ2aXNpYmxlXCIgY2xhc3M9XCJkaWFsb2dcIiAjZGlhbG9nPlxyXG5cdDxkaXYgY2xhc3M9XCJtb2RhbC1jb250ZW50XCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwibW9kYWwtaGVhZGVyIGNsZWFyZml4IHRleHQtbGVmdFwiPlxyXG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cIm1vZGFsX2hlYWRlclwiPjwvbmctdGVtcGxhdGU+XHJcbiAgICAgIDwvZGl2PlxyXG4gICAgICA8ZGl2IGNsYXNzPVwibW9kYWwtYm9keVwiPlxyXG4gICAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gICAgICA8L2Rpdj5cclxuICAgICAgPGRpdiBjbGFzcz1cIm1vZGFsLWZvb3RlclwiPlxyXG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cIm1vZGFsX2Zvb3RlclwiPjwvbmctdGVtcGxhdGU+XHJcbiAgICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj5cclxuPGRpdiAqbmdJZj1cInZpc2libGVcIiBjbGFzcz1cIm92ZXJsYXlcIiAoY2xpY2spPVwiaGlkZU1vZGFsKClcIj48L2Rpdj5cclxuIl19

package/esm2022/lib/markup-kit/modals/markup-kit.module.mjs

@@ -2,7 +2,6 @@ import { NgModule } from "@angular/core";
 import { FillComponent } from './fill/fill.component';
 import { SlideUpComponent } from './slide-up/slide-up.component';
 import { SlideRightComponent } from './slide-right/slide-right.component';
-import { ModalModule } from "ngx-bootstrap/modal";
 import { CommonModule } from "@angular/common";
 import { RightFilterComponent } from "./right-filter/right-filter.component";
 import { MefDevSelectModule } from '../../pg-components/select/select.module';
@@ -14,25 +13,22 @@ let mefDevModalModuleComponents = [
     RightFilterComponent
 ];
 export class MefDevModalModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: MefDevModalModule, declarations: [FillComponent,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: MefDevModalModule, declarations: [FillComponent,
             SlideUpComponent,
             SlideRightComponent,
-            RightFilterComponent], imports: [ModalModule,
-            CommonModule,
+            RightFilterComponent], imports: [CommonModule,
             MefDevSelectModule], exports: [FillComponent,
             SlideUpComponent,
             SlideRightComponent,
             RightFilterComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevModalModule, imports: [ModalModule,
-            CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevModalModule, imports: [CommonModule,
             MefDevSelectModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MefDevModalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MefDevModalModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
-                        ModalModule,
                         CommonModule,
                         MefDevSelectModule
                     ],
@@ -40,4 +36,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     declarations: mefDevModalModuleComponents
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFya3VwLWtpdC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQtbGliL3NyYy9saWIvbWFya3VwLWtpdC9tb2RhbHMvbWFya3VwLWtpdC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDdEQsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDakUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFFMUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ2xELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUM3RSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSwwQ0FBMEMsQ0FBQzs7QUFHOUUsSUFBSSwyQkFBMkIsR0FBRztJQUNoQyxhQUFhO0lBQ2IsZ0JBQWdCO0lBQ2hCLG1CQUFtQjtJQUNuQixvQkFBb0I7Q0FDckIsQ0FBQztBQVVGLE1BQU0sT0FBTyxpQkFBaUI7dUdBQWpCLGlCQUFpQjt3R0FBakIsaUJBQWlCLGlCQWQ1QixhQUFhO1lBQ2IsZ0JBQWdCO1lBQ2hCLG1CQUFtQjtZQUNuQixvQkFBb0IsYUFJbEIsV0FBVztZQUNYLFlBQVk7WUFDWixrQkFBa0IsYUFUcEIsYUFBYTtZQUNiLGdCQUFnQjtZQUNoQixtQkFBbUI7WUFDbkIsb0JBQW9CO3dHQVdULGlCQUFpQixZQVAxQixXQUFXO1lBQ1gsWUFBWTtZQUNaLGtCQUFrQjs7MkZBS1QsaUJBQWlCO2tCQVQ3QixRQUFRO21CQUFDO29CQUNSLE9BQU8sRUFBRTt3QkFDUCxXQUFXO3dCQUNYLFlBQVk7d0JBQ1osa0JBQWtCO3FCQUNuQjtvQkFDRCxPQUFPLEVBQUUsMkJBQTJCO29CQUNwQyxZQUFZLEVBQUUsMkJBQTJCO2lCQUMxQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcclxuaW1wb3J0IHsgRmlsbENvbXBvbmVudCB9IGZyb20gJy4vZmlsbC9maWxsLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFNsaWRlVXBDb21wb25lbnQgfSBmcm9tICcuL3NsaWRlLXVwL3NsaWRlLXVwLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFNsaWRlUmlnaHRDb21wb25lbnQgfSBmcm9tICcuL3NsaWRlLXJpZ2h0L3NsaWRlLXJpZ2h0LmNvbXBvbmVudCc7XHJcblxyXG5pbXBvcnQgeyBNb2RhbE1vZHVsZSB9IGZyb20gXCJuZ3gtYm9vdHN0cmFwL21vZGFsXCI7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcclxuaW1wb3J0IHsgUmlnaHRGaWx0ZXJDb21wb25lbnQgfSBmcm9tIFwiLi9yaWdodC1maWx0ZXIvcmlnaHQtZmlsdGVyLmNvbXBvbmVudFwiO1xyXG5pbXBvcnQgeyBNZWZEZXZTZWxlY3RNb2R1bGUgfSBmcm9tICcuLi8uLi9wZy1jb21wb25lbnRzL3NlbGVjdC9zZWxlY3QubW9kdWxlJztcclxuXHJcblxyXG5sZXQgbWVmRGV2TW9kYWxNb2R1bGVDb21wb25lbnRzID0gW1xyXG4gIEZpbGxDb21wb25lbnQsXHJcbiAgU2xpZGVVcENvbXBvbmVudCxcclxuICBTbGlkZVJpZ2h0Q29tcG9uZW50LFxyXG4gIFJpZ2h0RmlsdGVyQ29tcG9uZW50XHJcbl07XHJcbkBOZ01vZHVsZSh7XHJcbiAgaW1wb3J0czogW1xyXG4gICAgTW9kYWxNb2R1bGUsXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBNZWZEZXZTZWxlY3RNb2R1bGVcclxuICBdLFxyXG4gIGV4cG9ydHM6IG1lZkRldk1vZGFsTW9kdWxlQ29tcG9uZW50cyxcclxuICBkZWNsYXJhdGlvbnM6IG1lZkRldk1vZGFsTW9kdWxlQ29tcG9uZW50c1xyXG59KVxyXG5leHBvcnQgY2xhc3MgTWVmRGV2TW9kYWxNb2R1bGUge31cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFya3VwLWtpdC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQtbGliL3NyYy9saWIvbWFya3VwLWtpdC9tb2RhbHMvbWFya3VwLWtpdC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDdEQsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDakUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFFMUUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHVDQUF1QyxDQUFDO0FBQzdFLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLDBDQUEwQyxDQUFDOztBQUc5RSxJQUFJLDJCQUEyQixHQUFHO0lBQ2hDLGFBQWE7SUFDYixnQkFBZ0I7SUFDaEIsbUJBQW1CO0lBQ25CLG9CQUFvQjtDQUNyQixDQUFDO0FBU0YsTUFBTSxPQUFPLGlCQUFpQjt1R0FBakIsaUJBQWlCO3dHQUFqQixpQkFBaUIsaUJBYjVCLGFBQWE7WUFDYixnQkFBZ0I7WUFDaEIsbUJBQW1CO1lBQ25CLG9CQUFvQixhQUlsQixZQUFZO1lBQ1osa0JBQWtCLGFBUnBCLGFBQWE7WUFDYixnQkFBZ0I7WUFDaEIsbUJBQW1CO1lBQ25CLG9CQUFvQjt3R0FVVCxpQkFBaUIsWUFOMUIsWUFBWTtZQUNaLGtCQUFrQjs7MkZBS1QsaUJBQWlCO2tCQVI3QixRQUFRO21CQUFDO29CQUNSLE9BQU8sRUFBRTt3QkFDUCxZQUFZO3dCQUNaLGtCQUFrQjtxQkFDbkI7b0JBQ0QsT0FBTyxFQUFFLDJCQUEyQjtvQkFDcEMsWUFBWSxFQUFFLDJCQUEyQjtpQkFDMUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7IEZpbGxDb21wb25lbnQgfSBmcm9tICcuL2ZpbGwvZmlsbC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTbGlkZVVwQ29tcG9uZW50IH0gZnJvbSAnLi9zbGlkZS11cC9zbGlkZS11cC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTbGlkZVJpZ2h0Q29tcG9uZW50IH0gZnJvbSAnLi9zbGlkZS1yaWdodC9zbGlkZS1yaWdodC5jb21wb25lbnQnO1xyXG5cclxuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xyXG5pbXBvcnQgeyBSaWdodEZpbHRlckNvbXBvbmVudCB9IGZyb20gXCIuL3JpZ2h0LWZpbHRlci9yaWdodC1maWx0ZXIuY29tcG9uZW50XCI7XHJcbmltcG9ydCB7IE1lZkRldlNlbGVjdE1vZHVsZSB9IGZyb20gJy4uLy4uL3BnLWNvbXBvbmVudHMvc2VsZWN0L3NlbGVjdC5tb2R1bGUnO1xyXG5cclxuXHJcbmxldCBtZWZEZXZNb2RhbE1vZHVsZUNvbXBvbmVudHMgPSBbXHJcbiAgRmlsbENvbXBvbmVudCxcclxuICBTbGlkZVVwQ29tcG9uZW50LFxyXG4gIFNsaWRlUmlnaHRDb21wb25lbnQsXHJcbiAgUmlnaHRGaWx0ZXJDb21wb25lbnRcclxuXTtcclxuQE5nTW9kdWxlKHtcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBNZWZEZXZTZWxlY3RNb2R1bGVcclxuICBdLFxyXG4gIGV4cG9ydHM6IG1lZkRldk1vZGFsTW9kdWxlQ29tcG9uZW50cyxcclxuICBkZWNsYXJhdGlvbnM6IG1lZkRldk1vZGFsTW9kdWxlQ29tcG9uZW50c1xyXG59KVxyXG5leHBvcnQgY2xhc3MgTWVmRGV2TW9kYWxNb2R1bGUge31cclxuIl19

package/esm2022/lib/markup-kit/modals/right-filter/right-filter.component.mjs

@@ -34,10 +34,10 @@ export class RightFilterComponent {
     modalIsCloused() {
         this.isOpen = false;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RightFilterComponent, deps: [{ token: i1.FilteredFieldService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RightFilterComponent, selector: "mefdev-right-filter", ngImport: i0, template: "<div class=\"filter-btn\">\r\n    <button class=\"btn btn-secondary text-danger\" (click)=\"openModal()\"><i class=\"fa fa-filter\" aria-hidden=\"true\"></i></button>\r\n</div>\r\n\r\n<mefdev-slide-right-modal [show]=\"isOpen\" (isClouse)=\"modalIsCloused()\">\r\n    <ng-content></ng-content>\r\n</mefdev-slide-right-modal>", styles: [".filter-btn{position:fixed;top:60px;z-index:450;right:25px}\n"], dependencies: [{ kind: "component", type: i2.SlideRightComponent, selector: "mefdev-slide-right-modal", inputs: ["size", "show"], outputs: ["isClouse"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: RightFilterComponent, deps: [{ token: i1.FilteredFieldService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: RightFilterComponent, selector: "mefdev-right-filter", ngImport: i0, template: "<div class=\"filter-btn\">\r\n    <button class=\"btn btn-secondary text-danger\" (click)=\"openModal()\"><i class=\"fa fa-filter\" aria-hidden=\"true\"></i></button>\r\n</div>\r\n\r\n<mefdev-slide-right-modal [show]=\"isOpen\" (isClouse)=\"modalIsCloused()\">\r\n    <ng-content></ng-content>\r\n</mefdev-slide-right-modal>", styles: [".filter-btn{position:fixed;top:60px;z-index:450;right:25px}\n"], dependencies: [{ kind: "component", type: i2.SlideRightComponent, selector: "mefdev-slide-right-modal", inputs: ["size", "show"], outputs: ["visibleChange"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RightFilterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: RightFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mefdev-right-filter', template: "<div class=\"filter-btn\">\r\n    <button class=\"btn btn-secondary text-danger\" (click)=\"openModal()\"><i class=\"fa fa-filter\" aria-hidden=\"true\"></i></button>\r\n</div>\r\n\r\n<mefdev-slide-right-modal [show]=\"isOpen\" (isClouse)=\"modalIsCloused()\">\r\n    <ng-content></ng-content>\r\n</mefdev-slide-right-modal>", styles: [".filter-btn{position:fixed;top:60px;z-index:450;right:25px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.FilteredFieldService }]; } });