@kushki/ng-suka
Version:
<p align="center"> <h1 align="center">Suka Components Angular</h1> <p align="center"> An Angular implementation of the Suka Design System </p> </p>
178 lines • 11.5 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, Optional, Output, EventEmitter } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { Router, NavigationEnd } from '@angular/router';
export class NavigationItem {
/**
* @param {?} domSanitizer
* @param {?} router
*/
constructor(domSanitizer, router) {
this.domSanitizer = domSanitizer;
this.router = router;
/**
* Toggles the active (current page) state for the link.
*/
this.active = false;
/**
* Emits the navigation status promise when the link is activated
*/
this.navigation = new EventEmitter();
this.isSubMenu = false;
this._href = 'javascript:void(0)';
if (router) {
this.subscription = router.events.subscribe((/**
* @param {?} s
* @return {?}
*/
(s) => {
if (s instanceof NavigationEnd) {
this.update();
}
}));
}
}
/**
* Link for the item. NOTE: *do not* pass unsafe or untrusted values, this has the potential to open you up to XSS attacks
* @param {?} v
* @return {?}
*/
set href(v) {
this._href = v;
}
/**
* @return {?}
*/
get href() {
return (/** @type {?} */ (this.domSanitizer.bypassSecurityTrustUrl(this._href)));
}
/**
* @param {?} event
* @return {?}
*/
navigate(event) {
if (this.router && this.route) {
event.preventDefault();
/** @type {?} */
const status = this.router.navigate(this.route, this.routeExtras);
this.navigation.emit(status);
}
}
/**
* @return {?}
*/
ngOnDestroy() {
if (this.subscription) {
this.subscription.unsubscribe();
}
}
/**
* @private
* @return {?}
*/
isActive() {
/** @type {?} */
const itemUrl = this.router.createUrlTree(this.route, this.routeExtras);
return this.router.isActive(itemUrl, true);
}
/**
* @private
* @return {?}
*/
update() {
if (this.isActive()) {
this.active = true;
}
else {
this.active = false;
}
}
}
NavigationItem.decorators = [
{ type: Component, args: [{
selector: 'suka-navigation-item',
template: `
<li [ngClass]="{
'navigation__item': !isSubMenu,
'navigation__menu-item': isSubMenu
}"
[attr.role]="(isSubMenu ? 'none' : null)">
<a
class="navigation__link"
[href]="href"
[attr.role]="(isSubMenu ? 'menuitem' : null)"
[attr.aria-current]="(active ? 'page' : null)"
(click)="navigate($event)">
<div *ngIf="!isSubMenu" class="navigation__icon">
<ng-content select="suka-icon"></ng-content>
</div>
<span class="navigation__link-text">
<ng-content></ng-content>
</span>
</a>
</li>
`
}] }
];
/** @nocollapse */
NavigationItem.ctorParameters = () => [
{ type: DomSanitizer },
{ type: Router, decorators: [{ type: Optional }] }
];
NavigationItem.propDecorators = {
href: [{ type: Input }],
active: [{ type: Input }],
route: [{ type: Input }],
routeExtras: [{ type: Input }],
navigation: [{ type: Output }]
};
if (false) {
/**
* @type {?}
* @private
*/
NavigationItem.prototype.subscription;
/**
* Toggles the active (current page) state for the link.
* @type {?}
*/
NavigationItem.prototype.active;
/**
* Array of commands to send to the router when the link is activated
* See: https://angular.io/api/router/Router#navigate
* @type {?}
*/
NavigationItem.prototype.route;
/**
* Router options. Used in conjunction with `route`
* See: https://angular.io/api/router/Router#navigate
* @type {?}
*/
NavigationItem.prototype.routeExtras;
/**
* Emits the navigation status promise when the link is activated
* @type {?}
*/
NavigationItem.prototype.navigation;
/** @type {?} */
NavigationItem.prototype.isSubMenu;
/**
* @type {?}
* @protected
*/
NavigationItem.prototype._href;
/**
* @type {?}
* @protected
*/
NavigationItem.prototype.domSanitizer;
/**
* @type {?}
* @protected
*/
NavigationItem.prototype.router;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BrdXNoa2kvbmctc3VrYS8iLCJzb3VyY2VzIjpbImxpYi9uYXZpZ2F0aW9uL25hdmlnYXRpb24taXRlbS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUNMLFFBQVEsRUFDUixNQUFNLEVBQ04sWUFBWSxFQUViLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsTUFBTSxFQUFFLGFBQWEsRUFBZSxNQUFNLGlCQUFpQixDQUFDO0FBMkJyRSxNQUFNLE9BQU8sY0FBYzs7Ozs7SUF1Q3pCLFlBQXNCLFlBQTBCLEVBQXdCLE1BQWM7UUFBaEUsaUJBQVksR0FBWixZQUFZLENBQWM7UUFBd0IsV0FBTSxHQUFOLE1BQU0sQ0FBUTs7OztRQXZCN0UsV0FBTSxHQUFHLEtBQUssQ0FBQzs7OztRQWlCZCxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQW9CLENBQUM7UUFFNUQsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUVSLFVBQUssR0FBRyxvQkFBb0IsQ0FBQztRQUdyQyxJQUFJLE1BQU0sRUFBRTtZQUNWLElBQUksQ0FBQyxZQUFZLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxTQUFTOzs7O1lBQUMsQ0FBQyxDQUFjLEVBQUUsRUFBRTtnQkFDN0QsSUFBSSxDQUFDLFlBQVksYUFBYSxFQUFFO29CQUM5QixJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7aUJBQ2Y7WUFDSCxDQUFDLEVBQUMsQ0FBQztTQUNKO0lBQ0gsQ0FBQzs7Ozs7O0lBMUNELElBQWEsSUFBSSxDQUFDLENBQVM7UUFDekIsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLENBQUM7SUFDakIsQ0FBQzs7OztJQUVELElBQUksSUFBSTtRQUNOLE9BQU8sbUJBQUEsSUFBSSxDQUFDLFlBQVksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEVBQVUsQ0FBQztJQUN4RSxDQUFDOzs7OztJQXNDRCxRQUFRLENBQUMsS0FBSztRQUNaLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQzdCLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQzs7a0JBQ2pCLE1BQU0sR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQyxXQUFXLENBQUM7WUFDakUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7U0FDOUI7SUFDSCxDQUFDOzs7O0lBRUQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtZQUNyQixJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ2pDO0lBQ0gsQ0FBQzs7Ozs7SUFFTyxRQUFROztjQUNSLE9BQU8sR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQyxXQUFXLENBQUM7UUFDdkUsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDN0MsQ0FBQzs7Ozs7SUFFTyxNQUFNO1FBQ1osSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUU7WUFDbkIsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUM7U0FDcEI7YUFBTTtZQUNMLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1NBQ3JCO0lBQ0gsQ0FBQzs7O1lBbEdGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsc0JBQXNCO2dCQUNoQyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBb0JUO2FBQ0Y7Ozs7WUEzQlEsWUFBWTtZQUNaLE1BQU0sdUJBa0VzQyxRQUFROzs7bUJBbEMxRCxLQUFLO3FCQVdMLEtBQUs7b0JBTUwsS0FBSzswQkFNTCxLQUFLO3lCQUtMLE1BQU07Ozs7Ozs7SUFoQ1Asc0NBQW1DOzs7OztJQWVuQyxnQ0FBd0I7Ozs7OztJQU14QiwrQkFBc0I7Ozs7OztJQU10QixxQ0FBMEI7Ozs7O0lBSzFCLG9DQUE0RDs7SUFFNUQsbUNBQWtCOzs7OztJQUVsQiwrQkFBdUM7Ozs7O0lBRTNCLHNDQUFvQzs7Ozs7SUFBRSxnQ0FBb0MiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIElucHV0LFxuICBPcHRpb25hbCxcbiAgT3V0cHV0LFxuICBFdmVudEVtaXR0ZXIsXG4gIE9uRGVzdHJveVxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERvbVNhbml0aXplciB9IGZyb20gJ0Bhbmd1bGFyL3BsYXRmb3JtLWJyb3dzZXInO1xuaW1wb3J0IHsgUm91dGVyLCBOYXZpZ2F0aW9uRW5kLCBSb3V0ZXJFdmVudCB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3VrYS1uYXZpZ2F0aW9uLWl0ZW0nLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxsaSBbbmdDbGFzc109XCJ7XG4gICAgICAnbmF2aWdhdGlvbl9faXRlbSc6ICFpc1N1Yk1lbnUsXG4gICAgICAnbmF2aWdhdGlvbl9fbWVudS1pdGVtJzogaXNTdWJNZW51XG4gICAgfVwiXG4gICAgW2F0dHIucm9sZV09XCIoaXNTdWJNZW51ID8gJ25vbmUnIDogbnVsbClcIj5cbiAgICAgIDxhXG4gICAgICAgIGNsYXNzPVwibmF2aWdhdGlvbl9fbGlua1wiXG4gICAgICAgIFtocmVmXT1cImhyZWZcIlxuICAgICAgICBbYXR0ci5yb2xlXT1cIihpc1N1Yk1lbnUgPyAnbWVudWl0ZW0nIDogbnVsbClcIlxuICAgICAgICBbYXR0ci5hcmlhLWN1cnJlbnRdPVwiKGFjdGl2ZSA/ICdwYWdlJyA6IG51bGwpXCJcbiAgICAgICAgKGNsaWNrKT1cIm5hdmlnYXRlKCRldmVudClcIj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIiFpc1N1Yk1lbnVcIiBjbGFzcz1cIm5hdmlnYXRpb25fX2ljb25cIj5cbiAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJzdWthLWljb25cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8c3BhbiBjbGFzcz1cIm5hdmlnYXRpb25fX2xpbmstdGV4dFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9hPlxuICAgIDwvbGk+XG4gIGBcbn0pXG5leHBvcnQgY2xhc3MgTmF2aWdhdGlvbkl0ZW0gaW1wbGVtZW50cyBPbkRlc3Ryb3kge1xuICBwcml2YXRlIHN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuICAvKipcbiAgICogTGluayBmb3IgdGhlIGl0ZW0uIE5PVEU6ICpkbyBub3QqIHBhc3MgdW5zYWZlIG9yIHVudHJ1c3RlZCB2YWx1ZXMsIHRoaXMgaGFzIHRoZSBwb3RlbnRpYWwgdG8gb3BlbiB5b3UgdXAgdG8gWFNTIGF0dGFja3NcbiAgICovXG4gIEBJbnB1dCgpIHNldCBocmVmKHY6IHN0cmluZykge1xuICAgIHRoaXMuX2hyZWYgPSB2O1xuICB9XG5cbiAgZ2V0IGhyZWYoKSB7XG4gICAgcmV0dXJuIHRoaXMuZG9tU2FuaXRpemVyLmJ5cGFzc1NlY3VyaXR5VHJ1c3RVcmwodGhpcy5faHJlZikgYXMgc3RyaW5nO1xuICB9XG5cbiAgLyoqXG4gICAqIFRvZ2dsZXMgdGhlIGFjdGl2ZSAoY3VycmVudCBwYWdlKSBzdGF0ZSBmb3IgdGhlIGxpbmsuXG4gICAqL1xuICBASW5wdXQoKSBhY3RpdmUgPSBmYWxzZTtcblxuICAvKipcbiAgICogQXJyYXkgb2YgY29tbWFuZHMgdG8gc2VuZCB0byB0aGUgcm91dGVyIHdoZW4gdGhlIGxpbmsgaXMgYWN0aXZhdGVkXG4gICAqIFNlZTogaHR0cHM6Ly9hbmd1bGFyLmlvL2FwaS9yb3V0ZXIvUm91dGVyI25hdmlnYXRlXG4gICAqL1xuICBASW5wdXQoKSByb3V0ZTogYW55W107XG5cbiAgLyoqXG4gICAqIFJvdXRlciBvcHRpb25zLiBVc2VkIGluIGNvbmp1bmN0aW9uIHdpdGggYHJvdXRlYFxuICAgKiBTZWU6IGh0dHBzOi8vYW5ndWxhci5pby9hcGkvcm91dGVyL1JvdXRlciNuYXZpZ2F0ZVxuICAgKi9cbiAgQElucHV0KCkgcm91dGVFeHRyYXM6IGFueTtcblxuICAvKipcbiAgICogRW1pdHMgdGhlIG5hdmlnYXRpb24gc3RhdHVzIHByb21pc2Ugd2hlbiB0aGUgbGluayBpcyBhY3RpdmF0ZWRcbiAgICovXG4gIEBPdXRwdXQoKSBuYXZpZ2F0aW9uID0gbmV3IEV2ZW50RW1pdHRlcjxQcm9taXNlPGJvb2xlYW4+PigpO1xuXG4gIGlzU3ViTWVudSA9IGZhbHNlO1xuXG4gIHByb3RlY3RlZCBfaHJlZiA9ICdqYXZhc2NyaXB0OnZvaWQoMCknO1xuXG4gIGNvbnN0cnVjdG9yKHByb3RlY3RlZCBkb21TYW5pdGl6ZXI6IERvbVNhbml0aXplciwgQE9wdGlvbmFsKCkgcHJvdGVjdGVkIHJvdXRlcjogUm91dGVyKSB7XG4gICAgaWYgKHJvdXRlcikge1xuICAgICAgdGhpcy5zdWJzY3JpcHRpb24gPSByb3V0ZXIuZXZlbnRzLnN1YnNjcmliZSgoczogUm91dGVyRXZlbnQpID0+IHtcbiAgICAgICAgaWYgKHMgaW5zdGFuY2VvZiBOYXZpZ2F0aW9uRW5kKSB7XG4gICAgICAgICAgdGhpcy51cGRhdGUoKTtcbiAgICAgICAgfVxuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgbmF2aWdhdGUoZXZlbnQpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5yb3V0ZXIgJiYgdGhpcy5yb3V0ZSkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIGNvbnN0IHN0YXR1cyA9IHRoaXMucm91dGVyLm5hdmlnYXRlKHRoaXMucm91dGUsIHRoaXMucm91dGVFeHRyYXMpO1xuICAgICAgdGhpcy5uYXZpZ2F0aW9uLmVtaXQoc3RhdHVzKTtcbiAgICB9XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5zdWJzY3JpcHRpb24pIHtcbiAgICAgIHRoaXMuc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBpc0FjdGl2ZSgpOiBib29sZWFuIHtcbiAgICBjb25zdCBpdGVtVXJsID0gdGhpcy5yb3V0ZXIuY3JlYXRlVXJsVHJlZSh0aGlzLnJvdXRlLCB0aGlzLnJvdXRlRXh0cmFzKTtcbiAgICByZXR1cm4gdGhpcy5yb3V0ZXIuaXNBY3RpdmUoaXRlbVVybCwgdHJ1ZSk7XG4gIH1cblxuICBwcml2YXRlIHVwZGF0ZSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5pc0FjdGl2ZSgpKSB7XG4gICAgICB0aGlzLmFjdGl2ZSA9IHRydWU7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuYWN0aXZlID0gZmFsc2U7XG4gICAgfVxuICB9XG59XG4iXX0=