UNPKG

@ngx-tiny/switch-input

Version:

![minzipped size](https://img.shields.io/bundlephobia/minzip/@ngx-tiny/switch-input?style=for-the-badge) ![last commit](https://img.shields.io/github/last-commit/aavanzyl/ngx-tiny?style=for-the-badge) ![licence](https://img.shields.io/npm/l/@ngx-tiny/sw

1 lines 3.97 kB
{"__symbolic":"module","version":4,"metadata":{"NgxSwitchInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"ngx-switch-input","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":17,"character":19},"member":"Default"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":20,"character":15},"useExisting":{"__symbolic":"reference","name":"NgxSwitchInputComponent"},"multi":true}],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":25,"character":17},"member":"None"},"template":"<label [for]=\"instanceId\" class=\"ngx-switch-input\">\r\n <span *ngIf=\"label\" class=\"ngx-switch-input-label\">{{label}}</span>\r\n <div class=\"ngx-switch-input-wrap\" [ngClass]=\"{ 'ngx-switch-input-checked': value }\">\r\n <input type=\"checkbox\" [id]=\"instanceId\" class=\"ngx-switch-input-input\" [checked]=\"value\" (change)=\"switch()\" [attr.aria-label]=\"label\">\r\n <span class=\"ngx-switch-input-background\"></span>\r\n <span class=\"ngx-switch-input-handle\"></span>\r\n </div>\r\n</label>","styles":["ngx-switch-input{display:inline-block}.ngx-switch-input{padding:5px 0}.ngx-switch-input-wrap{cursor:pointer;display:inline-block;overflow:visible;padding:1px 0;position:relative;vertical-align:top}.ngx-switch-input-label{cursor:pointer;display:inline-block;font-size:15px;padding-right:5px;padding-top:5px}.ngx-switch-input-handle{background:#fff;border-radius:100%;height:16px;left:3px;position:absolute;top:6px;transition:left .15s ease-out;width:16px}.ngx-switch-input-input{left:0;opacity:0;position:absolute;top:0}.ngx-switch-input-background{background:#ccc;border-radius:15px;display:block;font-size:16px;font-weight:400;height:26px;position:relative;text-transform:uppercase;transition:.15s ease-out;transition-property:opacity background;width:45px}.ngx-switch-input-background:after,.ngx-switch-input-background:before{line-height:1;margin-top:-7px;position:absolute;top:50%;transition:inherit}.ngx-switch-input-checked .ngx-switch-input-background{background:#3d3d3d}.ngx-switch-input-checked .ngx-switch-input-background:before{opacity:0}.ngx-switch-input-checked .ngx-switch-input-background:after{opacity:1}.ngx-switch-input-checked .ngx-switch-input-handle{left:25px}"]}]}],"members":{"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"_value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3},"arguments":["value"]}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"switch":[{"__symbolic":"method"}]}},"NgxSwitchInputModule":{"__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":5,"character":12}],"declarations":[{"__symbolic":"reference","name":"NgxSwitchInputComponent"}],"exports":[{"__symbolic":"reference","name":"NgxSwitchInputComponent"}]}]}],"members":{}}},"origins":{"NgxSwitchInputComponent":"./ngx-switch-input.component","NgxSwitchInputModule":"./ngx-switch-input.module"},"importAs":"@ngx-tiny/switch-input"}