ps-toolkit-ui 0.2.95 → 0.2.96
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/ps-toolkit-ui.umd.js +21 -11
- package/bundles/ps-toolkit-ui.umd.js.map +1 -1
- package/bundles/ps-toolkit-ui.umd.min.js +1 -1
- package/bundles/ps-toolkit-ui.umd.min.js.map +1 -1
- package/esm2015/lib/components/form/checkbox/form.checkbox.component.js +17 -7
- package/fesm2015/ps-toolkit-ui.js +96 -86
- package/fesm2015/ps-toolkit-ui.js.map +1 -1
- package/lib/components/form/checkbox/form.checkbox.component.d.ts +2 -0
- package/package.json +1 -1
- package/ps-toolkit-ui.metadata.json +1 -1
|
@@ -7,7 +7,7 @@ export class FormCheckboxComponent {
|
|
|
7
7
|
ngOnInit() {
|
|
8
8
|
this.inp.clear = () => {
|
|
9
9
|
this.inp.error = null;
|
|
10
|
-
this.
|
|
10
|
+
this.setValue(this.inp.default);
|
|
11
11
|
};
|
|
12
12
|
this.inp.isValid = () => {
|
|
13
13
|
this.inp.error = null;
|
|
@@ -21,7 +21,7 @@ export class FormCheckboxComponent {
|
|
|
21
21
|
return this.inp.value;
|
|
22
22
|
};
|
|
23
23
|
this.inp.setValue = (v) => {
|
|
24
|
-
this.
|
|
24
|
+
this.setValue(v);
|
|
25
25
|
};
|
|
26
26
|
this.inp.focus = () => {
|
|
27
27
|
this.onFocusIn();
|
|
@@ -32,7 +32,16 @@ export class FormCheckboxComponent {
|
|
|
32
32
|
this.inputBase.nativeElement.focus();
|
|
33
33
|
}
|
|
34
34
|
onClick() {
|
|
35
|
-
this.
|
|
35
|
+
this.setValue(!this.inp.value);
|
|
36
|
+
}
|
|
37
|
+
setValue(v) {
|
|
38
|
+
this.inp.value = v;
|
|
39
|
+
if (v) {
|
|
40
|
+
$(this.inputBase.nativeElement).addClass('checked');
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
$(this.inputBase.nativeElement).removeClass('checked');
|
|
44
|
+
}
|
|
36
45
|
}
|
|
37
46
|
onChange() {
|
|
38
47
|
if (this.inp.onChange) {
|
|
@@ -52,8 +61,8 @@ export class FormCheckboxComponent {
|
|
|
52
61
|
FormCheckboxComponent.decorators = [
|
|
53
62
|
{ type: Component, args: [{
|
|
54
63
|
selector: 'lib-form-checkbox',
|
|
55
|
-
template: "<div #inputDiv [id]=\"inp.name + 'Input'\" [style]=\"inp.style\" [className]=\"'form-input-con checkbox w-100' + (inp.error == null ? '' : ' error') + (inp.disabled ? ' disabled' : '') + (inp.icon == null ? ' without-icon' : '') + (!inp.displayLabel ? ' without-label' : '') + ' ' + inp.class\">\r\n <div class=\"form-input\" (click)=\"onFocusIn()\">\r\n <div *ngIf=\"inp.displayLabel\" class=\"label\"></div>\r\n <input (keydown)=\"onKeyDown($event)\"
|
|
56
|
-
styles: [".form-input-con.checkbox{padding:0 15px;position:relative}.form-input-con.checkbox .form-input{float:right;position:relative;width:100%}.form-input-con.checkbox .form-input .label{cursor:default;direction:rtl;font-size:12px;height:20px;margin-bottom:3px;padding:0 10px;text-align:right}.form-input-con.checkbox .form-input .control,.form-input-con.checkbox .form-input .label{-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;float:right;line-height:20px;width:100%}.form-input-con.checkbox .form-input .control{align-items:center;background-color:#fff;border:var(--border-input);border-radius:var(--border-radius-base);cursor:pointer;display:flex;font-size:11px;justify-content:center;min-height:35px;padding:5px 45px;position:relative;text-align:center;z-index:2}.form-input-con.checkbox.without-border .form-input .control{border:unset}.form-input-con.checkbox .form-input .control:after{content:\"\\f0c8\";font-family:Font Awesome\\ 5 Pro;font-size:17px;font-weight:400;height:35px;line-height:32px;position:absolute;right:0;top:0;width:35px}.form-input-con.checkbox:not(.without-border) .form-input .check:focus+.control,.form-input-con.checkbox:not(.without-border) .form-input .control:hover{border:var(--border-input-dark);outline:none}.form-input-con.checkbox.error .form-input .control{border:var(--border-input-red)}.form-input-con.checkbox.error .form-input .control,.form-input-con.checkbox.error .form-input span.icon{color:var(--red)}.form-input-con.checkbox .form-input .check{cursor:pointer;height:0;opacity:0;position:absolute;right:50%;top:50%;width:0;z-index:1}.form-input-con.checkbox .form-input .
|
|
64
|
+
template: "<div #inputDiv [id]=\"inp.name + 'Input'\" [style]=\"inp.style\" [className]=\"'form-input-con checkbox w-100' + (inp.error == null ? '' : ' error') + (inp.disabled ? ' disabled' : '') + (inp.icon == null ? ' without-icon' : '') + (!inp.displayLabel ? ' without-label' : '') + ' ' + inp.class\">\r\n <div class=\"form-input\" (click)=\"onFocusIn()\">\r\n <div *ngIf=\"inp.displayLabel\" class=\"label\"></div>\r\n <input (keydown)=\"onKeyDown($event)\" #inputBase type=\"checkbox\" class=\"check\">\r\n <div (click)=\"onClick()\" #inputCon class=\"control\">{{inp.l(inp.name)}}</div>\r\n <i *ngIf=\"inp.icon != null || inp.loading\" #inputIcon [className]=\"(inp.loading ? 'fa-duotone fa-spin fa-spinner' : inp.icon) + ' icon'\"></i>\r\n </div>\r\n</div>\r\n",
|
|
65
|
+
styles: [".form-input-con.checkbox{padding:0 15px;position:relative}.form-input-con.checkbox .form-input{float:right;position:relative;width:100%}.form-input-con.checkbox .form-input .label{cursor:default;direction:rtl;font-size:12px;height:20px;margin-bottom:3px;padding:0 10px;text-align:right}.form-input-con.checkbox .form-input .control,.form-input-con.checkbox .form-input .label{-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;float:right;line-height:20px;width:100%}.form-input-con.checkbox .form-input .control{align-items:center;background-color:#fff;border:var(--border-input);border-radius:var(--border-radius-base);cursor:pointer;display:flex;font-size:11px;justify-content:center;min-height:35px;padding:5px 45px;position:relative;text-align:center;z-index:2}.form-input-con.checkbox.without-border .form-input .control{border:unset}.form-input-con.checkbox .form-input .control:after{content:\"\\f0c8\";font-family:Font Awesome\\ 5 Pro;font-size:17px;font-weight:400;height:35px;line-height:32px;position:absolute;right:0;top:0;width:35px}.form-input-con.checkbox:not(.without-border) .form-input .check:focus+.control,.form-input-con.checkbox:not(.without-border) .form-input .control:hover{border:var(--border-input-dark);outline:none}.form-input-con.checkbox.error .form-input .control{border:var(--border-input-red)}.form-input-con.checkbox.error .form-input .control,.form-input-con.checkbox.error .form-input span.icon{color:var(--red)}.form-input-con.checkbox .form-input .check{cursor:pointer;height:0;opacity:0;position:absolute;right:50%;top:50%;width:0;z-index:1}.form-input-con.checkbox .form-input .control.checked:after{animation:pop .18s ease-in;color:var(--green);content:\"\\f14a\";font-weight:900}.form-input-con.checkbox .form-input i.icon{color:var(--primary);cursor:pointer;font-size:13px;height:35px;left:0;line-height:35px;position:absolute;text-align:center;top:24px;transition:all .35s ease-in-out;width:35px;z-index:2}.form-input-con.checkbox.without-label .form-input i.icon{top:0}.form-input-con.checkbox.without-icon .form-input .control{padding:0 35px 0 0}.form-input-con.checkbox.h-30 .form-input .control{font-size:10px;line-height:28px;min-height:30px;padding:0 40px}.form-input-con.checkbox.h-30 .form-input .control:after{font-size:14px;height:30px;line-height:28px;width:30px}.form-input-con.checkbox.h-30 .form-input i.icon{font-size:11px;height:30px;line-height:30px;width:30px}.form-input-con.checkbox.h-30.without-icon .form-input .control{padding:0 0 0 40px}"]
|
|
57
66
|
},] }
|
|
58
67
|
];
|
|
59
68
|
FormCheckboxComponent.ctorParameters = () => [];
|
|
@@ -61,6 +70,7 @@ FormCheckboxComponent.propDecorators = {
|
|
|
61
70
|
inp: [{ type: Input }],
|
|
62
71
|
changeIndex: [{ type: Output }],
|
|
63
72
|
inputBase: [{ type: ViewChild, args: ['inputBase',] }],
|
|
64
|
-
inputDiv: [{ type: ViewChild, args: ['inputDiv',] }]
|
|
73
|
+
inputDiv: [{ type: ViewChild, args: ['inputDiv',] }],
|
|
74
|
+
inputCon: [{ type: ViewChild, args: ['inputCon',] }]
|
|
65
75
|
};
|
|
66
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
76
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS5jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiRDovUHJvamVjdHMvUHNUb29sa2l0L1VJL3Byb2plY3RzL3BzLXRvb2xraXQtdWkvc3JjLyIsInNvdXJjZXMiOlsibGliL2NvbXBvbmVudHMvZm9ybS9jaGVja2JveC9mb3JtLmNoZWNrYm94LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFjLFlBQVksRUFBZ0IsS0FBSyxFQUFVLE1BQU0sRUFBRSxTQUFTLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFFbEgsT0FBTyxFQUFDLFVBQVUsRUFBQyxNQUFNLDZCQUE2QixDQUFDO0FBT3ZELE1BQU0sT0FBTyxxQkFBcUI7SUFRaEM7UUFKQSxnQkFBVyxHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7SUFLekMsQ0FBQztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssR0FBRyxHQUFHLEVBQUU7WUFDcEIsSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDO1lBQ3RCLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUNsQyxDQUFDLENBQUM7UUFDRixJQUFJLENBQUMsR0FBRyxDQUFDLE9BQU8sR0FBRyxHQUFHLEVBQUU7WUFDdEIsSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDO1lBQ3RCLElBQUksSUFBSSxDQUFDLEdBQUcsQ0FBQyxRQUFRLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssRUFBRTtnQkFDeEMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLEdBQUcsVUFBVSxDQUFDLFFBQVEsQ0FBQztnQkFDckMsT0FBTyxLQUFLLENBQUM7YUFDZDtZQUNELE9BQU8sSUFBSSxDQUFDO1FBQ2QsQ0FBQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLEdBQUcsQ0FBQyxJQUFJLEdBQUcsR0FBRyxFQUFFO1lBQ25CLE9BQU8sSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUM7UUFDeEIsQ0FBQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEdBQUcsQ0FBQyxDQUFDLEVBQUUsRUFBRTtZQUN4QixJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDO1FBQ25CLENBQUMsQ0FBQztRQUNGLElBQUksQ0FBQyxHQUFHLENBQUMsS0FBSyxHQUFHLEdBQUcsRUFBRTtZQUNwQixJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7UUFDbkIsQ0FBQyxDQUFDO0lBQ0osQ0FBQztJQUNELFNBQVM7UUFDUCxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUM7UUFDdEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsS0FBSyxFQUFFLENBQUM7SUFDdkMsQ0FBQztJQUNELE9BQU87UUFDTCxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNqQyxDQUFDO0lBQ0QsUUFBUSxDQUFDLENBQUM7UUFDUixJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssR0FBRyxDQUFDLENBQUM7UUFDbkIsSUFBSSxDQUFDLEVBQUM7WUFDSixDQUFDLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsQ0FBQyxRQUFRLENBQUMsU0FBUyxDQUFDLENBQUM7U0FDckQ7YUFBTTtZQUNMLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQyxDQUFDLFdBQVcsQ0FBQyxTQUFTLENBQUMsQ0FBQztTQUN4RDtJQUNILENBQUM7SUFDRCxRQUFRO1FBQ04sSUFBSSxJQUFJLENBQUMsR0FBRyxDQUFDLFFBQVEsRUFBQztZQUNwQixVQUFVLENBQUMsR0FBRyxFQUFFO2dCQUNkLElBQUksQ0FBQyxHQUFHLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUM5QixDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUM7U0FDUDtJQUNILENBQUM7SUFDRCxTQUFTLENBQUMsQ0FBQztRQUNULE1BQU0sSUFBSSxHQUFHLENBQUMsQ0FBQyxPQUFPLElBQUksQ0FBQyxDQUFDLEtBQUssQ0FBQztRQUNsQyxJQUFJLElBQUksS0FBSyxDQUFDLElBQUksSUFBSSxLQUFLLEVBQUUsRUFBRTtZQUM3QixDQUFDLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDbkIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUM7U0FDM0c7SUFDSCxDQUFDOzs7WUFuRUYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxtQkFBbUI7Z0JBQzdCLGd4QkFBNkM7O2FBRTlDOzs7O2tCQUVFLEtBQUs7MEJBRUwsTUFBTTt3QkFFTixTQUFTLFNBQUMsV0FBVzt1QkFDckIsU0FBUyxTQUFDLFVBQVU7dUJBQ3BCLFNBQVMsU0FBQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSG9zdExpc3RlbmVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQsIFZpZXdDaGlsZH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7SW5wdXRDbGFzc30gZnJvbSAnLi4vLi4vLi4vY2xhc3Nlcy9mb3JtLmNsYXNzJztcclxuaW1wb3J0IHtJbnB1dEVycm9yfSBmcm9tICcuLi8uLi8uLi9jbGFzc2VzL2VudW0uY2xhc3MnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItZm9ybS1jaGVja2JveCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2Zvcm0uY2hlY2tib3guY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2Zvcm0uY2hlY2tib3guY29tcG9uZW50LmNzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBGb3JtQ2hlY2tib3hDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXR7XHJcbiAgQElucHV0KClcclxuICBpbnA6IElucHV0Q2xhc3M7XHJcbiAgQE91dHB1dCgpXHJcbiAgY2hhbmdlSW5kZXggPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcclxuICBAVmlld0NoaWxkKCdpbnB1dEJhc2UnKSBpbnB1dEJhc2U6IEVsZW1lbnRSZWY7XHJcbiAgQFZpZXdDaGlsZCgnaW5wdXREaXYnKSBpbnB1dERpdjogRWxlbWVudFJlZjtcclxuICBAVmlld0NoaWxkKCdpbnB1dENvbicpIGlucHV0Q29uOiBFbGVtZW50UmVmO1xyXG4gIGNvbnN0cnVjdG9yKCl7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgIHRoaXMuaW5wLmNsZWFyID0gKCkgPT4ge1xyXG4gICAgICB0aGlzLmlucC5lcnJvciA9IG51bGw7XHJcbiAgICAgIHRoaXMuc2V0VmFsdWUodGhpcy5pbnAuZGVmYXVsdCk7XHJcbiAgICB9O1xyXG4gICAgdGhpcy5pbnAuaXNWYWxpZCA9ICgpID0+IHtcclxuICAgICAgdGhpcy5pbnAuZXJyb3IgPSBudWxsO1xyXG4gICAgICBpZiAodGhpcy5pbnAucmVxdWlyZWQgJiYgIXRoaXMuaW5wLnZhbHVlKSB7XHJcbiAgICAgICAgdGhpcy5pbnAuZXJyb3IgPSBJbnB1dEVycm9yLlJlcXVpcmVkO1xyXG4gICAgICAgIHJldHVybiBmYWxzZTtcclxuICAgICAgfVxyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH07XHJcbiAgICB0aGlzLmlucC5kYXRhID0gKCkgPT4ge1xyXG4gICAgICByZXR1cm4gdGhpcy5pbnAudmFsdWU7XHJcbiAgICB9O1xyXG4gICAgdGhpcy5pbnAuc2V0VmFsdWUgPSAodikgPT4ge1xyXG4gICAgICB0aGlzLnNldFZhbHVlKHYpO1xyXG4gICAgfTtcclxuICAgIHRoaXMuaW5wLmZvY3VzID0gKCkgPT4ge1xyXG4gICAgICB0aGlzLm9uRm9jdXNJbigpO1xyXG4gICAgfTtcclxuICB9XHJcbiAgb25Gb2N1c0luKCk6IHZvaWR7XHJcbiAgICB0aGlzLmlucC5lcnJvciA9IG51bGw7XHJcbiAgICB0aGlzLmlucHV0QmFzZS5uYXRpdmVFbGVtZW50LmZvY3VzKCk7XHJcbiAgfVxyXG4gIG9uQ2xpY2soKTogdm9pZHtcclxuICAgIHRoaXMuc2V0VmFsdWUoIXRoaXMuaW5wLnZhbHVlKTtcclxuICB9XHJcbiAgc2V0VmFsdWUodik6IHZvaWR7XHJcbiAgICB0aGlzLmlucC52YWx1ZSA9IHY7XHJcbiAgICBpZiAodil7XHJcbiAgICAgICQodGhpcy5pbnB1dEJhc2UubmF0aXZlRWxlbWVudCkuYWRkQ2xhc3MoJ2NoZWNrZWQnKTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgICQodGhpcy5pbnB1dEJhc2UubmF0aXZlRWxlbWVudCkucmVtb3ZlQ2xhc3MoJ2NoZWNrZWQnKTtcclxuICAgIH1cclxuICB9XHJcbiAgb25DaGFuZ2UoKTogdm9pZHtcclxuICAgIGlmICh0aGlzLmlucC5vbkNoYW5nZSl7XHJcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xyXG4gICAgICAgIHRoaXMuaW5wLm9uQ2hhbmdlKHRoaXMuaW5wKTtcclxuICAgICAgfSwgMSk7XHJcbiAgICB9XHJcbiAgfVxyXG4gIG9uS2V5RG93bihlKTogdm9pZHtcclxuICAgIGNvbnN0IGNvZGUgPSBlLmtleUNvZGUgfHwgZS53aGljaDtcclxuICAgIGlmIChjb2RlID09PSA5IHx8IGNvZGUgPT09IDEzKSB7XHJcbiAgICAgIGUucHJldmVudERlZmF1bHQoKTtcclxuICAgICAgdGhpcy5jaGFuZ2VJbmRleC5lbWl0KGNvZGUgPT09IDkgPyBlLnNoaWZ0S2V5ID8gJ1NoaWZ0VGFiJyA6ICdUYWInIDogZS5zaGlmdEtleSA/ICdTaGlmdEVudGVyJyA6ICdFbnRlcicpO1xyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iXX0=
|