mapa-library-ui 0.3.4 → 0.3.6

package/esm2020/src/lib/components/capability/lib/components/capability/src/capability-detail/capability-detail.component.mjs

@@ -22,11 +22,11 @@ export class MapaCapabilityDetailComponent {
     }
 }
 MapaCapabilityDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaCapabilityDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityDetailComponent, selector: "mapa-capability-detail", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"capability\">\n  <div *ngFor=\"let capability of data; let i = index\" class=\"capability__item\">\n    <div class=\"capability__item--header\">\n      <div>\n        <h1>{{ capability.name }}</h1>\n  \n        <div class=\"capability__item--dots\">\n          <mapa-capability-dot\n            *ngFor=\"let item of sortItemsByinterval(capability.items)\"\n            type=\"small\"\n            [item]=\"item\"\n            [capability]=\"capability\"\n            [tooltip]=\"true\"\n          ></mapa-capability-dot>\n        </div>\n      </div>\n  \n      <div class=\"capability__item--interval\">\n        <mapa-capability-interval-bar\n          [data]=\"capability\"\n          (clicked)=\"showMore(i)\"\n          reusable-interval-bar\n        ></mapa-capability-interval-bar>\n      </div>\n    </div>\n    <div [class.capability__item--show]=\"expanded.has(i)\" [class.capability__item--hide]=\"!expanded.has(i)\">\n      <mapa-capability-expand\n        [data]=\"capability\"\n      ></mapa-capability-expand>\n    </div>\n  </div>\n</div>\n", styles: [".capability{border:1px solid #8c8f94;border-radius:16px}.capability h1{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability__item{padding:16px 16px 0}.capability__item:not(:only-child){border-bottom:1px solid #8C8F94}.capability__item:last-child{border-bottom:unset}.capability__item--hide{display:none}.capability__item--show{display:block}.capability__item--header{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.capability__item--dots{display:flex}.capability__item--dots mapa-capability-dot{margin-right:8px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: ["type", "item", "tooltip", "capability"] }, { kind: "component", type: i3.MapaCapabilityIntervalBarComponent, selector: "mapa-capability-interval-bar", inputs: ["data"], outputs: ["clicked"] }, { kind: "component", type: i4.MapaCapabilityExpandComponent, selector: "mapa-capability-expand", inputs: ["data"] }], encapsulation: i0.ViewEncapsulation.None });
+MapaCapabilityDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaCapabilityDetailComponent, selector: "mapa-capability-detail", inputs: { data: "data" }, ngImport: i0, template: "<section class=\"capability\">\n  <div class=\"capability__core\">\n    <div *ngFor=\"let capability of data; let i = index\" class=\"capability__item\">\n      <div class=\"capability__item--header\">\n        <div>\n          <h1>{{ capability.name }}</h1>\n    \n          <div class=\"capability__item--dots\">\n            <mapa-capability-dot\n              *ngFor=\"let item of sortItemsByinterval(capability.items)\"\n              type=\"small\"\n              [item]=\"item\"\n              [capability]=\"capability\"\n              [tooltip]=\"true\"\n            ></mapa-capability-dot>\n          </div>\n        </div>\n    \n        <div class=\"capability__item--interval\">\n          <mapa-capability-interval-bar\n            [data]=\"capability\"\n            (clicked)=\"showMore(i)\"\n            reusable-interval-bar\n          ></mapa-capability-interval-bar>\n        </div>\n      </div>\n      <div [class.capability__item--show]=\"expanded.has(i)\" [class.capability__item--hide]=\"!expanded.has(i)\">\n        <mapa-capability-expand\n          [data]=\"capability\"\n        ></mapa-capability-expand>\n      </div>\n    </div>\n  </div>\n</section>", styles: [".capability{background-color:#f6f7f7;border-radius:16px}.capability h1{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability__core{border:1px solid #8c8f94;border-radius:16px;background-color:#fff}.capability__item{padding:16px 16px 0}.capability__item:not(:only-child){border-bottom:1px solid #8c8f94}.capability__item:last-child{border-bottom:unset}.capability__item--hide{display:none}.capability__item--show{display:block}.capability__item--header{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.capability__item--dots{display:flex}.capability__item--dots mapa-capability-dot{margin-right:8px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.MapaCapabilityDotComponent, selector: "mapa-capability-dot", inputs: ["type", "item", "tooltip", "capability"] }, { kind: "component", type: i3.MapaCapabilityIntervalBarComponent, selector: "mapa-capability-interval-bar", inputs: ["data"], outputs: ["clicked"] }, { kind: "component", type: i4.MapaCapabilityExpandComponent, selector: "mapa-capability-expand", inputs: ["data"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaCapabilityDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mapa-capability-detail", encapsulation: ViewEncapsulation.None, template: "<div class=\"capability\">\n  <div *ngFor=\"let capability of data; let i = index\" class=\"capability__item\">\n    <div class=\"capability__item--header\">\n      <div>\n        <h1>{{ capability.name }}</h1>\n  \n        <div class=\"capability__item--dots\">\n          <mapa-capability-dot\n            *ngFor=\"let item of sortItemsByinterval(capability.items)\"\n            type=\"small\"\n            [item]=\"item\"\n            [capability]=\"capability\"\n            [tooltip]=\"true\"\n          ></mapa-capability-dot>\n        </div>\n      </div>\n  \n      <div class=\"capability__item--interval\">\n        <mapa-capability-interval-bar\n          [data]=\"capability\"\n          (clicked)=\"showMore(i)\"\n          reusable-interval-bar\n        ></mapa-capability-interval-bar>\n      </div>\n    </div>\n    <div [class.capability__item--show]=\"expanded.has(i)\" [class.capability__item--hide]=\"!expanded.has(i)\">\n      <mapa-capability-expand\n        [data]=\"capability\"\n      ></mapa-capability-expand>\n    </div>\n  </div>\n</div>\n", styles: [".capability{border:1px solid #8c8f94;border-radius:16px}.capability h1{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability__item{padding:16px 16px 0}.capability__item:not(:only-child){border-bottom:1px solid #8C8F94}.capability__item:last-child{border-bottom:unset}.capability__item--hide{display:none}.capability__item--show{display:block}.capability__item--header{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.capability__item--dots{display:flex}.capability__item--dots mapa-capability-dot{margin-right:8px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px}\n"] }]
+            args: [{ selector: "mapa-capability-detail", encapsulation: ViewEncapsulation.None, template: "<section class=\"capability\">\n  <div class=\"capability__core\">\n    <div *ngFor=\"let capability of data; let i = index\" class=\"capability__item\">\n      <div class=\"capability__item--header\">\n        <div>\n          <h1>{{ capability.name }}</h1>\n    \n          <div class=\"capability__item--dots\">\n            <mapa-capability-dot\n              *ngFor=\"let item of sortItemsByinterval(capability.items)\"\n              type=\"small\"\n              [item]=\"item\"\n              [capability]=\"capability\"\n              [tooltip]=\"true\"\n            ></mapa-capability-dot>\n          </div>\n        </div>\n    \n        <div class=\"capability__item--interval\">\n          <mapa-capability-interval-bar\n            [data]=\"capability\"\n            (clicked)=\"showMore(i)\"\n            reusable-interval-bar\n          ></mapa-capability-interval-bar>\n        </div>\n      </div>\n      <div [class.capability__item--show]=\"expanded.has(i)\" [class.capability__item--hide]=\"!expanded.has(i)\">\n        <mapa-capability-expand\n          [data]=\"capability\"\n        ></mapa-capability-expand>\n      </div>\n    </div>\n  </div>\n</section>", styles: [".capability{background-color:#f6f7f7;border-radius:16px}.capability h1{font-family:SF-Pro;font-size:32px;font-style:normal;font-weight:400;line-height:40px}.capability__core{border:1px solid #8c8f94;border-radius:16px;background-color:#fff}.capability__item{padding:16px 16px 0}.capability__item:not(:only-child){border-bottom:1px solid #8c8f94}.capability__item:last-child{border-bottom:unset}.capability__item--hide{display:none}.capability__item--show{display:block}.capability__item--header{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.capability__item--dots{display:flex}.capability__item--dots mapa-capability-dot{margin-right:8px}\n", ".classification-1{background-color:#073e92;color:#fff}.classification-2{background-color:#0e6ece;color:#fff}.classification-3{background-color:#2d9ced;color:#fff}.classification-4{background-color:#68ceee;color:#000}.classification-5{background-color:#96f2ee;color:#000}.classification-6{background-color:#f598a7;color:#000}.classification-7{background-color:#f56580;color:#000}.classification-8{background-color:#f4284e;color:#fff}.classification-9{background-color:#c11c2f;color:#fff}.small-dot{width:12px;height:12px;border-radius:12px;padding:0;margin:0}.dot{width:16px;height:16px;border-radius:16px;padding:0;margin:0}.indicator{display:flex;padding:2px 4px 2px 16px;justify-content:space-between;align-items:center;border-radius:8px}\n"] }]
         }], propDecorators: { data: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FwYWJpbGl0eS1kZXRhaWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWFwYS1saWJyYXJ5LXVpL3NyYy9saWIvY29tcG9uZW50cy9jYXBhYmlsaXR5L3NyYy9jYXBhYmlsaXR5LWRldGFpbC9jYXBhYmlsaXR5LWRldGFpbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXBhLWxpYnJhcnktdWkvc3JjL2xpYi9jb21wb25lbnRzL2NhcGFiaWxpdHkvc3JjL2NhcGFiaWxpdHktZGV0YWlsL2NhcGFiaWxpdHktZGV0YWlsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUdMLGlCQUFpQixHQUNsQixNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBWXZCLE1BQU0sT0FBTyw2QkFBNkI7SUFUMUM7UUFXUyxhQUFRLEdBQUcsSUFBSSxHQUFHLEVBQVUsQ0FBQztLQWNyQztJQVpDLG1CQUFtQixDQUFDLEtBQVk7UUFDOUIsT0FBTyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBTSxFQUFFLENBQU0sRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLFFBQVEsR0FBRyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDakUsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFhO1FBQ3BCLElBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLEVBQUU7WUFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDN0I7YUFBTTtZQUNMLElBQUksQ0FBQyxRQUFRLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDdEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDMUI7SUFDSCxDQUFDOzsySEFmVSw2QkFBNkI7K0dBQTdCLDZCQUE2Qix3RkNsQjFDLCtpQ0FnQ0E7NEZEZGEsNkJBQTZCO2tCQVR6QyxTQUFTOytCQUNFLHdCQUF3QixpQkFNbkIsaUJBQWlCLENBQUMsSUFBSTs4QkFHNUIsSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgT25Jbml0LFxuICBWaWV3Q29udGFpbmVyUmVmLFxuICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IENhcGFiaWxpdHkgfSBmcm9tIFwiLi4vZXNzZW50aWFscy9pbnRlcmZhY2VzL2NhcGFiaWxpdHkuaW50ZXJmYWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJtYXBhLWNhcGFiaWxpdHktZGV0YWlsXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vY2FwYWJpbGl0eS1kZXRhaWwuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXG4gICAgXCIuL2NhcGFiaWxpdHktZGV0YWlsLmNvbXBvbmVudC5zY3NzXCIsXG4gICAgXCIuLy4uLy4uL3N0eWxlcy9jYXBhYmlsaXR5LnNjc3NcIixcbiAgXSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgTWFwYUNhcGFiaWxpdHlEZXRhaWxDb21wb25lbnQge1xuICBASW5wdXQoKSBkYXRhITogQ2FwYWJpbGl0eVtdO1xuICBwdWJsaWMgZXhwYW5kZWQgPSBuZXcgU2V0PG51bWJlcj4oKTtcblxuICBzb3J0SXRlbXNCeWludGVydmFsKGl0ZW1zOiBhbnlbXSk6IGFueVtdIHtcbiAgICByZXR1cm4gaXRlbXMuc29ydCgoYTogYW55LCBiOiBhbnkpID0+IGIuaW50ZXJ2YWwgLSBhLmludGVydmFsKTtcbiAgfVxuXG4gIHNob3dNb3JlKGluZGV4OiBudW1iZXIpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5leHBhbmRlZC5oYXMoaW5kZXgpKSB7XG4gICAgICB0aGlzLmV4cGFuZGVkLmRlbGV0ZShpbmRleCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuZXhwYW5kZWQuY2xlYXIoKTtcbiAgICAgIHRoaXMuZXhwYW5kZWQuYWRkKGluZGV4KTtcbiAgICB9XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJjYXBhYmlsaXR5XCI+XG4gIDxkaXYgKm5nRm9yPVwibGV0IGNhcGFiaWxpdHkgb2YgZGF0YTsgbGV0IGkgPSBpbmRleFwiIGNsYXNzPVwiY2FwYWJpbGl0eV9faXRlbVwiPlxuICAgIDxkaXYgY2xhc3M9XCJjYXBhYmlsaXR5X19pdGVtLS1oZWFkZXJcIj5cbiAgICAgIDxkaXY+XG4gICAgICAgIDxoMT57eyBjYXBhYmlsaXR5Lm5hbWUgfX08L2gxPlxuICBcbiAgICAgICAgPGRpdiBjbGFzcz1cImNhcGFiaWxpdHlfX2l0ZW0tLWRvdHNcIj5cbiAgICAgICAgICA8bWFwYS1jYXBhYmlsaXR5LWRvdFxuICAgICAgICAgICAgKm5nRm9yPVwibGV0IGl0ZW0gb2Ygc29ydEl0ZW1zQnlpbnRlcnZhbChjYXBhYmlsaXR5Lml0ZW1zKVwiXG4gICAgICAgICAgICB0eXBlPVwic21hbGxcIlxuICAgICAgICAgICAgW2l0ZW1dPVwiaXRlbVwiXG4gICAgICAgICAgICBbY2FwYWJpbGl0eV09XCJjYXBhYmlsaXR5XCJcbiAgICAgICAgICAgIFt0b29sdGlwXT1cInRydWVcIlxuICAgICAgICAgID48L21hcGEtY2FwYWJpbGl0eS1kb3Q+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gIFxuICAgICAgPGRpdiBjbGFzcz1cImNhcGFiaWxpdHlfX2l0ZW0tLWludGVydmFsXCI+XG4gICAgICAgIDxtYXBhLWNhcGFiaWxpdHktaW50ZXJ2YWwtYmFyXG4gICAgICAgICAgW2RhdGFdPVwiY2FwYWJpbGl0eVwiXG4gICAgICAgICAgKGNsaWNrZWQpPVwic2hvd01vcmUoaSlcIlxuICAgICAgICAgIHJldXNhYmxlLWludGVydmFsLWJhclxuICAgICAgICA+PC9tYXBhLWNhcGFiaWxpdHktaW50ZXJ2YWwtYmFyPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBbY2xhc3MuY2FwYWJpbGl0eV9faXRlbS0tc2hvd109XCJleHBhbmRlZC5oYXMoaSlcIiBbY2xhc3MuY2FwYWJpbGl0eV9faXRlbS0taGlkZV09XCIhZXhwYW5kZWQuaGFzKGkpXCI+XG4gICAgICA8bWFwYS1jYXBhYmlsaXR5LWV4cGFuZFxuICAgICAgICBbZGF0YV09XCJjYXBhYmlsaXR5XCJcbiAgICAgID48L21hcGEtY2FwYWJpbGl0eS1leHBhbmQ+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FwYWJpbGl0eS1kZXRhaWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWFwYS1saWJyYXJ5LXVpL3NyYy9saWIvY29tcG9uZW50cy9jYXBhYmlsaXR5L3NyYy9jYXBhYmlsaXR5LWRldGFpbC9jYXBhYmlsaXR5LWRldGFpbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXBhLWxpYnJhcnktdWkvc3JjL2xpYi9jb21wb25lbnRzL2NhcGFiaWxpdHkvc3JjL2NhcGFiaWxpdHktZGV0YWlsL2NhcGFiaWxpdHktZGV0YWlsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUdMLGlCQUFpQixHQUNsQixNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBWXZCLE1BQU0sT0FBTyw2QkFBNkI7SUFUMUM7UUFXUyxhQUFRLEdBQUcsSUFBSSxHQUFHLEVBQVUsQ0FBQztLQWNyQztJQVpDLG1CQUFtQixDQUFDLEtBQVk7UUFDOUIsT0FBTyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBTSxFQUFFLENBQU0sRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLFFBQVEsR0FBRyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDakUsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFhO1FBQ3BCLElBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLEVBQUU7WUFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDN0I7YUFBTTtZQUNMLElBQUksQ0FBQyxRQUFRLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDdEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDMUI7SUFDSCxDQUFDOzsySEFmVSw2QkFBNkI7K0dBQTdCLDZCQUE2Qix3RkNsQjFDLCtwQ0FpQ1U7NEZEZkcsNkJBQTZCO2tCQVR6QyxTQUFTOytCQUNFLHdCQUF3QixpQkFNbkIsaUJBQWlCLENBQUMsSUFBSTs4QkFHNUIsSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgT25Jbml0LFxuICBWaWV3Q29udGFpbmVyUmVmLFxuICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IENhcGFiaWxpdHkgfSBmcm9tIFwiLi4vZXNzZW50aWFscy9pbnRlcmZhY2VzL2NhcGFiaWxpdHkuaW50ZXJmYWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJtYXBhLWNhcGFiaWxpdHktZGV0YWlsXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vY2FwYWJpbGl0eS1kZXRhaWwuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXG4gICAgXCIuL2NhcGFiaWxpdHktZGV0YWlsLmNvbXBvbmVudC5zY3NzXCIsXG4gICAgXCIuLy4uLy4uL3N0eWxlcy9jYXBhYmlsaXR5LnNjc3NcIixcbiAgXSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgTWFwYUNhcGFiaWxpdHlEZXRhaWxDb21wb25lbnQge1xuICBASW5wdXQoKSBkYXRhITogQ2FwYWJpbGl0eVtdO1xuICBwdWJsaWMgZXhwYW5kZWQgPSBuZXcgU2V0PG51bWJlcj4oKTtcblxuICBzb3J0SXRlbXNCeWludGVydmFsKGl0ZW1zOiBhbnlbXSk6IGFueVtdIHtcbiAgICByZXR1cm4gaXRlbXMuc29ydCgoYTogYW55LCBiOiBhbnkpID0+IGIuaW50ZXJ2YWwgLSBhLmludGVydmFsKTtcbiAgfVxuXG4gIHNob3dNb3JlKGluZGV4OiBudW1iZXIpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5leHBhbmRlZC5oYXMoaW5kZXgpKSB7XG4gICAgICB0aGlzLmV4cGFuZGVkLmRlbGV0ZShpbmRleCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuZXhwYW5kZWQuY2xlYXIoKTtcbiAgICAgIHRoaXMuZXhwYW5kZWQuYWRkKGluZGV4KTtcbiAgICB9XG4gIH1cbn1cbiIsIjxzZWN0aW9uIGNsYXNzPVwiY2FwYWJpbGl0eVwiPlxuICA8ZGl2IGNsYXNzPVwiY2FwYWJpbGl0eV9fY29yZVwiPlxuICAgIDxkaXYgKm5nRm9yPVwibGV0IGNhcGFiaWxpdHkgb2YgZGF0YTsgbGV0IGkgPSBpbmRleFwiIGNsYXNzPVwiY2FwYWJpbGl0eV9faXRlbVwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNhcGFiaWxpdHlfX2l0ZW0tLWhlYWRlclwiPlxuICAgICAgICA8ZGl2PlxuICAgICAgICAgIDxoMT57eyBjYXBhYmlsaXR5Lm5hbWUgfX08L2gxPlxuICAgIFxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJjYXBhYmlsaXR5X19pdGVtLS1kb3RzXCI+XG4gICAgICAgICAgICA8bWFwYS1jYXBhYmlsaXR5LWRvdFxuICAgICAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBzb3J0SXRlbXNCeWludGVydmFsKGNhcGFiaWxpdHkuaXRlbXMpXCJcbiAgICAgICAgICAgICAgdHlwZT1cInNtYWxsXCJcbiAgICAgICAgICAgICAgW2l0ZW1dPVwiaXRlbVwiXG4gICAgICAgICAgICAgIFtjYXBhYmlsaXR5XT1cImNhcGFiaWxpdHlcIlxuICAgICAgICAgICAgICBbdG9vbHRpcF09XCJ0cnVlXCJcbiAgICAgICAgICAgID48L21hcGEtY2FwYWJpbGl0eS1kb3Q+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgIFxuICAgICAgICA8ZGl2IGNsYXNzPVwiY2FwYWJpbGl0eV9faXRlbS0taW50ZXJ2YWxcIj5cbiAgICAgICAgICA8bWFwYS1jYXBhYmlsaXR5LWludGVydmFsLWJhclxuICAgICAgICAgICAgW2RhdGFdPVwiY2FwYWJpbGl0eVwiXG4gICAgICAgICAgICAoY2xpY2tlZCk9XCJzaG93TW9yZShpKVwiXG4gICAgICAgICAgICByZXVzYWJsZS1pbnRlcnZhbC1iYXJcbiAgICAgICAgICA+PC9tYXBhLWNhcGFiaWxpdHktaW50ZXJ2YWwtYmFyPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBbY2xhc3MuY2FwYWJpbGl0eV9faXRlbS0tc2hvd109XCJleHBhbmRlZC5oYXMoaSlcIiBbY2xhc3MuY2FwYWJpbGl0eV9faXRlbS0taGlkZV09XCIhZXhwYW5kZWQuaGFzKGkpXCI+XG4gICAgICAgIDxtYXBhLWNhcGFiaWxpdHktZXhwYW5kXG4gICAgICAgICAgW2RhdGFdPVwiY2FwYWJpbGl0eVwiXG4gICAgICAgID48L21hcGEtY2FwYWJpbGl0eS1leHBhbmQ+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L3NlY3Rpb24+Il19

package/esm2020/src/lib/components/capability/lib/components/dropdown/src/dropdown.component.mjs

@@ -84,10 +84,10 @@ export class MapaDropdownComponent {
     }
 }
 MapaDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
+MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
+            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { formControl: [{
                 type: Input
             }], formControlSearch: [{

package/esm2020/src/lib/components/chart/lib/components/dropdown/src/dropdown.component.mjs

@@ -84,10 +84,10 @@ export class MapaDropdownComponent {
     }
 }
 MapaDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
+MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
+            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { formControl: [{
                 type: Input
             }], formControlSearch: [{

package/esm2020/src/lib/components/dropdown/lib/components/dropdown/src/dropdown.component.mjs

@@ -84,10 +84,10 @@ export class MapaDropdownComponent {
     }
 }
 MapaDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
+MapaDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaDropdownComponent, selector: "mapa-dropdown", inputs: { formControl: "formControl", formControlSearch: "formControlSearch", element: "element", border: "border" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
+            args: [{ selector: "mapa-dropdown", encapsulation: ViewEncapsulation.None, template: "<label *ngIf=\"element.label\" class=\"mapa-dropdown__label\">\n  {{ element.label }}\n</label>\n<mat-form-field\n  appearance=\"outline\"\n  class=\"mapa-dropdown\"\n  [class.mapa-dropdown--highlight]=\"border === 'highlight'\"\n  [class.mapa-dropdown--soft-border]=\"border === 'soft'\"\n  [class.mapa-dropdown--tag]=\"border === 'tag'\"\n  [class.mapa-dropdown--labeled]=\"!!element.label\">\n  <mat-select\n    #dropdown\n    [formControl]=\"formControl\"\n    [multiple]=\"element.multiple\"\n    [placeholder]=\"element.placeholder || ''\"\n  >\n    <mat-option *ngIf=\"element.search\" class=\"mapa-dropdown__search\">\n      <ngx-mat-select-search\n        *ngIf=\"element.search.formControl\"\n        [showToggleAllCheckbox]=\"true\"\n        [formControl]=\"element.search.formControl\"\n        [placeholderLabel]=\"element.search.placeholder || ''\"\n        i18n-placeholderLabel\n        [noEntriesFoundLabel]=\"element.search.noEntriesFoundLabel || ''\"\n        [toggleAllCheckboxIndeterminate]=\"isIndeterminate\"\n        [toggleAllCheckboxChecked]=\"isChecked\"\n        (toggleAll)=\"toggleSelectAll($event)\"\n      ></ngx-mat-select-search>\n    </mat-option>\n\n    <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n      {{ option.value }}\n    </mat-option>\n  </mat-select>\n  <mat-error\n    *ngIf=\"formControl?.hasError('required')\">\n    {{ element.errors?.required }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('minlength')\">\n    {{ element.errors?.minlength }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cpf')\">\n    {{ element.errors?.cpf }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('cnpj')\">\n    {{ element.errors?.cnpj }}\n  </mat-error>\n  <mat-error\n    *ngIf=\"formControl?.hasError('email')\">\n    {{ element.errors?.email }}\n  </mat-error>\n</mat-form-field>\n", styles: [".mapa-dropdown{max-width:min-content;min-width:235px}.mapa-dropdown .mat-select{font-family:SF-Pro!important}.mapa-dropdown .mat-icon{display:flex;justify-content:center;align-items:center}.mapa-dropdown__label{display:block;font-size:12px;font-style:normal;font-weight:600;line-height:16px;text-transform:uppercase;margin-bottom:16px}.mapa-dropdown--highlight .mat-form-field-outline{border-radius:16px!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-width:2px!important;border-color:#eedb2a}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--highlight .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--soft-border .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important}.mapa-dropdown--tag .mat-form-field-outline{border-radius:16px!important;height:42px!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-width:1px!important;border-color:#cdcdcd}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-start{display:none!important}.mapa-dropdown--tag .mat-form-field-outline .mat-form-field-outline-end{border-radius:16px!important;border-left-style:solid!important}.mapa-dropdown .mat-form-field-outline{background-color:#fff;border-radius:8px}.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-start,.mapa-dropdown .mat-form-field-outline .mat-form-field-outline-end{border-width:2px}.mapa-dropdown .mat-form-field-flex{display:flex;align-items:center;height:48px}.mapa-dropdown .mat-form-field-infix{border-top:unset!important;padding:unset!important}.mapa-dropdown .mat-select-trigger{min-width:50px;padding-top:.3em;height:unset!important}.mapa-dropdown .mat-select-value-text{display:block;width:90%}.mapa-dropdown .mat-select-arrow-wrapper{transform:none!important}.mapa-dropdown .mat-select-arrow{border:unset}.mapa-dropdown .mat-select-arrow:before,.mapa-dropdown .mat-select-arrow:after{content:\"\";display:block;margin-top:-4px;position:absolute;right:10px;top:50%;width:0;border:solid black;border-width:0 2px 2px 0;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.mapa-dropdown [aria-expanded=true] .mat-select-arrow{margin:6px 0 0}.mapa-dropdown [aria-expanded=true] .mat-select-arrow:before,.mapa-dropdown [aria-expanded=true] .mat-select-arrow:after{transform:rotate(-135deg)!important;-webkit-transform:rotate(-135deg)!important}.mapa-overlay-dropdown{transform:translate(-16px) translateY(36px)!important}.mapa-overlay-dropdown .mat-select-panel{border-radius:8px;min-width:calc(100% + 24px)!important}.mapa-overlay-dropdown .mat-select-panel .mat-option,.mapa-overlay-dropdown .mat-select-panel .mat-option-text{font-family:SF-Pro!important;font-size:16px;font-style:normal;font-weight:400;line-height:2em;height:2em;color:#50575e}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option{display:flex;padding:16px 8px!important;flex-direction:column;justify-content:center;align-items:center;gap:10px;align-self:stretch;background:#f6f7f7;height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inside-mat-option{height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-clear{top:-3px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-inner{top:8px;border:2px solid #a7aaad;border-radius:8px!important;width:100%!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-toggle-all-checkbox{padding-left:8px!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input{padding:8px 8px 8px 6px!important;height:unset!important;line-height:unset!important}.mapa-overlay-dropdown .mapa-dropdown__search.mat-option .mat-select-search-input::placeholder{color:#c3c4c7!important}.mapa-overlay-dropdown .mapa-dropdown__search .mat-option-text{width:100%}.mapa-overlay-dropdown .mat-pseudo-checkbox{color:#c3c4c7!important}.mapa-overlay-dropdown .mat-checkbox-frame{border-color:#c3c4c7!important}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { formControl: [{
                 type: Input
             }], formControlSearch: [{

package/esm2020/src/lib/components/table/lib/components/table/src/table.component.mjs

@@ -193,10 +193,10 @@ export class MapaTableComponent {
     }
 }
 MapaTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaTableComponent, selector: "mapa-table", inputs: { columns: "columns", data: "data", checkbox: "checkbox", actions: "actions", groupReport: "groupReport", isGroupReport: "isGroupReport" }, outputs: { rowClick: "rowClick", selectedRows: "selectedRows" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"mapa-table\">\n  <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"sortDataFunction($event)\">\n    <ng-container\n      *ngFor=\"let column of columns; let isFirst = first\"\n      [matColumnDef]=\"column.key\" \n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        mat-sort-header\n        [disabled]=\"!(column.key !== 'actions' ? column.sort : null)\"\n      >\n        <div\n          [ngTemplateOutlet]=\"tableHeader\"\n          [ngTemplateOutletContext]=\"{ selection, column, isFirst, checkbox }\"\n        ></div>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <div \n          class=\"mapa-table__column\"\n          (click)=\"emitRowClick(row, '')\"\n          *ngIf=\"column.key !== 'actions'; else columnActions\"\n        > \n          <ng-container *ngIf=\"isFirst && checkbox\">\n            <mat-checkbox\n              (click)=\"$event.stopPropagation()\"\n              (change)=\"$event ? selection.toggle(row) : null; getSelectedValues()\"\n              [checked]=\"selection.isSelected(row)\"\n            >\n            </mat-checkbox>\n          </ng-container>\n          <div class=\"table__column\" [ngClass]=\"{ 'center-cell': isGroupReport }\">\n            <div *ngIf=\"!isGroupReport\">\n              <ng-container *ngIf=\"isMaskedData(column, row); else statusContent\">\n                {{ getValueAsDate(column, row) | date: column.mask }}\n              </ng-container>\n              <ng-template #statusContent>\n                <ng-container *ngIf=\"column.statusLabel; else commonContent\">\n                  <ng-container *ngIf=\"isBoolean(column, row); else commonStatus\">\n                    {{ column.statusLabel[row[column.key] ? 1 : 0] }}\n                  </ng-container>\n                  <ng-template #commonStatus>{{ column.statusLabel[row[column.key] - 1] }}</ng-template>\n                </ng-container>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n              <ng-template #statusContent>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n            </div>\n            <div *ngIf=\"isGroupReport\">\n              <div [ngClass]=\"getCellClass(column, row)\">\n                <ng-container *ngIf=\"column.key === 'name' || column.key === 'cpf' || column.key === 'general'; else scoreOrIntervalContent\">\n                  <div *ngIf=\"column.key === 'name'\">\n                    <div class=\"name\">\n                      {{ row.name }}<br>\n                    </div>\n                    <div class=\"cpf\">\n                      {{row.cpf}}\n                    </div>\n                  </div>\n                  <div *ngIf=\"column.key === 'general'\" class=\"general\">\n                    {{ row[column.key] }}%\n                  </div>\n                </ng-container>\n                <ng-template #scoreOrIntervalContent>\n                  <ng-container *ngIf=\"row[column.key] && row[column.key].scoreT; else intervalContent\">\n                    {{ row[column.key].scoreT }}%\n                  </ng-container>\n                  <ng-template #intervalContent>\n                    {{ row[column.key]?.interval }}%\n                  </ng-template>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </div>\n        <ng-template #columnActions>\n          <div class=\"mapa-table__column--actions\">\n            <mat-icon (click)=\"emitRowClick(row, 'edit')\">edit</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'delete')\">delete</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'visibility')\">visibility</mat-icon>\n          </div>\n        </ng-template>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" [ngClass]=\"getRowClass()\"></tr>\n  </table>\n  <mat-paginator \n    class=\"mapa-table__paginator-legacy\"\n    itemsPerPageLabel=\"Item por p\u00E1gina\"\n    appStylePaginatorMv\n    [length]=\"dataSource ? dataSource.data.length : 0\"\n    [pageSize]=\"5\"\n    [pageSizeOptions]=\"[5, 10, 25, 100]\"\n  >\n  </mat-paginator>\n</div>\n\n<ng-template\n  #tableHeader\n  let-selection=\"selection\"\n  let-column=\"column\"\n  let-isFirst=\"isFirst\"\n  let-checkbox=\"checkbox\"\n>\n  <div class=\"mapa-table__column mapa-table__column--header\">\n    <ng-container *ngIf=\"isFirst && checkbox\">\n      <mat-checkbox\n        (change)=\"$event ? toggleAllRows() : null\"\n        [checked]=\"selection.hasValue() && isAllSelected()\"\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n        (click)=\"$event.stopPropagation()\"\n      >\n      </mat-checkbox>\n    </ng-container>\n    <div class=\"mapa-table__label\" [ngClass]=\"{ 'label_report': isGroupReport }\">\n      {{ column.label }}\n    </div>\n    <div *ngIf=\"column.key !== 'actions' && column.sort\">\n      <mat-icon>filter_list</mat-icon>\n    </div>\n  </div>\n</ng-template>\n", styles: [".mapa-table .mat-table{font-family:SF-Pro;width:100%}.mapa-table .mat-table .mat-checkbox{margin:6px 8px 0 0;padding:0}.mapa-table td.mat-cell{padding:16px 0}.mapa-table .mat-table .mat-row .mat-cell{font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:400;color:#50575e}.mapa-table .row-hover:hover{box-shadow:0 2px 4px #00000021;outline:1px solid rgba(238,238,238,.93);cursor:pointer}.mapa-table .mat-table .mat-header-cell{border:none;border-bottom:1px solid #eee;font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:600;color:#50575e}.mapa-table .mat-icon{cursor:pointer;position:relative;bottom:-3px;margin:0 7px 0 0;font-size:14px;height:14px;width:14px}.mapa-table .mat-mdc-row,.mapa-table .mdc-data-table__content,.mapa-table .mat-mdc-header-cell{--mat-table-row-item-label-text-font: \"SF-Pro\"}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-frame{border-color:#b6b6b6}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-frame{border-color:#ea561d}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-background{background-color:transparent}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-background{background-color:#ea561d}.mapa-table .mat-mdc-paginator-container{display:flex;justify-content:space-between}.mapa-table ::ng-deep .mat-mdc-paginator-page-size-label{display:none}.mapa-table__paginator-legacy .mat-paginator-container{font-family:SF-Pro!important;justify-content:flex-start}.mapa-table__paginator-legacy .mat-paginator-page-size{margin-right:10vw}.mapa-table__paginator-legacy .custom-paginator-container{justify-content:flex-end}.mapa-table__paginator-legacy .custom-paginator-counter{white-space:nowrap;margin:0 4px 0 10px!important}.mapa-table__paginator-legacy .custom-paginator-page{border-radius:4px;outline:none;border:none;margin:.4em;font-size:14px;min-width:24px;width:auto;min-height:24px;max-height:24px;padding:1px 6px}.mapa-table__paginator-legacy .custom-paginator-page-enabled{color:#50575e;background:transparent;cursor:pointer}.mapa-table__paginator-legacy .custom-paginator-page-enabled:hover{background-color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-page-disabled{background-color:#ea561d;color:#fff}.mapa-table__paginator-legacy .custom-paginator-arrow-disabled{color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-arrow-enabled{color:#999}.mapa-table{width:100vw;white-space:nowrap}.mapa-table__label{margin-top:4px}.mapa-table__column{padding:15px;align-items:center;display:flex}.mapa-table__column--actions{display:flex}.mapa-table__column--actions .mat-icon{color:#ea561d!important}.mapa-table__column--header{justify-content:space-between;width:100%}.mapa-table .mat-sort-header-content{width:100%}.mapa-table .mat-cell,.mapa-table .mat-header-cell{padding:0 10px!important}.mapa-table .mat-table{width:100%;overflow-x:auto}.mapa-table .red-0-25{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f598a7;color:#000}.mapa-table .red-26-50{width:43px;height:43px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f56580;color:#000}.mapa-table .red-51-75{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f4284e;color:#fff}.mapa-table .red-76-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#c11c2f;color:#fff}.mapa-table .blue-0-20{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#96f2ee;color:#fff}.mapa-table .blue-21-40{width:42px;height:42px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#68ceee;color:#fff}.mapa-table .blue-41-60{width:44px;height:44px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#2d9ced;color:#fff}.mapa-table .blue-61-80{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#0e6ece;color:#fff}.mapa-table .blue-81-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#073e92;color:#fff}.mapa-table .roundCell{border-radius:10px}.mapa-table .general{border-radius:24px;border:1px solid #dcdcde;display:flex;justify-content:center;align-items:center;width:48px;height:48px}.mapa-table .name{color:#181818;text-align:left;font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px}.mapa-table .cpf{color:var(--Grey-Grey-30, #8c8f94);text-align:left;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.mapa-table .center-cell{margin:auto}.mapa-table .label_report{color:#181818;text-align:center;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i7.PaginatorLegacyDirective, selector: "[appStylePaginatorMv]" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], encapsulation: i0.ViewEncapsulation.None });
+MapaTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaTableComponent, selector: "mapa-table", inputs: { columns: "columns", data: "data", checkbox: "checkbox", actions: "actions", groupReport: "groupReport", isGroupReport: "isGroupReport" }, outputs: { rowClick: "rowClick", selectedRows: "selectedRows" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"mapa-table\">\n  <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"sortDataFunction($event)\">\n    <ng-container\n      *ngFor=\"let column of columns; let isFirst = first\"\n      [matColumnDef]=\"column.key\" \n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        mat-sort-header\n        [disabled]=\"!(column.key !== 'actions' ? column.sort : null)\"\n      >\n        <div\n          [ngTemplateOutlet]=\"tableHeader\"\n          [ngTemplateOutletContext]=\"{ selection, column, isFirst, checkbox }\"\n        ></div>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <div \n          class=\"mapa-table__column\"\n          (click)=\"emitRowClick(row, '')\"\n          *ngIf=\"column.key !== 'actions'; else columnActions\"\n        > \n          <ng-container *ngIf=\"isFirst && checkbox\">\n            <mat-checkbox\n              (click)=\"$event.stopPropagation()\"\n              (change)=\"$event ? selection.toggle(row) : null; getSelectedValues()\"\n              [checked]=\"selection.isSelected(row)\"\n            >\n            </mat-checkbox>\n          </ng-container>\n          <div class=\"table__column\" [ngClass]=\"{ 'center-cell': isGroupReport }\">\n            <div *ngIf=\"!isGroupReport\">\n              <ng-container *ngIf=\"isMaskedData(column, row); else statusContent\">\n                {{ getValueAsDate(column, row) | date: column.mask }}\n              </ng-container>\n              <ng-template #statusContent>\n                <ng-container *ngIf=\"column.statusLabel; else commonContent\">\n                  <ng-container *ngIf=\"isBoolean(column, row); else commonStatus\">\n                    {{ column.statusLabel[row[column.key] ? 1 : 0] }}\n                  </ng-container>\n                  <ng-template #commonStatus>{{ column.statusLabel[row[column.key] - 1] }}</ng-template>\n                </ng-container>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n              <ng-template #statusContent>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n            </div>\n            <div *ngIf=\"isGroupReport\">\n              <div [ngClass]=\"getCellClass(column, row)\">\n                <ng-container *ngIf=\"column.key === 'name' || column.key === 'cpf' || column.key === 'general'; else scoreOrIntervalContent\">\n                  <div *ngIf=\"column.key === 'name'\">\n                    <div class=\"name\">\n                      {{ row.name }}<br>\n                    </div>\n                    <div class=\"cpf\">\n                      {{row.cpf}}\n                    </div>\n                  </div>\n                  <div *ngIf=\"column.key === 'general'\" class=\"general\">\n                    {{ row[column.key] }}%\n                  </div>\n                </ng-container>\n                <ng-template #scoreOrIntervalContent>\n                  <ng-container *ngIf=\"row[column.key] && row[column.key].scoreT; else intervalContent\">\n                    {{ row[column.key].scoreT }}%\n                  </ng-container>\n                  <ng-template #intervalContent>\n                    {{ row[column.key]?.interval }}%\n                  </ng-template>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </div>\n        <ng-template #columnActions>\n          <div class=\"mapa-table__column--actions\">\n            <mat-icon (click)=\"emitRowClick(row, 'edit')\">edit</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'delete')\">delete</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'visibility')\">visibility</mat-icon>\n          </div>\n        </ng-template>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" [ngClass]=\"getRowClass()\"></tr>\n  </table>\n  <mat-paginator \n    class=\"mapa-table__paginator-legacy\"\n    itemsPerPageLabel=\"Item por p\u00E1gina\"\n    appStylePaginatorMv\n    [length]=\"dataSource ? dataSource.data.length : 0\"\n    [pageSize]=\"5\"\n    [pageSizeOptions]=\"[5, 10, 25, 100]\"\n  >\n  </mat-paginator>\n</div>\n\n<ng-template\n  #tableHeader\n  let-selection=\"selection\"\n  let-column=\"column\"\n  let-isFirst=\"isFirst\"\n  let-checkbox=\"checkbox\"\n>\n  <div class=\"mapa-table__column mapa-table__column--header\">\n    <ng-container *ngIf=\"isFirst && checkbox\">\n      <mat-checkbox\n        (change)=\"$event ? toggleAllRows() : null\"\n        [checked]=\"selection.hasValue() && isAllSelected()\"\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n        (click)=\"$event.stopPropagation()\"\n      >\n      </mat-checkbox>\n    </ng-container>\n    <div class=\"mapa-table__label\" [ngClass]=\"{ 'label_report': isGroupReport }\">\n      {{ column.label }}\n    </div>\n    <div *ngIf=\"column.key !== 'actions' && column.sort\">\n      <mat-icon>filter_list</mat-icon>\n    </div>\n  </div>\n</ng-template>\n", styles: [".mapa-table .mat-table{font-family:SF-Pro;width:100%}.mapa-table .mat-table .mat-checkbox{margin:6px 8px 0 0;padding:0}.mapa-table td.mat-cell{padding:16px 0}.mapa-table .mat-table .mat-row .mat-cell{font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:400;color:#50575e}.mapa-table .row-hover:hover{box-shadow:0 2px 4px #00000021;outline:1px solid rgba(238,238,238,.93);cursor:pointer}.mapa-table .mat-table .mat-header-cell{border:none;border-bottom:1px solid #eee;font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:600;color:#50575e}.mapa-table .mat-icon{cursor:pointer;position:relative;bottom:-3px;margin:0 7px 0 0;font-size:14px;height:14px;width:14px}.mapa-table .mat-mdc-row,.mapa-table .mdc-data-table__content,.mapa-table .mat-mdc-header-cell{--mat-table-row-item-label-text-font: \"SF-Pro\"}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-frame{border-color:#b6b6b6}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-frame{border-color:#ea561d}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-background{background-color:transparent}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-background{background-color:#ea561d}.mapa-table .mat-mdc-paginator-container{display:flex;justify-content:space-between}.mapa-table ::ng-deep .mat-mdc-paginator-page-size-label{display:none}.mapa-table__paginator-legacy .mat-paginator-container{font-family:SF-Pro!important;justify-content:flex-start}.mapa-table__paginator-legacy .mat-paginator-page-size{margin-right:10vw}.mapa-table__paginator-legacy .custom-paginator-container{justify-content:flex-end}.mapa-table__paginator-legacy .custom-paginator-counter{white-space:nowrap;margin:0 4px 0 10px!important}.mapa-table__paginator-legacy .custom-paginator-page{border-radius:4px;outline:none;border:none;margin:.4em;font-size:14px;min-width:24px;width:auto;min-height:24px;max-height:24px;padding:1px 6px}.mapa-table__paginator-legacy .custom-paginator-page-enabled{color:#50575e;background:transparent;cursor:pointer}.mapa-table__paginator-legacy .custom-paginator-page-enabled:hover{background-color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-page-disabled{background-color:#ea561d;color:#fff}.mapa-table__paginator-legacy .custom-paginator-arrow-disabled{color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-arrow-enabled{color:#999}.mapa-table{width:100%;white-space:nowrap}.mapa-table__label{margin-top:4px}.mapa-table__column{padding:15px;align-items:center;display:flex}.mapa-table__column--actions{display:flex}.mapa-table__column--actions .mat-icon{color:#ea561d!important}.mapa-table__column--header{justify-content:space-between;width:100%}.mapa-table .mat-sort-header-content{width:100%}.mapa-table .mat-cell,.mapa-table .mat-header-cell{padding:0 10px!important}.mapa-table .mat-table{width:100%;overflow-x:auto}.mapa-table .red-0-25{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f598a7;color:#000}.mapa-table .red-26-50{width:43px;height:43px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f56580;color:#000}.mapa-table .red-51-75{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f4284e;color:#fff}.mapa-table .red-76-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#c11c2f;color:#fff}.mapa-table .blue-0-20{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#96f2ee;color:#fff}.mapa-table .blue-21-40{width:42px;height:42px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#68ceee;color:#fff}.mapa-table .blue-41-60{width:44px;height:44px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#2d9ced;color:#fff}.mapa-table .blue-61-80{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#0e6ece;color:#fff}.mapa-table .blue-81-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#073e92;color:#fff}.mapa-table .roundCell{border-radius:10px}.mapa-table .general{border-radius:24px;border:1px solid #dcdcde;display:flex;justify-content:center;align-items:center;width:48px;height:48px}.mapa-table .name{color:#181818;text-align:left;font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px}.mapa-table .cpf{color:var(--Grey-Grey-30, #8c8f94);text-align:left;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.mapa-table .center-cell{margin:auto}.mapa-table .label_report{color:#181818;text-align:center;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i7.PaginatorLegacyDirective, selector: "[appStylePaginatorMv]" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: "mapa-table", encapsulation: ViewEncapsulation.None, template: "<div class=\"mapa-table\">\n  <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"sortDataFunction($event)\">\n    <ng-container\n      *ngFor=\"let column of columns; let isFirst = first\"\n      [matColumnDef]=\"column.key\" \n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        mat-sort-header\n        [disabled]=\"!(column.key !== 'actions' ? column.sort : null)\"\n      >\n        <div\n          [ngTemplateOutlet]=\"tableHeader\"\n          [ngTemplateOutletContext]=\"{ selection, column, isFirst, checkbox }\"\n        ></div>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <div \n          class=\"mapa-table__column\"\n          (click)=\"emitRowClick(row, '')\"\n          *ngIf=\"column.key !== 'actions'; else columnActions\"\n        > \n          <ng-container *ngIf=\"isFirst && checkbox\">\n            <mat-checkbox\n              (click)=\"$event.stopPropagation()\"\n              (change)=\"$event ? selection.toggle(row) : null; getSelectedValues()\"\n              [checked]=\"selection.isSelected(row)\"\n            >\n            </mat-checkbox>\n          </ng-container>\n          <div class=\"table__column\" [ngClass]=\"{ 'center-cell': isGroupReport }\">\n            <div *ngIf=\"!isGroupReport\">\n              <ng-container *ngIf=\"isMaskedData(column, row); else statusContent\">\n                {{ getValueAsDate(column, row) | date: column.mask }}\n              </ng-container>\n              <ng-template #statusContent>\n                <ng-container *ngIf=\"column.statusLabel; else commonContent\">\n                  <ng-container *ngIf=\"isBoolean(column, row); else commonStatus\">\n                    {{ column.statusLabel[row[column.key] ? 1 : 0] }}\n                  </ng-container>\n                  <ng-template #commonStatus>{{ column.statusLabel[row[column.key] - 1] }}</ng-template>\n                </ng-container>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n              <ng-template #statusContent>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n            </div>\n            <div *ngIf=\"isGroupReport\">\n              <div [ngClass]=\"getCellClass(column, row)\">\n                <ng-container *ngIf=\"column.key === 'name' || column.key === 'cpf' || column.key === 'general'; else scoreOrIntervalContent\">\n                  <div *ngIf=\"column.key === 'name'\">\n                    <div class=\"name\">\n                      {{ row.name }}<br>\n                    </div>\n                    <div class=\"cpf\">\n                      {{row.cpf}}\n                    </div>\n                  </div>\n                  <div *ngIf=\"column.key === 'general'\" class=\"general\">\n                    {{ row[column.key] }}%\n                  </div>\n                </ng-container>\n                <ng-template #scoreOrIntervalContent>\n                  <ng-container *ngIf=\"row[column.key] && row[column.key].scoreT; else intervalContent\">\n                    {{ row[column.key].scoreT }}%\n                  </ng-container>\n                  <ng-template #intervalContent>\n                    {{ row[column.key]?.interval }}%\n                  </ng-template>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </div>\n        <ng-template #columnActions>\n          <div class=\"mapa-table__column--actions\">\n            <mat-icon (click)=\"emitRowClick(row, 'edit')\">edit</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'delete')\">delete</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'visibility')\">visibility</mat-icon>\n          </div>\n        </ng-template>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" [ngClass]=\"getRowClass()\"></tr>\n  </table>\n  <mat-paginator \n    class=\"mapa-table__paginator-legacy\"\n    itemsPerPageLabel=\"Item por p\u00E1gina\"\n    appStylePaginatorMv\n    [length]=\"dataSource ? dataSource.data.length : 0\"\n    [pageSize]=\"5\"\n    [pageSizeOptions]=\"[5, 10, 25, 100]\"\n  >\n  </mat-paginator>\n</div>\n\n<ng-template\n  #tableHeader\n  let-selection=\"selection\"\n  let-column=\"column\"\n  let-isFirst=\"isFirst\"\n  let-checkbox=\"checkbox\"\n>\n  <div class=\"mapa-table__column mapa-table__column--header\">\n    <ng-container *ngIf=\"isFirst && checkbox\">\n      <mat-checkbox\n        (change)=\"$event ? toggleAllRows() : null\"\n        [checked]=\"selection.hasValue() && isAllSelected()\"\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n        (click)=\"$event.stopPropagation()\"\n      >\n      </mat-checkbox>\n    </ng-container>\n    <div class=\"mapa-table__label\" [ngClass]=\"{ 'label_report': isGroupReport }\">\n      {{ column.label }}\n    </div>\n    <div *ngIf=\"column.key !== 'actions' && column.sort\">\n      <mat-icon>filter_list</mat-icon>\n    </div>\n  </div>\n</ng-template>\n", styles: [".mapa-table .mat-table{font-family:SF-Pro;width:100%}.mapa-table .mat-table .mat-checkbox{margin:6px 8px 0 0;padding:0}.mapa-table td.mat-cell{padding:16px 0}.mapa-table .mat-table .mat-row .mat-cell{font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:400;color:#50575e}.mapa-table .row-hover:hover{box-shadow:0 2px 4px #00000021;outline:1px solid rgba(238,238,238,.93);cursor:pointer}.mapa-table .mat-table .mat-header-cell{border:none;border-bottom:1px solid #eee;font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:600;color:#50575e}.mapa-table .mat-icon{cursor:pointer;position:relative;bottom:-3px;margin:0 7px 0 0;font-size:14px;height:14px;width:14px}.mapa-table .mat-mdc-row,.mapa-table .mdc-data-table__content,.mapa-table .mat-mdc-header-cell{--mat-table-row-item-label-text-font: \"SF-Pro\"}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-frame{border-color:#b6b6b6}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-frame{border-color:#ea561d}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-background{background-color:transparent}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-background{background-color:#ea561d}.mapa-table .mat-mdc-paginator-container{display:flex;justify-content:space-between}.mapa-table ::ng-deep .mat-mdc-paginator-page-size-label{display:none}.mapa-table__paginator-legacy .mat-paginator-container{font-family:SF-Pro!important;justify-content:flex-start}.mapa-table__paginator-legacy .mat-paginator-page-size{margin-right:10vw}.mapa-table__paginator-legacy .custom-paginator-container{justify-content:flex-end}.mapa-table__paginator-legacy .custom-paginator-counter{white-space:nowrap;margin:0 4px 0 10px!important}.mapa-table__paginator-legacy .custom-paginator-page{border-radius:4px;outline:none;border:none;margin:.4em;font-size:14px;min-width:24px;width:auto;min-height:24px;max-height:24px;padding:1px 6px}.mapa-table__paginator-legacy .custom-paginator-page-enabled{color:#50575e;background:transparent;cursor:pointer}.mapa-table__paginator-legacy .custom-paginator-page-enabled:hover{background-color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-page-disabled{background-color:#ea561d;color:#fff}.mapa-table__paginator-legacy .custom-paginator-arrow-disabled{color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-arrow-enabled{color:#999}.mapa-table{width:100vw;white-space:nowrap}.mapa-table__label{margin-top:4px}.mapa-table__column{padding:15px;align-items:center;display:flex}.mapa-table__column--actions{display:flex}.mapa-table__column--actions .mat-icon{color:#ea561d!important}.mapa-table__column--header{justify-content:space-between;width:100%}.mapa-table .mat-sort-header-content{width:100%}.mapa-table .mat-cell,.mapa-table .mat-header-cell{padding:0 10px!important}.mapa-table .mat-table{width:100%;overflow-x:auto}.mapa-table .red-0-25{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f598a7;color:#000}.mapa-table .red-26-50{width:43px;height:43px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f56580;color:#000}.mapa-table .red-51-75{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f4284e;color:#fff}.mapa-table .red-76-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#c11c2f;color:#fff}.mapa-table .blue-0-20{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#96f2ee;color:#fff}.mapa-table .blue-21-40{width:42px;height:42px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#68ceee;color:#fff}.mapa-table .blue-41-60{width:44px;height:44px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#2d9ced;color:#fff}.mapa-table .blue-61-80{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#0e6ece;color:#fff}.mapa-table .blue-81-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#073e92;color:#fff}.mapa-table .roundCell{border-radius:10px}.mapa-table .general{border-radius:24px;border:1px solid #dcdcde;display:flex;justify-content:center;align-items:center;width:48px;height:48px}.mapa-table .name{color:#181818;text-align:left;font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px}.mapa-table .cpf{color:var(--Grey-Grey-30, #8c8f94);text-align:left;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.mapa-table .center-cell{margin:auto}.mapa-table .label_report{color:#181818;text-align:center;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}\n"] }]
+            args: [{ selector: "mapa-table", encapsulation: ViewEncapsulation.None, template: "<div class=\"mapa-table\">\n  <table mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"sortDataFunction($event)\">\n    <ng-container\n      *ngFor=\"let column of columns; let isFirst = first\"\n      [matColumnDef]=\"column.key\" \n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        mat-sort-header\n        [disabled]=\"!(column.key !== 'actions' ? column.sort : null)\"\n      >\n        <div\n          [ngTemplateOutlet]=\"tableHeader\"\n          [ngTemplateOutletContext]=\"{ selection, column, isFirst, checkbox }\"\n        ></div>\n      </th>\n      <td mat-cell *matCellDef=\"let row\">\n        <div \n          class=\"mapa-table__column\"\n          (click)=\"emitRowClick(row, '')\"\n          *ngIf=\"column.key !== 'actions'; else columnActions\"\n        > \n          <ng-container *ngIf=\"isFirst && checkbox\">\n            <mat-checkbox\n              (click)=\"$event.stopPropagation()\"\n              (change)=\"$event ? selection.toggle(row) : null; getSelectedValues()\"\n              [checked]=\"selection.isSelected(row)\"\n            >\n            </mat-checkbox>\n          </ng-container>\n          <div class=\"table__column\" [ngClass]=\"{ 'center-cell': isGroupReport }\">\n            <div *ngIf=\"!isGroupReport\">\n              <ng-container *ngIf=\"isMaskedData(column, row); else statusContent\">\n                {{ getValueAsDate(column, row) | date: column.mask }}\n              </ng-container>\n              <ng-template #statusContent>\n                <ng-container *ngIf=\"column.statusLabel; else commonContent\">\n                  <ng-container *ngIf=\"isBoolean(column, row); else commonStatus\">\n                    {{ column.statusLabel[row[column.key] ? 1 : 0] }}\n                  </ng-container>\n                  <ng-template #commonStatus>{{ column.statusLabel[row[column.key] - 1] }}</ng-template>\n                </ng-container>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n              <ng-template #statusContent>\n                <ng-template #commonContent>{{ row[column.key] }}</ng-template>\n              </ng-template>\n            </div>\n            <div *ngIf=\"isGroupReport\">\n              <div [ngClass]=\"getCellClass(column, row)\">\n                <ng-container *ngIf=\"column.key === 'name' || column.key === 'cpf' || column.key === 'general'; else scoreOrIntervalContent\">\n                  <div *ngIf=\"column.key === 'name'\">\n                    <div class=\"name\">\n                      {{ row.name }}<br>\n                    </div>\n                    <div class=\"cpf\">\n                      {{row.cpf}}\n                    </div>\n                  </div>\n                  <div *ngIf=\"column.key === 'general'\" class=\"general\">\n                    {{ row[column.key] }}%\n                  </div>\n                </ng-container>\n                <ng-template #scoreOrIntervalContent>\n                  <ng-container *ngIf=\"row[column.key] && row[column.key].scoreT; else intervalContent\">\n                    {{ row[column.key].scoreT }}%\n                  </ng-container>\n                  <ng-template #intervalContent>\n                    {{ row[column.key]?.interval }}%\n                  </ng-template>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </div>\n        <ng-template #columnActions>\n          <div class=\"mapa-table__column--actions\">\n            <mat-icon (click)=\"emitRowClick(row, 'edit')\">edit</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'delete')\">delete</mat-icon>\n            <mat-icon (click)=\"emitRowClick(row, 'visibility')\">visibility</mat-icon>\n          </div>\n        </ng-template>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" [ngClass]=\"getRowClass()\"></tr>\n  </table>\n  <mat-paginator \n    class=\"mapa-table__paginator-legacy\"\n    itemsPerPageLabel=\"Item por p\u00E1gina\"\n    appStylePaginatorMv\n    [length]=\"dataSource ? dataSource.data.length : 0\"\n    [pageSize]=\"5\"\n    [pageSizeOptions]=\"[5, 10, 25, 100]\"\n  >\n  </mat-paginator>\n</div>\n\n<ng-template\n  #tableHeader\n  let-selection=\"selection\"\n  let-column=\"column\"\n  let-isFirst=\"isFirst\"\n  let-checkbox=\"checkbox\"\n>\n  <div class=\"mapa-table__column mapa-table__column--header\">\n    <ng-container *ngIf=\"isFirst && checkbox\">\n      <mat-checkbox\n        (change)=\"$event ? toggleAllRows() : null\"\n        [checked]=\"selection.hasValue() && isAllSelected()\"\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n        (click)=\"$event.stopPropagation()\"\n      >\n      </mat-checkbox>\n    </ng-container>\n    <div class=\"mapa-table__label\" [ngClass]=\"{ 'label_report': isGroupReport }\">\n      {{ column.label }}\n    </div>\n    <div *ngIf=\"column.key !== 'actions' && column.sort\">\n      <mat-icon>filter_list</mat-icon>\n    </div>\n  </div>\n</ng-template>\n", styles: [".mapa-table .mat-table{font-family:SF-Pro;width:100%}.mapa-table .mat-table .mat-checkbox{margin:6px 8px 0 0;padding:0}.mapa-table td.mat-cell{padding:16px 0}.mapa-table .mat-table .mat-row .mat-cell{font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:400;color:#50575e}.mapa-table .row-hover:hover{box-shadow:0 2px 4px #00000021;outline:1px solid rgba(238,238,238,.93);cursor:pointer}.mapa-table .mat-table .mat-header-cell{border:none;border-bottom:1px solid #eee;font-family:SF-Pro;font-size:16px;font-style:normal;font-weight:600;color:#50575e}.mapa-table .mat-icon{cursor:pointer;position:relative;bottom:-3px;margin:0 7px 0 0;font-size:14px;height:14px;width:14px}.mapa-table .mat-mdc-row,.mapa-table .mdc-data-table__content,.mapa-table .mat-mdc-header-cell{--mat-table-row-item-label-text-font: \"SF-Pro\"}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-frame{border-color:#b6b6b6}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-frame{border-color:#ea561d}.mapa-table .mat-checkbox.mat-accent .mat-checkbox-background{background-color:transparent}.mapa-table .mat-checkbox.mat-accent.mat-checkbox-checked .mat-checkbox-background{background-color:#ea561d}.mapa-table .mat-mdc-paginator-container{display:flex;justify-content:space-between}.mapa-table ::ng-deep .mat-mdc-paginator-page-size-label{display:none}.mapa-table__paginator-legacy .mat-paginator-container{font-family:SF-Pro!important;justify-content:flex-start}.mapa-table__paginator-legacy .mat-paginator-page-size{margin-right:10vw}.mapa-table__paginator-legacy .custom-paginator-container{justify-content:flex-end}.mapa-table__paginator-legacy .custom-paginator-counter{white-space:nowrap;margin:0 4px 0 10px!important}.mapa-table__paginator-legacy .custom-paginator-page{border-radius:4px;outline:none;border:none;margin:.4em;font-size:14px;min-width:24px;width:auto;min-height:24px;max-height:24px;padding:1px 6px}.mapa-table__paginator-legacy .custom-paginator-page-enabled{color:#50575e;background:transparent;cursor:pointer}.mapa-table__paginator-legacy .custom-paginator-page-enabled:hover{background-color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-page-disabled{background-color:#ea561d;color:#fff}.mapa-table__paginator-legacy .custom-paginator-arrow-disabled{color:#dfe3e6}.mapa-table__paginator-legacy .custom-paginator-arrow-enabled{color:#999}.mapa-table{width:100%;white-space:nowrap}.mapa-table__label{margin-top:4px}.mapa-table__column{padding:15px;align-items:center;display:flex}.mapa-table__column--actions{display:flex}.mapa-table__column--actions .mat-icon{color:#ea561d!important}.mapa-table__column--header{justify-content:space-between;width:100%}.mapa-table .mat-sort-header-content{width:100%}.mapa-table .mat-cell,.mapa-table .mat-header-cell{padding:0 10px!important}.mapa-table .mat-table{width:100%;overflow-x:auto}.mapa-table .red-0-25{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f598a7;color:#000}.mapa-table .red-26-50{width:43px;height:43px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f56580;color:#000}.mapa-table .red-51-75{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#f4284e;color:#fff}.mapa-table .red-76-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#c11c2f;color:#fff}.mapa-table .blue-0-20{width:40px;height:40px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#96f2ee;color:#fff}.mapa-table .blue-21-40{width:42px;height:42px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#68ceee;color:#fff}.mapa-table .blue-41-60{width:44px;height:44px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#2d9ced;color:#fff}.mapa-table .blue-61-80{width:46px;height:46px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#0e6ece;color:#fff}.mapa-table .blue-81-100{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;background-color:#073e92;color:#fff}.mapa-table .roundCell{border-radius:10px}.mapa-table .general{border-radius:24px;border:1px solid #dcdcde;display:flex;justify-content:center;align-items:center;width:48px;height:48px}.mapa-table .name{color:#181818;text-align:left;font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px}.mapa-table .cpf{color:var(--Grey-Grey-30, #8c8f94);text-align:left;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.mapa-table .center-cell{margin:auto}.mapa-table .label_report{color:#181818;text-align:center;font-family:SF-Pro;font-size:12px;font-style:normal;font-weight:400;line-height:16px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { columns: [{
                 type: Input
             }], data: [{

package/esm2020/src/lib/components/warning/src/warning.component.mjs

@@ -4,10 +4,10 @@ import * as i1 from "@angular/material/icon";
 export class MapaWarningComponent {
 }
 MapaWarningComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaWarningComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MapaWarningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaWarningComponent, selector: "mapa-warning", inputs: { firstLine: "firstLine", secondLine: "secondLine" }, ngImport: i0, template: "<div class=\"warning\">\n  <div class=\"material-icons\">\n    <mat-icon>warning</mat-icon>\n  </div>\n  <div>\n    <p>\n      {{ firstLine }}\n    </p>\n    <p>\n      {{ secondLine }}\n    </p>\n  </div>\n</div>\n", styles: [".warning{background:#eedb2a;display:flex;padding:21px 45px;align-items:flex-start}.warning p{font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0}.warning .material-icons{margin-right:16px;margin-top:auto;margin-bottom:auto;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
+MapaWarningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MapaWarningComponent, selector: "mapa-warning", inputs: { firstLine: "firstLine", secondLine: "secondLine" }, ngImport: i0, template: "<div class=\"warning\">\n  <div class=\"material-icons\">\n    <mat-icon>warning</mat-icon>\n  </div>\n  <div>\n    <p>\n      {{ firstLine }}\n    </p>\n    <p>\n      {{ secondLine }}\n    </p>\n  </div>\n</div>\n", styles: [".warning{background:#eedb2a;display:flex;padding:21px 45px;align-items:flex-start}.warning p{font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:500;line-height:20px;margin:0}.warning .material-icons{margin-right:16px;margin-top:auto;margin-bottom:auto;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MapaWarningComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mapa-warning', template: "<div class=\"warning\">\n  <div class=\"material-icons\">\n    <mat-icon>warning</mat-icon>\n  </div>\n  <div>\n    <p>\n      {{ firstLine }}\n    </p>\n    <p>\n      {{ secondLine }}\n    </p>\n  </div>\n</div>\n", styles: [".warning{background:#eedb2a;display:flex;padding:21px 45px;align-items:flex-start}.warning p{font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:400;line-height:20px;margin:0}.warning .material-icons{margin-right:16px;margin-top:auto;margin-bottom:auto;display:flex;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'mapa-warning', template: "<div class=\"warning\">\n  <div class=\"material-icons\">\n    <mat-icon>warning</mat-icon>\n  </div>\n  <div>\n    <p>\n      {{ firstLine }}\n    </p>\n    <p>\n      {{ secondLine }}\n    </p>\n  </div>\n</div>\n", styles: [".warning{background:#eedb2a;display:flex;padding:21px 45px;align-items:flex-start}.warning p{font-family:SF-Pro;font-size:14px;font-style:normal;font-weight:500;line-height:20px;margin:0}.warning .material-icons{margin-right:16px;margin-top:auto;margin-bottom:auto;display:flex;align-items:center;justify-content:center}\n"] }]
         }], propDecorators: { firstLine: [{
                 type: Input
             }], secondLine: [{