mis-crystal-design-system 4.0.6 → 4.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/mis-crystal-design-system-switch.umd.js +2 -2
- package/bundles/mis-crystal-design-system-switch.umd.js.map +1 -1
- package/bundles/mis-crystal-design-system-switch.umd.min.js +1 -1
- package/bundles/mis-crystal-design-system-switch.umd.min.js.map +1 -1
- package/esm2015/switch/switch.component.js +3 -3
- package/fesm2015/mis-crystal-design-system-switch.js +2 -2
- package/fesm2015/mis-crystal-design-system-switch.js.map +1 -1
- package/package.json +1 -1
- package/switch/mis-crystal-design-system-switch.metadata.json +1 -1
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
SwitchComponent.decorators = [
|
|
38
38
|
{ type: core.Component, args: [{
|
|
39
39
|
selector: "mis-switch",
|
|
40
|
-
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
41
|
-
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative
|
|
40
|
+
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\" [ngStyle]=\"{'cursor': control.disabled ? 'not-allowed' : 'pointer'}\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
41
|
+
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative}.toggle-switch input{display:none}.toggle-switch input:checked+.slider{background-color:#0937b2}.toggle-switch input:checked+.slider:after{transform:translateX(23px)}.toggle-switch .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch .slider:after{position:absolute;content:\"\";height:24px;width:24px;background-color:#fff;border-radius:12px;left:2px;bottom:2px;transition:.25s}.toggle-switch-mobile{height:14px;width:34px;display:inline-block;position:relative}.toggle-switch-mobile input{display:none}.toggle-switch-mobile input:checked+.slider{background-color:#e0e0e0}.toggle-switch-mobile input:disabled+.slider{background-color:#f5f5f5!important}.toggle-switch-mobile input:checked+.slider:after{background-color:#0937b2;transform:translateX(34px)}.toggle-switch-mobile input:checked:disabled+.slider:after{background-color:#929dab}.toggle-switch-mobile .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch-mobile .slider:after{position:absolute;content:\"\";height:20px;width:20px;background-color:#fff;box-shadow:0 0 6px -2px #929dab;border-radius:12px;top:-3px;left:-10px;transition:.25s}"]
|
|
42
42
|
},] }
|
|
43
43
|
];
|
|
44
44
|
SwitchComponent.ctorParameters = function () { return []; };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-switch.umd.js","sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts","../../../projects/mis-components/switch/mis-crystal-design-system-switch.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n selector: \"mis-switch\",\n templateUrl: \"./switch.component.html\",\n styleUrls: [\"./switch.component.scss\"]\n})\nexport class SwitchComponent implements OnInit {\n @Input() mobileView: boolean = false;\n @Input() set checked(value: boolean) {\n this.control.setValue(value);\n }\n @Input() set disabled(value: boolean) {\n if (value) this.control.disable();\n else this.control.enable();\n }\n @Input() control: AbstractControl = new FormControl(false);\n\n /** Emits value when toggled */\n @Output() valueChanged = new EventEmitter<boolean>();\n\n constructor() {}\n ngOnInit() {}\n onChange(event) {\n this.valueChanged.emit(this.control.value);\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { SwitchComponent } from \"./switch.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n declarations: [SwitchComponent],\n imports: [CommonModule, ReactiveFormsModule],\n exports: [SwitchComponent]\n})\nexport class SwitchModule {\n static forRoot(): ModuleWithProviders<SwitchModule> {\n return { ngModule: SwitchModule, providers: [] };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["FormControl","EventEmitter","Component","Input","Output","NgModule","CommonModule","ReactiveFormsModule"],"mappings":";;;;;;;QAsBE;YAbS,eAAU,GAAY,KAAK,CAAC;YAQ5B,YAAO,GAAoB,IAAIA,iBAAW,CAAC,KAAK,CAAC,CAAC;;YAGjD,iBAAY,GAAG,IAAIC,iBAAY,EAAW,CAAC;SAErC;QAZhB,sBAAa,oCAAO;iBAApB,UAAqB,KAAc;gBACjC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aAC9B;;;WAAA;QACD,sBAAa,qCAAQ;iBAArB,UAAsB,KAAc;gBAClC,IAAI,KAAK;oBAAE,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;;oBAC7B,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;aAC5B;;;WAAA;QAOD,kCAAQ,GAAR,eAAa;QACb,kCAAQ,GAAR,UAAS,KAAK;YACZ,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;SAC5C;;;;gBAvBFC,cAAS,SAAC;oBACT,QAAQ,EAAE,YAAY;oBACtB,
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-switch.umd.js","sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts","../../../projects/mis-components/switch/mis-crystal-design-system-switch.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n selector: \"mis-switch\",\n templateUrl: \"./switch.component.html\",\n styleUrls: [\"./switch.component.scss\"]\n})\nexport class SwitchComponent implements OnInit {\n @Input() mobileView: boolean = false;\n @Input() set checked(value: boolean) {\n this.control.setValue(value);\n }\n @Input() set disabled(value: boolean) {\n if (value) this.control.disable();\n else this.control.enable();\n }\n @Input() control: AbstractControl = new FormControl(false);\n\n /** Emits value when toggled */\n @Output() valueChanged = new EventEmitter<boolean>();\n\n constructor() {}\n ngOnInit() {}\n onChange(event) {\n this.valueChanged.emit(this.control.value);\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { SwitchComponent } from \"./switch.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n declarations: [SwitchComponent],\n imports: [CommonModule, ReactiveFormsModule],\n exports: [SwitchComponent]\n})\nexport class SwitchModule {\n static forRoot(): ModuleWithProviders<SwitchModule> {\n return { ngModule: SwitchModule, providers: [] };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["FormControl","EventEmitter","Component","Input","Output","NgModule","CommonModule","ReactiveFormsModule"],"mappings":";;;;;;;QAsBE;YAbS,eAAU,GAAY,KAAK,CAAC;YAQ5B,YAAO,GAAoB,IAAIA,iBAAW,CAAC,KAAK,CAAC,CAAC;;YAGjD,iBAAY,GAAG,IAAIC,iBAAY,EAAW,CAAC;SAErC;QAZhB,sBAAa,oCAAO;iBAApB,UAAqB,KAAc;gBACjC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aAC9B;;;WAAA;QACD,sBAAa,qCAAQ;iBAArB,UAAsB,KAAc;gBAClC,IAAI,KAAK;oBAAE,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;;oBAC7B,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;aAC5B;;;WAAA;QAOD,kCAAQ,GAAR,eAAa;QACb,kCAAQ,GAAR,UAAS,KAAK;YACZ,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;SAC5C;;;;gBAvBFC,cAAS,SAAC;oBACT,QAAQ,EAAE,YAAY;oBACtB,4SAAsC;;iBAEvC;;;;6BAEEC,UAAK;0BACLA,UAAK;2BAGLA,UAAK;0BAILA,UAAK;+BAGLC,WAAM;;;;QCTT;;QACS,oBAAO,GAAd;YACE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;SAClD;;;;gBARFC,aAAQ,SAAC;oBACR,YAAY,EAAE,CAAC,eAAe,CAAC;oBAC/B,OAAO,EAAE,CAACC,mBAAY,EAAEC,yBAAmB,CAAC;oBAC5C,OAAO,EAAE,CAAC,eAAe,CAAC;iBAC3B;;;ICVD;;;;;;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/switch",["exports","@angular/core","@angular/forms","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].switch={}),e.ng.core,e.ng.forms,e.ng.common)}(this,(function(e,t,o,i){"use strict";var n=function(){function e(){this.mobileView=!1,this.control=new o.FormControl(!1),this.valueChanged=new t.EventEmitter}return Object.defineProperty(e.prototype,"checked",{set:function(e){this.control.setValue(e)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"disabled",{set:function(e){e?this.control.disable():this.control.enable()},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){},e.prototype.onChange=function(e){this.valueChanged.emit(this.control.value)},e}();n.decorators=[{type:t.Component,args:[{selector:"mis-switch",template:'<label class="toggle-switch" [ngClass]="{ \'toggle-switch-mobile\': mobileView }">\n <input type="checkbox" (change)="onChange($event)" [formControl]="control" />\n <span class="slider"></span>\n</label>\n',styles:['.toggle-switch{height:28px;width:51px;display:inline-block;position:relative
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@angular/common")):"function"==typeof define&&define.amd?define("mis-crystal-design-system/switch",["exports","@angular/core","@angular/forms","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["mis-crystal-design-system"]=e["mis-crystal-design-system"]||{},e["mis-crystal-design-system"].switch={}),e.ng.core,e.ng.forms,e.ng.common)}(this,(function(e,t,o,i){"use strict";var n=function(){function e(){this.mobileView=!1,this.control=new o.FormControl(!1),this.valueChanged=new t.EventEmitter}return Object.defineProperty(e.prototype,"checked",{set:function(e){this.control.setValue(e)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"disabled",{set:function(e){e?this.control.disable():this.control.enable()},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){},e.prototype.onChange=function(e){this.valueChanged.emit(this.control.value)},e}();n.decorators=[{type:t.Component,args:[{selector:"mis-switch",template:'<label class="toggle-switch" [ngClass]="{ \'toggle-switch-mobile\': mobileView }" [ngStyle]="{\'cursor\': control.disabled ? \'not-allowed\' : \'pointer\'}">\n <input type="checkbox" (change)="onChange($event)" [formControl]="control" />\n <span class="slider"></span>\n</label>\n',styles:['.toggle-switch{height:28px;width:51px;display:inline-block;position:relative}.toggle-switch input{display:none}.toggle-switch input:checked+.slider{background-color:#0937b2}.toggle-switch input:checked+.slider:after{transform:translateX(23px)}.toggle-switch .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch .slider:after{position:absolute;content:"";height:24px;width:24px;background-color:#fff;border-radius:12px;left:2px;bottom:2px;transition:.25s}.toggle-switch-mobile{height:14px;width:34px;display:inline-block;position:relative}.toggle-switch-mobile input{display:none}.toggle-switch-mobile input:checked+.slider{background-color:#e0e0e0}.toggle-switch-mobile input:disabled+.slider{background-color:#f5f5f5!important}.toggle-switch-mobile input:checked+.slider:after{background-color:#0937b2;transform:translateX(34px)}.toggle-switch-mobile input:checked:disabled+.slider:after{background-color:#929dab}.toggle-switch-mobile .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch-mobile .slider:after{position:absolute;content:"";height:20px;width:20px;background-color:#fff;box-shadow:0 0 6px -2px #929dab;border-radius:12px;top:-3px;left:-10px;transition:.25s}']}]}],n.ctorParameters=function(){return[]},n.propDecorators={mobileView:[{type:t.Input}],checked:[{type:t.Input}],disabled:[{type:t.Input}],control:[{type:t.Input}],valueChanged:[{type:t.Output}]};var r=function(){function e(){}return e.forRoot=function(){return{ngModule:e,providers:[]}},e}();r.decorators=[{type:t.NgModule,args:[{declarations:[n],imports:[i.CommonModule,o.ReactiveFormsModule],exports:[n]}]}],e.SwitchComponent=n,e.SwitchModule=r,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
2
2
|
//# sourceMappingURL=mis-crystal-design-system-switch.umd.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts"],"names":["SwitchComponent","this","mobileView","control","FormControl","valueChanged","EventEmitter","Object","defineProperty","prototype","value","setValue","disable","enable","ngOnInit","onChange","event","emit","Component","args","selector","template","Input","Output","SwitchModule","forRoot","ngModule","providers","NgModule","declarations","imports","CommonModule","ReactiveFormsModule","exports"],"mappings":"2iBAsBE,SAAAA,IAbSC,KAAAC,YAAsB,EAQtBD,KAAAE,QAA2B,IAAIC,EAAAA,aAAY,GAG1CH,KAAAI,aAAe,IAAIC,EAAAA,oBAV7BC,OAAAC,eAAaR,EAAAS,UAAA,UAAO,KAApB,SAAqBC,GACnBT,KAAKE,QAAQQ,SAASD,oCAExBH,OAAAC,eAAaR,EAAAS,UAAA,WAAQ,KAArB,SAAsBC,GAChBA,EAAOT,KAAKE,QAAQS,UACnBX,KAAKE,QAAQU,0CAQpBb,EAAAS,UAAAK,SAAA,aACAd,EAAAS,UAAAM,SAAA,SAASC,GACPf,KAAKI,aAAaY,KAAKhB,KAAKE,QAAQO,iCAtBvCQ,EAAAA,UAASC,KAAA,CAAC,CACTC,SAAU,aACVC,SAAA,
|
|
1
|
+
{"version":3,"sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts"],"names":["SwitchComponent","this","mobileView","control","FormControl","valueChanged","EventEmitter","Object","defineProperty","prototype","value","setValue","disable","enable","ngOnInit","onChange","event","emit","Component","args","selector","template","Input","Output","SwitchModule","forRoot","ngModule","providers","NgModule","declarations","imports","CommonModule","ReactiveFormsModule","exports"],"mappings":"2iBAsBE,SAAAA,IAbSC,KAAAC,YAAsB,EAQtBD,KAAAE,QAA2B,IAAIC,EAAAA,aAAY,GAG1CH,KAAAI,aAAe,IAAIC,EAAAA,oBAV7BC,OAAAC,eAAaR,EAAAS,UAAA,UAAO,KAApB,SAAqBC,GACnBT,KAAKE,QAAQQ,SAASD,oCAExBH,OAAAC,eAAaR,EAAAS,UAAA,WAAQ,KAArB,SAAsBC,GAChBA,EAAOT,KAAKE,QAAQS,UACnBX,KAAKE,QAAQU,0CAQpBb,EAAAS,UAAAK,SAAA,aACAd,EAAAS,UAAAM,SAAA,SAASC,GACPf,KAAKI,aAAaY,KAAKhB,KAAKE,QAAQO,iCAtBvCQ,EAAAA,UAASC,KAAA,CAAC,CACTC,SAAU,aACVC,SAAA,sqDAICC,EAAAA,uBACAA,EAAAA,wBAGAA,EAAAA,uBAIAA,EAAAA,4BAGAC,EAAAA,2BCTH,SAAAC,YACSA,EAAAC,QAAP,WACE,MAAO,CAAEC,SAAUF,EAAcG,UAAW,8BAP/CC,EAAAA,SAAQT,KAAA,CAAC,CACRU,aAAc,CAAC7B,GACf8B,QAAS,CAACC,EAAAA,aAAcC,EAAAA,qBACxBC,QAAS,CAACjC","sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n selector: \"mis-switch\",\n templateUrl: \"./switch.component.html\",\n styleUrls: [\"./switch.component.scss\"]\n})\nexport class SwitchComponent implements OnInit {\n @Input() mobileView: boolean = false;\n @Input() set checked(value: boolean) {\n this.control.setValue(value);\n }\n @Input() set disabled(value: boolean) {\n if (value) this.control.disable();\n else this.control.enable();\n }\n @Input() control: AbstractControl = new FormControl(false);\n\n /** Emits value when toggled */\n @Output() valueChanged = new EventEmitter<boolean>();\n\n constructor() {}\n ngOnInit() {}\n onChange(event) {\n this.valueChanged.emit(this.control.value);\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { SwitchComponent } from \"./switch.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n declarations: [SwitchComponent],\n imports: [CommonModule, ReactiveFormsModule],\n exports: [SwitchComponent]\n})\nexport class SwitchModule {\n static forRoot(): ModuleWithProviders<SwitchModule> {\n return { ngModule: SwitchModule, providers: [] };\n }\n}\n"]}
|
|
@@ -24,8 +24,8 @@ export class SwitchComponent {
|
|
|
24
24
|
SwitchComponent.decorators = [
|
|
25
25
|
{ type: Component, args: [{
|
|
26
26
|
selector: "mis-switch",
|
|
27
|
-
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
28
|
-
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative
|
|
27
|
+
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\" [ngStyle]=\"{'cursor': control.disabled ? 'not-allowed' : 'pointer'}\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
28
|
+
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative}.toggle-switch input{display:none}.toggle-switch input:checked+.slider{background-color:#0937b2}.toggle-switch input:checked+.slider:after{transform:translateX(23px)}.toggle-switch .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch .slider:after{position:absolute;content:\"\";height:24px;width:24px;background-color:#fff;border-radius:12px;left:2px;bottom:2px;transition:.25s}.toggle-switch-mobile{height:14px;width:34px;display:inline-block;position:relative}.toggle-switch-mobile input{display:none}.toggle-switch-mobile input:checked+.slider{background-color:#e0e0e0}.toggle-switch-mobile input:disabled+.slider{background-color:#f5f5f5!important}.toggle-switch-mobile input:checked+.slider:after{background-color:#0937b2;transform:translateX(34px)}.toggle-switch-mobile input:checked:disabled+.slider:after{background-color:#929dab}.toggle-switch-mobile .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch-mobile .slider:after{position:absolute;content:\"\";height:20px;width:20px;background-color:#fff;box-shadow:0 0 6px -2px #929dab;border-radius:12px;top:-3px;left:-10px;transition:.25s}"]
|
|
29
29
|
},] }
|
|
30
30
|
];
|
|
31
31
|
SwitchComponent.ctorParameters = () => [];
|
|
@@ -36,4 +36,4 @@ SwitchComponent.propDecorators = {
|
|
|
36
36
|
control: [{ type: Input }],
|
|
37
37
|
valueChanged: [{ type: Output }]
|
|
38
38
|
};
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3dpdGNoLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL21pcy1jb21wb25lbnRzL3N3aXRjaC9zd2l0Y2guY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0UsT0FBTyxFQUFtQixXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQU85RCxNQUFNLE9BQU8sZUFBZTtJQWMxQjtRQWJTLGVBQVUsR0FBWSxLQUFLLENBQUM7UUFRNUIsWUFBTyxHQUFvQixJQUFJLFdBQVcsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUUzRCwrQkFBK0I7UUFDckIsaUJBQVksR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBRXRDLENBQUM7SUFaaEIsSUFBYSxPQUFPLENBQUMsS0FBYztRQUNqQyxJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMvQixDQUFDO0lBQ0QsSUFBYSxRQUFRLENBQUMsS0FBYztRQUNsQyxJQUFJLEtBQUs7WUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sRUFBRSxDQUFDOztZQUM3QixJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxDQUFDO0lBQzdCLENBQUM7SUFPRCxRQUFRLEtBQUksQ0FBQztJQUNiLFFBQVEsQ0FBQyxLQUFLO1FBQ1osSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM3QyxDQUFDOzs7WUF2QkYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxZQUFZO2dCQUN0Qiw0U0FBc0M7O2FBRXZDOzs7O3lCQUVFLEtBQUs7c0JBQ0wsS0FBSzt1QkFHTCxLQUFLO3NCQUlMLEtBQUs7MkJBR0wsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQWJzdHJhY3RDb250cm9sLCBGb3JtQ29udHJvbCB9IGZyb20gXCJAYW5ndWxhci9mb3Jtc1wiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwibWlzLXN3aXRjaFwiLFxuICB0ZW1wbGF0ZVVybDogXCIuL3N3aXRjaC5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybHM6IFtcIi4vc3dpdGNoLmNvbXBvbmVudC5zY3NzXCJdXG59KVxuZXhwb3J0IGNsYXNzIFN3aXRjaENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIG1vYmlsZVZpZXc6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgc2V0IGNoZWNrZWQodmFsdWU6IGJvb2xlYW4pIHtcbiAgICB0aGlzLmNvbnRyb2wuc2V0VmFsdWUodmFsdWUpO1xuICB9XG4gIEBJbnB1dCgpIHNldCBkaXNhYmxlZCh2YWx1ZTogYm9vbGVhbikge1xuICAgIGlmICh2YWx1ZSkgdGhpcy5jb250cm9sLmRpc2FibGUoKTtcbiAgICBlbHNlIHRoaXMuY29udHJvbC5lbmFibGUoKTtcbiAgfVxuICBASW5wdXQoKSBjb250cm9sOiBBYnN0cmFjdENvbnRyb2wgPSBuZXcgRm9ybUNvbnRyb2woZmFsc2UpO1xuXG4gIC8qKiBFbWl0cyB2YWx1ZSB3aGVuIHRvZ2dsZWQgKi9cbiAgQE91dHB1dCgpIHZhbHVlQ2hhbmdlZCA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICBjb25zdHJ1Y3RvcigpIHt9XG4gIG5nT25Jbml0KCkge31cbiAgb25DaGFuZ2UoZXZlbnQpIHtcbiAgICB0aGlzLnZhbHVlQ2hhbmdlZC5lbWl0KHRoaXMuY29udHJvbC52YWx1ZSk7XG4gIH1cbn1cbiJdfQ==
|
|
@@ -26,8 +26,8 @@ class SwitchComponent {
|
|
|
26
26
|
SwitchComponent.decorators = [
|
|
27
27
|
{ type: Component, args: [{
|
|
28
28
|
selector: "mis-switch",
|
|
29
|
-
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
30
|
-
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative
|
|
29
|
+
template: "<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\" [ngStyle]=\"{'cursor': control.disabled ? 'not-allowed' : 'pointer'}\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n",
|
|
30
|
+
styles: [".toggle-switch{height:28px;width:51px;display:inline-block;position:relative}.toggle-switch input{display:none}.toggle-switch input:checked+.slider{background-color:#0937b2}.toggle-switch input:checked+.slider:after{transform:translateX(23px)}.toggle-switch .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch .slider:after{position:absolute;content:\"\";height:24px;width:24px;background-color:#fff;border-radius:12px;left:2px;bottom:2px;transition:.25s}.toggle-switch-mobile{height:14px;width:34px;display:inline-block;position:relative}.toggle-switch-mobile input{display:none}.toggle-switch-mobile input:checked+.slider{background-color:#e0e0e0}.toggle-switch-mobile input:disabled+.slider{background-color:#f5f5f5!important}.toggle-switch-mobile input:checked+.slider:after{background-color:#0937b2;transform:translateX(34px)}.toggle-switch-mobile input:checked:disabled+.slider:after{background-color:#929dab}.toggle-switch-mobile .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch-mobile .slider:after{position:absolute;content:\"\";height:20px;width:20px;background-color:#fff;box-shadow:0 0 6px -2px #929dab;border-radius:12px;top:-3px;left:-10px;transition:.25s}"]
|
|
31
31
|
},] }
|
|
32
32
|
];
|
|
33
33
|
SwitchComponent.ctorParameters = () => [];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-switch.js","sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts","../../../projects/mis-components/switch/mis-crystal-design-system-switch.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n selector: \"mis-switch\",\n templateUrl: \"./switch.component.html\",\n styleUrls: [\"./switch.component.scss\"]\n})\nexport class SwitchComponent implements OnInit {\n @Input() mobileView: boolean = false;\n @Input() set checked(value: boolean) {\n this.control.setValue(value);\n }\n @Input() set disabled(value: boolean) {\n if (value) this.control.disable();\n else this.control.enable();\n }\n @Input() control: AbstractControl = new FormControl(false);\n\n /** Emits value when toggled */\n @Output() valueChanged = new EventEmitter<boolean>();\n\n constructor() {}\n ngOnInit() {}\n onChange(event) {\n this.valueChanged.emit(this.control.value);\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { SwitchComponent } from \"./switch.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n declarations: [SwitchComponent],\n imports: [CommonModule, ReactiveFormsModule],\n exports: [SwitchComponent]\n})\nexport class SwitchModule {\n static forRoot(): ModuleWithProviders<SwitchModule> {\n return { ngModule: SwitchModule, providers: [] };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAQa,eAAe;IAc1B;QAbS,eAAU,GAAY,KAAK,CAAC;QAQ5B,YAAO,GAAoB,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC;;QAGjD,iBAAY,GAAG,IAAI,YAAY,EAAW,CAAC;KAErC;IAZhB,IAAa,OAAO,CAAC,KAAc;QACjC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;KAC9B;IACD,IAAa,QAAQ,CAAC,KAAc;QAClC,IAAI,KAAK;YAAE,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;;YAC7B,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;KAC5B;IAOD,QAAQ,MAAK;IACb,QAAQ,CAAC,KAAK;QACZ,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;KAC5C;;;YAvBF,SAAS,SAAC;gBACT,QAAQ,EAAE,YAAY;gBACtB,
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-switch.js","sources":["../../../projects/mis-components/switch/switch.component.ts","../../../projects/mis-components/switch/switch.module.ts","../../../projects/mis-components/switch/mis-crystal-design-system-switch.ts"],"sourcesContent":["import { Component, Input, OnInit, Output, EventEmitter } from \"@angular/core\";\nimport { AbstractControl, FormControl } from \"@angular/forms\";\n\n@Component({\n selector: \"mis-switch\",\n templateUrl: \"./switch.component.html\",\n styleUrls: [\"./switch.component.scss\"]\n})\nexport class SwitchComponent implements OnInit {\n @Input() mobileView: boolean = false;\n @Input() set checked(value: boolean) {\n this.control.setValue(value);\n }\n @Input() set disabled(value: boolean) {\n if (value) this.control.disable();\n else this.control.enable();\n }\n @Input() control: AbstractControl = new FormControl(false);\n\n /** Emits value when toggled */\n @Output() valueChanged = new EventEmitter<boolean>();\n\n constructor() {}\n ngOnInit() {}\n onChange(event) {\n this.valueChanged.emit(this.control.value);\n }\n}\n","import { NgModule, ModuleWithProviders } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { SwitchComponent } from \"./switch.component\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\n\n@NgModule({\n declarations: [SwitchComponent],\n imports: [CommonModule, ReactiveFormsModule],\n exports: [SwitchComponent]\n})\nexport class SwitchModule {\n static forRoot(): ModuleWithProviders<SwitchModule> {\n return { ngModule: SwitchModule, providers: [] };\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAQa,eAAe;IAc1B;QAbS,eAAU,GAAY,KAAK,CAAC;QAQ5B,YAAO,GAAoB,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC;;QAGjD,iBAAY,GAAG,IAAI,YAAY,EAAW,CAAC;KAErC;IAZhB,IAAa,OAAO,CAAC,KAAc;QACjC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;KAC9B;IACD,IAAa,QAAQ,CAAC,KAAc;QAClC,IAAI,KAAK;YAAE,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;;YAC7B,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;KAC5B;IAOD,QAAQ,MAAK;IACb,QAAQ,CAAC,KAAK;QACZ,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;KAC5C;;;YAvBF,SAAS,SAAC;gBACT,QAAQ,EAAE,YAAY;gBACtB,4SAAsC;;aAEvC;;;;yBAEE,KAAK;sBACL,KAAK;uBAGL,KAAK;sBAIL,KAAK;2BAGL,MAAM;;;MCTI,YAAY;IACvB,OAAO,OAAO;QACZ,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC;KAClD;;;YARF,QAAQ,SAAC;gBACR,YAAY,EAAE,CAAC,eAAe,CAAC;gBAC/B,OAAO,EAAE,CAAC,YAAY,EAAE,mBAAmB,CAAC;gBAC5C,OAAO,EAAE,CAAC,eAAe,CAAC;aAC3B;;;ACVD;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"__symbolic":"module","version":4,"metadata":{"SwitchComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"mis-switch","template":"<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n","styles":[".toggle-switch{height:28px;width:51px;display:inline-block;position:relative
|
|
1
|
+
{"__symbolic":"module","version":4,"metadata":{"SwitchComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"mis-switch","template":"<label class=\"toggle-switch\" [ngClass]=\"{ 'toggle-switch-mobile': mobileView }\" [ngStyle]=\"{'cursor': control.disabled ? 'not-allowed' : 'pointer'}\">\n <input type=\"checkbox\" (change)=\"onChange($event)\" [formControl]=\"control\" />\n <span class=\"slider\"></span>\n</label>\n","styles":[".toggle-switch{height:28px;width:51px;display:inline-block;position:relative}.toggle-switch input{display:none}.toggle-switch input:checked+.slider{background-color:#0937b2}.toggle-switch input:checked+.slider:after{transform:translateX(23px)}.toggle-switch .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch .slider:after{position:absolute;content:\"\";height:24px;width:24px;background-color:#fff;border-radius:12px;left:2px;bottom:2px;transition:.25s}.toggle-switch-mobile{height:14px;width:34px;display:inline-block;position:relative}.toggle-switch-mobile input{display:none}.toggle-switch-mobile input:checked+.slider{background-color:#e0e0e0}.toggle-switch-mobile input:disabled+.slider{background-color:#f5f5f5!important}.toggle-switch-mobile input:checked+.slider:after{background-color:#0937b2;transform:translateX(34px)}.toggle-switch-mobile input:checked:disabled+.slider:after{background-color:#929dab}.toggle-switch-mobile .slider{position:absolute;left:0;top:0;right:0;bottom:0;background-color:#e0e0e0;transition:.25s;border-radius:14px}.toggle-switch-mobile .slider:after{position:absolute;content:\"\";height:20px;width:20px;background-color:#fff;box-shadow:0 0 6px -2px #929dab;border-radius:12px;top:-3px;left:-10px;transition:.25s}"]}]}],"members":{"mobileView":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":3}}]}],"checked":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"control":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"valueChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}]}},"SwitchModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"SwitchComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":8,"character":26}],"exports":[{"__symbolic":"reference","name":"SwitchComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"SwitchModule"},"providers":[]}}}}},"origins":{"SwitchComponent":"./switch.component","SwitchModule":"./switch.module"},"importAs":"mis-crystal-design-system/switch"}
|