{"__symbolic":"module","version":4,"metadata":{"ToggleComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"db-toggle","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":9,"character":15},"useExisting":{"__symbolic":"reference","name":"ToggleComponent"},"multi":true}],"template":"<div class=\"toggle-container\">\n  <span\n    [class.active]=\"toggleState\"\n    class=\"d-inline-block option option-show\">\n  </span>\n\n  <div\n    class=\"toggle d-inline-block\"\n    [class.active]=\"toggleState\"\n    (click)=\"changeToggle()\">\n    <input #toggle type=\"radio\" name=\"toggleTrue\" class=\"toggle-true\">\n    <span class=\"indication\" [class.right]=\"toggleState\" [class.left]=\"!toggleState\"></span>\n  </div>\n\n  <span\n    [class.active]=\"!toggleState\"\n    class=\"d-inline-block option option-hide\">\n  </span>\n</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{display:flex;align-items:center}.option{font-size:.7142857143rem;font-weight:600;text-transform:uppercase;transition:all .35s}.option.active{color:#ff3f59;background-color:#ff3f59}.option-show{margin-right:4px}.option-hide{margin-left:4px}.toggle{width:36px;height:22px;position:relative;border-radius:10px;background-color:#d7d7d7;border:1px solid #d7d7d7;cursor:pointer}.toggle input{display:none}.toggle.active{background-color:#ff3f59;border:1px solid #ff3f59}.toggle .indication{top:-2px;position:absolute;display:inline-block;transform:translateY(-50%);transform:translateX(-50%);background-color:#f7f7fc;left:50%;border-radius:100%;width:24px;height:24px;transition:all .2s}.toggle .indication.left{transform:translateX(-22px);border:2px solid #d7d7d7}.toggle .indication.right{transform:translateX(2px);border:2px solid #c6003d}"]}]}],"members":{"toggleState":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"ontoggle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":3}}]}],"toggle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":36,"character":3},"arguments":["toggle",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"changeToggle":[{"__symbolic":"method"}]}},"ToggleModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":4}],"declarations":[{"__symbolic":"reference","name":"ToggleComponent"}],"exports":[{"__symbolic":"reference","name":"ToggleComponent"}]}]}],"members":{}}},"origins":{"ToggleComponent":"./toggle.component","ToggleModule":"./toogle.module"},"importAs":"@desbank/components/src/lib/toggle"}