@progressio_resources/gravity-design-system 3.6.0 → 3.6.1

package/esm2022/lib/components/gravity-chip-group/gravity-chip-group.component.mjs

@@ -28,11 +28,11 @@ export class GravityChipGroupComponent {
         return this.selectedItems.some((i) => i.id === item.id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityChipGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityChipGroupComponent, selector: "gravity-chip-group", inputs: { disabled: "disabled", size: "size", items: "items" }, outputs: { clickOnChip: "clickOnChip" }, ngImport: i0, template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;gap:var(--gravity-spacing-sm);flex-wrap:wrap}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;gap:var(--gravity-spacing-xs);border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{height:32px}.chips-wrapper .gravity-chip.md{height:44px}\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: "component", type: i2.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityChipGroupComponent, selector: "gravity-chip-group", inputs: { disabled: "disabled", size: "size", items: "items" }, outputs: { clickOnChip: "clickOnChip" }, ngImport: i0, template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;flex-wrap:wrap;row-gap:var(--gravity-spacing-sm)}@media (min-width: 993px){.chips-wrapper{gap:var(--gravity-spacing-sm)}}@media (max-width: 992px){.chips-wrapper{gap:var(--gravity-spacing-xs)}}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{gap:var(--gravity-spacing-xs);height:32px}.chips-wrapper .gravity-chip.md{gap:var(--gravity-spacing-sm);height:44px}\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: "component", type: i2.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityChipGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-chip-group', template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;gap:var(--gravity-spacing-sm);flex-wrap:wrap}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;gap:var(--gravity-spacing-xs);border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{height:32px}.chips-wrapper .gravity-chip.md{height:44px}\n"] }]
