cps-ui-kit 0.86.0 → 0.87.0
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/cps-sidebar-menu/cps-sidebar-menu.component.mjs +10 -5
- package/fesm2015/cps-ui-kit.mjs +9 -4
- package/fesm2015/cps-ui-kit.mjs.map +1 -1
- package/fesm2020/cps-ui-kit.mjs +9 -4
- package/fesm2020/cps-ui-kit.mjs.map +1 -1
- package/lib/components/cps-sidebar-menu/cps-sidebar-menu.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -14,6 +14,7 @@ export class CpsSidebarMenuComponent {
|
|
|
14
14
|
this._router = _router;
|
|
15
15
|
this.items = [];
|
|
16
16
|
this.isExpanded = true;
|
|
17
|
+
this.exactRoutes = false;
|
|
17
18
|
this.height = '100%';
|
|
18
19
|
}
|
|
19
20
|
ngOnInit() {
|
|
@@ -28,15 +29,17 @@ export class CpsSidebarMenuComponent {
|
|
|
28
29
|
isActive(item) {
|
|
29
30
|
if (!item.items)
|
|
30
31
|
return false;
|
|
31
|
-
const urls = item.items.map((i) => i.url);
|
|
32
|
-
|
|
32
|
+
const urls = item.items.filter((i) => i.url).map((i) => i.url);
|
|
33
|
+
if (this.exactRoutes)
|
|
34
|
+
return urls.includes(this._router.url);
|
|
35
|
+
return urls.some((url) => this._router.url.includes(url));
|
|
33
36
|
}
|
|
34
37
|
toggleSidebar() {
|
|
35
38
|
this.isExpanded = !this.isExpanded;
|
|
36
39
|
}
|
|
37
40
|
}
|
|
38
41
|
CpsSidebarMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsSidebarMenuComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
39
|
-
CpsSidebarMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsSidebarMenuComponent, isStandalone: true, selector: "cps-sidebar-menu", inputs: { items: "items", isExpanded: "isExpanded", height: "height" }, viewQueries: [{ propertyName: "allMenus", predicate: ["popupMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact:
|
|
42
|
+
CpsSidebarMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsSidebarMenuComponent, isStandalone: true, selector: "cps-sidebar-menu", inputs: { items: "items", isExpanded: "isExpanded", exactRoutes: "exactRoutes", height: "height" }, viewQueries: [{ propertyName: "allMenus", predicate: ["popupMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: exactRoutes }\"\n [ngClass]=\"{ disabled: item.disabled }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </a>\n <ng-container *ngIf=\"!item.url\">\n <cps-menu\n #popupMenu\n [items]=\"item.items || []\"\n [header]=\"item.title\"\n showTransitionOptions=\"0s\"\n hideTransitionOptions=\"0s\"\n [withArrow]=\"false\">\n </cps-menu>\n <div\n (click)=\"toggleMenu($event, popupMenu)\"\n class=\"cps-sidebar-menu-item menu-trigger\"\n [ngClass]=\"{\n active: isActive(item),\n 'menu-open': popupMenu.isVisible(),\n disabled: item.disabled\n }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </div>\n </ng-container>\n </ng-container>\n <div class=\"expand-area\" (click)=\"toggleSidebar()\">\n <cps-icon icon=\"menu-shrink\" size=\"fill\"> </cps-icon>\n </div>\n</div>\n", styles: [":host .cps-sidebar-menu{display:inline-flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 60px #0000001a;width:80px;transition-duration:.2s;overflow:hidden;position:relative}:host .cps-sidebar-menu .expand-area{cursor:pointer;display:flex;justify-content:center;height:24px;position:absolute;bottom:5%;transition-duration:.2s}:host .cps-sidebar-menu .expand-area:hover{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:80px;text-decoration:none;color:var(--cps-color-text-darkest);border-bottom:1px solid var(--cps-color-line-mid);-webkit-user-select:none;user-select:none}:host .cps-sidebar-menu .cps-sidebar-menu-item .cps-sidebar-menu-item-label{font-weight:600;font-size:11px;line-height:13px;width:80px;color:var(--cps-color-text-darkest);text-align:center}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active){background:#f8f4f5;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:active:not(.active){background:#f1eaec}:host .cps-sidebar-menu .cps-sidebar-menu-item.active{background:var(--cps-color-calm);color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.active .cps-sidebar-menu-item-label{color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active){background:#f1eaec;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-trigger{cursor:pointer}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled{cursor:default;pointer-events:none;color:var(--cps-color-text-light)}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled .cps-sidebar-menu-item-label{color:var(--cps-color-text-light)}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed{width:40px}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed .expand-area{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], animations: [
|
|
40
43
|
trigger('onExpand', [
|
|
41
44
|
state('collapsed', style({
|
|
42
45
|
marginTop: '0',
|
|
@@ -71,15 +74,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
71
74
|
animate('0.2s cubic-bezier(0.4, 0, 0.2, 1)')
|
|
72
75
|
])
|
|
73
76
|
])
|
|
74
|
-
], template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact:
|
|
77
|
+
], template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: exactRoutes }\"\n [ngClass]=\"{ disabled: item.disabled }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </a>\n <ng-container *ngIf=\"!item.url\">\n <cps-menu\n #popupMenu\n [items]=\"item.items || []\"\n [header]=\"item.title\"\n showTransitionOptions=\"0s\"\n hideTransitionOptions=\"0s\"\n [withArrow]=\"false\">\n </cps-menu>\n <div\n (click)=\"toggleMenu($event, popupMenu)\"\n class=\"cps-sidebar-menu-item menu-trigger\"\n [ngClass]=\"{\n active: isActive(item),\n 'menu-open': popupMenu.isVisible(),\n disabled: item.disabled\n }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </div>\n </ng-container>\n </ng-container>\n <div class=\"expand-area\" (click)=\"toggleSidebar()\">\n <cps-icon icon=\"menu-shrink\" size=\"fill\"> </cps-icon>\n </div>\n</div>\n", styles: [":host .cps-sidebar-menu{display:inline-flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 60px #0000001a;width:80px;transition-duration:.2s;overflow:hidden;position:relative}:host .cps-sidebar-menu .expand-area{cursor:pointer;display:flex;justify-content:center;height:24px;position:absolute;bottom:5%;transition-duration:.2s}:host .cps-sidebar-menu .expand-area:hover{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:80px;text-decoration:none;color:var(--cps-color-text-darkest);border-bottom:1px solid var(--cps-color-line-mid);-webkit-user-select:none;user-select:none}:host .cps-sidebar-menu .cps-sidebar-menu-item .cps-sidebar-menu-item-label{font-weight:600;font-size:11px;line-height:13px;width:80px;color:var(--cps-color-text-darkest);text-align:center}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active){background:#f8f4f5;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:active:not(.active){background:#f1eaec}:host .cps-sidebar-menu .cps-sidebar-menu-item.active{background:var(--cps-color-calm);color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.active .cps-sidebar-menu-item-label{color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active){background:#f1eaec;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-trigger{cursor:pointer}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled{cursor:default;pointer-events:none;color:var(--cps-color-text-light)}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled .cps-sidebar-menu-item-label{color:var(--cps-color-text-light)}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed{width:40px}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed .expand-area{transform:rotate(180deg)}\n"] }]
|
|
75
78
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { items: [{
|
|
76
79
|
type: Input
|
|
77
80
|
}], isExpanded: [{
|
|
78
81
|
type: Input
|
|
82
|
+
}], exactRoutes: [{
|
|
83
|
+
type: Input
|
|
79
84
|
}], height: [{
|
|
80
85
|
type: Input
|
|
81
86
|
}], allMenus: [{
|
|
82
87
|
type: ViewChildren,
|
|
83
88
|
args: ['popupMenu']
|
|
84
89
|
}] } });
|
|
85
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
90
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3BzLXNpZGViYXItbWVudS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jcHMtdWkta2l0L3NyYy9saWIvY29tcG9uZW50cy9jcHMtc2lkZWJhci1tZW51L2Nwcy1zaWRlYmFyLW1lbnUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY3BzLXVpLWtpdC9zcmMvbGliL2NvbXBvbmVudHMvY3BzLXNpZGViYXItbWVudS9jcHMtc2lkZWJhci1tZW51LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUdMLFlBQVksRUFDYixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFVLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxnQkFBZ0IsRUFBZSxNQUFNLGdDQUFnQyxDQUFDO0FBQy9FLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsT0FBTyxFQUNQLEtBQUssRUFDTCxLQUFLLEVBQ0wsVUFBVSxFQUNWLE9BQU8sRUFDUixNQUFNLHFCQUFxQixDQUFDOzs7O0FBeUM3QixNQUFNLE9BQU8sdUJBQXVCO0lBUWxDLGtEQUFrRDtJQUNsRCxZQUFvQixPQUFlO1FBQWYsWUFBTyxHQUFQLE9BQU8sQ0FBUTtRQVIxQixVQUFLLEdBQXlCLEVBQUUsQ0FBQztRQUNqQyxlQUFVLEdBQUcsSUFBSSxDQUFDO1FBQ2xCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBQ3BCLFdBQU0sR0FBRyxNQUFNLENBQUM7SUFLYSxDQUFDO0lBRXZDLFFBQVE7UUFDTixJQUFJLENB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c0JBQW5CLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUVxQixRQUFRO3NCQUFsQyxZQUFZO3VCQUFDLFdBQVciLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIFF1ZXJ5TGlzdCxcbiAgVmlld0NoaWxkcmVuXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFJvdXRlciwgUm91dGVyTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcbmltcG9ydCB7IENwc01lbnVDb21wb25lbnQsIENwc01lbnVJdGVtIH0gZnJvbSAnLi4vY3BzLW1lbnUvY3BzLW1lbnUuY29tcG9uZW50JztcbmltcG9ydCB7IENwc0ljb25Db21wb25lbnQgfSBmcm9tICcuLi9jcHMtaWNvbi9jcHMtaWNvbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgY29udmVydFNpemUgfSBmcm9tICcuLi8uLi91dGlscy9pbnRlcm5hbC9zaXplLXV0aWxzJztcbmltcG9ydCB7XG4gIGFuaW1hdGUsXG4gIHN0YXRlLFxuICBzdHlsZSxcbiAgdHJhbnNpdGlvbixcbiAgdHJpZ2dlclxufSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcblxuZXhwb3J0IHR5cGUgQ3BzU2lkZWJhck1lbnVJdGVtID0ge1xuICB0aXRsZTogc3RyaW5nO1xuICBpY29uOiBzdHJpbmc7XG4gIHVybD86IHN0cmluZztcbiAgdGFyZ2V0Pzogc3RyaW5nO1xuICBkaXNhYmxlZD86IGJvb2xlYW47XG4gIGl0ZW1zPzogQ3BzTWVudUl0ZW1bXTtcbn07XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2Nwcy1zaWRlYmFyLW1lbnUnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBDcHNNZW51Q29tcG9uZW50LCBDcHNJY29uQ29tcG9uZW50LCBSb3V0ZXJNb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vY3BzLXNpZGViYXItbWVudS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2Nwcy1zaWRlYmFyLW1lbnUuY29tcG9uZW50LnNjc3MnXSxcbiAgYW5pbWF0aW9uczogW1xuICAgIHRyaWdnZXIoJ29uRXhwYW5kJywgW1xuICAgICAgc3RhdGUoXG4gICAgICAgICdjb2xsYXBzZWQnLFxuICAgICAgICBzdHlsZSh7XG4gICAgICAgICAgbWFyZ2luVG9wOiAnMCcsXG4gICAgICAgICAgb3BhY2l0eTogJzAnLFxuICAgICAgICAgIGhlaWdodDogJzAnLFxuICAgICAgICAgIHZpc2liaWxpdHk6ICdoaWRkZW4nXG4gICAgICAgIH0pXG4gICAgICApLFxuICAgICAgc3RhdGUoXG4gICAgICAgICdleHBhbmRlZCcsXG4gICAgICAgIHN0eWxlKHtcbiAgICAgICAgICBtYXJnaW5Ub3A6ICc2cHgnLFxuICAgICAgICAgIG9wYWNpdHk6ICcxJ1xuICAgICAgICB9KVxuICAgICAgKSxcbiAgICAgIHRyYW5zaXRpb24oJ2V4cGFuZGVkIDw9PiBjb2xsYXBzZWQnLCBbXG4gICAgICAgIGFuaW1hdGUoJzAuMnMgY3ViaWMtYmV6aWVyKDAuNCwgMCwgMC4yLCAxKScpXG4gICAgICBdKVxuICAgIF0pXG4gIF1cbn0pXG5leHBvcnQgY2xhc3MgQ3BzU2lkZWJhck1lbnVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSBpdGVtczogQ3BzU2lkZWJhck1lbnVJdGVtW10gPSBbXTtcbiAgQElucHV0KCkgaXNFeHBhbmRlZCA9IHRydWU7XG4gIEBJbnB1dCgpIGV4YWN0Um91dGVzID0gZmFsc2U7XG4gIEBJbnB1dCgpIGhlaWdodCA9ICcxMDAlJztcblxuICBAVmlld0NoaWxkcmVuKCdwb3B1cE1lbnUnKSBhbGxNZW51cz86IFF1ZXJ5TGlzdDxDcHNNZW51Q29tcG9uZW50PjtcblxuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbm8tdXNlbGVzcy1jb25zdHJ1Y3RvclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF9yb3V0ZXI6IFJvdXRlcikge31cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmhlaWdodCA9IGNvbnZlcnRTaXplKHRoaXMuaGVpZ2h0KTtcbiAgfVxuXG4gIHRvZ2dsZU1lbnUoZXZlbnQ6IGFueSwgbWVudTogQ3BzTWVudUNvbXBvbmVudCkge1xuICAgIGNvbnN0IGlzVmlzaWJsZSA9IG1lbnUuaXNWaXNpYmxlKCk7XG4gICAgdGhpcy5hbGxNZW51cz8uZm9yRWFjaCgobSkgPT4gbS5oaWRlKCkpO1xuICAgIGlmICghaXNWaXNpYmxlKSBtZW51LnRvZ2dsZShldmVudCwgZXZlbnQuY3VycmVudFRhcmdldCwgJ3RyJyk7XG4gIH1cblxuICBpc0FjdGl2ZShpdGVtOiBDcHNTaWRlYmFyTWVudUl0ZW0pIHtcbiAgICBpZiAoIWl0ZW0uaXRlbXMpIHJldHVybiBmYWxzZTtcbiAgICBjb25zdCB1cmxzID0gaXRlbS5pdGVtcy5maWx0ZXIoKGkpID0+IGkudXJsKS5tYXAoKGkpID0+IGkudXJsKSBhcyBzdHJpbmdbXTtcblxuICAgIGlmICh0aGlzLmV4YWN0Um91dGVzKSByZXR1cm4gdXJscy5pbmNsdWRlcyh0aGlzLl9yb3V0ZXIudXJsKTtcbiAgICByZXR1cm4gdXJscy5zb21lKCh1cmwpID0+IHRoaXMuX3JvdXRlci51cmwuaW5jbHVkZXModXJsKSk7XG4gIH1cblxuICB0b2dnbGVTaWRlYmFyKCkge1xuICAgIHRoaXMuaXNFeHBhbmRlZCA9ICF0aGlzLmlzRXhwYW5kZWQ7XG4gIH1cbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJjcHMtc2lkZWJhci1tZW51XCJcbiAgW3N0eWxlLmhlaWdodF09XCJoZWlnaHRcIlxuICBbbmdDbGFzc109XCJ7ICdjcHMtc2lkZWJhci1tZW51LWNvbGxhcHNlZCc6ICFpc0V4cGFuZGVkIH1cIj5cbiAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgaXRlbSBvZiBpdGVtc1wiPlxuICAgIDxhXG4gICAgICAqbmdJZj1cIml0ZW0udXJsXCJcbiAgICAgIGNsYXNzPVwiY3BzLXNpZGViYXItbWVudS1pdGVtXCJcbiAgICAgIFtyb3V0ZXJMaW5rXT1cIltpdGVtLnVybF1cIlxuICAgICAgcm91dGVyTGlua0FjdGl2ZT1cImFjdGl2ZVwiXG4gICAgICBbcm91dGVyTGlua0FjdGl2ZU9wdGlvbnNdPVwieyBleGFjdDogZXhhY3RSb3V0ZXMgfVwiXG4gICAgICBbbmdDbGFzc109XCJ7IGRpc2FibGVkOiBpdGVtLmRpc2FibGVkIH1cIj5cbiAgICAgIDxjcHMtaWNvbiBbaWNvbl09XCJpdGVtLmljb25cIiBzaXplPVwibm9ybWFsXCI+IDwvY3BzLWljb24+XG4gICAgICA8c3BhblxuICAgICAgICBjbGFzcz1cImNwcy1zaWRlYmFyLW1lbnUtaXRlbS1sYWJlbFwiXG4gICAgICAgIFtAb25FeHBhbmRdPVwiaXNFeHBhbmRlZCA/ICdleHBhbmRlZCcgOiAnY29sbGFwc2VkJ1wiPlxuICAgICAgICB7eyBpdGVtLnRpdGxlIH19XG4gICAgICA8L3NwYW4+XG4gICAgPC9hPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCIhaXRlbS51cmxcIj5cbiAgICAgIDxjcHMtbWVudVxuICAgICAgICAjcG9wdXBNZW51XG4gICAgICAgIFtpdGVtc109XCJpdGVtLml0ZW1zIHx8IFtdXCJcbiAgICAgICAgW2hlYWRlcl09XCJpdGVtLnRpdGxlXCJcbiAgICAgICAgc2hvd1RyYW5zaXRpb25PcHRpb25zPVwiMHNcIlxuICAgICAgICBoaWRlVHJhbnNpdGlvbk9wdGlvbnM9XCIwc1wiXG4gICAgICAgIFt3aXRoQXJyb3ddPVwiZmFsc2VcIj5cbiAgICAgIDwvY3BzLW1lbnU+XG4gICAgICA8ZGl2XG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVNZW51KCRldmVudCwgcG9wdXBNZW51KVwiXG4gICAgICAgIGNsYXNzPVwiY3BzLXNpZGViYXItbWVudS1pdGVtIG1lbnUtdHJpZ2dlclwiXG4gICAgICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgICBhY3RpdmU6IGlzQWN0aXZlKGl0ZW0pLFxuICAgICAgICAgICdtZW51LW9wZW4nOiBwb3B1cE1lbnUuaXNWaXNpYmxlKCksXG4gICAgICAgICAgZGlzYWJsZWQ6IGl0ZW0uZGlzYWJsZWRcbiAgICAgICAgfVwiPlxuICAgICAgICA8Y3BzLWljb24gW2ljb25dPVwiaXRlbS5pY29uXCIgc2l6ZT1cIm5vcm1hbFwiPiA8L2Nwcy1pY29uPlxuICAgICAgICA8c3BhblxuICAgICAgICAgIGNsYXNzPVwiY3BzLXNpZGViYXItbWVudS1pdGVtLWxhYmVsXCJcbiAgICAgICAgICBbQG9uRXhwYW5kXT1cImlzRXhwYW5kZWQgPyAnZXhwYW5kZWQnIDogJ2NvbGxhcHNlZCdcIj5cbiAgICAgICAgICB7eyBpdGVtLnRpdGxlIH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvbmctY29udGFpbmVyPlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPGRpdiBjbGFzcz1cImV4cGFuZC1hcmVhXCIgKGNsaWNrKT1cInRvZ2dsZVNpZGViYXIoKVwiPlxuICAgIDxjcHMtaWNvbiBpY29uPVwibWVudS1zaHJpbmtcIiBzaXplPVwiZmlsbFwiPiA8L2Nwcy1pY29uPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
|
package/fesm2015/cps-ui-kit.mjs
CHANGED
|
@@ -6424,6 +6424,7 @@ class CpsSidebarMenuComponent {
|
|
|
6424
6424
|
this._router = _router;
|
|
6425
6425
|
this.items = [];
|
|
6426
6426
|
this.isExpanded = true;
|
|
6427
|
+
this.exactRoutes = false;
|
|
6427
6428
|
this.height = '100%';
|
|
6428
6429
|
}
|
|
6429
6430
|
ngOnInit() {
|
|
@@ -6439,15 +6440,17 @@ class CpsSidebarMenuComponent {
|
|
|
6439
6440
|
isActive(item) {
|
|
6440
6441
|
if (!item.items)
|
|
6441
6442
|
return false;
|
|
6442
|
-
const urls = item.items.map((i) => i.url);
|
|
6443
|
-
|
|
6443
|
+
const urls = item.items.filter((i) => i.url).map((i) => i.url);
|
|
6444
|
+
if (this.exactRoutes)
|
|
6445
|
+
return urls.includes(this._router.url);
|
|
6446
|
+
return urls.some((url) => this._router.url.includes(url));
|
|
6444
6447
|
}
|
|
6445
6448
|
toggleSidebar() {
|
|
6446
6449
|
this.isExpanded = !this.isExpanded;
|
|
6447
6450
|
}
|
|
6448
6451
|
}
|
|
6449
6452
|
CpsSidebarMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsSidebarMenuComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
6450
|
-
CpsSidebarMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsSidebarMenuComponent, isStandalone: true, selector: "cps-sidebar-menu", inputs: { items: "items", isExpanded: "isExpanded", height: "height" }, viewQueries: [{ propertyName: "allMenus", predicate: ["popupMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact:
|
|
6453
|
+
CpsSidebarMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsSidebarMenuComponent, isStandalone: true, selector: "cps-sidebar-menu", inputs: { items: "items", isExpanded: "isExpanded", exactRoutes: "exactRoutes", height: "height" }, viewQueries: [{ propertyName: "allMenus", predicate: ["popupMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: exactRoutes }\"\n [ngClass]=\"{ disabled: item.disabled }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </a>\n <ng-container *ngIf=\"!item.url\">\n <cps-menu\n #popupMenu\n [items]=\"item.items || []\"\n [header]=\"item.title\"\n showTransitionOptions=\"0s\"\n hideTransitionOptions=\"0s\"\n [withArrow]=\"false\">\n </cps-menu>\n <div\n (click)=\"toggleMenu($event, popupMenu)\"\n class=\"cps-sidebar-menu-item menu-trigger\"\n [ngClass]=\"{\n active: isActive(item),\n 'menu-open': popupMenu.isVisible(),\n disabled: item.disabled\n }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </div>\n </ng-container>\n </ng-container>\n <div class=\"expand-area\" (click)=\"toggleSidebar()\">\n <cps-icon icon=\"menu-shrink\" size=\"fill\"> </cps-icon>\n </div>\n</div>\n", styles: [":host .cps-sidebar-menu{display:inline-flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 60px #0000001a;width:80px;transition-duration:.2s;overflow:hidden;position:relative}:host .cps-sidebar-menu .expand-area{cursor:pointer;display:flex;justify-content:center;height:24px;position:absolute;bottom:5%;transition-duration:.2s}:host .cps-sidebar-menu .expand-area:hover{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:80px;text-decoration:none;color:var(--cps-color-text-darkest);border-bottom:1px solid var(--cps-color-line-mid);-webkit-user-select:none;user-select:none}:host .cps-sidebar-menu .cps-sidebar-menu-item .cps-sidebar-menu-item-label{font-weight:600;font-size:11px;line-height:13px;width:80px;color:var(--cps-color-text-darkest);text-align:center}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active){background:#f8f4f5;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:active:not(.active){background:#f1eaec}:host .cps-sidebar-menu .cps-sidebar-menu-item.active{background:var(--cps-color-calm);color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.active .cps-sidebar-menu-item-label{color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active){background:#f1eaec;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-trigger{cursor:pointer}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled{cursor:default;pointer-events:none;color:var(--cps-color-text-light)}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled .cps-sidebar-menu-item-label{color:var(--cps-color-text-light)}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed{width:40px}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed .expand-area{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], animations: [
|
|
6451
6454
|
trigger('onExpand', [
|
|
6452
6455
|
state('collapsed', style({
|
|
6453
6456
|
marginTop: '0',
|
|
@@ -6482,11 +6485,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
6482
6485
|
animate('0.2s cubic-bezier(0.4, 0, 0.2, 1)')
|
|
6483
6486
|
])
|
|
6484
6487
|
])
|
|
6485
|
-
], template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{exact:
|
|
6488
|
+
], template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"height\"\n [ngClass]=\"{ 'cps-sidebar-menu-collapsed': !isExpanded }\">\n <ng-container *ngFor=\"let item of items\">\n <a\n *ngIf=\"item.url\"\n class=\"cps-sidebar-menu-item\"\n [routerLink]=\"[item.url]\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: exactRoutes }\"\n [ngClass]=\"{ disabled: item.disabled }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </a>\n <ng-container *ngIf=\"!item.url\">\n <cps-menu\n #popupMenu\n [items]=\"item.items || []\"\n [header]=\"item.title\"\n showTransitionOptions=\"0s\"\n hideTransitionOptions=\"0s\"\n [withArrow]=\"false\">\n </cps-menu>\n <div\n (click)=\"toggleMenu($event, popupMenu)\"\n class=\"cps-sidebar-menu-item menu-trigger\"\n [ngClass]=\"{\n active: isActive(item),\n 'menu-open': popupMenu.isVisible(),\n disabled: item.disabled\n }\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\"> </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </div>\n </ng-container>\n </ng-container>\n <div class=\"expand-area\" (click)=\"toggleSidebar()\">\n <cps-icon icon=\"menu-shrink\" size=\"fill\"> </cps-icon>\n </div>\n</div>\n", styles: [":host .cps-sidebar-menu{display:inline-flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 60px #0000001a;width:80px;transition-duration:.2s;overflow:hidden;position:relative}:host .cps-sidebar-menu .expand-area{cursor:pointer;display:flex;justify-content:center;height:24px;position:absolute;bottom:5%;transition-duration:.2s}:host .cps-sidebar-menu .expand-area:hover{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:80px;text-decoration:none;color:var(--cps-color-text-darkest);border-bottom:1px solid var(--cps-color-line-mid);-webkit-user-select:none;user-select:none}:host .cps-sidebar-menu .cps-sidebar-menu-item .cps-sidebar-menu-item-label{font-weight:600;font-size:11px;line-height:13px;width:80px;color:var(--cps-color-text-darkest);text-align:center}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active){background:#f8f4f5;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:active:not(.active){background:#f1eaec}:host .cps-sidebar-menu .cps-sidebar-menu-item.active{background:var(--cps-color-calm);color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.active .cps-sidebar-menu-item-label{color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active){background:#f1eaec;color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-trigger{cursor:pointer}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled{cursor:default;pointer-events:none;color:var(--cps-color-text-light)}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled .cps-sidebar-menu-item-label{color:var(--cps-color-text-light)}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed{width:40px}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed .expand-area{transform:rotate(180deg)}\n"] }]
|
|
6486
6489
|
}], ctorParameters: function () { return [{ type: i1$1.Router }]; }, propDecorators: { items: [{
|
|
6487
6490
|
type: Input
|
|
6488
6491
|
}], isExpanded: [{
|
|
6489
6492
|
type: Input
|
|
6493
|
+
}], exactRoutes: [{
|
|
6494
|
+
type: Input
|
|
6490
6495
|
}], height: [{
|
|
6491
6496
|
type: Input
|
|
6492
6497
|
}], allMenus: [{
|