@openexo/design-system
Version:
OpenExO design system
1 lines • 26.7 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"ExoButtonModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":14,"character":4}],"exports":[{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":17,"character":4}],"providers":[{"provide":{"__symbolic":"reference","module":"@angular/material/core","name":"MAT_RIPPLE_GLOBAL_OPTIONS","line":20,"character":15},"useValue":{"disabled":true}}]}]}],"members":{}},"ExOAvatarModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":11,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/material/progress-spinner","name":"MatProgressSpinnerModule","line":13,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵa"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/material/progress-spinner","name":"MatProgressSpinnerModule","line":22,"character":4}]}]}],"members":{}},"ExOAvatarSystemModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":4},{"__symbolic":"reference","name":"ɵb"}],"declarations":[{"__symbolic":"reference","name":"ExoAvatarSystemComponent"}],"exports":[{"__symbolic":"reference","name":"ExoAvatarSystemComponent"}]}]}],"members":{}},"ExoAvatarSystemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"exo-avatar-system","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":17,"character":19},"member":"OnPush"},"template":"<div class=\"avatar-system__container\" [ngClass]=\"direction\">\n <ng-content select=\"exo-avatar\"></ng-content>\n <div class=\"avatar-system__data\" [ngClass]=\"[direction, systemTruncate] \">\n <p class=\"avatar-system__data--name\"\n [ngClass]=\"{\n 'title': avatar?.size === 'xl',\n 'subheading-2': avatar?.size === 'lg',\n 'body-2': avatar?.size === 'sm',\n 'caption-2': avatar?.size === 'xs',\n 'text-truncate': truncateName === true,\n 'connected': connected === true }\"\n [matTooltip]=\"truncateName === true ? name : undefined\"\n >\n {{ name }}\n </p>\n <p class=\"foreground-secondary-text avatar-system__data--description\"\n [ngClass]=\"{\n 'subheading-2': avatar?.size === 'xl',\n 'caption-1': avatar?.size !== 'xl',\n 'text-truncate': truncateDescription === true }\"\n [matTooltip]=\"truncateDescription === true ? description : undefined \"\n [innerHTML] = \"description\"\n >\n </p>\n </div>\n</div>\n","styles":[""]}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"description":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"direction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"avatar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":29,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵa"}]}]}],"truncateName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"truncateDescription":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"connected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}]}},"ExoAlertModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":10,"character":4},{"__symbolic":"reference","name":"ɵc"}],"declarations":[{"__symbolic":"reference","name":"ɵd"}],"exports":[{"__symbolic":"reference","name":"ɵd"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":33,"character":1},"arguments":[{"selector":"exo-avatar","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"template":"<div *ngIf=\"!imageSet\">\n <figure *ngIf=\"imageUrl; else icon\"\n (click)=\"click()\"\n class=\"avatar__figure\"\n [ngClass]=\"['exo-image-' + size]\"\n >\n <img [src]=\"imageUrl\"\n [matTooltip]=\"imageTooltip\"\n [matTooltipPosition]=\"tooltipPosition\"\n [ngStyle]=\"{width: customizedSize?.width, height: customizedSize?.height}\"\n [ngClass]=\"['exo-image', 'exo-image-' + size, 'exo-image-shape-' + shape]\"\n [alt]=\"imageAlt\"\n >\n </figure>\n</div>\n<ng-template #icon>\n <div>\n <mat-icon [ngClass]=\"['icon', 'icon-size-' + size]\"\n (click)=\"click()\"\n [matTooltip]=\"imageTooltip\"\n [matTooltipPosition]=\"tooltipPosition\"\n >account_circle</mat-icon>\n </div>\n</ng-template>\n\n<div class=\"certificates\" *ngIf=\"certificates\">\n <ng-container [ngSwitch]=\"size\">\n <div *ngSwitchCase=\"sizeAvatar.sm\">\n <ng-container [ngTemplateOutlet]=\"certificateTpl\" [ngTemplateOutletContext]=\"{class: 'medium-avatar', diameter: 56, stroke: 2}\"></ng-container>\n </div>\n <div *ngSwitchCase=\"sizeAvatar.lg\">\n <ng-container [ngTemplateOutlet]=\"certificateTpl\" [ngTemplateOutletContext]=\"{class: 'big-avatar', diameter: 108, stroke: 3}\"></ng-container>\n </div>\n </ng-container>\n</div>\n\n<ng-template #certificateTpl let-class=\"class\" let-diameter=\"diameter\" let-stroke=\"stroke\">\n <div [ngClass]=\"class\" [matTooltip]=\"certificateTooltip\" matTooltipClass=\"line-breaker\">\n <mat-progress-spinner\n *ngFor=\"let certificate of certificates; let i=index;\"\n [diameter]=\"diameter\"\n [strokeWidth]=\"stroke\"\n [value]=\"valuesCertification[certificates.length - 1]\"\n [ngClass]=\"['certificate-' + i, certificate.code, 'number-certificates-' + certificates.length]\"\n ></mat-progress-spinner>\n </div>\n</ng-template>\n\n<div *ngIf=\"imageSet\" class=\"images-set\">\n <div class=\"avatars\">\n <span *ngIf=\"maxSetShowed < imageSet.length\" class=\"avatar remain\">\n <span class=\"number\">\n {{imageSet.length - maxSetShowed}}+\n </span>\n </span>\n <ng-container *ngFor=\"let item of imageSet; let i = index\">\n <span class=\"avatar\" *ngIf=\"i < maxSetShowed\">\n <figure *ngIf=\"item.src; else icon\" class=\"avatar__figure\">\n <img [src]=\"item.src\"\n [matTooltip]=\"item.tooltip\"\n [matTooltipPosition]=\"tooltipPosition\"\n [ngStyle]=\"{width: customizedSize?.width, height: customizedSize?.height}\"\n [ngClass]=\"['exo-image', 'exo-image-' + size, 'exo-image-shape-' + shape]\"\n >\n </figure>\n </span>\n </ng-container>\n </div>\n</div>\n","styles":[".certificates .medium-avatar{margin-top:-52px;margin-left:-4px;width:56px;height:56px}.certificates .medium-avatar ::ng-deep circle{stroke-linecap:round}.certificates .medium-avatar ::ng-deep .CCO circle{stroke:#6ae5d5}.certificates .medium-avatar ::ng-deep .CEA circle{stroke:#ffb05c}.certificates .medium-avatar ::ng-deep .CSC circle{stroke:#0094d4}.certificates .medium-avatar ::ng-deep .CFO circle{stroke:#46464b}.certificates .medium-avatar ::ng-deep .CTR circle{stroke:#002e58}.certificates .medium-avatar ::ng-deep .CBA circle{stroke:#6f23ff}.certificates .medium-avatar ::ng-deep.number-certificates-0.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-1.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-1.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-1.certificate-1 circle{transform:rotate(366deg)}.certificates .medium-avatar ::ng-deep.number-certificates-2.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-2.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-2.certificate-1 circle{transform:rotate(186deg)}.certificates .medium-avatar ::ng-deep.number-certificates-2.certificate-2 svg{margin-top:-112px!important}.certificates .medium-avatar ::ng-deep.number-certificates-2.certificate-2 circle{transform:rotate(366deg)}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-1 circle{transform:rotate(126deg)}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-2 svg{margin-top:-112px!important}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-2 circle{transform:rotate(246deg)}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-3 svg{margin-top:-168px!important}.certificates .medium-avatar ::ng-deep.number-certificates-3.certificate-3 circle{transform:rotate(366deg)}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-1 circle{transform:rotate(96deg)}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-2 svg{margin-top:-112px!important}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-2 circle{transform:rotate(186deg)}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-3 svg{margin-top:-168px!important}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-3 circle{transform:rotate(276deg)}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-4 svg{margin-top:-224px!important}.certificates .medium-avatar ::ng-deep.number-certificates-4.certificate-4 circle{transform:rotate(366deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-1 circle{transform:rotate(78deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-2 svg{margin-top:-112px!important}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-2 circle{transform:rotate(150deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-3 svg{margin-top:-168px!important}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-3 circle{transform:rotate(222deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-4 svg{margin-top:-224px!important}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-4 circle{transform:rotate(294deg)}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-5 svg{margin-top:-280px!important}.certificates .medium-avatar ::ng-deep.number-certificates-5.certificate-5 circle{transform:rotate(366deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-0 circle{transform:rotate(6deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-1 svg{margin-top:-56px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-1 circle{transform:rotate(66deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-2 svg{margin-top:-112px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-2 circle{transform:rotate(126deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-3 svg{margin-top:-168px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-3 circle{transform:rotate(186deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-4 svg{margin-top:-224px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-4 circle{transform:rotate(246deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-5 svg{margin-top:-280px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-5 circle{transform:rotate(306deg)}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-6 svg{margin-top:-336px!important}.certificates .medium-avatar ::ng-deep.number-certificates-6.certificate-6 circle{transform:rotate(366deg)}.certificates .big-avatar{margin-top:-102px;margin-left:-6px;width:108px;height:108px}.certificates .big-avatar ::ng-deep circle{stroke-linecap:round}.certificates .big-avatar ::ng-deep .CCO circle{stroke:#6ae5d5}.certificates .big-avatar ::ng-deep .CEA circle{stroke:#ffb05c}.certificates .big-avatar ::ng-deep .CSC circle{stroke:#0094d4}.certificates .big-avatar ::ng-deep .CFO circle{stroke:#46464b}.certificates .big-avatar ::ng-deep .CTR circle{stroke:#002e58}.certificates .big-avatar ::ng-deep .CBA circle{stroke:#6f23ff}.certificates .big-avatar ::ng-deep.number-certificates-0.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-1.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-1.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-1.certificate-1 circle{transform:rotate(366deg)}.certificates .big-avatar ::ng-deep.number-certificates-2.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-2.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-2.certificate-1 circle{transform:rotate(186deg)}.certificates .big-avatar ::ng-deep.number-certificates-2.certificate-2 svg{margin-top:-216px!important}.certificates .big-avatar ::ng-deep.number-certificates-2.certificate-2 circle{transform:rotate(366deg)}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-1 circle{transform:rotate(126deg)}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-2 svg{margin-top:-216px!important}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-2 circle{transform:rotate(246deg)}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-3 svg{margin-top:-324px!important}.certificates .big-avatar ::ng-deep.number-certificates-3.certificate-3 circle{transform:rotate(366deg)}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-1 circle{transform:rotate(96deg)}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-2 svg{margin-top:-216px!important}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-2 circle{transform:rotate(186deg)}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-3 svg{margin-top:-324px!important}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-3 circle{transform:rotate(276deg)}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-4 svg{margin-top:-432px!important}.certificates .big-avatar ::ng-deep.number-certificates-4.certificate-4 circle{transform:rotate(366deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-1 circle{transform:rotate(78deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-2 svg{margin-top:-216px!important}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-2 circle{transform:rotate(150deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-3 svg{margin-top:-324px!important}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-3 circle{transform:rotate(222deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-4 svg{margin-top:-432px!important}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-4 circle{transform:rotate(294deg)}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-5 svg{margin-top:-540px!important}.certificates .big-avatar ::ng-deep.number-certificates-5.certificate-5 circle{transform:rotate(366deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-0 circle{transform:rotate(6deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-1 svg{margin-top:-108px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-1 circle{transform:rotate(66deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-2 svg{margin-top:-216px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-2 circle{transform:rotate(126deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-3 svg{margin-top:-324px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-3 circle{transform:rotate(186deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-4 svg{margin-top:-432px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-4 circle{transform:rotate(246deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-5 svg{margin-top:-540px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-5 circle{transform:rotate(306deg)}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-6 svg{margin-top:-648px!important}.certificates .big-avatar ::ng-deep.number-certificates-6.certificate-6 circle{transform:rotate(366deg)}.images-set .avatars{display:inline-flex;flex-direction:row-reverse;margin:0 0 16px 16px}.images-set .avatars .avatar{margin-left:-16px;position:relative;border:1px solid #fff;border-radius:50%;overflow:hidden;width:48px;height:48px}.images-set .avatars .avatar.remain{background-color:#3a1090;color:#fff}.images-set .avatars .avatar.remain .number{flex-direction:column;display:flex;place-content:center;align-items:center;height:100%}"]}]}],"members":{"maxSetShowed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"imageSet":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"alt":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"customizedSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":72,"character":3}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":79,"character":3}}]}],"shape":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":85,"character":3}}]}],"item":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":91,"character":3}}]}],"tooltip":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":97,"character":3}}]}],"tooltipPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":103,"character":3}}]}],"certificates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":110,"character":3}}]}],"onClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":116,"character":3}}]}],"buildPicture":[{"__symbolic":"method"}],"buildNameItem":[{"__symbolic":"method"}],"click":[{"__symbolic":"method"}]}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"exo-alert","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":14,"character":19},"member":"OnPush"},"template":"<div *ngIf=\"showMessage\" class=\"alert__container {{typeAlert}}\">\n <div class=\"body-2 alert__description\">\n <ng-container [ngSwitch]=\"typeAlert\">\n <mat-icon *ngSwitchCase=\"typeAlertEnum.info\" class=\"icon_type\">info</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.success\" class=\"icon_type\" >check_circle</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.warning\" class=\"icon_type\">warning</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.danger\" class=\"icon_type\">cancel</mat-icon>\n </ng-container>\n <div [innerHtml]=\"message\"></div>\n </div>\n <button class=\"alert__action-button push-left-xs\" *ngIf=\"actionButtonText\" mat-button color=\"primary\" (click)=\"onAction()\">{{actionButtonText}}</button>\n <ng-container *ngIf=\"isCloseable\">\n <mat-icon (click)=\"onClose()\" class=\"push-left-xs pointer alert__close-icon\">close</mat-icon>\n <button class=\"alert__action-button close push-left-xxs\" mat-button color=\"primary\" (click)=\"onClose()\">{{closeButtonText}}</button>\n </ng-container>\n</div>\n\n","styles":[""]}]}],"members":{"typeAlert":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"message":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"isCloseable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"closeButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"actionButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"sendAction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":53,"character":23}]}],"ngOnInit":[{"__symbolic":"method"}],"onClose":[{"__symbolic":"method"}],"onAction":[{"__symbolic":"method"}]}}},"origins":{"ExoButtonModule":"./lib/button/button.module","ExOAvatarModule":"./lib/avatar/avatar.module","ExOAvatarSystemModule":"./lib/avatar-system/avatar-system.module","ExoAvatarSystemComponent":"./lib/avatar-system/avatar-system.component","ExoAlertModule":"./lib/alert/alert.module","ɵa":"./lib/avatar/avatar.component","ɵb":"./lib/avatar","ɵc":"./lib/button","ɵd":"./lib/alert/alert.component"},"importAs":"@openexo/design-system"}