ng-zenduit 2.0.8 → 2.0.9
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/esm2020/lib/card-block/zendu-card-block.component.mjs +1 -1
- package/esm2020/lib/checkbox/zendu-checkbox.component.mjs +8 -3
- package/esm2020/lib/column-configuration/zendu-column-configuration.component.mjs +1 -1
- package/esm2020/lib/date-picker-dropdown/zendu-date-picker-dropdown.component.mjs +10 -8
- package/esm2020/lib/datepicker/zendu-datepicker.component.mjs +1 -1
- package/esm2020/lib/file-upload/zendu-file-upload.component.mjs +1 -1
- package/esm2020/lib/file-uploader/zendu-file-uploader.component.mjs +1 -1
- package/esm2020/lib/filter/zendu-filter.component.mjs +1 -1
- package/esm2020/lib/groups/zendu-groups.component.mjs +1 -1
- package/esm2020/lib/icon/icon-config.mjs +6 -0
- package/esm2020/lib/icon/zendu-icon.component.mjs +42 -12
- package/esm2020/lib/location-search/zendu-location-search.component.mjs +1 -1
- package/esm2020/lib/progress/zendu-progress.component.mjs +60 -4
- package/esm2020/lib/radio-button/radio-button.component.mjs +8 -3
- package/esm2020/lib/select/zendu-select.component.mjs +1 -1
- package/esm2020/lib/timepicker/zendu-timepicker.component.mjs +1 -1
- package/esm2020/lib/toggle/zendu-toggle.component.mjs +15 -7
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/ng-zenduit.mjs +153 -42
- package/fesm2015/ng-zenduit.mjs.map +1 -1
- package/fesm2020/ng-zenduit.mjs +151 -42
- package/fesm2020/ng-zenduit.mjs.map +1 -1
- package/lib/checkbox/zendu-checkbox.component.d.ts +3 -1
- package/lib/icon/icon-config.d.ts +8 -0
- package/lib/icon/zendu-icon.component.d.ts +10 -2
- package/lib/progress/zendu-progress.component.d.ts +36 -2
- package/lib/radio-button/radio-button.component.d.ts +3 -1
- package/lib/toggle/zendu-toggle.component.d.ts +5 -3
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -5,7 +5,7 @@ import * as i2 from "../icon/zendu-icon.component";
|
|
|
5
5
|
export class ZenduCardBlockComponent {
|
|
6
6
|
}
|
|
7
7
|
ZenduCardBlockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCardBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8
|
-
ZenduCardBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCardBlockComponent, selector: "zen-card-block", inputs: { icon: "icon", title: "title", text: "text", selected: "selected" }, ngImport: i0, template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src"] }] });
|
|
8
|
+
ZenduCardBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCardBlockComponent, selector: "zen-card-block", inputs: { icon: "icon", title: "title", text: "text", selected: "selected" }, ngImport: i0, template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src", "name", "size", "color", "theme"] }] });
|
|
9
9
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCardBlockComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
args: [{ selector: 'zen-card-block', template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"] }]
|
|
@@ -9,6 +9,7 @@ export class ZenduCheckboxComponent {
|
|
|
9
9
|
this.disabled = false;
|
|
10
10
|
this.disableValueChange = false;
|
|
11
11
|
this.indeterminate = false;
|
|
12
|
+
this.size = 'sm';
|
|
12
13
|
}
|
|
13
14
|
/**
|
|
14
15
|
* Toggle state
|
|
@@ -23,10 +24,10 @@ export class ZenduCheckboxComponent {
|
|
|
23
24
|
}
|
|
24
25
|
}
|
|
25
26
|
ZenduCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
-
ZenduCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCheckboxComponent, selector: "zen-checkbox", inputs: { checked: "checked", label: "label", labelColor: "labelColor", disabled: "disabled", disableValueChange: "disableValueChange", indeterminate: "indeterminate", imageUrl: "imageUrl" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<div class=\"checkbox-component\"\n [ngClass]=\"{'app-disabled': disabled}\"\n (click)=\"toggle()\">\n <button class=\"app-checkbox\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ 'app-checked': checked && !indeterminate, 'app-indeterminate': indeterminate }\">\n <i *ngIf=\"checked && !indeterminate\"\n class=\"material-icons app-checkbox-icon\">done</i>\n <i *ngIf=\"indeterminate\"\n class=\"material-icons app-checkbox-icon\">remove</i>\n </button>\n <div class=\"app-checkbox-
|
|
27
|
+
ZenduCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCheckboxComponent, selector: "zen-checkbox", inputs: { checked: "checked", label: "label", labelColor: "labelColor", disabled: "disabled", disableValueChange: "disableValueChange", indeterminate: "indeterminate", imageUrl: "imageUrl", size: "size", supportingText: "supportingText" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<div class=\"checkbox-component\"\n [ngClass]=\"{'app-disabled': disabled, 'checkbox-md': size === 'md'}\"\n (click)=\"toggle()\">\n <button class=\"app-checkbox\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ 'app-checked': checked && !indeterminate, 'app-indeterminate': indeterminate }\">\n <i *ngIf=\"checked && !indeterminate\"\n class=\"material-icons app-checkbox-icon\">done</i>\n <i *ngIf=\"indeterminate\"\n class=\"material-icons app-checkbox-icon\">remove</i>\n </button>\n <div class=\"app-checkbox-text-wrap\"\n *ngIf=\"label || supportingText\">\n <div class=\"app-checkbox-label\"\n *ngIf=\"label\"\n [ngStyle]=\"{'color': labelColor }\">\n <img class=\"checkbox-image\"\n [src]=\"imageUrl\"\n *ngIf=\"imageUrl\">\n {{ label }}\n </div>\n <div class=\"app-checkbox-supporting-text\"\n *ngIf=\"supportingText\">\n {{ supportingText }}\n </div>\n </div>\n</div>\n", styles: [".checkbox-component{display:flex;align-items:flex-start;cursor:pointer;gap:8px}.checkbox-component .app-checkbox{padding:0;position:relative;width:16px;min-width:16px;height:16px;min-height:16px;border:1px solid #D0D5DD;border-radius:4px;box-sizing:border-box;color:#fff;background:#FFFFFF;cursor:pointer;margin-top:2px}.checkbox-component .app-checkbox:focus{outline:none;border-color:#88c1f1;box-shadow:0 0 0 4px #f4ebff}.checkbox-component .app-checkbox:disabled{cursor:not-allowed}.checkbox-component .app-checkbox.app-checked,.checkbox-component .app-checkbox.app-indeterminate{border-color:#136ab6;color:#136ab6;background:#F1F7FE}.checkbox-component .app-checkbox .app-checkbox-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px}.checkbox-component .app-checkbox-text-wrap{display:flex;flex-direction:column}.checkbox-component .app-checkbox-label{font-weight:500;font-size:14px;line-height:20px;color:#344054;display:flex;align-items:center}.checkbox-component .app-checkbox-label .checkbox-image{margin-right:8px;width:36px}.checkbox-component .app-checkbox-supporting-text{font-weight:400;font-size:14px;line-height:20px;color:#667085}.checkbox-component:hover,.checkbox-component:focus{outline:none;text-decoration:none}.checkbox-component:hover .app-checkbox,.checkbox-component:focus .app-checkbox{background:#E3EEFB;border-color:#136ab6}.checkbox-component:hover .app-checkbox.app-checked,.checkbox-component:focus .app-checkbox.app-checked{background:#E3EEFB;border-color:#136ab6;color:#136ab6}.checkbox-component:hover .app-checkbox.app-indeterminate,.checkbox-component:focus .app-checkbox.app-indeterminate{background:#E3EEFB;border-color:#136ab6;color:#136ab6}.checkbox-component.app-disabled{cursor:not-allowed}.checkbox-component.app-disabled:hover .app-checkbox,.checkbox-component.app-disabled:focus .app-checkbox{background:#F2F4F7;border-color:#eaecf0}.checkbox-component.app-disabled:hover .app-checkbox.app-checked,.checkbox-component.app-disabled:focus .app-checkbox.app-checked{background:#F2F4F7;border-color:#eaecf0;color:#eaecf0}.checkbox-component.app-disabled:hover .app-checkbox.app-indeterminate,.checkbox-component.app-disabled:focus .app-checkbox.app-indeterminate{background:#F2F4F7;border-color:#eaecf0;color:#eaecf0}.checkbox-component.app-disabled .app-checkbox{border-color:#eaecf0;background:#F2F4F7}.checkbox-component.app-disabled .app-checkbox.app-checked,.checkbox-component.app-disabled .app-checkbox.app-indeterminate{border-color:#eaecf0;color:#eaecf0;background:#F2F4F7}.checkbox-component.app-disabled .app-checkbox-label,.checkbox-component.app-disabled .app-checkbox-supporting-text{color:#d0d5dd}.checkbox-component.checkbox-md{gap:12px}.checkbox-component.checkbox-md .app-checkbox{width:20px;min-width:20px;height:20px;min-height:20px;border-radius:6px;margin-top:2px}.checkbox-component.checkbox-md .app-checkbox .app-checkbox-icon{font-size:16px}.checkbox-component.checkbox-md .app-checkbox-label,.checkbox-component.checkbox-md .app-checkbox-supporting-text{font-size:16px;line-height:24px}\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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
27
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCheckboxComponent, decorators: [{
|
|
28
29
|
type: Component,
|
|
29
|
-
args: [{ selector: 'zen-checkbox', template: "<div class=\"checkbox-component\"\n [ngClass]=\"{'app-disabled': disabled}\"\n (click)=\"toggle()\">\n <button class=\"app-checkbox\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ 'app-checked': checked && !indeterminate, 'app-indeterminate': indeterminate }\">\n <i *ngIf=\"checked && !indeterminate\"\n class=\"material-icons app-checkbox-icon\">done</i>\n <i *ngIf=\"indeterminate\"\n class=\"material-icons app-checkbox-icon\">remove</i>\n </button>\n <div class=\"app-checkbox-
|
|
30
|
+
args: [{ selector: 'zen-checkbox', template: "<div class=\"checkbox-component\"\n [ngClass]=\"{'app-disabled': disabled, 'checkbox-md': size === 'md'}\"\n (click)=\"toggle()\">\n <button class=\"app-checkbox\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ 'app-checked': checked && !indeterminate, 'app-indeterminate': indeterminate }\">\n <i *ngIf=\"checked && !indeterminate\"\n class=\"material-icons app-checkbox-icon\">done</i>\n <i *ngIf=\"indeterminate\"\n class=\"material-icons app-checkbox-icon\">remove</i>\n </button>\n <div class=\"app-checkbox-text-wrap\"\n *ngIf=\"label || supportingText\">\n <div class=\"app-checkbox-label\"\n *ngIf=\"label\"\n [ngStyle]=\"{'color': labelColor }\">\n <img class=\"checkbox-image\"\n [src]=\"imageUrl\"\n *ngIf=\"imageUrl\">\n {{ label }}\n </div>\n <div class=\"app-checkbox-supporting-text\"\n *ngIf=\"supportingText\">\n {{ supportingText }}\n </div>\n </div>\n</div>\n", styles: [".checkbox-component{display:flex;align-items:flex-start;cursor:pointer;gap:8px}.checkbox-component .app-checkbox{padding:0;position:relative;width:16px;min-width:16px;height:16px;min-height:16px;border:1px solid #D0D5DD;border-radius:4px;box-sizing:border-box;color:#fff;background:#FFFFFF;cursor:pointer;margin-top:2px}.checkbox-component .app-checkbox:focus{outline:none;border-color:#88c1f1;box-shadow:0 0 0 4px #f4ebff}.checkbox-component .app-checkbox:disabled{cursor:not-allowed}.checkbox-component .app-checkbox.app-checked,.checkbox-component .app-checkbox.app-indeterminate{border-color:#136ab6;color:#136ab6;background:#F1F7FE}.checkbox-component .app-checkbox .app-checkbox-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:14px}.checkbox-component .app-checkbox-text-wrap{display:flex;flex-direction:column}.checkbox-component .app-checkbox-label{font-weight:500;font-size:14px;line-height:20px;color:#344054;display:flex;align-items:center}.checkbox-component .app-checkbox-label .checkbox-image{margin-right:8px;width:36px}.checkbox-component .app-checkbox-supporting-text{font-weight:400;font-size:14px;line-height:20px;color:#667085}.checkbox-component:hover,.checkbox-component:focus{outline:none;text-decoration:none}.checkbox-component:hover .app-checkbox,.checkbox-component:focus .app-checkbox{background:#E3EEFB;border-color:#136ab6}.checkbox-component:hover .app-checkbox.app-checked,.checkbox-component:focus .app-checkbox.app-checked{background:#E3EEFB;border-color:#136ab6;color:#136ab6}.checkbox-component:hover .app-checkbox.app-indeterminate,.checkbox-component:focus .app-checkbox.app-indeterminate{background:#E3EEFB;border-color:#136ab6;color:#136ab6}.checkbox-component.app-disabled{cursor:not-allowed}.checkbox-component.app-disabled:hover .app-checkbox,.checkbox-component.app-disabled:focus .app-checkbox{background:#F2F4F7;border-color:#eaecf0}.checkbox-component.app-disabled:hover .app-checkbox.app-checked,.checkbox-component.app-disabled:focus .app-checkbox.app-checked{background:#F2F4F7;border-color:#eaecf0;color:#eaecf0}.checkbox-component.app-disabled:hover .app-checkbox.app-indeterminate,.checkbox-component.app-disabled:focus .app-checkbox.app-indeterminate{background:#F2F4F7;border-color:#eaecf0;color:#eaecf0}.checkbox-component.app-disabled .app-checkbox{border-color:#eaecf0;background:#F2F4F7}.checkbox-component.app-disabled .app-checkbox.app-checked,.checkbox-component.app-disabled .app-checkbox.app-indeterminate{border-color:#eaecf0;color:#eaecf0;background:#F2F4F7}.checkbox-component.app-disabled .app-checkbox-label,.checkbox-component.app-disabled .app-checkbox-supporting-text{color:#d0d5dd}.checkbox-component.checkbox-md{gap:12px}.checkbox-component.checkbox-md .app-checkbox{width:20px;min-width:20px;height:20px;min-height:20px;border-radius:6px;margin-top:2px}.checkbox-component.checkbox-md .app-checkbox .app-checkbox-icon{font-size:16px}.checkbox-component.checkbox-md .app-checkbox-label,.checkbox-component.checkbox-md .app-checkbox-supporting-text{font-size:16px;line-height:24px}\n"] }]
|
|
30
31
|
}], propDecorators: { checked: [{
|
|
31
32
|
type: Input
|
|
32
33
|
}], checkedChange: [{
|
|
@@ -43,5 +44,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
43
44
|
type: Input
|
|
44
45
|
}], imageUrl: [{
|
|
45
46
|
type: Input
|
|
47
|
+
}], size: [{
|
|
48
|
+
type: Input
|
|
49
|
+
}], supportingText: [{
|
|
50
|
+
type: Input
|
|
46
51
|
}] } });
|
|
47
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
52
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctemVuZHVpdC9zcmMvbGliL2NoZWNrYm94L3plbmR1LWNoZWNrYm94LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9jaGVja2JveC96ZW5kdS1jaGVja2JveC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFPdkUsTUFBTSxPQUFPLHNCQUFzQjtJQUxuQztRQVNjLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQUU3QyxVQUFLLEdBQW9CLFFBQVEsQ0FBQztRQUVsQyxlQUFVLEdBQVcsRUFBRSxDQUFDO1FBRXhCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFakIsdUJBQWtCLEdBQUcsS0FBSyxDQUFDO1FBRTNCLGtCQUFhLEdBQUcsS0FBSyxDQUFDO1FBSXRCLFNBQUksR0FBZ0IsSUFBSSxDQUFDO0tBaUJyQztJQWJHOztPQUVHO0lBQ0ksTUFBTTtRQUNULElBQUksSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsa0JBQWtCLEVBQUU7WUFDMUMsT0FBTztTQUNWO1FBRUQsSUFBSSxDQUFDLE9BQU8sR0FBRyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUM7UUFDN0IsSUFBSSxDQUFDLGFBQWEsR0FBRyxLQUFLLENBQUM7UUFFM0IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQzFDLENBQUM7O29IQWxDUSxzQkFBc0I7d0dBQXRCLHNCQUFzQixpVkNQbkMsZ2tDQTJCQTs0RkRwQmEsc0JBQXNCO2tCQUxsQyxTQUFTOytCQUNJLGNBQWM7OEJBTWYsT0FBTztzQkFBZixLQUFLO2dCQUVJLGFBQWE7c0JBQXRCLE1BQU07Z0JBRUUsS0FBSztzQkFBYixLQUFLO2dCQUVHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUcsUUFBUTtzQkFBaEIsS0FBSztnQkFFRyxrQkFBa0I7c0JBQTFCLEtBQUs7Z0JBRUcsYUFBYTtzQkFBckIsS0FBSztnQkFFRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVHLElBQUk7c0JBQVosS0FBSztnQkFFRyxjQUFjO3NCQUF0QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICd6ZW4tY2hlY2tib3gnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi96ZW5kdS1jaGVja2JveC5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vemVuZHUtY2hlY2tib3guY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBaZW5kdUNoZWNrYm94Q29tcG9uZW50IHtcblxuICAgIEBJbnB1dCgpIGNoZWNrZWQ6IGJvb2xlYW47XG5cbiAgICBAT3V0cHV0KCkgY2hlY2tlZENoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICAgIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmcgfCBudW1iZXIgPSAnRW5hYmxlJztcblxuICAgIEBJbnB1dCgpIGxhYmVsQ29sb3I6IHN0cmluZyA9IFwiXCI7XG5cbiAgICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuXG4gICAgQElucHV0KCkgZGlzYWJsZVZhbHVlQ2hhbmdlID0gZmFsc2U7XG5cbiAgICBASW5wdXQoKSBpbmRldGVybWluYXRlID0gZmFsc2U7XG5cbiAgICBASW5wdXQoKSBpbWFnZVVybDogc3RyaW5nO1xuXG4gICAgQElucHV0KCkgc2l6ZTogJ3NtJyB8ICdtZCcgPSAnc20nO1xuXG4gICAgQElucHV0KCkgc3VwcG9ydGluZ1RleHQ6IHN0cmluZztcblxuICAgIC8qKlxuICAgICAqIFRvZ2dsZSBzdGF0ZVxuICAgICAqL1xuICAgIHB1YmxpYyB0b2dnbGUoKTogdm9pZCB7XG4gICAgICAgIGlmICh0aGlzLmRpc2FibGVkIHx8IHRoaXMuZGlzYWJsZVZhbHVlQ2hhbmdlKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cblxuICAgICAgICB0aGlzLmNoZWNrZWQgPSAhdGhpcy5jaGVja2VkO1xuICAgICAgICB0aGlzLmluZGV0ZXJtaW5hdGUgPSBmYWxzZTtcblxuICAgICAgICB0aGlzLmNoZWNrZWRDaGFuZ2UuZW1pdCh0aGlzLmNoZWNrZWQpO1xuICAgIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJjaGVja2JveC1jb21wb25lbnRcIlxuICAgICBbbmdDbGFzc109XCJ7J2FwcC1kaXNhYmxlZCc6IGRpc2FibGVkLCAnY2hlY2tib3gtbWQnOiBzaXplID09PSAnbWQnfVwiXG4gICAgIChjbGljayk9XCJ0b2dnbGUoKVwiPlxuICAgIDxidXR0b24gY2xhc3M9XCJhcHAtY2hlY2tib3hcIlxuICAgICAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICAgICAgICAgIFtuZ0NsYXNzXT1cInsgJ2FwcC1jaGVja2VkJzogY2hlY2tlZCAmJiAhaW5kZXRlcm1pbmF0ZSwgJ2FwcC1pbmRldGVybWluYXRlJzogaW5kZXRlcm1pbmF0ZSB9XCI+XG4gICAgICAgIDxpICpuZ0lmPVwiY2hlY2tlZCAmJiAhaW5kZXRlcm1pbmF0ZVwiXG4gICAgICAgICAgIGNsYXNzPVwibWF0ZXJpYWwtaWNvbnMgYXBwLWNoZWNrYm94LWljb25cIj5kb25lPC9pPlxuICAgICAgICA8aSAqbmdJZj1cImluZGV0ZXJtaW5hdGVcIlxuICAgICAgICAgICBjbGFzcz1cIm1hdGVyaWFsLWljb25zIGFwcC1jaGVja2JveC1pY29uXCI+cmVtb3ZlPC9pPlxuICAgIDwvYnV0dG9uPlxuICAgIDxkaXYgY2xhc3M9XCJhcHAtY2hlY2tib3gtdGV4dC13cmFwXCJcbiAgICAgICAgICpuZ0lmPVwibGFiZWwgfHwgc3VwcG9ydGluZ1RleHRcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImFwcC1jaGVja2JveC1sYWJlbFwiXG4gICAgICAgICAgICAgKm5nSWY9XCJsYWJlbFwiXG4gICAgICAgICAgICAgW25nU3R5bGVdPVwieydjb2xvcic6IGxhYmVsQ29sb3IgfVwiPlxuICAgICAgICAgICAgPGltZyBjbGFzcz1cImNoZWNrYm94LWltYWdlXCJcbiAgICAgICAgICAgICAgICAgW3NyY109XCJpbWFnZVVybFwiXG4gICAgICAgICAgICAgICAgICpuZ0lmPVwiaW1hZ2VVcmxcIj5cbiAgICAgICAgICAgIHt7IGxhYmVsIH19XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiYXBwLWNoZWNrYm94LXN1cHBvcnRpbmctdGV4dFwiXG4gICAgICAgICAgICAgKm5nSWY9XCJzdXBwb3J0aW5nVGV4dFwiPlxuICAgICAgICAgICAge3sgc3VwcG9ydGluZ1RleHQgfX1cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -99,7 +99,7 @@ export class ZenduColumnConfigurationComponent {
|
|
|
99
99
|
}
|
|
100
100
|
}
|
|
101
101
|
ZenduColumnConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduColumnConfigurationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
102
|
-
ZenduColumnConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduColumnConfigurationComponent, selector: "zen-column-configuration", inputs: { configuration: "configuration", defaultConfiguration: "defaultConfiguration", dropdownPosition: "dropdownPosition" }, outputs: { configurationChange: "configurationChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "labelColor", "disabled", "disableValueChange", "indeterminate", "imageUrl"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "disabled", "placeholder"], outputs: ["textChange"] }] });
|
|
102
|
+
ZenduColumnConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduColumnConfigurationComponent, selector: "zen-column-configuration", inputs: { configuration: "configuration", defaultConfiguration: "defaultConfiguration", dropdownPosition: "dropdownPosition" }, outputs: { configurationChange: "configurationChange" }, host: { listeners: { "window:mousedown": "outsideHandling($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3.ZenduCheckboxComponent, selector: "zen-checkbox", inputs: ["checked", "label", "labelColor", "disabled", "disableValueChange", "indeterminate", "imageUrl", "size", "supportingText"], outputs: ["checkedChange"] }, { kind: "component", type: i4.ZenduSearchBoxComponent, selector: "zen-search-box", inputs: ["text", "delay", "autoFocus", "disabled", "placeholder"], outputs: ["textChange"] }] });
|
|
103
103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduColumnConfigurationComponent, decorators: [{
|
|
104
104
|
type: Component,
|
|
105
105
|
args: [{ selector: 'zen-column-configuration', template: "<div class=\"column-config-component\">\n <button class=\"button-basic button-icon\"\n [ngClass]=\"{ 'active': showPanel }\"\n (click)=\"togglePanel()\">\n <i class=\"material-icons\">view_column</i>\n </button>\n\n <div *ngIf=\"showPanel\"\n class=\"action-menu column-config-menu\"\n [ngClass]=\"{'right': dropdownPosition === 'right'}\">\n <div class=\"action-menu-header\">\n <div class=\"title\">Manage Columns</div>\n <zen-search-box [(text)]=\"searchText\"\n (textChange)=\"filterItems()\"></zen-search-box>\n </div>\n\n\n <div class=\"action-menu-body dnd-container\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\">\n <div *ngFor=\"let config of filteredColumnsConfiguration\"\n class=\"action-item-checkbox drag-item\"\n cdkDrag>\n <zen-checkbox class=\"flex-1\"\n [(checked)]=\"config.isVisible\"\n [label]=\"config.displayName\"></zen-checkbox>\n <i class=\"material-icons drag-icon\">drag_handle</i>\n </div>\n </div>\n\n <div class=\"action-menu-footer\">\n <button (click)=\"reset()\"\n type=\"button\"\n class=\"button-stroked full-width\">Reset</button>\n <button (click)=\"apply()\"\n type=\"button\"\n class=\"button-flat full-width\">Apply</button>\n </div>\n </div>\n</div>\n", styles: [".column-config-component{display:inline-block;position:relative}.column-config-component .column-config-menu{top:115%;width:300px}.column-config-component .column-config-menu.right{right:0}.column-config-component .column-config-menu .dnd-container{max-height:218px;overflow-y:auto}.column-config-component .column-config-menu .dnd-container .drag-item{justify-content:space-between}.column-config-component .column-config-menu .dnd-container .drag-item .drag-icon{cursor:move;color:#b8b9bc}.column-config-component .column-config-menu .dnd-container .dndDraggingSource{display:none}.column-config-component .column-config-menu .dnd-container .dndPlaceholder{background-color:#b8b9bc;display:block;min-height:40px}\n"] }]
|