Skip to content

Commit 55834bc

Browse files
xidedixxidedix
committed
refactor(library): typings, api surface
1 parent faf5893 commit 55834bc

31 files changed

+205
-143
lines changed

‎e2e/src/app.po.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export class AppDashboard {
1616
getBody() {
1717
return element(by.xpath('/html/body'));
1818
}
19-
getByCss(selector) {
19+
getByCss(selector: string) {
2020
return element.all(by.css(selector));
2121
}
2222

‎projects/coreui/angular/src/lib/aside/app-aside.component.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ import { asideMenuCssClasses } from '../shared';
99
})
1010
export class AppAsideComponent implements OnInit, OnDestroy {
1111
@Input() display: any;
12-
@Input() fixed: boolean;
13-
@Input() offCanvas: boolean;
12+
@Input() fixed?: boolean;
13+
@Input() offCanvas?: boolean;
1414

1515
private readonly fixedClass = 'aside-menu-fixed';
1616

@@ -31,13 +31,13 @@ export class AppAsideComponent implements OnInit, OnDestroy {
3131
this.renderer.removeClass(this.document.body, this.fixedClass);
3232
}
3333

34-
isFixed(fixed: boolean = this.fixed): void {
34+
isFixed(fixed = this.fixed): void {
3535
if (fixed) {
3636
this.renderer.addClass(this.document.body, this.fixedClass);
3737
}
3838
}
3939

40-
isOffCanvas(offCanvas: boolean = this.offCanvas): void {
40+
isOffCanvas(offCanvas = this.offCanvas): void {
4141
if (offCanvas) {
4242
this.renderer.addClass(this.document.body, 'aside-menu-off-canvas');
4343
}

‎projects/coreui/angular/src/lib/aside/app-aside.module.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,7 @@ import { AppAsideComponent } from './app-aside.component';
1010
LayoutModule
1111
],
1212
exports: [
13-
AppAsideComponent,
14-
LayoutModule
13+
AppAsideComponent
1514
],
1615
declarations: [
1716
AppAsideComponent

‎projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {DOCUMENT} from '@angular/common';
33

44
import {AppBreadcrumbService} from './app-breadcrumb.service';
55
import {Replace} from '../shared';
6+
import { Observable } from 'rxjs';
67

78
@Component({
89
selector: 'app-breadcrumb',
@@ -18,8 +19,8 @@ import {Replace} from '../shared';
1819
`
1920
})
2021
export class AppBreadcrumbComponent implements OnInit, OnDestroy {
21-
@Input() fixed: boolean;
22-
public breadcrumbs;
22+
@Input() fixed?: boolean;
23+
public breadcrumbs?: Observable<any>;
2324
private readonly fixedClass = 'breadcrumb-fixed';
2425

2526
constructor(
@@ -39,7 +40,7 @@ export class AppBreadcrumbComponent implements OnInit, OnDestroy {
3940
this.renderer.removeClass(this.document.body, this.fixedClass);
4041
}
4142

42-
isFixed(fixed: boolean = this.fixed): void {
43+
isFixed(fixed = this.fixed): void {
4344
if (fixed) {
4445
this.renderer.addClass(this.document.body, this.fixedClass);
4546
}

‎projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@ export class AppBreadcrumbService {
2020
this.breadcrumbs = this.breadcrumbSubject.asObservable();
2121

2222
this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event) => {
23-
const breadcrumbs = [];
24-
let currentRoute = this.route.root;
23+
const breadcrumbs: any[] = [];
24+
let currentRoute: ActivatedRoute | null = this.route.root;
2525
let url = '';
2626
do {
2727
const childrenRoutes = currentRoute.children;

‎projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,17 @@ import {Component, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2} from
22
import {DOCUMENT} from '@angular/common';
33

44
import {AppBreadcrumbService} from './app-breadcrumb.service';
5+
import { Observable } from 'rxjs';
56

67
@Component({
78
// tslint:disable-next-line:component-selector
89
selector: 'cui-breadcrumb',
910
templateUrl: './cui-breadcrumb.component.html'
1011
})
1112
export class CuiBreadcrumbComponent implements OnInit, OnDestroy {
12-
@Input() fixed: boolean;
13+
@Input() fixed?: boolean;
1314

14-
public breadcrumbs;
15+
public breadcrumbs?: Observable<any[]>;
1516
private readonly fixedClass = 'breadcrumb-fixed';
1617

1718
constructor(
@@ -29,7 +30,7 @@ export class CuiBreadcrumbComponent implements OnInit, OnDestroy {
2930
this.renderer.removeClass(this.document.body, this.fixedClass);
3031
}
3132

32-
isFixed(fixed: boolean = this.fixed): void {
33+
isFixed(fixed = this.fixed): void {
3334
if (fixed) {
3435
this.renderer.addClass(this.document.body, this.fixedClass);
3536
}

‎projects/coreui/angular/src/lib/footer/app-footer.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {DOCUMENT} from '@angular/common';
66
template: `<ng-content></ng-content>`
77
})
88
export class AppFooterComponent implements OnInit, OnDestroy {
9-
@Input() fixed: boolean;
9+
@Input() fixed?: boolean;
1010

1111
private readonly fixedClass = 'footer-fixed';
1212

@@ -25,7 +25,7 @@ export class AppFooterComponent implements OnInit, OnDestroy {
2525
this.renderer.removeClass(this.document.body, this.fixedClass);
2626
}
2727

28-
isFixed(fixed: boolean = this.fixed): void {
28+
isFixed(fixed = this.fixed): void {
2929
if (fixed) {
3030
this.renderer.addClass(this.document.body, this.fixedClass);
3131
}

‎projects/coreui/angular/src/lib/header/app-header.component.ts

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,27 +7,27 @@ import { DOCUMENT } from '@angular/common';
77
})
88
export class AppHeaderComponent implements OnInit, OnDestroy {
99

10-
@Input() fixed: boolean;
10+
@Input() fixed?: boolean;
1111

1212
@Input() navbarBrand: any;
1313
@Input() navbarBrandFull: any;
1414
@Input() navbarBrandMinimized: any;
1515
@Input() navbarBrandText: any = {icon: '🅲', text: '🅲 CoreUI'};
16-
@Input() navbarBrandHref: ''; // deprecated, use navbarBrandRouterLink instead
16+
@Input() navbarBrandHref = ''; // deprecated, use navbarBrandRouterLink instead
1717
@Input() navbarBrandRouterLink: any[] | string = '';
1818

19-
@Input() sidebarToggler: string | boolean;
20-
@Input() mobileSidebarToggler: boolean;
19+
@Input() sidebarToggler: string | boolean = 'lg';
20+
@Input() mobileSidebarToggler = true;
2121

22-
@Input() asideMenuToggler: string | boolean;
23-
@Input() mobileAsideMenuToggler: boolean;
22+
@Input() asideMenuToggler: string | boolean = 'lg';
23+
@Input() mobileAsideMenuToggler = true;
2424

2525
private readonly fixedClass = 'header-fixed';
2626

2727
@HostBinding('class.app-header') appHeaderClass = true;
2828
@HostBinding('class.navbar') navbarClass = true;
2929

30-
navbarBrandImg: boolean;
30+
navbarBrandImg!: boolean;
3131

3232
private readonly breakpoints = ['xl', 'lg', 'md', 'sm', 'xs'];
3333
sidebarTogglerClass = 'd-none d-md-block';
@@ -44,23 +44,23 @@ export class AppHeaderComponent implements OnInit, OnDestroy {
4444
this.isFixed(this.fixed);
4545
this.navbarBrandImg = Boolean(this.navbarBrand || this.navbarBrandFull || this.navbarBrandMinimized);
4646
this.navbarBrandRouterLink = this.navbarBrandRouterLink[0] ? this.navbarBrandRouterLink : this.navbarBrandHref;
47-
this.sidebarTogglerClass = this.setToggerBreakpointClass(this.sidebarToggler as string);
48-
this.sidebarTogglerMobileClass = this.setToggerMobileBreakpointClass(this.sidebarToggler as string);
49-
this.asideTogglerClass = this.setToggerBreakpointClass(this.asideMenuToggler as string);
50-
this.asideTogglerMobileClass = this.setToggerMobileBreakpointClass(this.asideMenuToggler as string);
47+
this.sidebarTogglerClass = this.setTogglerBreakpointClass(this.sidebarToggler as string);
48+
this.sidebarTogglerMobileClass = this.setTogglerMobileBreakpointClass(this.sidebarToggler as string);
49+
this.asideTogglerClass = this.setTogglerBreakpointClass(this.asideMenuToggler as string);
50+
this.asideTogglerMobileClass = this.setTogglerMobileBreakpointClass(this.asideMenuToggler as string);
5151
}
5252

5353
ngOnDestroy(): void {
5454
this.renderer.removeClass(this.document.body, this.fixedClass);
5555
}
5656

57-
isFixed(fixed: boolean = this.fixed): void {
57+
isFixed(fixed = this.fixed): void {
5858
if (fixed) {
5959
this.renderer.addClass(this.document.body, this.fixedClass);
6060
}
6161
}
6262

63-
setToggerBreakpointClass(breakpoint = 'md') {
63+
setTogglerBreakpointClass(breakpoint = 'md') {
6464
let togglerClass = 'd-none d-md-block';
6565
if (this.breakpoints.includes(breakpoint)) {
6666
const breakpointIndex = this.breakpoints.indexOf(breakpoint);
@@ -69,7 +69,7 @@ export class AppHeaderComponent implements OnInit, OnDestroy {
6969
return togglerClass;
7070
}
7171

72-
setToggerMobileBreakpointClass(breakpoint = 'lg') {
72+
setTogglerMobileBreakpointClass(breakpoint = 'lg') {
7373
let togglerClass = 'd-lg-none';
7474
if (this.breakpoints.includes(breakpoint)) {
7575
togglerClass = `d-${breakpoint}-none`;

‎projects/coreui/angular/src/lib/header/app-header.module.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ import { AppHeaderComponent } from './app-header.component';
1313
],
1414
exports: [
1515
AppHeaderComponent,
16-
LayoutModule
1716
],
1817
declarations: [
1918
AppHeaderComponent

‎projects/coreui/angular/src/lib/shared/index.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1 @@
1-
export * from './classes';
2-
export * from './layout/index';
3-
export * from './replace';
1+
export * from './public_api';

‎projects/coreui/angular/src/lib/shared/layout/layout.directive.ts

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ import { ClassToggler } from '../toggle-classes';
1212
providers: [ClassToggler]
1313
})
1414
export class SidebarToggleDirective implements OnInit {
15-
@Input('appSidebarToggler') breakpoint: string;
16-
public bp;
15+
@Input('appSidebarToggler') breakpoint: string | boolean = false;
16+
public bp!: string | boolean;
1717
constructor(private classToggler: ClassToggler) {}
1818
ngOnInit(): void {
1919
this.bp = this.breakpoint;
@@ -117,8 +117,8 @@ export class BrandMinimizeDirective {
117117
providers: [ClassToggler]
118118
})
119119
export class AsideToggleDirective implements OnInit {
120-
@Input('appAsideMenuToggler') breakpoint: string;
121-
public bp;
120+
@Input('appAsideMenuToggler') breakpoint: string | boolean = false;
121+
public bp!: string | boolean;
122122
constructor(private classToggler: ClassToggler) {}
123123
ngOnInit(): void {
124124
this.bp = this.breakpoint;
@@ -135,7 +135,7 @@ export class AsideToggleDirective implements OnInit {
135135
selector: '[appHtmlAttr]'
136136
})
137137
export class HtmlAttributesDirective implements OnInit {
138-
@Input() appHtmlAttr: {[key: string]: string };
138+
@Input() appHtmlAttr?: {[key: string]: string } = {};
139139

140140
constructor(
141141
private renderer: Renderer2,
@@ -155,20 +155,22 @@ export class HtmlAttributesDirective implements OnInit {
155155
}
156156
}
157157

158-
private setStyle(styles) {
158+
private setStyle(styles: any) {
159159
for (const style in styles) {
160-
this.renderer.setStyle(this.el.nativeElement, style, styles[style] );
160+
if (style) {
161+
this.renderer.setStyle(this.el.nativeElement, style, styles[style]);
162+
}
161163
}
162164
}
163165

164-
private addClass(classes) {
166+
private addClass(classes: string | any[]) {
165167
const classArray = (Array.isArray(classes) ? classes : classes.split(' '));
166168
classArray.filter((element) => element.length > 0).forEach(element => {
167169
this.renderer.addClass(this.el.nativeElement, element );
168170
});
169171
}
170172

171-
private setAttrib(key, value) {
173+
private setAttrib(key: string, value: string | null) {
172174
value !== null ?
173175
this.renderer.setAttribute(this.el.nativeElement, key, value ) :
174176
this.renderer.removeAttribute(this.el.nativeElement, key);

‎projects/coreui/angular/src/lib/shared/public_api.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
export {
2+
AsideToggleDirective,
3+
BrandMinimizeDirective,
4+
MobileSidebarToggleDirective,
5+
SidebarMinimizeDirective,
6+
SidebarToggleDirective,
7+
SidebarOffCanvasCloseDirective,
8+
HtmlAttributesDirective
9+
} from './layout/layout.directive';
10+
export { LayoutModule } from './layout/layout.module';
11+
export * from './classes';
12+
export * from './replace';

‎projects/coreui/angular/src/lib/shared/replace.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
export function Replace(el: any): any {
22
const nativeElement: HTMLElement = el.nativeElement;
3+
// @ts-ignore
34
const parentElement: HTMLElement = nativeElement.parentElement;
45
// move all children out of the element
56
while (nativeElement.firstChild) {

‎projects/coreui/angular/src/lib/shared/toggle-classes.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import {Inject, Injectable, Renderer2} from '@angular/core';
22
import {DOCUMENT} from '@angular/common';
33

4-
const RemoveClasses = (NewClassNames) => {
4+
const RemoveClasses = (NewClassNames: string[]) => {
55
const MatchClasses = NewClassNames.map((Class) => document.body.classList.contains(Class));
66
return MatchClasses.indexOf(true) !== -1;
77
};
88

9-
export const ToggleClasses = (Toggle, ClassNames) => {
9+
export const ToggleClasses = (Toggle: string, ClassNames: string[]) => {
1010
const Level = ClassNames.indexOf(Toggle);
1111
const NewClassNames = ClassNames.slice(0, Level + 1);
1212

@@ -25,12 +25,12 @@ export class ClassToggler {
2525
private renderer: Renderer2,
2626
) {}
2727

28-
removeClasses(NewClassNames) {
28+
removeClasses(NewClassNames: string[]) {
2929
const MatchClasses = NewClassNames.map((Class) => this.document.body.classList.contains(Class));
3030
return MatchClasses.indexOf(true) !== -1;
3131
}
3232

33-
toggleClasses(Toggle, ClassNames) {
33+
toggleClasses(Toggle: string, ClassNames: string[]) {
3434
const Level = ClassNames.indexOf(Toggle);
3535
const NewClassNames = ClassNames.slice(0, Level + 1);
3636

‎projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ describe('SidebarNavHelper', () => {
2929
expect(service.itemType({divider: true})).toEqual('divider');
3030
expect(service.itemType({title: true})).toEqual('title');
3131
expect(service.itemType({children: []})).toEqual('dropdown');
32-
expect(service.itemType({label: true})).toEqual('label');
32+
expect(service.itemType({label: { variant: 'info'}})).toEqual('label');
3333
expect(service.itemType({})).toEqual('empty');
3434
expect(service.itemType({
3535
name: 'Disabled',
@@ -46,7 +46,7 @@ describe('SidebarNavHelper', () => {
4646
});
4747

4848
it('item hasBadge', () => {
49-
expect(service.hasBadge({badge: {}})).toBeTruthy();
49+
expect(service.hasBadge({badge: { text: 'badge', variant: 'info'}})).toBeTruthy();
5050
expect(service.hasBadge({})).toBeFalsy();
5151
});
5252
it('item hasIcon', () => {

‎projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { Injectable } from '@angular/core';
2+
import { RouterTestingModule } from '@angular/router/testing';
23

34
import { INavData } from './app-sidebar-nav';
5+
import { Router } from '@angular/router';
46

57
@Injectable()
68
export abstract class SidebarNavService {
@@ -13,7 +15,7 @@ export abstract class SidebarNavService {
1315
@Injectable()
1416
export class SidebarNavHelper {
1517

16-
public itemType(item) {
18+
public itemType(item: INavData) {
1719
if (item.divider) {
1820
return 'divider';
1921
} else if (item.title) {
@@ -24,24 +26,24 @@ export class SidebarNavHelper {
2426
return 'label';
2527
} else if (!Object.keys(item).length) {
2628
return 'empty';
27-
} else {
28-
return 'link';
2929
}
30+
return 'link';
3031
}
3132

32-
public isActive(router, item) {
33+
public isActive(router: any, item: INavData) {
3334
return router.isActive(item.url, false);
3435
}
3536

36-
public hasBadge = (item) => Boolean(item.badge);
37-
public hasIcon = (item) => Boolean(item.icon);
37+
public hasBadge = (item: INavData) => Boolean(item.badge);
38+
public hasIcon = (item: INavData) => Boolean(item.icon);
3839

39-
public getIconClass(item) {
40+
public getIconClass(item: INavData) {
4041
const classes = {
4142
'nav-icon': true
4243
};
4344
if (this.hasIcon(item)) {
4445
const icon = item.icon;
46+
// @ts-ignore
4547
classes[icon] = this.hasIcon(item);
4648
}
4749
return classes;

0 commit comments

Comments
 (0)