+            args: [{ selector: 'gravity-chip-group', template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;flex-wrap:wrap;row-gap:var(--gravity-spacing-sm)}@media (min-width: 993px){.chips-wrapper{gap:var(--gravity-spacing-sm)}}@media (max-width: 992px){.chips-wrapper{gap:var(--gravity-spacing-xs)}}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{gap:var(--gravity-spacing-xs);height:32px}.chips-wrapper .gravity-chip.md{gap:var(--gravity-spacing-sm);height:44px}\n"] }]
         }], propDecorators: { disabled: [{
                 type: Input
             }], size: [{

package/esm2022/lib/components/gravity-notification/gravity-notification.component.mjs

@@ -7,16 +7,27 @@ export class GravityNotificationComponent {
     constructor(ngbActiveModal) {
         this.ngbActiveModal = ngbActiveModal;
     }
+    get iconByState() {
+        if (this.notificationContent.state === 'success') {
+            return 'check';
+        }
+        else if (this.notificationContent.state === 'error') {
+            return 'unsuccess';
+        }
+        else if (this.notificationContent.state === 'warning') {
+            return 'warning-circle';
+        }
+    }
     closeModal() {
         this.ngbActiveModal.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, deps: [{ token: i1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <!--TODO ebiazzetti change icons-->\n    <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\" [size]=\"'md'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <gravity-icon class=\"title-icon\" [iconName]=\"iconByState\" [iconSize]=\"'md-16'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, decorators: [{
             type: Component,
-            args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <!--TODO ebiazzetti change icons-->\n    <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\" [size]=\"'md'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
+            args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <gravity-icon class=\"title-icon\" [iconName]=\"iconByState\" [iconSize]=\"'md-16'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.NgbActiveModal }]; }, propDecorators: { notificationContent: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS1ub3RpZmljYXRpb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3Jhdml0eS1kZXNpZ24tc3lzdGVtL3NyYy9saWIvY29tcG9uZW50cy9ncmF2aXR5LW5vdGlmaWNhdGlvbi9ncmF2aXR5LW5vdGlmaWNhdGlvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ncmF2aXR5LWRlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2dyYXZpdHktbm90aWZpY2F0aW9uL2dyYXZpdHktbm90aWZpY2F0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsS0FBSyxFQUFDLE1BQU0sZUFBZSxDQUFDOzs7OztBQVEvQyxNQUFNLE9BQU8sNEJBQTRCO0lBR3ZDLFlBQTZCLGNBQThCO1FBQTlCLG1CQUFjLEdBQWQsY0FBYyxDQUFnQjtJQUMzRCxDQUFDO0lBRU0sVUFBVTtRQUNmLElBQUksQ0FBQyxjQUFjLENBQUMsS0FBSyxFQUFFLENBQUM7SUFDOUIsQ0FBQzsrR0FSVSw0QkFBNEI7bUdBQTVCLDRCQUE0Qiw0R0NSekMsNjhCQW9CQTs7NEZEWmEsNEJBQTRCO2tCQUp4QyxTQUFTOztxR0FLUSxtQkFBbUI7c0JBQWxDLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgSW5wdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtOZ2JBY3RpdmVNb2RhbH0gZnJvbSBcIkBuZy1ib290c3RyYXAvbmctYm9vdHN0cmFwXCI7XG5pbXBvcnQge0dyYXZpdHlOb3RpZmljYXRpb25Db250ZW50fSBmcm9tIFwiLi9ncmF2aXR5LW5vdGlmaWNhdGlvbi1jb250ZW50LmludGVyZmFjZVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgdGVtcGxhdGVVcmw6ICcuL2dyYXZpdHktbm90aWZpY2F0aW9uLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZ3Jhdml0eS1ub3RpZmljYXRpb24uY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBHcmF2aXR5Tm90aWZpY2F0aW9uQ29tcG9uZW50IHtcbiAgQElucHV0KCkgcHVibGljIG5vdGlmaWNhdGlvbkNvbnRlbnQ6IEdyYXZpdHlOb3RpZmljYXRpb25Db250ZW50O1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgbmdiQWN0aXZlTW9kYWw6IE5nYkFjdGl2ZU1vZGFsKSB7XG4gIH1cblxuICBwdWJsaWMgY2xvc2VNb2RhbCgpOiB2b2lkIHtcbiAgICB0aGlzLm5nYkFjdGl2ZU1vZGFsLmNsb3NlKCk7XG4gIH1cbn1cbiIsIjxtYWluIGNsYXNzPVwiYWxlcnQtY29udGVudCB7e25vdGlmaWNhdGlvbkNvbnRlbnQuc3RhdGV9fVwiPlxuICA8Z3Jhdml0eS1pY29uIGNsYXNzPVwiY2xvc2VcIiAoY2xpY2spPVwiY2xvc2VNb2RhbCgpXCIgZGF0YS1jeT1cImdyYXZpdHlfbm90aWZpY2F0aW9uX2luZm9ybWF0aXZlX2Nsb3NlX2ljb25cIlxuICAgICAgICAgICAgICAgIFtpY29uTmFtZV09XCIndW5zdWNjZXNzJ1wiIFt0aXRsZV09XCInQ2xvc2UnXCIgW2ljb25TaXplXT1cIidtZC0xNidcIj48L2dyYXZpdHktaWNvbj5cblxuICA8ZGl2IGNsYXNzPVwidGl0bGVcIj5cbiAgICA8IS0tVE9ETyBlYmlhenpldHRpIGNoYW5nZSBpY29ucy0tPlxuICAgIDxncmF2aXR5LWljb24gY2xhc3M9XCJ0aXRsZS1pY29uXCIgW2ljb25OYW1lXT1cIidub3RpZmljYXRpb25fJyArIG5vdGlmaWNhdGlvbkNvbnRlbnQuc3RhdGVcIiBbc2l6ZV09XCInbWQnXCI+PC9ncmF2aXR5LWljb24+XG4gICAgPGgxIGNsYXNzPVwiaHItdGl0bGUgbGctYm9sZFwiPnt7bm90aWZpY2F0aW9uQ29udGVudC50aXRsZX19PC9oMT5cbiAgPC9kaXY+XG5cbiAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIj5cbiAgICA8aDIgY2xhc3M9XCJoci1ib2R5IG1kLXJlZ3VsYXJcIj57e25vdGlmaWNhdGlvbkNvbnRlbnQudGV4dH19PC9oMj5cbiAgICA8aDIgY2xhc3M9XCJoci1ib2R5IG1kLXJlZ3VsYXJcIiAqbmdJZj1cIm5vdGlmaWNhdGlvbkNvbnRlbnQuZGV0YWlsc1wiPlxuICAgICAgRGV0YWlsOiA8Yj57e25vdGlmaWNhdGlvbkNvbnRlbnQuZGV0YWlsc319PC9iPlxuICAgIDwvaDI+XG4gICAgPGgyIGNsYXNzPVwiaHItYm9keSBtZC1yZWd1bGFyXCIgKm5nSWY9XCJub3RpZmljYXRpb25Db250ZW50LmVycm9yQ29kZVwiPlxuICAgICAgRXJyb3IgY29kZTogPGI+e3tub3RpZmljYXRpb25Db250ZW50LmVycm9yQ29kZX19PC9iPlxuICAgIDwvaDI+XG4gIDwvZGl2PlxuPC9tYWluPlxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS1ub3RpZmljYXRpb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3Jhdml0eS1kZXNpZ24tc3lzdGVtL3NyYy9saWIvY29tcG9uZW50cy9ncmF2aXR5LW5vdGlmaWNhdGlvbi9ncmF2aXR5LW5vdGlmaWNhdGlvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ncmF2aXR5LWRlc2lnbi1zeXN0ZW0vc3JjL2xpYi9jb21wb25lbnRzL2dyYXZpdHktbm90aWZpY2F0aW9uL2dyYXZpdHktbm90aWZpY2F0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsS0FBSyxFQUFDLE1BQU0sZUFBZSxDQUFDOzs7OztBQVEvQyxNQUFNLE9BQU8sNEJBQTRCO0lBR3ZDLFlBQTZCLGNBQThCO1FBQTlCLG1CQUFjLEdBQWQsY0FBYyxDQUFnQjtJQUMzRCxDQUFDO0lBRUQsSUFBVyxXQUFXO1FBQ3BCLElBQUksSUFBSSxDQUFDLG1CQUFtQixDQUFDLEtBQUssS0FBSyxTQUFTLEVBQUU7WUFDaEQsT0FBTyxPQUFPLENBQUM7U0FDaEI7YUFBTSxJQUFJLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxLQUFLLEtBQUssT0FBTyxFQUFFO1lBQ3JELE9BQU8sV0FBVyxDQUFDO1NBQ3BCO2FBQU0sSUFBSSxJQUFJLENBQUMsbUJBQW1CLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRTtZQUN2RCxPQUFPLGdCQUFnQixDQUFBO1NBQ3hCO0lBQ0gsQ0FBQztJQUVNLFVBQVU7UUFDZixJQUFJLENBQUMsY0FBYyxDQUFDLEtBQUssRUFBRSxDQUFDO0lBQzlCLENBQUM7K0dBbEJVLDRCQUE0QjttR0FBNUIsNEJBQTRCLDRHQ1J6QywyNEJBbUJBOzs0RkRYYSw0QkFBNEI7a0JBSnhDLFNBQVM7O3FHQUtRLG1CQUFtQjtzQkFBbEMsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBJbnB1dH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge05nYkFjdGl2ZU1vZGFsfSBmcm9tIFwiQG5nLWJvb3RzdHJhcC9uZy1ib290c3RyYXBcIjtcbmltcG9ydCB7R3Jhdml0eU5vdGlmaWNhdGlvbkNvbnRlbnR9IGZyb20gXCIuL2dyYXZpdHktbm90aWZpY2F0aW9uLWNvbnRlbnQuaW50ZXJmYWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICB0ZW1wbGF0ZVVybDogJy4vZ3Jhdml0eS1ub3RpZmljYXRpb24uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9ncmF2aXR5LW5vdGlmaWNhdGlvbi5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIEdyYXZpdHlOb3RpZmljYXRpb25Db21wb25lbnQge1xuICBASW5wdXQoKSBwdWJsaWMgbm90aWZpY2F0aW9uQ29udGVudDogR3Jhdml0eU5vdGlmaWNhdGlvbkNvbnRlbnQ7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSByZWFkb25seSBuZ2JBY3RpdmVNb2RhbDogTmdiQWN0aXZlTW9kYWwpIHtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgaWNvbkJ5U3RhdGUoKSB7XG4gICAgaWYgKHRoaXMubm90aWZpY2F0aW9uQ29udGVudC5zdGF0ZSA9PT0gJ3N1Y2Nlc3MnKSB7XG4gICAgICByZXR1cm4gJ2NoZWNrJztcbiAgICB9IGVsc2UgaWYgKHRoaXMubm90aWZpY2F0aW9uQ29udGVudC5zdGF0ZSA9PT0gJ2Vycm9yJykge1xuICAgICAgcmV0dXJuICd1bnN1Y2Nlc3MnO1xuICAgIH0gZWxzZSBpZiAodGhpcy5ub3RpZmljYXRpb25Db250ZW50LnN0YXRlID09PSAnd2FybmluZycpIHtcbiAgICAgIHJldHVybiAnd2FybmluZy1jaXJjbGUnXG4gICAgfVxuICB9XG5cbiAgcHVibGljIGNsb3NlTW9kYWwoKTogdm9pZCB7XG4gICAgdGhpcy5uZ2JBY3RpdmVNb2RhbC5jbG9zZSgpO1xuICB9XG59XG4iLCI8bWFpbiBjbGFzcz1cImFsZXJ0LWNvbnRlbnQge3tub3RpZmljYXRpb25Db250ZW50LnN0YXRlfX1cIj5cbiAgPGdyYXZpdHktaWNvbiBjbGFzcz1cImNsb3NlXCIgKGNsaWNrKT1cImNsb3NlTW9kYWwoKVwiIGRhdGEtY3k9XCJncmF2aXR5X25vdGlmaWNhdGlvbl9pbmZvcm1hdGl2ZV9jbG9zZV9pY29uXCJcbiAgICAgICAgICAgICAgICBbaWNvbk5hbWVdPVwiJ3Vuc3VjY2VzcydcIiBbdGl0bGVdPVwiJ0Nsb3NlJ1wiIFtpY29uU2l6ZV09XCInbWQtMTYnXCI+PC9ncmF2aXR5LWljb24+XG5cbiAgPGRpdiBjbGFzcz1cInRpdGxlXCI+XG4gICAgPGdyYXZpdHktaWNvbiBjbGFzcz1cInRpdGxlLWljb25cIiBbaWNvbk5hbWVdPVwiaWNvbkJ5U3RhdGVcIiBbaWNvblNpemVdPVwiJ21kLTE2J1wiPjwvZ3Jhdml0eS1pY29uPlxuICAgIDxoMSBjbGFzcz1cImhyLXRpdGxlIGxnLWJvbGRcIj57e25vdGlmaWNhdGlvbkNvbnRlbnQudGl0bGV9fTwvaDE+XG4gIDwvZGl2PlxuXG4gIDxkaXYgY2xhc3M9XCJjb250ZW50XCI+XG4gICAgPGgyIGNsYXNzPVwiaHItYm9keSBtZC1yZWd1bGFyXCI+e3tub3RpZmljYXRpb25Db250ZW50LnRleHR9fTwvaDI+XG4gICAgPGgyIGNsYXNzPVwiaHItYm9keSBtZC1yZWd1bGFyXCIgKm5nSWY9XCJub3RpZmljYXRpb25Db250ZW50LmRldGFpbHNcIj5cbiAgICAgIERldGFpbDogPGI+e3tub3RpZmljYXRpb25Db250ZW50LmRldGFpbHN9fTwvYj5cbiAgICA8L2gyPlxuICAgIDxoMiBjbGFzcz1cImhyLWJvZHkgbWQtcmVndWxhclwiICpuZ0lmPVwibm90aWZpY2F0aW9uQ29udGVudC5lcnJvckNvZGVcIj5cbiAgICAgIEVycm9yIGNvZGU6IDxiPnt7bm90aWZpY2F0aW9uQ29udGVudC5lcnJvckNvZGV9fTwvYj5cbiAgICA8L2gyPlxuICA8L2Rpdj5cbjwvbWFpbj5cbiJdfQ==

package/esm2022/lib/components/gravity-notification-instant/gravity-notification-instant-container.component.mjs

@@ -9,13 +9,24 @@ export class GravityNotificationInstantContainerComponent {
         this.gravityInstantNotificationsService = gravityInstantNotificationsService;
         this.delay = 5000;
     }
+    iconByState(state) {
+        if (state === 'success') {
+            return 'check';
+        }
+        else if (state === 'error') {
+            return 'unsuccess';
+        }
+        else if (state === 'warning') {
+            return 'warning-circle';
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, deps: [{ token: i1.GravityInstantNotificationsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <!--TODO ebiazzetti change icons-->\n      <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\" [size]=\"'md'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.NgbToast, selector: "ngb-toast", inputs: ["animation", "delay", "autohide", "header"], outputs: ["shown", "hidden"], exportAs: ["ngbToast"] }, { kind: "component", type: i4.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <gravity-icon class=\"title-icon\" [iconName]=\"iconByState(notification.state)\" [iconSize]=\"'md-16'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.NgbToast, selector: "ngb-toast", inputs: ["animation", "delay", "autohide", "header"], outputs: ["shown", "hidden"], exportAs: ["ngbToast"] }, { kind: "component", type: i4.GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <!--TODO ebiazzetti change icons-->\n      <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\" [size]=\"'md'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
+            args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <gravity-icon class=\"title-icon\" [iconName]=\"iconByState(notification.state)\" [iconSize]=\"'md-16'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.GravityInstantNotificationsService }]; }, propDecorators: { delay: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC1jb250YWluZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3Jhdml0eS1kZXNpZ24tc3lzdGVtL3NyYy9saWIvY29tcG9uZW50cy9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50L2dyYXZpdHktbm90aWZpY2F0aW9uLWluc3RhbnQtY29udGFpbmVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2dyYXZpdHktZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50LWNvbnRhaW5lci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLEtBQUssRUFBQyxNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBUS9DLE1BQU0sT0FBTyw0Q0FBNEM7SUFHdkQsWUFBNEIsa0NBQXNFO1FBQXRFLHVDQUFrQyxHQUFsQyxrQ0FBa0MsQ0FBb0M7UUFGbEYsVUFBSyxHQUFXLElBQUksQ0FBQztJQUdyQyxDQUFDOytHQUpVLDRDQUE0QzttR0FBNUMsNENBQTRDLDBHQ1J6RCx5bUNBd0JBOzs0RkRoQmEsNENBQTRDO2tCQUx4RCxTQUFTOytCQUNFLHdDQUF3Qzt5SEFLbEMsS0FBSztzQkFBcEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBJbnB1dH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0dyYXZpdHlJbnN0YW50Tm90aWZpY2F0aW9uc1NlcnZpY2V9IGZyb20gXCIuLi8uLi9zZXJ2aWNlcy9ncmF2aXR5LWluc3RhbnQtbm90aWZpY2F0aW9ucy5zZXJ2aWNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2dyYXZpdHktbm90aWZpY2F0aW9uLWluc3RhbnQtY29udGFpbmVyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2dyYXZpdHktbm90aWZpY2F0aW9uLWluc3RhbnQtY29udGFpbmVyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC1jb250YWluZXIuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBHcmF2aXR5Tm90aWZpY2F0aW9uSW5zdGFudENvbnRhaW5lckNvbXBvbmVudCB7XG4gIEBJbnB1dCgpIHB1YmxpYyBkZWxheTogbnVtYmVyID0gNTAwMDtcblxuICBjb25zdHJ1Y3RvcihwdWJsaWMgcmVhZG9ubHkgZ3Jhdml0eUluc3RhbnROb3RpZmljYXRpb25zU2VydmljZTogR3Jhdml0eUluc3RhbnROb3RpZmljYXRpb25zU2VydmljZSkge1xuICB9XG59XG4iLCI8bmdiLXRvYXN0IFthdXRvaGlkZV09XCJ0cnVlXCIgW2RlbGF5XT1cImRlbGF5XCJcblxuICAgICAgICAgICAoaGlkZGVuKT1cImdyYXZpdHlJbnN0YW50Tm90aWZpY2F0aW9uc1NlcnZpY2UuaGlkZU5vdGlmaWNhdGlvbihpKVwiXG5cbiAgICAgICAgICAgKm5nRm9yPVwibGV0IG5vdGlmaWNhdGlvbiBvZiBncmF2aXR5SW5zdGFudE5vdGlmaWNhdGlvbnNTZXJ2aWNlLm5vdGlmaWNhdGlvbnM7IGluZGV4IGFzIGlcIj5cbiAgPG1haW4gY2xhc3M9XCJhbGVydC1jb250ZW50IHt7bm90aWZpY2F0aW9uLnN0YXRlfX1cIj5cbiAgICA8Z3Jhdml0eS1pY29uIGNsYXNzPVwiY2xvc2VcIiAoY2xpY2spPVwiZ3Jhdml0eUluc3RhbnROb3RpZmljYXRpb25zU2VydmljZS5oaWRlTm90aWZpY2F0aW9uKGkpXCJcbiAgICAgICAgICAgICAgICAgIGRhdGEtY3k9XCJncmF2aXR5X25vdGlmaWNhdGlvbl9pbnN0YW50X2Nsb3NlX2ljb25cIiBbaWNvbk5hbWVdPVwiJ3Vuc3VjY2VzcydcIiBbaWNvblNpemVdPVwiJ21kLTE2J1wiXG4gICAgICAgICAgICAgICAgICBbdGl0bGVdPVwiJ0Nsb3NlJ1wiPjwvZ3Jhdml0eS1pY29uPlxuXG4gICAgPGRpdiBjbGFzcz1cInRpdGxlXCI+XG4gICAgICA8IS0tVE9ETyBlYmlhenpldHRpIGNoYW5nZSBpY29ucy0tPlxuICAgICAgPGdyYXZpdHktaWNvbiBjbGFzcz1cInRpdGxlLWljb25cIiBbaWNvbk5hbWVdPVwiJ25vdGlmaWNhdGlvbl8nICsgbm90aWZpY2F0aW9uLnN0YXRlXCIgW3NpemVdPVwiJ21kJ1wiPjwvZ3Jhdml0eS1pY29uPlxuICAgICAgPGgxIGNsYXNzPVwiaHItdGl0bGUgbWQtYm9sZFwiPnt7bm90aWZpY2F0aW9uLnRpdGxlfX08L2gxPlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIj5cbiAgICAgIDxoMiBjbGFzcz1cImhyLWJvZHkgc20tcmVndWxhclwiPnt7bm90aWZpY2F0aW9uLnRleHR9fTwvaDI+XG4gICAgICA8aDIgY2xhc3M9XCJoci1ib2R5IHNtLXJlZ3VsYXJcIiAqbmdJZj1cIm5vdGlmaWNhdGlvbi5lcnJvckNvZGVcIj5cbiAgICAgICAgRXJyb3IgY29kZTogPGI+e3tub3RpZmljYXRpb24uZXJyb3JDb2RlfX08L2I+XG4gICAgICA8L2gyPlxuICAgIDwvZGl2PlxuICA8L21haW4+XG48L25nYi10b2FzdD5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC1jb250YWluZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3Jhdml0eS1kZXNpZ24tc3lzdGVtL3NyYy9saWIvY29tcG9uZW50cy9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50L2dyYXZpdHktbm90aWZpY2F0aW9uLWluc3RhbnQtY29udGFpbmVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2dyYXZpdHktZGVzaWduLXN5c3RlbS9zcmMvbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50LWNvbnRhaW5lci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLEtBQUssRUFBQyxNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBUS9DLE1BQU0sT0FBTyw0Q0FBNEM7SUFHdkQsWUFBNEIsa0NBQXNFO1FBQXRFLHVDQUFrQyxHQUFsQyxrQ0FBa0MsQ0FBb0M7UUFGbEYsVUFBSyxHQUFXLElBQUksQ0FBQztJQUdyQyxDQUFDO0lBRU0sV0FBVyxDQUFDLEtBQWE7UUFDOUIsSUFBSSxLQUFLLEtBQUssU0FBUyxFQUFFO1lBQ3ZCLE9BQU8sT0FBTyxDQUFDO1NBQ2hCO2FBQU0sSUFBSSxLQUFLLEtBQUssT0FBTyxFQUFFO1lBQzVCLE9BQU8sV0FBVyxDQUFDO1NBQ3BCO2FBQU0sSUFBSSxLQUFLLEtBQUssU0FBUyxFQUFFO1lBQzlCLE9BQU8sZ0JBQWdCLENBQUE7U0FDeEI7SUFDSCxDQUFDOytHQWRVLDRDQUE0QzttR0FBNUMsNENBQTRDLDBHQ1J6RCxna0NBdUJBOzs0RkRmYSw0Q0FBNEM7a0JBTHhELFNBQVM7K0JBQ0Usd0NBQXdDO3lIQUtsQyxLQUFLO3NCQUFwQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIElucHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7R3Jhdml0eUluc3RhbnROb3RpZmljYXRpb25zU2VydmljZX0gZnJvbSBcIi4uLy4uL3NlcnZpY2VzL2dyYXZpdHktaW5zdGFudC1ub3RpZmljYXRpb25zLnNlcnZpY2VcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC1jb250YWluZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC1jb250YWluZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50LWNvbnRhaW5lci5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIEdyYXZpdHlOb3RpZmljYXRpb25JbnN0YW50Q29udGFpbmVyQ29tcG9uZW50IHtcbiAgQElucHV0KCkgcHVibGljIGRlbGF5OiBudW1iZXIgPSA1MDAwO1xuXG4gIGNvbnN0cnVjdG9yKHB1YmxpYyByZWFkb25seSBncmF2aXR5SW5zdGFudE5vdGlmaWNhdGlvbnNTZXJ2aWNlOiBHcmF2aXR5SW5zdGFudE5vdGlmaWNhdGlvbnNTZXJ2aWNlKSB7XG4gIH1cblxuICBwdWJsaWMgaWNvbkJ5U3RhdGUoc3RhdGU6IHN0cmluZyk6IHN0cmluZyB7XG4gICAgaWYgKHN0YXRlID09PSAnc3VjY2VzcycpIHtcbiAgICAgIHJldHVybiAnY2hlY2snO1xuICAgIH0gZWxzZSBpZiAoc3RhdGUgPT09ICdlcnJvcicpIHtcbiAgICAgIHJldHVybiAndW5zdWNjZXNzJztcbiAgICB9IGVsc2UgaWYgKHN0YXRlID09PSAnd2FybmluZycpIHtcbiAgICAgIHJldHVybiAnd2FybmluZy1jaXJjbGUnXG4gICAgfVxuICB9XG59XG4iLCI8bmdiLXRvYXN0IFthdXRvaGlkZV09XCJ0cnVlXCIgW2RlbGF5XT1cImRlbGF5XCJcblxuICAgICAgICAgICAoaGlkZGVuKT1cImdyYXZpdHlJbnN0YW50Tm90aWZpY2F0aW9uc1NlcnZpY2UuaGlkZU5vdGlmaWNhdGlvbihpKVwiXG5cbiAgICAgICAgICAgKm5nRm9yPVwibGV0IG5vdGlmaWNhdGlvbiBvZiBncmF2aXR5SW5zdGFudE5vdGlmaWNhdGlvbnNTZXJ2aWNlLm5vdGlmaWNhdGlvbnM7IGluZGV4IGFzIGlcIj5cbiAgPG1haW4gY2xhc3M9XCJhbGVydC1jb250ZW50IHt7bm90aWZpY2F0aW9uLnN0YXRlfX1cIj5cbiAgICA8Z3Jhdml0eS1pY29uIGNsYXNzPVwiY2xvc2VcIiAoY2xpY2spPVwiZ3Jhdml0eUluc3RhbnROb3RpZmljYXRpb25zU2VydmljZS5oaWRlTm90aWZpY2F0aW9uKGkpXCJcbiAgICAgICAgICAgICAgICAgIGRhdGEtY3k9XCJncmF2aXR5X25vdGlmaWNhdGlvbl9pbnN0YW50X2Nsb3NlX2ljb25cIiBbaWNvbk5hbWVdPVwiJ3Vuc3VjY2VzcydcIiBbaWNvblNpemVdPVwiJ21kLTE2J1wiXG4gICAgICAgICAgICAgICAgICBbdGl0bGVdPVwiJ0Nsb3NlJ1wiPjwvZ3Jhdml0eS1pY29uPlxuXG4gICAgPGRpdiBjbGFzcz1cInRpdGxlXCI+XG4gICAgICA8Z3Jhdml0eS1pY29uIGNsYXNzPVwidGl0bGUtaWNvblwiIFtpY29uTmFtZV09XCJpY29uQnlTdGF0ZShub3RpZmljYXRpb24uc3RhdGUpXCIgW2ljb25TaXplXT1cIidtZC0xNidcIj48L2dyYXZpdHktaWNvbj5cbiAgICAgIDxoMSBjbGFzcz1cImhyLXRpdGxlIG1kLWJvbGRcIj57e25vdGlmaWNhdGlvbi50aXRsZX19PC9oMT5cbiAgICA8L2Rpdj5cblxuICAgIDxkaXYgY2xhc3M9XCJjb250ZW50XCI+XG4gICAgICA8aDIgY2xhc3M9XCJoci1ib2R5IHNtLXJlZ3VsYXJcIj57e25vdGlmaWNhdGlvbi50ZXh0fX08L2gyPlxuICAgICAgPGgyIGNsYXNzPVwiaHItYm9keSBzbS1yZWd1bGFyXCIgKm5nSWY9XCJub3RpZmljYXRpb24uZXJyb3JDb2RlXCI+XG4gICAgICAgIEVycm9yIGNvZGU6IDxiPnt7bm90aWZpY2F0aW9uLmVycm9yQ29kZX19PC9iPlxuICAgICAgPC9oMj5cbiAgICA8L2Rpdj5cbiAgPC9tYWluPlxuPC9uZ2ItdG9hc3Q+XG4iXX0=

package/fesm2022/progressio_resources-gravity-design-system.mjs

@@ -4831,15 +4831,26 @@ class GravityNotificationComponent {
     constructor(ngbActiveModal) {
         this.ngbActiveModal = ngbActiveModal;
     }
+    get iconByState() {
+        if (this.notificationContent.state === 'success') {
+            return 'check';
+        }
+        else if (this.notificationContent.state === 'error') {
+            return 'unsuccess';
+        }
+        else if (this.notificationContent.state === 'warning') {
+            return 'warning-circle';
+        }
+    }
     closeModal() {
         this.ngbActiveModal.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, deps: [{ token: i1$2.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <!--TODO ebiazzetti change icons-->\n    <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\" [size]=\"'md'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <gravity-icon class=\"title-icon\" [iconName]=\"iconByState\" [iconSize]=\"'md-16'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, decorators: [{
             type: Component,
-            args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <!--TODO ebiazzetti change icons-->\n    <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\" [size]=\"'md'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
+            args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n  <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n                [iconName]=\"'unsuccess'\" [title]=\"'Close'\" [iconSize]=\"'md-16'\"></gravity-icon>\n\n  <div class=\"title\">\n    <gravity-icon class=\"title-icon\" [iconName]=\"iconByState\" [iconSize]=\"'md-16'\"></gravity-icon>\n    <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n  </div>\n\n  <div class=\"content\">\n    <h2 class=\"hr-body md-regular\">{{notificationContent.text}}</h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.details\">\n      Detail: <b>{{notificationContent.details}}</b>\n    </h2>\n    <h2 class=\"hr-body md-regular\" *ngIf=\"notificationContent.errorCode\">\n      Error code: <b>{{notificationContent.errorCode}}</b>\n    </h2>\n  </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$2.NgbActiveModal }]; }, propDecorators: { notificationContent: [{
                 type: Input
             }] } });
@@ -4870,12 +4881,23 @@ class GravityNotificationInstantContainerComponent {
         this.gravityInstantNotificationsService = gravityInstantNotificationsService;
         this.delay = 5000;
     }
+    iconByState(state) {
+        if (state === 'success') {
+            return 'check';
+        }
+        else if (state === 'error') {
+            return 'unsuccess';
+        }
+        else if (state === 'warning') {
+            return 'warning-circle';
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, deps: [{ token: GravityInstantNotificationsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <!--TODO ebiazzetti change icons-->\n      <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\" [size]=\"'md'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$2.NgbToast, selector: "ngb-toast", inputs: ["animation", "delay", "autohide", "header"], outputs: ["shown", "hidden"], exportAs: ["ngbToast"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <gravity-icon class=\"title-icon\" [iconName]=\"iconByState(notification.state)\" [iconSize]=\"'md-16'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$2.NgbToast, selector: "ngb-toast", inputs: ["animation", "delay", "autohide", "header"], outputs: ["shown", "hidden"], exportAs: ["ngbToast"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <!--TODO ebiazzetti change icons-->\n      <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\" [size]=\"'md'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
+            args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\" [delay]=\"delay\"\n\n           (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n           *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n  <main class=\"alert-content {{notification.state}}\">\n    <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n                  data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [iconSize]=\"'md-16'\"\n                  [title]=\"'Close'\"></gravity-icon>\n\n    <div class=\"title\">\n      <gravity-icon class=\"title-icon\" [iconName]=\"iconByState(notification.state)\" [iconSize]=\"'md-16'\"></gravity-icon>\n      <h1 class=\"hr-title md-bold\">{{notification.title}}</h1>\n    </div>\n\n    <div class=\"content\">\n      <h2 class=\"hr-body sm-regular\">{{notification.text}}</h2>\n      <h2 class=\"hr-body sm-regular\" *ngIf=\"notification.errorCode\">\n        Error code: <b>{{notification.errorCode}}</b>\n      </h2>\n    </div>\n  </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:host{padding:.75rem;position:absolute;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{cursor:pointer;height:1rem;position:absolute;right:.75rem;top:.625rem;width:1rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
         }], ctorParameters: function () { return [{ type: GravityInstantNotificationsService }]; }, propDecorators: { delay: [{
                 type: Input
             }] } });
@@ -7047,11 +7069,11 @@ class GravityChipGroupComponent {
         return this.selectedItems.some((i) => i.id === item.id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityChipGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityChipGroupComponent, selector: "gravity-chip-group", inputs: { disabled: "disabled", size: "size", items: "items" }, outputs: { clickOnChip: "clickOnChip" }, ngImport: i0, template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;gap:var(--gravity-spacing-sm);flex-wrap:wrap}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;gap:var(--gravity-spacing-xs);border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{height:32px}.chips-wrapper .gravity-chip.md{height:44px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityChipGroupComponent, selector: "gravity-chip-group", inputs: { disabled: "disabled", size: "size", items: "items" }, outputs: { clickOnChip: "clickOnChip" }, ngImport: i0, template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;flex-wrap:wrap;row-gap:var(--gravity-spacing-sm)}@media (min-width: 993px){.chips-wrapper{gap:var(--gravity-spacing-sm)}}@media (max-width: 992px){.chips-wrapper{gap:var(--gravity-spacing-xs)}}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{gap:var(--gravity-spacing-xs);height:32px}.chips-wrapper .gravity-chip.md{gap:var(--gravity-spacing-sm);height:44px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityChipGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-chip-group', template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;gap:var(--gravity-spacing-sm);flex-wrap:wrap}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;gap:var(--gravity-spacing-xs);border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{height:32px}.chips-wrapper .gravity-chip.md{height:44px}\n"] }]
+            args: [{ selector: 'gravity-chip-group', template: "<div class=\"chips-wrapper\">\n  <div class=\"gravity-chip {{size}}\" *ngFor=\"let item of items\" [attr.data-cy]=\"item.cypressTag\"\n       [ngClass]=\"{'selected': isSelected(item), 'disabled': disabled}\" (click)=\"toggleSelection(item)\">\n\n    <gravity-icon *ngIf=\"item.icon\" [style.--icon-color]=\"'var(--left-icon-color)'\"\n                  [iconName]=\"item.icon\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n    </gravity-icon>\n\n    <label class=\"hr-label\" [ngClass]=\"size === 'sm' ? 'sm-regular' : 'md-regular'\">{{item.label}}</label>\n\n    <div *ngIf=\"isSelected(item)\" class=\"close-button {{size}}\">\n      <gravity-icon [style.--icon-color]=\"'var(--close-button-color)'\"\n                    [iconName]=\"'unsuccess'\" [iconSize]=\"size === 'sm' ? 'sm-12' :'md-16'\">\n      </gravity-icon>\n    </div>\n  </div>\n</div>\n", styles: [":root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}.border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.chips-wrapper{display:flex;flex-wrap:wrap;row-gap:var(--gravity-spacing-sm)}@media (min-width: 993px){.chips-wrapper{gap:var(--gravity-spacing-sm)}}@media (max-width: 992px){.chips-wrapper{gap:var(--gravity-spacing-xs)}}.chips-wrapper .gravity-chip{align-items:center;display:inline-flex;border-radius:2rem;padding:0 var(--gravity-spacing-sm);background-color:var(--bg-chip-active-primary);border:1px solid var(--cl-chip-active-primary);--left-icon-color: var(--cl-chip-active-primary);order:1}.chips-wrapper .gravity-chip label{color:var(--cl-chip-active-primary);text-wrap:nowrap}.chips-wrapper .gravity-chip .close-button{display:flex;align-items:center;justify-content:center;border-radius:6.25rem;margin-left:var(--gravity-spacing-xs);background-color:var(--bg-chip-active-close-button);--close-button-color: var(--cl-chip-active-close-button)}.chips-wrapper .gravity-chip .close-button.sm{width:21px;height:21px}.chips-wrapper .gravity-chip .close-button.md{width:29px;height:29px}.chips-wrapper .gravity-chip.selected{border:2px solid var(--cl-chip-active-primary);order:0}.chips-wrapper .gravity-chip.selected:not(.disabled):hover{border:2px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover{cursor:pointer;background-color:var(--bg-chip-active-hover);border:1.5px solid var(--cl-chip-active-primary)}.chips-wrapper .gravity-chip:not(.disabled):hover label{cursor:pointer}.chips-wrapper .gravity-chip:not(.disabled):hover .close-button{background-color:var(--bg-chip-active-close-button-hover);--close-button-color: var(--cl-chip-active-close-button-hover)}.chips-wrapper .gravity-chip.disabled{border:1px solid var(--cl-chip-disabled-state);--left-icon-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled label{color:var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.disabled .close-button{cursor:default;background:none;pointer-events:none;--close-button-color: var(--cl-chip-disabled-state)}.chips-wrapper .gravity-chip.sm{gap:var(--gravity-spacing-xs);height:32px}.chips-wrapper .gravity-chip.md{gap:var(--gravity-spacing-sm);height:44px}\n"] }]
         }], propDecorators: { disabled: [{
                 type: Input
             }], size: [{