[{"__symbolic":"module","version":3,"metadata":{"ThfModalComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@totvs/thf-core/components/thf-modal-base","name":"ThfModalBaseComponent"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"thf-modal","template":"<div class=\"thf-modal\" *ngIf=\"!isHidden\"> <div class=\"thf-modal-overlay\" (click)=\"onClickOut()\"></div> <div #modalContent class=\"thf-modal-content thf-modal-{{ modalSize }}\" tabindex=\"-1\"> <div class=\"thf-modal-header\"> <div class=\"thf-modal-title\"> <a class=\"thf-modal-header-close-button\" *ngIf=\"!hideClose\" (click)=\"close()\" tabindex=\"0\" > <span class=\"thf-icon thf-icon-close\"></span> </a> {{ title }} </div> </div> <div class=\"thf-modal-body\"> <ng-content></ng-content> </div> <div class=\"thf-modal-footer\"> <thf-button *ngIf=\"secondaryAction\" class=\"thf-modal-footer-button\" [t-label]=\"secondaryAction.label\" (t-click)=\"secondaryAction.action()\" t-primary=\"false\"> </thf-button> <thf-button *ngIf=\"primaryAction\" class=\"thf-modal-footer-button\" [t-label]=\"primaryAction.label\" (t-click)=\"primaryAction.action()\" t-primary=\"true\"> </thf-button> </div> </div> </div> ","styles":[".thf-modal { font-family: NunitoSans; position: relative; z-index: 50; } .thf-modal-overlay:before { content: ''; position: fixed; background-color: #052e3e; top: 0; bottom: 0; right: 0; left: 0; opacity: 0.7; } .thf-modal-sm { width: 50% !important; } .thf-modal-md { width: 70% !important; } .thf-modal-lg { width: 80% !important; } .thf-modal-xl { width: 90% !important; } .thf-modal-auto { width: auto !important; } @media screen and (max-width: 480px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 90%; } } @media screen and (min-width: 481px) and (max-width: 960px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 80%; } } @media screen and (min-width: 961px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 70%; } } .thf-modal-header { border-radius: 3px; padding-top: 18px; padding-left: 24px; padding-right: 24px; padding-bottom: 12px; border: 0px; } .thf-modal-title { font-size: 34px; font-weight: 200; line-height: 27px; text-align: left; color: #4a5c60; } .thf-modal-header-close-button { float: right; border-radius: 1px; text-align: right; color: #0c9abe; cursor: pointer; text-decoration: none; } .thf-modal-body { margin: 12px 24px 12px 24px; font-size: 14px; line-height: 1.71; text-align: left; color: #425357; max-height: calc(100vh - 210px); overflow-y: auto; } .thf-modal-footer { font-family: NunitoSans; background-color: #ffffff; border-radius: 3px; border: 0px; text-align: right; padding-top: 12px; padding-left: 0px; padding-bottom: 24px; padding-right: 24px; } .thf-modal-footer-button { margin-left: 16px; margin-top: 5px; } ::-webkit-scrollbar { width: 4px; height: 50px; opacity: 0.5; border-radius: 2px; } ::-webkit-scrollbar-thumb { background-color: #0c9abe; } "]}]}],"members":{"modalContent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["modalContent",{"read":{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}}]}]}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"handleFocus":[{"__symbolic":"method"}],"initFocus":[{"__symbolic":"method"}],"setFirstElement":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ThfModalComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@totvs/thf-core/components/thf-modal-base","name":"ThfModalBaseComponent"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"thf-modal","template":"<div class=\"thf-modal\" *ngIf=\"!isHidden\"> <div class=\"thf-modal-overlay\" (click)=\"onClickOut()\"></div> <div #modalContent class=\"thf-modal-content thf-modal-{{ modalSize }}\" tabindex=\"-1\"> <div class=\"thf-modal-header\"> <div class=\"thf-modal-title\"> <a class=\"thf-modal-header-close-button\" *ngIf=\"!hideClose\" (click)=\"close()\" tabindex=\"0\" > <span class=\"thf-icon thf-icon-close\"></span> </a> {{ title }} </div> </div> <div class=\"thf-modal-body\"> <ng-content></ng-content> </div> <div class=\"thf-modal-footer\"> <thf-button *ngIf=\"secondaryAction\" class=\"thf-modal-footer-button\" [t-label]=\"secondaryAction.label\" (t-click)=\"secondaryAction.action()\" t-primary=\"false\"> </thf-button> <thf-button *ngIf=\"primaryAction\" class=\"thf-modal-footer-button\" [t-label]=\"primaryAction.label\" (t-click)=\"primaryAction.action()\" t-primary=\"true\"> </thf-button> </div> </div> </div> ","styles":[".thf-modal { font-family: NunitoSans; position: relative; z-index: 50; } .thf-modal-overlay:before { content: ''; position: fixed; background-color: #052e3e; top: 0; bottom: 0; right: 0; left: 0; opacity: 0.7; } .thf-modal-sm { width: 50% !important; } .thf-modal-md { width: 70% !important; } .thf-modal-lg { width: 80% !important; } .thf-modal-xl { width: 90% !important; } .thf-modal-auto { width: auto !important; } @media screen and (max-width: 480px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 90%; } } @media screen and (min-width: 481px) and (max-width: 960px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 80%; } } @media screen and (min-width: 961px) { .thf-modal-content { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #ffffff; box-shadow: 0px 4px 16px 0 rgba(7, 9, 9, 0.24); max-height: 90%; width: 70%; } } .thf-modal-header { border-radius: 3px; padding-top: 18px; padding-left: 24px; padding-right: 24px; padding-bottom: 12px; border: 0px; } .thf-modal-title { font-size: 34px; font-weight: 200; line-height: 27px; text-align: left; color: #4a5c60; } .thf-modal-header-close-button { float: right; border-radius: 1px; text-align: right; color: #0c9abe; cursor: pointer; text-decoration: none; } .thf-modal-body { margin: 12px 24px 12px 24px; font-size: 14px; line-height: 1.71; text-align: left; color: #425357; max-height: calc(100vh - 210px); overflow-y: auto; } .thf-modal-footer { font-family: NunitoSans; background-color: #ffffff; border-radius: 3px; border: 0px; text-align: right; padding-top: 12px; padding-left: 0px; padding-bottom: 24px; padding-right: 24px; } .thf-modal-footer-button { margin-left: 16px; margin-top: 5px; } ::-webkit-scrollbar { width: 4px; height: 50px; opacity: 0.5; border-radius: 2px; } ::-webkit-scrollbar-thumb { background-color: #0c9abe; } "]}]}],"members":{"modalContent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["modalContent",{"read":{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}}]}]}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"handleFocus":[{"__symbolic":"method"}],"initFocus":[{"__symbolic":"method"}],"setFirstElement":[{"__symbolic":"method"}]}}}}]