@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>
152 lines • 10.9 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, Optional, Output, EventEmitter, TemplateRef } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { Router } from '@angular/router';
var Topbar = /** @class */ (function () {
function Topbar(domSanitizer, router) {
this.domSanitizer = domSanitizer;
this.router = router;
/**
* Put topbar contents inside a container. Defaults to `false`
*/
this.insideContainer = false;
/**
* Top level branding. Defaults to "Kushki"
*/
this.brand = 'Kushki';
/**
* Emits the navigation status promise when the link is activated
*/
this.navigation = new EventEmitter();
this._href = 'javascript:void(0)';
}
Object.defineProperty(Topbar.prototype, "href", {
get: /**
* @return {?}
*/
function () {
return (/** @type {?} */ (this.domSanitizer.bypassSecurityTrustUrl(this._href)));
},
/**
* Optional link for the header
*/
set: /**
* Optional link for the header
* @param {?} v
* @return {?}
*/
function (v) {
this._href = v;
},
enumerable: true,
configurable: true
});
/**
* @param {?} value
* @return {?}
*/
Topbar.prototype.isTemplate = /**
* @param {?} value
* @return {?}
*/
function (value) {
return value instanceof TemplateRef;
};
/**
* @param {?} event
* @return {?}
*/
Topbar.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);
}
};
Topbar.decorators = [
{ type: Component, args: [{
selector: 'suka-topbar',
template: "\n <header\n class=\"topbar\"\n role=\"banner\"\n [attr.aria-label]=\"brand + ' ' + productName\">\n\n <div class=\"container\" *ngIf=\"insideContainer else elseTpl\">\n <ng-container *ngTemplateOutlet=\"elseTpl\"></ng-container>\n </div>\n\n <ng-template #elseTpl>\n <ng-template\n *ngIf=\"isTemplate(brand)\"\n [ngTemplateOutlet]=\"brand\">\n </ng-template>\n <a\n *ngIf=\"!isTemplate(brand)\"\n class=\"topbar__name\"\n [href]=\"href\"\n (click)=\"navigate($event)\">\n <img *ngIf=\"logoSrc\" [src]=\"logoSrc\" class=\"topbar__logo\" [attr.alt]=\"brand\" />\n <span *ngIf=\"!logoSrc\" class=\"topbar__name--prefix\">{{brand}}</span>\n <span *ngIf=\"productName\" class=\"topbar__name--suffix\">{{productName}}</span>\n </a>\n <ng-content></ng-content>\n </ng-template>\n </header>\n "
}] }
];
/** @nocollapse */
Topbar.ctorParameters = function () { return [
{ type: DomSanitizer },
{ type: Router, decorators: [{ type: Optional }] }
]; };
Topbar.propDecorators = {
insideContainer: [{ type: Input }],
productName: [{ type: Input }],
logoSrc: [{ type: Input }],
brand: [{ type: Input }],
href: [{ type: Input }],
route: [{ type: Input }],
routeExtras: [{ type: Input }],
navigation: [{ type: Output }]
};
return Topbar;
}());
export { Topbar };
if (false) {
/**
* Put topbar contents inside a container. Defaults to `false`
* @type {?}
*/
Topbar.prototype.insideContainer;
/**
* Label that shows to the right of the `brand`.
* @type {?}
*/
Topbar.prototype.productName;
/**
* Source for the header logo.
* @type {?}
*/
Topbar.prototype.logoSrc;
/**
* Top level branding. Defaults to "Kushki"
* @type {?}
*/
Topbar.prototype.brand;
/**
* Array of commands to send to the router when the link is activated
* See: https://angular.io/api/router/Router#navigate
* @type {?}
*/
Topbar.prototype.route;
/**
* Router options. Used in conjunction with `route`
* See: https://angular.io/api/router/Router#navigate
* @type {?}
*/
Topbar.prototype.routeExtras;
/**
* Emits the navigation status promise when the link is activated
* @type {?}
*/
Topbar.prototype.navigation;
/**
* @type {?}
* @protected
*/
Topbar.prototype._href;
/**
* @type {?}
* @protected
*/
Topbar.prototype.domSanitizer;
/**
* @type {?}
* @protected
*/
Topbar.prototype.router;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9wYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BrdXNoa2kvbmctc3VrYS8iLCJzb3VyY2VzIjpbImxpYi90b3BiYXIvdG9wYmFyLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxLQUFLLEVBQ0wsUUFBUSxFQUNSLE1BQU0sRUFDTixZQUFZLEVBQ1osV0FBVyxFQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFekM7SUE2RUUsZ0JBQ1ksWUFBMEIsRUFDZCxNQUFjO1FBRDFCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQ2QsV0FBTSxHQUFOLE1BQU0sQ0FBUTs7OztRQTVDN0Isb0JBQWUsR0FBRyxLQUFLLENBQUM7Ozs7UUFZeEIsVUFBSyxHQUE4QixRQUFRLENBQUM7Ozs7UUEwQjNDLGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBb0IsQ0FBQztRQUVsRCxVQUFLLEdBQUcsb0JBQW9CLENBQUM7SUFLbkMsQ0FBQztJQTdCTCxzQkFBYSx3QkFBSTs7OztRQUlqQjtZQUNFLE9BQU8sbUJBQUEsSUFBSSxDQUFDLFlBQVksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEVBQVUsQ0FBQztRQUN4RSxDQUFDO1FBVEQ7O1dBRUc7Ozs7OztRQUNILFVBQWtCLENBQVM7WUFDekIsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLENBQUM7UUFDakIsQ0FBQzs7O09BQUE7Ozs7O0lBNkJNLDJCQUFVOzs7O0lBQWpCLFVBQWtCLEtBQUs7UUFDckIsT0FBTyxLQUFLLFlBQVksV0FBVyxDQUFDO0lBQ3RDLENBQUM7Ozs7O0lBRUQseUJBQVE7Ozs7SUFBUixVQUFTLEtBQUs7UUFDWixJQUFJLElBQUksQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUM3QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7O2dCQUNqQixRQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDO1lBQ2pFLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLFFBQU0sQ0FBQyxDQUFDO1NBQzlCO0lBQ0gsQ0FBQzs7Z0JBNUZGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsYUFBYTtvQkFDdkIsUUFBUSxFQUFFLHk3QkEyQlQ7aUJBQ0Y7Ozs7Z0JBakNRLFlBQVk7Z0JBQ1osTUFBTSx1QkFpRlYsUUFBUTs7O2tDQTVDVixLQUFLOzhCQUlMLEtBQUs7MEJBSUwsS0FBSzt3QkFJTCxLQUFLO3VCQUlMLEtBQUs7d0JBV0wsS0FBSzs4QkFNTCxLQUFLOzZCQUtMLE1BQU07O0lBb0JULGFBQUM7Q0FBQSxBQTdGRCxJQTZGQztTQTlEWSxNQUFNOzs7Ozs7SUFJakIsaUNBQWlDOzs7OztJQUlqQyw2QkFBNkI7Ozs7O0lBSTdCLHlCQUF5Qjs7Ozs7SUFJekIsdUJBQXFEOzs7Ozs7SUFlckQsdUJBQXNCOzs7Ozs7SUFNdEIsNkJBQTBCOzs7OztJQUsxQiw0QkFBNEQ7Ozs7O0lBRTVELHVCQUF1Qzs7Ozs7SUFHckMsOEJBQW9DOzs7OztJQUNwQyx3QkFBb0MiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIElucHV0LFxuICBPcHRpb25hbCxcbiAgT3V0cHV0LFxuICBFdmVudEVtaXR0ZXIsXG4gIFRlbXBsYXRlUmVmXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRG9tU2FuaXRpemVyIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5pbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWthLXRvcGJhcicsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGhlYWRlclxuICAgICAgY2xhc3M9XCJ0b3BiYXJcIlxuICAgICAgcm9sZT1cImJhbm5lclwiXG4gICAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImJyYW5kICsgJyAnICsgcHJvZHVjdE5hbWVcIj5cblxuICAgICAgPGRpdiBjbGFzcz1cImNvbnRhaW5lclwiICpuZ0lmPVwiaW5zaWRlQ29udGFpbmVyIGVsc2UgZWxzZVRwbFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiZWxzZVRwbFwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZWxzZVRwbD5cbiAgICAgICAgPG5nLXRlbXBsYXRlXG4gICAgICAgICAgKm5nSWY9XCJpc1RlbXBsYXRlKGJyYW5kKVwiXG4gICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRdPVwiYnJhbmRcIj5cbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgPGFcbiAgICAgICAgICAqbmdJZj1cIiFpc1RlbXBsYXRlKGJyYW5kKVwiXG4gICAgICAgICAgY2xhc3M9XCJ0b3BiYXJfX25hbWVcIlxuICAgICAgICAgIFtocmVmXT1cImhyZWZcIlxuICAgICAgICAgIChjbGljayk9XCJuYXZpZ2F0ZSgkZXZlbnQpXCI+XG4gICAgICAgICAgPGltZyAqbmdJZj1cImxvZ29TcmNcIiBbc3JjXT1cImxvZ29TcmNcIiBjbGFzcz1cInRvcGJhcl9fbG9nb1wiIFthdHRyLmFsdF09XCJicmFuZFwiIC8+XG4gICAgICAgICAgPHNwYW4gKm5nSWY9XCIhbG9nb1NyY1wiIGNsYXNzPVwidG9wYmFyX19uYW1lLS1wcmVmaXhcIj57e2JyYW5kfX08L3NwYW4+XG4gICAgICAgICAgPHNwYW4gKm5nSWY9XCJwcm9kdWN0TmFtZVwiIGNsYXNzPVwidG9wYmFyX19uYW1lLS1zdWZmaXhcIj57e3Byb2R1Y3ROYW1lfX08L3NwYW4+XG4gICAgICAgIDwvYT5cbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L2hlYWRlcj5cbiAgYFxufSlcbmV4cG9ydCBjbGFzcyBUb3BiYXIge1xuICAvKipcbiAgICogIFB1dCB0b3BiYXIgY29udGVudHMgaW5zaWRlIGEgY29udGFpbmVyLiBEZWZhdWx0cyB0byBgZmFsc2VgXG4gICAqL1xuICBASW5wdXQoKSBpbnNpZGVDb250YWluZXIgPSBmYWxzZTtcbiAgLyoqXG4gICAqIExhYmVsIHRoYXQgc2hvd3MgdG8gdGhlIHJpZ2h0IG9mIHRoZSBgYnJhbmRgLlxuICAgKi9cbiAgQElucHV0KCkgcHJvZHVjdE5hbWU6IHN0cmluZztcbiAgLyoqXG4gICAqIFNvdXJjZSBmb3IgdGhlIGhlYWRlciBsb2dvLlxuICAgKi9cbiAgQElucHV0KCkgbG9nb1NyYzogc3RyaW5nO1xuICAvKipcbiAgICogVG9wIGxldmVsIGJyYW5kaW5nLiBEZWZhdWx0cyB0byBcIkt1c2hraVwiXG4gICAqL1xuICBASW5wdXQoKSBicmFuZDogc3RyaW5nIHwgVGVtcGxhdGVSZWY8YW55PiA9ICdLdXNoa2knO1xuICAvKipcbiAgICogT3B0aW9uYWwgbGluayBmb3IgdGhlIGhlYWRlclxuICAgKi9cbiAgQElucHV0KCkgc2V0IGhyZWYodjogc3RyaW5nKSB7XG4gICAgdGhpcy5faHJlZiA9IHY7XG4gIH1cblxuICBnZXQgaHJlZigpIHtcbiAgICByZXR1cm4gdGhpcy5kb21TYW5pdGl6ZXIuYnlwYXNzU2VjdXJpdHlUcnVzdFVybCh0aGlzLl9ocmVmKSBhcyBzdHJpbmc7XG4gIH1cbiAgLyoqXG4gICAqIEFycmF5IG9mIGNvbW1hbmRzIHRvIHNlbmQgdG8gdGhlIHJvdXRlciB3aGVuIHRoZSBsaW5rIGlzIGFjdGl2YXRlZFxuICAgKiBTZWU6IGh0dHBzOi8vYW5ndWxhci5pby9hcGkvcm91dGVyL1JvdXRlciNuYXZpZ2F0ZVxuICAgKi9cbiAgQElucHV0KCkgcm91dGU6IGFueVtdO1xuXG4gIC8qKlxuICAgKiBSb3V0ZXIgb3B0aW9ucy4gVXNlZCBpbiBjb25qdW5jdGlvbiB3aXRoIGByb3V0ZWBcbiAgICogU2VlOiBodHRwczovL2FuZ3VsYXIuaW8vYXBpL3JvdXRlci9Sb3V0ZXIjbmF2aWdhdGVcbiAgICovXG4gIEBJbnB1dCgpIHJvdXRlRXh0cmFzOiBhbnk7XG5cbiAgLyoqXG4gICAqIEVtaXRzIHRoZSBuYXZpZ2F0aW9uIHN0YXR1cyBwcm9taXNlIHdoZW4gdGhlIGxpbmsgaXMgYWN0aXZhdGVkXG4gICAqL1xuICBAT3V0cHV0KCkgbmF2aWdhdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8UHJvbWlzZTxib29sZWFuPj4oKTtcblxuICBwcm90ZWN0ZWQgX2hyZWYgPSAnamF2YXNjcmlwdDp2b2lkKDApJztcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcm90ZWN0ZWQgZG9tU2FuaXRpemVyOiBEb21TYW5pdGl6ZXIsXG4gICAgQE9wdGlvbmFsKCkgcHJvdGVjdGVkIHJvdXRlcjogUm91dGVyXG4gICkgeyB9XG5cbiAgcHVibGljIGlzVGVtcGxhdGUodmFsdWUpIHtcbiAgICByZXR1cm4gdmFsdWUgaW5zdGFuY2VvZiBUZW1wbGF0ZVJlZjtcbiAgfVxuXG4gIG5hdmlnYXRlKGV2ZW50KSB7XG4gICAgaWYgKHRoaXMucm91dGVyICYmIHRoaXMucm91dGUpIHtcbiAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICBjb25zdCBzdGF0dXMgPSB0aGlzLnJvdXRlci5uYXZpZ2F0ZSh0aGlzLnJvdXRlLCB0aGlzLnJvdXRlRXh0cmFzKTtcbiAgICAgIHRoaXMubmF2aWdhdGlvbi5lbWl0KHN0YXR1cyk7XG4gICAgfVxuICB9XG59XG4iXX0=