@klippa/ngx-enhancy-forms 18.32.0 → 18.32.1
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.
|
@@ -10,14 +10,14 @@ export class CheckboxComponent extends ValueAccessorBase {
|
|
|
10
10
|
this.renderUndefinedAsIndeterminate = false;
|
|
11
11
|
}
|
|
12
12
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
13
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: CheckboxComponent, selector: "klp-form-checkbox", inputs: { caption: "caption", renderUndefinedAsIndeterminate: "renderUndefinedAsIndeterminate" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<
|
|
13
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: CheckboxComponent, selector: "klp-form-checkbox", inputs: { caption: "caption", renderUndefinedAsIndeterminate: "renderUndefinedAsIndeterminate" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\">\n\t<label>\n\t\t<div class=\"checkboxContainer\">\n\t\t\t<div class=\"checkBoxVisualContainer\">\n\t\t\t\t<input type=\"checkbox\" class=\"checkboxNative\"\n\t\t\t\t\t[(ngModel)]=\"innerValue\"\n\t\t\t\t\t(change)=\"setInnerValueAndNotify(innerValue); touch()\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t#nativeInputRef\n\t\t\t\t/>\n\t\t\t\t<div class=\"checkboxVisual\" [ngClass]=\"{filledWithColor: innerValue === true || (renderUndefinedAsIndeterminate && innerValue === undefined)}\">\n\t\t\t\t\t<svg *ngIf=\"innerValue === true\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"9\" viewBox=\"0 0 12 9\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M10.3333 1L3.91667 7.41667L1 4.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t\t<svg *ngIf=\"renderUndefinedAsIndeterminate && innerValue === undefined\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11\" height=\"2\" viewBox=\"0 0 11 2\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M1 1H9.16667\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"caption\" class=\"caption\">{{ caption }}</div>\n\t</label>\n</div>\n", styles: [":host{display:block}.componentContainer{display:flex;align-items:center;margin-bottom:0}label{display:flex;align-items:center;justify-content:center}.checkboxContainer{position:relative}.checkBoxVisualContainer{padding:2px;margin-right:10px;border-radius:4px}.checkBoxVisualContainer:focus-within{outline:2px solid #27bb5f}.caption{cursor:pointer;font-weight:400;color:#101828}.checkboxNative{position:absolute;opacity:0;top:0;left:0;width:20px;height:20px;cursor:pointer}.checkboxVisual{pointer-events:none;padding:.125rem;color:#fff;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:1px solid #D0D5DD;border-radius:4px;font-size:15px;font-weight:400;line-height:19px;vertical-align:bottom;text-align:center;background-color:#fff;cursor:pointer}.checkboxVisual.filledWithColor{background-color:#27bb5f;border-color:#27bb5f}.checkboxNative:hover+.checkboxVisual{border-color:#98a2b3}.checkboxNative:hover+.checkboxVisual.filledWithColor{border-color:#27bb5f}.checkboxNative:hover[disabled]+.checkboxVisual{border-color:#eaecf0}.checkboxNative:hover[disabled]+.checkboxVisual.filledWithColor{border-color:#f2f4f7}.checkboxNative[disabled]{cursor:not-allowed}.checkboxNative[disabled]+.checkboxVisual{background-color:#f2f4f7;border-color:#eaecf0}.checkboxNative[disabled]+.checkboxVisual svg{color:#98a2b3}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] }); }
|
|
14
14
|
}
|
|
15
15
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
16
16
|
type: Component,
|
|
17
|
-
args: [{ selector: 'klp-form-checkbox', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], template: "<
|
|
17
|
+
args: [{ selector: 'klp-form-checkbox', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], template: "<div class=\"componentContainer\">\n\t<label>\n\t\t<div class=\"checkboxContainer\">\n\t\t\t<div class=\"checkBoxVisualContainer\">\n\t\t\t\t<input type=\"checkbox\" class=\"checkboxNative\"\n\t\t\t\t\t[(ngModel)]=\"innerValue\"\n\t\t\t\t\t(change)=\"setInnerValueAndNotify(innerValue); touch()\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t#nativeInputRef\n\t\t\t\t/>\n\t\t\t\t<div class=\"checkboxVisual\" [ngClass]=\"{filledWithColor: innerValue === true || (renderUndefinedAsIndeterminate && innerValue === undefined)}\">\n\t\t\t\t\t<svg *ngIf=\"innerValue === true\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"9\" viewBox=\"0 0 12 9\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M10.3333 1L3.91667 7.41667L1 4.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t\t<svg *ngIf=\"renderUndefinedAsIndeterminate && innerValue === undefined\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11\" height=\"2\" viewBox=\"0 0 11 2\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M1 1H9.16667\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"caption\" class=\"caption\">{{ caption }}</div>\n\t</label>\n</div>\n", styles: [":host{display:block}.componentContainer{display:flex;align-items:center;margin-bottom:0}label{display:flex;align-items:center;justify-content:center}.checkboxContainer{position:relative}.checkBoxVisualContainer{padding:2px;margin-right:10px;border-radius:4px}.checkBoxVisualContainer:focus-within{outline:2px solid #27bb5f}.caption{cursor:pointer;font-weight:400;color:#101828}.checkboxNative{position:absolute;opacity:0;top:0;left:0;width:20px;height:20px;cursor:pointer}.checkboxVisual{pointer-events:none;padding:.125rem;color:#fff;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:1px solid #D0D5DD;border-radius:4px;font-size:15px;font-weight:400;line-height:19px;vertical-align:bottom;text-align:center;background-color:#fff;cursor:pointer}.checkboxVisual.filledWithColor{background-color:#27bb5f;border-color:#27bb5f}.checkboxNative:hover+.checkboxVisual{border-color:#98a2b3}.checkboxNative:hover+.checkboxVisual.filledWithColor{border-color:#27bb5f}.checkboxNative:hover[disabled]+.checkboxVisual{border-color:#eaecf0}.checkboxNative:hover[disabled]+.checkboxVisual.filledWithColor{border-color:#f2f4f7}.checkboxNative[disabled]{cursor:not-allowed}.checkboxNative[disabled]+.checkboxVisual{background-color:#f2f4f7;border-color:#eaecf0}.checkboxNative[disabled]+.checkboxVisual svg{color:#98a2b3}\n"] }]
|
|
18
18
|
}], propDecorators: { caption: [{
|
|
19
19
|
type: Input
|
|
20
20
|
}], renderUndefinedAsIndeterminate: [{
|
|
21
21
|
type: Input
|
|
22
22
|
}] } });
|
|
23
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
23
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xpcHBhL25neC1lbmhhbmN5LWZvcm1zL3NyYy9saWIvZWxlbWVudHMvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2xpcHBhL25neC1lbmhhbmN5LWZvcm1zL3NyYy9saWIvZWxlbWVudHMvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sc0RBQXNELENBQUM7Ozs7QUFRekYsTUFBTSxPQUFPLGlCQUFrQixTQUFRLGlCQUEwQjtJQU5qRTs7UUFRVSxtQ0FBOEIsR0FBRyxLQUFLLENBQUM7S0FDaEQ7OEdBSFksaUJBQWlCO2tHQUFqQixpQkFBaUIsOElBRmxCLENBQUMsRUFBRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsV0FBVyxFQUFFLGlCQUFpQixFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUUsQ0FBQyxpRENSekYsZ3pDQXVCQTs7MkZEYmEsaUJBQWlCO2tCQU43QixTQUFTOytCQUNDLG1CQUFtQixhQUdsQixDQUFDLEVBQUUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLFdBQVcsbUJBQW1CLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxDQUFDOzhCQUcvRSxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csOEJBQThCO3NCQUF0QyxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBWYWx1ZUFjY2Vzc29yQmFzZSB9IGZyb20gJy4uL3ZhbHVlLWFjY2Vzc29yLWJhc2UvdmFsdWUtYWNjZXNzb3ItYmFzZS5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6ICdrbHAtZm9ybS1jaGVja2JveCcsXG5cdHRlbXBsYXRlVXJsOiAnLi9jaGVja2JveC5jb21wb25lbnQuaHRtbCcsXG5cdHN0eWxlVXJsczogWycuL2NoZWNrYm94LmNvbXBvbmVudC5zY3NzJ10sXG5cdHByb3ZpZGVyczogW3sgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsIHVzZUV4aXN0aW5nOiBDaGVja2JveENvbXBvbmVudCwgbXVsdGk6IHRydWUgfV0sXG59KVxuZXhwb3J0IGNsYXNzIENoZWNrYm94Q29tcG9uZW50IGV4dGVuZHMgVmFsdWVBY2Nlc3NvckJhc2U8Ym9vbGVhbj4ge1xuXHRASW5wdXQoKSBjYXB0aW9uOiBzdHJpbmc7XG5cdEBJbnB1dCgpIHJlbmRlclVuZGVmaW5lZEFzSW5kZXRlcm1pbmF0ZSA9IGZhbHNlO1xufVxuIiwiPGRpdiBjbGFzcz1cImNvbXBvbmVudENvbnRhaW5lclwiPlxuXHQ8bGFiZWw+XG5cdFx0PGRpdiBjbGFzcz1cImNoZWNrYm94Q29udGFpbmVyXCI+XG5cdFx0XHQ8ZGl2IGNsYXNzPVwiY2hlY2tCb3hWaXN1YWxDb250YWluZXJcIj5cblx0XHRcdFx0PGlucHV0IHR5cGU9XCJjaGVja2JveFwiIGNsYXNzPVwiY2hlY2tib3hOYXRpdmVcIlxuXHRcdFx0XHRcdFsobmdNb2RlbCldPVwiaW5uZXJWYWx1ZVwiXG5cdFx0XHRcdFx0KGNoYW5nZSk9XCJzZXRJbm5lclZhbHVlQW5kTm90aWZ5KGlubmVyVmFsdWUpOyB0b3VjaCgpXCJcblx0XHRcdFx0XHRbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuXHRcdFx0XHRcdCNuYXRpdmVJbnB1dFJlZlxuXHRcdFx0XHQvPlxuXHRcdFx0XHQ8ZGl2IGNsYXNzPVwiY2hlY2tib3hWaXN1YWxcIiBbbmdDbGFzc109XCJ7ZmlsbGVkV2l0aENvbG9yOiBpbm5lclZhbHVlID09PSB0cnVlIHx8IChyZW5kZXJVbmRlZmluZWRBc0luZGV0ZXJtaW5hdGUgJiYgaW5uZXJWYWx1ZSA9PT0gdW5kZWZpbmVkKX1cIj5cblx0XHRcdFx0XHQ8c3ZnICpuZ0lmPVwiaW5uZXJWYWx1ZSA9PT0gdHJ1ZVwiIHZlcnNpb249XCIxLjFcIiB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgd2lkdGg9XCIxMlwiIGhlaWdodD1cIjlcIiB2aWV3Qm94PVwiMCAwIDEyIDlcIiBmaWxsPVwibm9uZVwiPlxuXHRcdFx0XHRcdFx0PHBhdGggZD1cIk0xMC4zMzMzIDFMMy45MTY2NyA3LjQxNjY3TDEgNC41XCIgc3Ryb2tlPVwiY3VycmVudENvbG9yXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiLz5cblx0XHRcdFx0XHQ8L3N2Zz5cblx0XHRcdFx0XHQ8c3ZnICpuZ0lmPVwicmVuZGVyVW5kZWZpbmVkQXNJbmRldGVybWluYXRlICYmIGlubmVyVmFsdWUgPT09IHVuZGVmaW5lZFwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiB3aWR0aD1cIjExXCIgaGVpZ2h0PVwiMlwiIHZpZXdCb3g9XCIwIDAgMTEgMlwiIGZpbGw9XCJub25lXCI+XG5cdFx0XHRcdFx0XHQ8cGF0aCBkPVwiTTEgMUg5LjE2NjY3XCIgc3Ryb2tlPVwiY3VycmVudENvbG9yXCIgc3Ryb2tlLXdpZHRoPVwiMlwiIHN0cm9rZS1saW5lY2FwPVwicm91bmRcIiBzdHJva2UtbGluZWpvaW49XCJyb3VuZFwiLz5cblx0XHRcdFx0XHQ8L3N2Zz5cblx0XHRcdFx0PC9kaXY+XG5cdFx0XHQ8L2Rpdj5cblx0XHQ8L2Rpdj5cblx0XHQ8ZGl2ICpuZ0lmPVwiY2FwdGlvblwiIGNsYXNzPVwiY2FwdGlvblwiPnt7IGNhcHRpb24gfX08L2Rpdj5cblx0PC9sYWJlbD5cbjwvZGl2PlxuIl19
|
|
@@ -1204,11 +1204,11 @@ class CheckboxComponent extends ValueAccessorBase {
|
|
|
1204
1204
|
this.renderUndefinedAsIndeterminate = false;
|
|
1205
1205
|
}
|
|
1206
1206
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1207
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: CheckboxComponent, selector: "klp-form-checkbox", inputs: { caption: "caption", renderUndefinedAsIndeterminate: "renderUndefinedAsIndeterminate" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<
|
|
1207
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: CheckboxComponent, selector: "klp-form-checkbox", inputs: { caption: "caption", renderUndefinedAsIndeterminate: "renderUndefinedAsIndeterminate" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\">\n\t<label>\n\t\t<div class=\"checkboxContainer\">\n\t\t\t<div class=\"checkBoxVisualContainer\">\n\t\t\t\t<input type=\"checkbox\" class=\"checkboxNative\"\n\t\t\t\t\t[(ngModel)]=\"innerValue\"\n\t\t\t\t\t(change)=\"setInnerValueAndNotify(innerValue); touch()\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t#nativeInputRef\n\t\t\t\t/>\n\t\t\t\t<div class=\"checkboxVisual\" [ngClass]=\"{filledWithColor: innerValue === true || (renderUndefinedAsIndeterminate && innerValue === undefined)}\">\n\t\t\t\t\t<svg *ngIf=\"innerValue === true\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"9\" viewBox=\"0 0 12 9\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M10.3333 1L3.91667 7.41667L1 4.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t\t<svg *ngIf=\"renderUndefinedAsIndeterminate && innerValue === undefined\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11\" height=\"2\" viewBox=\"0 0 11 2\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M1 1H9.16667\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"caption\" class=\"caption\">{{ caption }}</div>\n\t</label>\n</div>\n", styles: [":host{display:block}.componentContainer{display:flex;align-items:center;margin-bottom:0}label{display:flex;align-items:center;justify-content:center}.checkboxContainer{position:relative}.checkBoxVisualContainer{padding:2px;margin-right:10px;border-radius:4px}.checkBoxVisualContainer:focus-within{outline:2px solid #27bb5f}.caption{cursor:pointer;font-weight:400;color:#101828}.checkboxNative{position:absolute;opacity:0;top:0;left:0;width:20px;height:20px;cursor:pointer}.checkboxVisual{pointer-events:none;padding:.125rem;color:#fff;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:1px solid #D0D5DD;border-radius:4px;font-size:15px;font-weight:400;line-height:19px;vertical-align:bottom;text-align:center;background-color:#fff;cursor:pointer}.checkboxVisual.filledWithColor{background-color:#27bb5f;border-color:#27bb5f}.checkboxNative:hover+.checkboxVisual{border-color:#98a2b3}.checkboxNative:hover+.checkboxVisual.filledWithColor{border-color:#27bb5f}.checkboxNative:hover[disabled]+.checkboxVisual{border-color:#eaecf0}.checkboxNative:hover[disabled]+.checkboxVisual.filledWithColor{border-color:#f2f4f7}.checkboxNative[disabled]{cursor:not-allowed}.checkboxNative[disabled]+.checkboxVisual{background-color:#f2f4f7;border-color:#eaecf0}.checkboxNative[disabled]+.checkboxVisual svg{color:#98a2b3}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] }); }
|
|
1208
1208
|
}
|
|
1209
1209
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
1210
1210
|
type: Component,
|
|
1211
|
-
args: [{ selector: 'klp-form-checkbox', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], template: "<
|
|
1211
|
+
args: [{ selector: 'klp-form-checkbox', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }], template: "<div class=\"componentContainer\">\n\t<label>\n\t\t<div class=\"checkboxContainer\">\n\t\t\t<div class=\"checkBoxVisualContainer\">\n\t\t\t\t<input type=\"checkbox\" class=\"checkboxNative\"\n\t\t\t\t\t[(ngModel)]=\"innerValue\"\n\t\t\t\t\t(change)=\"setInnerValueAndNotify(innerValue); touch()\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t#nativeInputRef\n\t\t\t\t/>\n\t\t\t\t<div class=\"checkboxVisual\" [ngClass]=\"{filledWithColor: innerValue === true || (renderUndefinedAsIndeterminate && innerValue === undefined)}\">\n\t\t\t\t\t<svg *ngIf=\"innerValue === true\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"9\" viewBox=\"0 0 12 9\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M10.3333 1L3.91667 7.41667L1 4.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t\t<svg *ngIf=\"renderUndefinedAsIndeterminate && innerValue === undefined\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11\" height=\"2\" viewBox=\"0 0 11 2\" fill=\"none\">\n\t\t\t\t\t\t<path d=\"M1 1H9.16667\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div *ngIf=\"caption\" class=\"caption\">{{ caption }}</div>\n\t</label>\n</div>\n", styles: [":host{display:block}.componentContainer{display:flex;align-items:center;margin-bottom:0}label{display:flex;align-items:center;justify-content:center}.checkboxContainer{position:relative}.checkBoxVisualContainer{padding:2px;margin-right:10px;border-radius:4px}.checkBoxVisualContainer:focus-within{outline:2px solid #27bb5f}.caption{cursor:pointer;font-weight:400;color:#101828}.checkboxNative{position:absolute;opacity:0;top:0;left:0;width:20px;height:20px;cursor:pointer}.checkboxVisual{pointer-events:none;padding:.125rem;color:#fff;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:1px solid #D0D5DD;border-radius:4px;font-size:15px;font-weight:400;line-height:19px;vertical-align:bottom;text-align:center;background-color:#fff;cursor:pointer}.checkboxVisual.filledWithColor{background-color:#27bb5f;border-color:#27bb5f}.checkboxNative:hover+.checkboxVisual{border-color:#98a2b3}.checkboxNative:hover+.checkboxVisual.filledWithColor{border-color:#27bb5f}.checkboxNative:hover[disabled]+.checkboxVisual{border-color:#eaecf0}.checkboxNative:hover[disabled]+.checkboxVisual.filledWithColor{border-color:#f2f4f7}.checkboxNative[disabled]{cursor:not-allowed}.checkboxNative[disabled]+.checkboxVisual{background-color:#f2f4f7;border-color:#eaecf0}.checkboxNative[disabled]+.checkboxVisual svg{color:#98a2b3}\n"] }]
|
|
1212
1212
|
}], propDecorators: { caption: [{
|
|
1213
1213
|
type: Input
|
|
1214
1214
|
}], renderUndefinedAsIndeterminate: [{
|