@klippa/ngx-enhancy-forms 20.0.0 → 20.0.2
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.
|
@@ -403,7 +403,10 @@ class FormComponent {
|
|
|
403
403
|
return current;
|
|
404
404
|
}
|
|
405
405
|
unregisterControl(formControl) {
|
|
406
|
+
console.log('this.activeControls before', this.activeControls.length);
|
|
407
|
+
console.log(this.activeControls);
|
|
406
408
|
this.activeControls = this.activeControls.filter((e) => e.formControl !== formControl);
|
|
409
|
+
console.log('this.activeControls after', this.activeControls.length);
|
|
407
410
|
if (this.parent) {
|
|
408
411
|
this.parent.unregisterControl(formControl);
|
|
409
412
|
}
|
|
@@ -1919,11 +1922,11 @@ class ToggleComponent extends ValueAccessorBase {
|
|
|
1919
1922
|
this.transparentBackground = true;
|
|
1920
1923
|
}
|
|
1921
1924
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ToggleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1922
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ToggleComponent, isStandalone: false, selector: "klp-form-toggle", inputs: { transparentBackground: "transparentBackground" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: ToggleComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\" [ngClass]=\"{disabled: disabled}\">\n\t<input type=\"checkbox\" class=\"nativeCheckbox\"\n\t\t[(ngModel)]=\"innerValue\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.checked); touch()\"\n\t\t[disabled]=\"disabled\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t #nativeInputRef\n\t/>\n\t<div class=\"toggleVisual\" [ngClass]=\"{transparentBackground: transparentBackground}\"></div>\n</div>\n", styles: [":host{display:block}.componentContainer{position:relative;padding-right:6px}.nativeCheckbox{position:absolute;opacity:0;top:0;left:0;width:35px;height:20px;cursor:pointer;margin:0}.toggleVisual{pointer-events:none;position:relative;display:block;transition:.4s ease;-webkit-transition:.4s ease;-moz-transition:.4s ease;-o-transition:.4s ease;-ms-transition:.4s ease;width:35px;height:20px;border:1px solid #D0D5DD;border-radius:35px;background:#eaecf0}.toggleVisual.transparentBackground{background:transparent}.toggleVisual:before{content:\"\";position:absolute;display:block;transition:.2s cubic-bezier(.24,0,.5,1);-webkit-transition:.2s cubic-bezier(.24,0,.5,1);-moz-transition:.2s cubic-bezier(.24,0,.5,1);-o-transition:.2s cubic-bezier(.24,0,.5,1);-ms-transition:.2s cubic-bezier(.24,0,.5,1);margin:1px;width:33px;height:18px;top:-1px;left:-1px;border-radius:30px}.toggleVisual:after{content:\"\";position:absolute;display:block;box-shadow:0 0 0 1px #0000001a,0 4px #0000000a,0 4px 9px #00000021,0 3px 3px #0000000d;transition:.35s cubic-bezier(.54,1.6,.5,1);-webkit-transition:.35s cubic-bezier(.54,1.6,.5,1);-moz-transition:.35s cubic-bezier(.54,1.6,.5,1);-o-transition:.35s cubic-bezier(.54,1.6,.5,1);-ms-transition:.35s cubic-bezier(.54,1.6,.5,1);background:#f7f7f7;height:20px;width:20px;top:-1px;left:0;border-radius:60px}.nativeCheckbox:checked+.toggleVisual:before{background:#37c936;transition:width .2s cubic-bezier(0,0,0,.1);-webkit-transition:width .2s cubic-bezier(0,0,0,.1);-moz-transition:width .2s cubic-bezier(0,0,0,.1);-o-transition:width .2s cubic-bezier(0,0,0,.1);-ms-transition:width .2s cubic-bezier(0,0,0,.1)}.nativeCheckbox:checked+.toggleVisual:after{left:18px}.disabled{opacity:.6}.disabled .nativeCheckbox{cursor:not-allowed}.showErrors+.toggleVisual:before{border:1px solid #ff8000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
1925
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ToggleComponent, isStandalone: false, selector: "klp-form-toggle", inputs: { transparentBackground: "transparentBackground" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: ToggleComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\" [ngClass]=\"{disabled: disabled}\">\n\t<div class=\"hiddenValue\" data-cy-value>{{innerValue}}</div>\n\t<input type=\"checkbox\" class=\"nativeCheckbox\"\n\t\t[(ngModel)]=\"innerValue\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.checked); touch()\"\n\t\t[disabled]=\"disabled\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t #nativeInputRef\n\t/>\n\t<div class=\"toggleVisual\" [ngClass]=\"{transparentBackground: transparentBackground}\"></div>\n</div>\n", styles: [":host{display:block}.hiddenValue{display:none}.componentContainer{position:relative;padding-right:6px}.nativeCheckbox{position:absolute;opacity:0;top:0;left:0;width:35px;height:20px;cursor:pointer;margin:0}.toggleVisual{pointer-events:none;position:relative;display:block;transition:.4s ease;-webkit-transition:.4s ease;-moz-transition:.4s ease;-o-transition:.4s ease;-ms-transition:.4s ease;width:35px;height:20px;border:1px solid #D0D5DD;border-radius:35px;background:#eaecf0}.toggleVisual.transparentBackground{background:transparent}.toggleVisual:before{content:\"\";position:absolute;display:block;transition:.2s cubic-bezier(.24,0,.5,1);-webkit-transition:.2s cubic-bezier(.24,0,.5,1);-moz-transition:.2s cubic-bezier(.24,0,.5,1);-o-transition:.2s cubic-bezier(.24,0,.5,1);-ms-transition:.2s cubic-bezier(.24,0,.5,1);margin:1px;width:33px;height:18px;top:-1px;left:-1px;border-radius:30px}.toggleVisual:after{content:\"\";position:absolute;display:block;box-shadow:0 0 0 1px #0000001a,0 4px #0000000a,0 4px 9px #00000021,0 3px 3px #0000000d;transition:.35s cubic-bezier(.54,1.6,.5,1);-webkit-transition:.35s cubic-bezier(.54,1.6,.5,1);-moz-transition:.35s cubic-bezier(.54,1.6,.5,1);-o-transition:.35s cubic-bezier(.54,1.6,.5,1);-ms-transition:.35s cubic-bezier(.54,1.6,.5,1);background:#f7f7f7;height:20px;width:20px;top:-1px;left:0;border-radius:60px}.nativeCheckbox:checked+.toggleVisual:before{background:#37c936;transition:width .2s cubic-bezier(0,0,0,.1);-webkit-transition:width .2s cubic-bezier(0,0,0,.1);-moz-transition:width .2s cubic-bezier(0,0,0,.1);-o-transition:width .2s cubic-bezier(0,0,0,.1);-ms-transition:width .2s cubic-bezier(0,0,0,.1)}.nativeCheckbox:checked+.toggleVisual:after{left:18px}.disabled{opacity:.6}.disabled .nativeCheckbox{cursor:not-allowed}.showErrors+.toggleVisual:before{border:1px solid #ff8000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
1923
1926
|
}
|
|
1924
1927
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
1925
1928
|
type: Component,
|
|
1926
|
-
args: [{ selector: 'klp-form-toggle', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: ToggleComponent, multi: true }], standalone: false, template: "<div class=\"componentContainer\" [ngClass]=\"{disabled: disabled}\">\n\t<input type=\"checkbox\" class=\"nativeCheckbox\"\n\t\t[(ngModel)]=\"innerValue\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.checked); touch()\"\n\t\t[disabled]=\"disabled\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t #nativeInputRef\n\t/>\n\t<div class=\"toggleVisual\" [ngClass]=\"{transparentBackground: transparentBackground}\"></div>\n</div>\n", styles: [":host{display:block}.componentContainer{position:relative;padding-right:6px}.nativeCheckbox{position:absolute;opacity:0;top:0;left:0;width:35px;height:20px;cursor:pointer;margin:0}.toggleVisual{pointer-events:none;position:relative;display:block;transition:.4s ease;-webkit-transition:.4s ease;-moz-transition:.4s ease;-o-transition:.4s ease;-ms-transition:.4s ease;width:35px;height:20px;border:1px solid #D0D5DD;border-radius:35px;background:#eaecf0}.toggleVisual.transparentBackground{background:transparent}.toggleVisual:before{content:\"\";position:absolute;display:block;transition:.2s cubic-bezier(.24,0,.5,1);-webkit-transition:.2s cubic-bezier(.24,0,.5,1);-moz-transition:.2s cubic-bezier(.24,0,.5,1);-o-transition:.2s cubic-bezier(.24,0,.5,1);-ms-transition:.2s cubic-bezier(.24,0,.5,1);margin:1px;width:33px;height:18px;top:-1px;left:-1px;border-radius:30px}.toggleVisual:after{content:\"\";position:absolute;display:block;box-shadow:0 0 0 1px #0000001a,0 4px #0000000a,0 4px 9px #00000021,0 3px 3px #0000000d;transition:.35s cubic-bezier(.54,1.6,.5,1);-webkit-transition:.35s cubic-bezier(.54,1.6,.5,1);-moz-transition:.35s cubic-bezier(.54,1.6,.5,1);-o-transition:.35s cubic-bezier(.54,1.6,.5,1);-ms-transition:.35s cubic-bezier(.54,1.6,.5,1);background:#f7f7f7;height:20px;width:20px;top:-1px;left:0;border-radius:60px}.nativeCheckbox:checked+.toggleVisual:before{background:#37c936;transition:width .2s cubic-bezier(0,0,0,.1);-webkit-transition:width .2s cubic-bezier(0,0,0,.1);-moz-transition:width .2s cubic-bezier(0,0,0,.1);-o-transition:width .2s cubic-bezier(0,0,0,.1);-ms-transition:width .2s cubic-bezier(0,0,0,.1)}.nativeCheckbox:checked+.toggleVisual:after{left:18px}.disabled{opacity:.6}.disabled .nativeCheckbox{cursor:not-allowed}.showErrors+.toggleVisual:before{border:1px solid #ff8000}\n"] }]
|
|
1929
|
+
args: [{ selector: 'klp-form-toggle', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: ToggleComponent, multi: true }], standalone: false, template: "<div class=\"componentContainer\" [ngClass]=\"{disabled: disabled}\">\n\t<div class=\"hiddenValue\" data-cy-value>{{innerValue}}</div>\n\t<input type=\"checkbox\" class=\"nativeCheckbox\"\n\t\t[(ngModel)]=\"innerValue\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.checked); touch()\"\n\t\t[disabled]=\"disabled\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t #nativeInputRef\n\t/>\n\t<div class=\"toggleVisual\" [ngClass]=\"{transparentBackground: transparentBackground}\"></div>\n</div>\n", styles: [":host{display:block}.hiddenValue{display:none}.componentContainer{position:relative;padding-right:6px}.nativeCheckbox{position:absolute;opacity:0;top:0;left:0;width:35px;height:20px;cursor:pointer;margin:0}.toggleVisual{pointer-events:none;position:relative;display:block;transition:.4s ease;-webkit-transition:.4s ease;-moz-transition:.4s ease;-o-transition:.4s ease;-ms-transition:.4s ease;width:35px;height:20px;border:1px solid #D0D5DD;border-radius:35px;background:#eaecf0}.toggleVisual.transparentBackground{background:transparent}.toggleVisual:before{content:\"\";position:absolute;display:block;transition:.2s cubic-bezier(.24,0,.5,1);-webkit-transition:.2s cubic-bezier(.24,0,.5,1);-moz-transition:.2s cubic-bezier(.24,0,.5,1);-o-transition:.2s cubic-bezier(.24,0,.5,1);-ms-transition:.2s cubic-bezier(.24,0,.5,1);margin:1px;width:33px;height:18px;top:-1px;left:-1px;border-radius:30px}.toggleVisual:after{content:\"\";position:absolute;display:block;box-shadow:0 0 0 1px #0000001a,0 4px #0000000a,0 4px 9px #00000021,0 3px 3px #0000000d;transition:.35s cubic-bezier(.54,1.6,.5,1);-webkit-transition:.35s cubic-bezier(.54,1.6,.5,1);-moz-transition:.35s cubic-bezier(.54,1.6,.5,1);-o-transition:.35s cubic-bezier(.54,1.6,.5,1);-ms-transition:.35s cubic-bezier(.54,1.6,.5,1);background:#f7f7f7;height:20px;width:20px;top:-1px;left:0;border-radius:60px}.nativeCheckbox:checked+.toggleVisual:before{background:#37c936;transition:width .2s cubic-bezier(0,0,0,.1);-webkit-transition:width .2s cubic-bezier(0,0,0,.1);-moz-transition:width .2s cubic-bezier(0,0,0,.1);-o-transition:width .2s cubic-bezier(0,0,0,.1);-ms-transition:width .2s cubic-bezier(0,0,0,.1)}.nativeCheckbox:checked+.toggleVisual:after{left:18px}.disabled{opacity:.6}.disabled .nativeCheckbox{cursor:not-allowed}.showErrors+.toggleVisual:before{border:1px solid #ff8000}\n"] }]
|
|
1927
1930
|
}], propDecorators: { transparentBackground: [{
|
|
1928
1931
|
type: Input
|
|
1929
1932
|
}] } });
|