@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>
182 lines • 12.8 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';
var NavigationItem = /** @class */ (function () {
function NavigationItem(domSanitizer, router) {
var _this = this;
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.route) {
this.subscription = router.events.subscribe((/**
* @param {?} s
* @return {?}
*/
function (s) {
if (s instanceof NavigationEnd) {
_this.update();
}
}));
}
}
Object.defineProperty(NavigationItem.prototype, "href", {
get: /**
* @return {?}
*/
function () {
return (/** @type {?} */ (this.domSanitizer.bypassSecurityTrustUrl(this._href)));
},
/**
* Link for the item. NOTE: *do not* pass unsafe or untrusted values, this has the potential to open you up to XSS attacks
*/
set: /**
* 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 {?}
*/
function (v) {
this._href = v;
},
enumerable: true,
configurable: true
});
/**
* @param {?} event
* @return {?}
*/
NavigationItem.prototype.navigate = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (this.router && this.route) {
event.preventDefault();
/** @type {?} */
var status_1 = this.router.navigate(this.route, this.routeExtras);
this.navigation.emit(status_1);
}
};
/**
* @return {?}
*/
NavigationItem.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
if (this.subscription) {
this.subscription.unsubscribe();
}
};
/**
* @private
* @return {?}
*/
NavigationItem.prototype.isActive = /**
* @private
* @return {?}
*/
function () {
if (this.router && this.route) {
/** @type {?} */
var itemUrl = this.router.createUrlTree(this.route, this.routeExtras);
return this.router.isActive(itemUrl, true);
}
return false;
};
/**
* @private
* @return {?}
*/
NavigationItem.prototype.update = /**
* @private
* @return {?}
*/
function () {
if (this.isActive()) {
this.active = true;
}
else {
this.active = false;
}
};
NavigationItem.decorators = [
{ type: Component, args: [{
selector: 'suka-navigation-item',
template: "\n <li [ngClass]=\"{\n 'navigation__item': !isSubMenu,\n 'navigation__menu-item': isSubMenu\n }\"\n [attr.role]=\"(isSubMenu ? 'none' : null)\">\n <a\n class=\"navigation__link\"\n [href]=\"href\"\n [attr.role]=\"(isSubMenu ? 'menuitem' : null)\"\n [attr.aria-current]=\"(active ? 'page' : null)\"\n (click)=\"navigate($event)\">\n <div *ngIf=\"!isSubMenu\" class=\"navigation__icon\">\n <ng-content select=\"suka-icon\"></ng-content>\n </div>\n <span class=\"navigation__link-text\">\n <ng-content></ng-content>\n </span>\n </a>\n </li>\n "
}] }
];
/** @nocollapse */
NavigationItem.ctorParameters = function () { return [
{ type: DomSanitizer },
{ type: Router, decorators: [{ type: Optional }] }
]; };
NavigationItem.propDecorators = {
href: [{ type: Input }],
active: [{ type: Input }],
route: [{ type: Input }],
routeExtras: [{ type: Input }],
navigation: [{ type: Output }]
};
return NavigationItem;
}());
export { NavigationItem };
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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BrdXNoa2kvbmctc3VrYS8iLCJzb3VyY2VzIjpbImxpYi9uYXZpZ2F0aW9uL25hdmlnYXRpb24taXRlbS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUNMLFFBQVEsRUFDUixNQUFNLEVBQ04sWUFBWSxFQUViLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsTUFBTSxFQUFFLGFBQWEsRUFBZSxNQUFNLGlCQUFpQixDQUFDO0FBR3JFO0lBK0RFLHdCQUNZLFlBQTBCLEVBQ2QsTUFBYztRQUZ0QyxpQkFXQztRQVZXLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQ2QsV0FBTSxHQUFOLE1BQU0sQ0FBUTs7OztRQXpCN0IsV0FBTSxHQUFHLEtBQUssQ0FBQzs7OztRQWlCZCxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQW9CLENBQUM7UUFFNUQsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUVSLFVBQUssR0FBRyxvQkFBb0IsQ0FBQztRQU1yQyxJQUFJLE1BQU0sSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ3hCLElBQUksQ0FBQyxZQUFZLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxTQUFTOzs7O1lBQUMsVUFBQyxDQUFjO2dCQUN6RCxJQUFJLENBQUMsWUFBWSxhQUFhLEVBQUU7b0JBQzlCLEtBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztpQkFDZjtZQUNILENBQUMsRUFBQyxDQUFDO1NBQ0o7SUFDSCxDQUFDO0lBN0NELHNCQUFhLGdDQUFJOzs7O1FBSWpCO1lBQ0UsT0FBTyxtQkFBQSxJQUFJLENBQUMsWUFBWSxDQUFDLHNCQUFzQixDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsRUFBVSxDQUFDO1FBQ3hFLENBQUM7UUFURDs7V0FFRzs7Ozs7O1FBQ0gsVUFBa0IsQ0FBUztZQUN6QixJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsQ0FBQztRQUNqQixDQUFDOzs7T0FBQTs7Ozs7SUE2Q0QsaUNBQVE7Ozs7SUFBUixVQUFTLEtBQUs7UUFDWixJQUFJLElBQUksQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUM3QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7O2dCQUNqQixRQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDO1lBQ2pFLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLFFBQU0sQ0FBQyxDQUFDO1NBQzlCO0lBQ0gsQ0FBQzs7OztJQUVELG9DQUFXOzs7SUFBWDtRQUNFLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtZQUNyQixJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ2pDO0lBQ0gsQ0FBQzs7Ozs7SUFFTyxpQ0FBUTs7OztJQUFoQjtRQUNFLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFOztnQkFDdkIsT0FBTyxHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsSUFBSSxDQUFDLFdBQVcsQ0FBQztZQUN2RSxPQUFPLElBQUksQ0FBQyxNQUFNLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsQ0FBQztTQUM1QztRQUVELE9BQU8sS0FBSyxDQUFDO0lBQ2YsQ0FBQzs7Ozs7SUFFTywrQkFBTTs7OztJQUFkO1FBQ0UsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUU7WUFDbkIsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUM7U0FDcEI7YUFBTTtZQUNMLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1NBQ3JCO0lBQ0gsQ0FBQzs7Z0JBekdGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxRQUFRLEVBQUUsZ3BCQW9CVDtpQkFDRjs7OztnQkEzQlEsWUFBWTtnQkFDWixNQUFNLHVCQW9FVixRQUFROzs7dUJBcENWLEtBQUs7eUJBV0wsS0FBSzt3QkFNTCxLQUFLOzhCQU1MLEtBQUs7NkJBS0wsTUFBTTs7SUFpRFQscUJBQUM7Q0FBQSxBQTFHRCxJQTBHQztTQWxGWSxjQUFjOzs7Ozs7SUFDekIsc0NBQW1DOzs7OztJQWVuQyxnQ0FBd0I7Ozs7OztJQU14QiwrQkFBc0I7Ozs7OztJQU10QixxQ0FBMEI7Ozs7O0lBSzFCLG9DQUE0RDs7SUFFNUQsbUNBQWtCOzs7OztJQUVsQiwrQkFBdUM7Ozs7O0lBR3JDLHNDQUFvQzs7Ozs7SUFDcEMsZ0NBQW9DIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgT3B0aW9uYWwsXG4gIE91dHB1dCxcbiAgRXZlbnRFbWl0dGVyLFxuICBPbkRlc3Ryb3lcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBEb21TYW5pdGl6ZXIgfSBmcm9tICdAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyJztcbmltcG9ydCB7IFJvdXRlciwgTmF2aWdhdGlvbkVuZCwgUm91dGVyRXZlbnQgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuaW1wb3J0IHsgU3Vic2NyaXB0aW9uIH0gZnJvbSAncnhqcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1a2EtbmF2aWdhdGlvbi1pdGVtJyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8bGkgW25nQ2xhc3NdPVwie1xuICAgICAgJ25hdmlnYXRpb25fX2l0ZW0nOiAhaXNTdWJNZW51LFxuICAgICAgJ25hdmlnYXRpb25fX21lbnUtaXRlbSc6IGlzU3ViTWVudVxuICAgIH1cIlxuICAgIFthdHRyLnJvbGVdPVwiKGlzU3ViTWVudSA/ICdub25lJyA6IG51bGwpXCI+XG4gICAgICA8YVxuICAgICAgICBjbGFzcz1cIm5hdmlnYXRpb25fX2xpbmtcIlxuICAgICAgICBbaHJlZl09XCJocmVmXCJcbiAgICAgICAgW2F0dHIucm9sZV09XCIoaXNTdWJNZW51ID8gJ21lbnVpdGVtJyA6IG51bGwpXCJcbiAgICAgICAgW2F0dHIuYXJpYS1jdXJyZW50XT1cIihhY3RpdmUgPyAncGFnZScgOiBudWxsKVwiXG4gICAgICAgIChjbGljayk9XCJuYXZpZ2F0ZSgkZXZlbnQpXCI+XG4gICAgICAgIDxkaXYgKm5nSWY9XCIhaXNTdWJNZW51XCIgY2xhc3M9XCJuYXZpZ2F0aW9uX19pY29uXCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwic3VrYS1pY29uXCI+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJuYXZpZ2F0aW9uX19saW5rLXRleHRcIj5cbiAgICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvYT5cbiAgICA8L2xpPlxuICBgXG59KVxuZXhwb3J0IGNsYXNzIE5hdmlnYXRpb25JdGVtIGltcGxlbWVudHMgT25EZXN0cm95IHtcbiAgcHJpdmF0ZSBzdWJzY3JpcHRpb246IFN1YnNjcmlwdGlvbjtcbiAgLyoqXG4gICAqIExpbmsgZm9yIHRoZSBpdGVtLiBOT1RFOiAqZG8gbm90KiBwYXNzIHVuc2FmZSBvciB1bnRydXN0ZWQgdmFsdWVzLCB0aGlzIGhhcyB0aGUgcG90ZW50aWFsIHRvIG9wZW4geW91IHVwIHRvIFhTUyBhdHRhY2tzXG4gICAqL1xuICBASW5wdXQoKSBzZXQgaHJlZih2OiBzdHJpbmcpIHtcbiAgICB0aGlzLl9ocmVmID0gdjtcbiAgfVxuXG4gIGdldCBocmVmKCkge1xuICAgIHJldHVybiB0aGlzLmRvbVNhbml0aXplci5ieXBhc3NTZWN1cml0eVRydXN0VXJsKHRoaXMuX2hyZWYpIGFzIHN0cmluZztcbiAgfVxuXG4gIC8qKlxuICAgKiBUb2dnbGVzIHRoZSBhY3RpdmUgKGN1cnJlbnQgcGFnZSkgc3RhdGUgZm9yIHRoZSBsaW5rLlxuICAgKi9cbiAgQElucHV0KCkgYWN0aXZlID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIEFycmF5IG9mIGNvbW1hbmRzIHRvIHNlbmQgdG8gdGhlIHJvdXRlciB3aGVuIHRoZSBsaW5rIGlzIGFjdGl2YXRlZFxuICAgKiBTZWU6IGh0dHBzOi8vYW5ndWxhci5pby9hcGkvcm91dGVyL1JvdXRlciNuYXZpZ2F0ZVxuICAgKi9cbiAgQElucHV0KCkgcm91dGU6IGFueVtdO1xuXG4gIC8qKlxuICAgKiBSb3V0ZXIgb3B0aW9ucy4gVXNlZCBpbiBjb25qdW5jdGlvbiB3aXRoIGByb3V0ZWBcbiAgICogU2VlOiBodHRwczovL2FuZ3VsYXIuaW8vYXBpL3JvdXRlci9Sb3V0ZXIjbmF2aWdhdGVcbiAgICovXG4gIEBJbnB1dCgpIHJvdXRlRXh0cmFzOiBhbnk7XG5cbiAgLyoqXG4gICAqIEVtaXRzIHRoZSBuYXZpZ2F0aW9uIHN0YXR1cyBwcm9taXNlIHdoZW4gdGhlIGxpbmsgaXMgYWN0aXZhdGVkXG4gICAqL1xuICBAT3V0cHV0KCkgbmF2aWdhdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8UHJvbWlzZTxib29sZWFuPj4oKTtcblxuICBpc1N1Yk1lbnUgPSBmYWxzZTtcblxuICBwcm90ZWN0ZWQgX2hyZWYgPSAnamF2YXNjcmlwdDp2b2lkKDApJztcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcm90ZWN0ZWQgZG9tU2FuaXRpemVyOiBEb21TYW5pdGl6ZXIsXG4gICAgQE9wdGlvbmFsKCkgcHJvdGVjdGVkIHJvdXRlcjogUm91dGVyXG4gICkge1xuICAgIGlmIChyb3V0ZXIgJiYgdGhpcy5yb3V0ZSkge1xuICAgICAgdGhpcy5zdWJzY3JpcHRpb24gPSByb3V0ZXIuZXZlbnRzLnN1YnNjcmliZSgoczogUm91dGVyRXZlbnQpID0+IHtcbiAgICAgICAgaWYgKHMgaW5zdGFuY2VvZiBOYXZpZ2F0aW9uRW5kKSB7XG4gICAgICAgICAgdGhpcy51cGRhdGUoKTtcbiAgICAgICAgfVxuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgbmF2aWdhdGUoZXZlbnQpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5yb3V0ZXIgJiYgdGhpcy5yb3V0ZSkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIGNvbnN0IHN0YXR1cyA9IHRoaXMucm91dGVyLm5hdmlnYXRlKHRoaXMucm91dGUsIHRoaXMucm91dGVFeHRyYXMpO1xuICAgICAgdGhpcy5uYXZpZ2F0aW9uLmVtaXQoc3RhdHVzKTtcbiAgICB9XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5zdWJzY3JpcHRpb24pIHtcbiAgICAgIHRoaXMuc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBpc0FjdGl2ZSgpOiBib29sZWFuIHtcbiAgICBpZiAodGhpcy5yb3V0ZXIgJiYgdGhpcy5yb3V0ZSkge1xuICAgICAgY29uc3QgaXRlbVVybCA9IHRoaXMucm91dGVyLmNyZWF0ZVVybFRyZWUodGhpcy5yb3V0ZSwgdGhpcy5yb3V0ZUV4dHJhcyk7XG4gICAgICByZXR1cm4gdGhpcy5yb3V0ZXIuaXNBY3RpdmUoaXRlbVVybCwgdHJ1ZSk7XG4gICAgfVxuXG4gICAgcmV0dXJuIGZhbHNlO1xuICB9XG5cbiAgcHJpdmF0ZSB1cGRhdGUoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuaXNBY3RpdmUoKSkge1xuICAgICAgdGhpcy5hY3RpdmUgPSB0cnVlO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmFjdGl2ZSA9IGZhbHNlO1xuICAgIH1cbiAgfVxufVxuIl19