@recursyve/nice-ui-kit.v2 13.2.0-beta.120 → 13.2.0-beta.122
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/components/collapsable/collapsable.component.mjs +17 -4
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs +13 -2
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs +13 -2
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/lib/components/collapsable/collapsable.component.d.ts +8 -3
- package/package.json +1 -1
- package/src/lib/components/collapsable/collapsable.theme.scss +32 -0
|
@@ -1,23 +1,36 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from "@angular/core";
|
|
1
|
+
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from "@angular/core";
|
|
2
2
|
import { FormControl } from "@angular/forms";
|
|
3
|
+
import { Subject } from "rxjs";
|
|
4
|
+
import { takeUntil } from "rxjs/operators";
|
|
3
5
|
import * as i0 from "@angular/core";
|
|
4
6
|
import * as i1 from "@angular/forms";
|
|
5
7
|
export class NiceCollapsableComponent {
|
|
6
8
|
constructor() {
|
|
9
|
+
this.openChange = new EventEmitter();
|
|
10
|
+
this.unsubscribeAll$ = new Subject();
|
|
7
11
|
this.control = new FormControl(false);
|
|
8
12
|
}
|
|
13
|
+
ngOnInit() {
|
|
14
|
+
this.control.valueChanges.pipe(takeUntil(this.unsubscribeAll$)).subscribe(open => this.openChange.emit(open));
|
|
15
|
+
}
|
|
9
16
|
ngOnChanges(changes) {
|
|
10
17
|
if ("open" in changes) {
|
|
11
18
|
this.control.patchValue(this.open);
|
|
12
19
|
}
|
|
13
20
|
}
|
|
21
|
+
ngOnDestroy() {
|
|
22
|
+
this.unsubscribeAll$.next();
|
|
23
|
+
this.unsubscribeAll$.complete();
|
|
24
|
+
}
|
|
14
25
|
}
|
|
15
26
|
NiceCollapsableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: NiceCollapsableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
-
NiceCollapsableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: NiceCollapsableComponent, selector: "nice-collapsable", inputs: { open: "open" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
27
|
+
NiceCollapsableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: NiceCollapsableComponent, selector: "nice-collapsable", inputs: { open: "open" }, outputs: { openChange: "openChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [""], directives: [{ type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
17
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: NiceCollapsableComponent, decorators: [{
|
|
18
29
|
type: Component,
|
|
19
|
-
args: [{ selector: "nice-collapsable", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
30
|
+
args: [{ selector: "nice-collapsable", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [""] }]
|
|
20
31
|
}], propDecorators: { open: [{
|
|
21
32
|
type: Input
|
|
33
|
+
}], openChange: [{
|
|
34
|
+
type: Output
|
|
22
35
|
}] } });
|
|
23
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
36
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGFwc2FibGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmljZS11aS1raXQtdjIvc3JjL2xpYi9jb21wb25lbnRzL2NvbGxhcHNhYmxlL2NvbGxhcHNhYmxlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25pY2UtdWkta2l0LXYyL3NyYy9saWIvY29tcG9uZW50cy9jb2xsYXBzYWJsZS9jb2xsYXBzYWJsZS50ZW1wbGF0ZS5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBR0csTUFBTSxFQUVkLGlCQUFpQixFQUNwQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDN0MsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7OztBQVMzQyxNQUFNLE9BQU8sd0JBQXdCO0lBUHJDO1FBWVcsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7UUFFekMsb0JBQWUsR0FBRyxJQUFJLE9BQU8sRUFBUSxDQUFDO1FBQ3RDLFlBQU8sR0FBRyxJQUFJLFdBQVcsQ0FBQyxLQUFLLENBQUMsQ0FBQztLQWdCM0M7SUFkVSxRQUFRO1FBQ1gsSUFBSSxDQUFDLE9BQU8sQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO0lBQ2xILENBQUM7SUFFTSxXQUFXLENBQUMsT0FBc0I7UUFDckMsSUFBSSxNQUFNLElBQUksT0FBTyxFQUFFO1lBQ25CLElBQUksQ0FBQyxPQUFPLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUN0QztJQUNMLENBQUM7SUFFTSxXQUFXO1FBQ2QsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUM1QixJQUFJLENBQUMsZUFBZSxDQUFDLFFBQVEsRUFBRSxDQUFDO0lBQ3BDLENBQUM7O3FIQXZCUSx3QkFBd0I7eUdBQXhCLHdCQUF3Qiw4SUN0QnJDLCtaQVdBOzJGRFdhLHdCQUF3QjtrQkFQcEMsU0FBUzsrQkFDSSxrQkFBa0IsaUJBR2IsaUJBQWlCLENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTTs4QkFJeEMsSUFBSTtzQkFEVixLQUFLO2dCQUlDLFVBQVU7c0JBRGhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgSW5wdXQsXG4gICAgT25DaGFuZ2VzLFxuICAgIE9uRGVzdHJveSxcbiAgICBPbkluaXQsIE91dHB1dCxcbiAgICBTaW1wbGVDaGFuZ2VzLFxuICAgIFZpZXdFbmNhcHN1bGF0aW9uXG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBGb3JtQ29udHJvbCB9IGZyb20gXCJAYW5ndWxhci9mb3Jtc1wiO1xuaW1wb3J0IHsgU3ViamVjdCB9IGZyb20gXCJyeGpzXCI7XG5pbXBvcnQgeyB0YWtlVW50aWwgfSBmcm9tIFwicnhqcy9vcGVyYXRvcnNcIjtcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6IFwibmljZS1jb2xsYXBzYWJsZVwiLFxuICAgIHRlbXBsYXRlVXJsOiBcImNvbGxhcHNhYmxlLnRlbXBsYXRlLmh0bWxcIixcbiAgICBzdHlsZVVybHM6IFtcImNvbGxhcHNhYmxlLnN0eWxlLnNjc3NcIl0sXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBOaWNlQ29sbGFwc2FibGVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcywgT25EZXN0cm95IHtcbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBvcGVuOiBib29sZWFuO1xuXG4gICAgQE91dHB1dCgpXG4gICAgcHVibGljIG9wZW5DaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgICBwdWJsaWMgdW5zdWJzY3JpYmVBbGwkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcbiAgICBwdWJsaWMgY29udHJvbCA9IG5ldyBGb3JtQ29udHJvbChmYWxzZSk7XG5cbiAgICBwdWJsaWMgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgICAgIHRoaXMuY29udHJvbC52YWx1ZUNoYW5nZXMucGlwZSh0YWtlVW50aWwodGhpcy51bnN1YnNjcmliZUFsbCQpKS5zdWJzY3JpYmUob3BlbiA9PiB0aGlzLm9wZW5DaGFuZ2UuZW1pdChvcGVuKSk7XG4gICAgfVxuXG4gICAgcHVibGljIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICAgICAgaWYgKFwib3BlblwiIGluIGNoYW5nZXMpIHtcbiAgICAgICAgICAgIHRoaXMuY29udHJvbC5wYXRjaFZhbHVlKHRoaXMub3Blbik7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBwdWJsaWMgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHRoaXMudW5zdWJzY3JpYmVBbGwkLm5leHQoKTtcbiAgICAgICAgdGhpcy51bnN1YnNjcmliZUFsbCQuY29tcGxldGUoKTtcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiY29sbGFwc2VcIj5cbiAgICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgY2xhc3M9XCJwZWVyIGN1cnNvci1wb2ludGVyXCIgW2Zvcm1Db250cm9sXT1cImNvbnRyb2xcIi8+XG4gICAgPGRpdiBjbGFzcz1cImNvbGxhcHNlLXRpdGxlXCI+XG4gICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltuaWNlQ29sbGFwc2FibGVUaXRsZV1cIj48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cImNvbGxhcHNlLWNvbnRlbnRcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIj5cbiAgICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltuaWNlQ29sbGFwc2FibGVDb250ZW50XVwiPjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -3551,21 +3551,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
|
|
|
3551
3551
|
|
|
3552
3552
|
class NiceCollapsableComponent {
|
|
3553
3553
|
constructor() {
|
|
3554
|
+
this.openChange = new EventEmitter();
|
|
3555
|
+
this.unsubscribeAll$ = new Subject();
|
|
3554
3556
|
this.control = new FormControl(false);
|
|
3555
3557
|
}
|
|
3558
|
+
ngOnInit() {
|
|
3559
|
+
this.control.valueChanges.pipe(takeUntil(this.unsubscribeAll$)).subscribe(open => this.openChange.emit(open));
|
|
3560
|
+
}
|
|
3556
3561
|
ngOnChanges(changes) {
|
|
3557
3562
|
if ("open" in changes) {
|
|
3558
3563
|
this.control.patchValue(this.open);
|
|
3559
3564
|
}
|
|
3560
3565
|
}
|
|
3566
|
+
ngOnDestroy() {
|
|
3567
|
+
this.unsubscribeAll$.next();
|
|
3568
|
+
this.unsubscribeAll$.complete();
|
|
3569
|
+
}
|
|
3561
3570
|
}
|
|
3562
3571
|
NiceCollapsableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: NiceCollapsableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3563
|
-
NiceCollapsableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: NiceCollapsableComponent, selector: "nice-collapsable", inputs: { open: "open" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
3572
|
+
NiceCollapsableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: NiceCollapsableComponent, selector: "nice-collapsable", inputs: { open: "open" }, outputs: { openChange: "openChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [""], directives: [{ type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3564
3573
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: NiceCollapsableComponent, decorators: [{
|
|
3565
3574
|
type: Component,
|
|
3566
|
-
args: [{ selector: "nice-collapsable", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
3575
|
+
args: [{ selector: "nice-collapsable", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"collapse\">\n <input type=\"checkbox\" class=\"peer cursor-pointer\" [formControl]=\"control\"/>\n <div class=\"collapse-title\">\n <ng-content select=\"[niceCollapsableTitle]\"></ng-content>\n </div>\n <div class=\"collapse-content\">\n <div class=\"content\">\n <ng-content select=\"[niceCollapsableContent]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [""] }]
|
|
3567
3576
|
}], propDecorators: { open: [{
|
|
3568
3577
|
type: Input
|
|
3578
|
+
}], openChange: [{
|
|
3579
|
+
type: Output
|
|
3569
3580
|
}] } });
|
|
3570
3581
|
|
|
3571
3582
|
class NiceCollapsableModule {
|