{"__symbolic":"module","version":4,"metadata":{"SidebarRightContentDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"ng-template[dbSidebarRightContent]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"reference","name":"any"}]}]}]}},"SidebarRightComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"db-sidebar-right, [dbSidebarRight]","template":"<aside class=\"sidebar-right\" [class.closing]=\"isClosing\">\n  <header>\n    <button id=\"sidebar-right-close\" class=\"close fas fa-times\" (click)=\"closeSidebar()\"></button>\n    <h3>{{ title }}</h3>\n    <div class=\"pagination\" *ngIf=\"pagination && (stepPagination < pagination.length)\">\n      <span class=\"item text-center d-flex align-items-center\" *ngFor=\"let item of pagination;let i = index;\" [ngClass]=\"{'active': i == stepPagination}\">{{item}}</span>\n    </div>\n  </header>\n  <section> \n    <ng-template [ngTemplateOutlet]=\"content?.templateRef\"></ng-template>\n  </section>\n</aside>\n<div class=\"content-side\" (click)=\"onContentSideClick()\"></div>\n","styles":["@-webkit-keyframes slideInUp{0%{transform:translate3d(0,100%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes slideInUp{0%{transform:translate3d(0,100%,0);visibility:visible}to{transform:translateZ(0)}}@-webkit-keyframes slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,100%,0)}}@keyframes slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,100%,0)}}@-webkit-keyframes slideToLeft{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slideToLeft{0%{transform:translateX(100%)}to{transform:translateX(0)}}@-webkit-keyframes slideToRight{0%{transform:translateX(0)}to{transform:translateX(110%)}}@keyframes slideToRight{0%{transform:translateX(0)}to{transform:translateX(110%)}}@-webkit-keyframes fadeIn{0%{opacity:0;display:none}to{opacity:1;display:block}}@keyframes fadeIn{0%{opacity:0;display:none}to{opacity:1;display:block}}@-webkit-keyframes fadeOut{0%{opacity:1;display:block}to{opacity:0;display:none}}@keyframes fadeOut{0%{opacity:1;display:block}to{opacity:0;display:none}}@-webkit-keyframes spinner{to{transform:rotate(1turn)}}@keyframes spinner{to{transform:rotate(1turn)}}@-webkit-keyframes circleAnimation{to{transform:rotate(1turn)}}@keyframes circleAnimation{to{transform:rotate(1turn)}}:host{position:fixed;width:100vw;top:0;left:0;height:100vh;z-index:100;-webkit-animation-duration:.45s;animation-duration:.45s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:fadeIn;animation-name:fadeIn;background-color:rgba(33,43,54,.6)}:host.fadeOut{-webkit-animation-duration:.45s;animation-duration:.45s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:fadeOut;animation-name:fadeOut}:host aside{overflow:auto;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:slideToLeft;animation-name:slideToLeft}:host .sidebar-right{width:50%;height:100vh;max-width:650px;float:right;background-color:#fff;border-top-left-radius:12px;border-bottom-left-radius:12px}:host .sidebar-right.closing{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:slideToRight;animation-name:slideToRight}:host .sidebar-right header{position:relative;padding:4.2857142857rem 2.8571428571rem 2.5rem;background:linear-gradient(180deg,#f7f7f7,#f1f1f1)}:host .sidebar-right header .close{position:absolute;background:transparent;border:0;font-size:16px;color:#333;right:45px;top:45px;cursor:pointer;transition:.4s}:host .sidebar-right header .close:hover{color:#c6003d}:host .sidebar-right header h3{color:#333;line-height:2.1428571429rem;margin-bottom:1.4285714286rem}:host .sidebar-right section{padding:2.8571428571rem}:host .sidebar-right ::ng-deep footer{padding-top:2.8571428571rem}:host .content-side{width:55%;height:100vh}:host .pagination{display:flex;font-size:1rem;line-height:1.2857142857rem;color:#666;font-weight:400}:host .pagination .item{position:relative}:host .pagination .item.active{color:#333}:host .pagination .item.active:before{content:\"\";position:absolute;bottom:-7px;left:calc(50% - 15px);height:3px;width:30px;background:#ff3f59;border-radius:2px}:host .pagination .item:not(:last-child){margin-right:3.4285714286rem}:host .pagination .item:not(:last-child):after{content:\"\";position:absolute;width:1.7142857143rem;height:1px;background:#999;top:calc(50% - .5px);left:calc(100% + 12px)}"]}]}],"members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"pagination":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"btnPrimaryText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"btnSecondaryText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"stepPagination":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"onclose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":3}}]}],"onprimaryclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":3}}]}],"onsecondaryclick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":48,"character":3}}]}],"isClosing":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":51,"character":3},"arguments":["class.fadeOut"]}]}],"button":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":54,"character":3},"arguments":["button",{"static":true}]}]}],"contentSide":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":57,"character":3},"arguments":["contentSide",{"static":true}]}]}],"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":60,"character":3},"arguments":[{"__symbolic":"reference","name":"SidebarRightContentDirective"},{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":69,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":69,"character":12}]}]],"parameters":[{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentChecked":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onBtnPrimaryClick":[{"__symbolic":"method"}],"onBtnSecondaryClick":[{"__symbolic":"method"}],"onContentSideClick":[{"__symbolic":"method"}],"closeSidebar":[{"__symbolic":"method"}]}},"SidebarRightModule":{"__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}],"declarations":[{"__symbolic":"reference","name":"SidebarRightComponent"},{"__symbolic":"reference","name":"SidebarRightContentDirective"}],"exports":[{"__symbolic":"reference","name":"SidebarRightComponent"},{"__symbolic":"reference","name":"SidebarRightContentDirective"}]}]}],"members":{}}},"origins":{"SidebarRightContentDirective":"./directive/sidebar-right-content.directive","SidebarRightComponent":"./sidebar-right.component","SidebarRightModule":"./sidebar-right.module"},"importAs":"@desbank/components/src/lib/sidebar-right"}