@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--sufix\">{{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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9wYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BrdXNoa2kvbmctc3VrYS8iLCJzb3VyY2VzIjpbImxpYi90b3BiYXIvdG9wYmFyLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxLQUFLLEVBQ0wsUUFBUSxFQUNSLE1BQU0sRUFDTixZQUFZLEVBQ1osV0FBVyxFQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFekM7SUE2RUUsZ0JBQ1ksWUFBMEIsRUFDZCxNQUFjO1FBRDFCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQ2QsV0FBTSxHQUFOLE1BQU0sQ0FBUTs7OztRQTVDN0Isb0JBQWUsR0FBRyxLQUFLLENBQUM7Ozs7UUFZeEIsVUFBSyxHQUE4QixRQUFRLENBQUM7Ozs7UUEwQjNDLGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBb0IsQ0FBQztRQUVsRCxVQUFLLEdBQUcsb0JBQW9CLENBQUM7SUFLbkMsQ0FBQztJQTdCTCxzQkFBYSx3QkFBSTs7OztRQUlqQjtZQUNFLE9BQU8sbUJBQUEsSUFBSSxDQUFDLFlBQVksQ0FBQyxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEVBQVUsQ0FBQztRQUN4RSxDQUFDO1FBVEQ7O1dBRUc7Ozs7OztRQUNILFVBQWtCLENBQVM7WUFDekIsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLENBQUM7UUFDakIsQ0FBQzs7O09BQUE7Ozs7O0lBNkJNLDJCQUFVOzs7O0lBQWpCLFVBQWtCLEtBQUs7UUFDckIsT0FBTyxLQUFLLFlBQVksV0FBVyxDQUFDO0lBQ3RDLENBQUM7Ozs7O0lBRUQseUJBQVE7Ozs7SUFBUixVQUFTLEtBQUs7UUFDWixJQUFJLElBQUksQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUM3QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7O2dCQUNqQixRQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDO1lBQ2pFLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLFFBQU0sQ0FBQyxDQUFDO1NBQzlCO0lBQ0gsQ0FBQzs7Z0JBNUZGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsYUFBYTtvQkFDdkIsUUFBUSxFQUFFLHc3QkEyQlQ7aUJBQ0Y7Ozs7Z0JBakNRLFlBQVk7Z0JBQ1osTUFBTSx1QkFpRlYsUUFBUTs7O2tDQTVDVixLQUFLOzhCQUlMLEtBQUs7MEJBSUwsS0FBSzt3QkFJTCxLQUFLO3VCQUlMLEtBQUs7d0JBV0wsS0FBSzs4QkFNTCxLQUFLOzZCQUtMLE1BQU07O0lBb0JULGFBQUM7Q0FBQSxBQTdGRCxJQTZGQztTQTlEWSxNQUFNOzs7Ozs7SUFJakIsaUNBQWlDOzs7OztJQUlqQyw2QkFBNkI7Ozs7O0lBSTdCLHlCQUF5Qjs7Ozs7SUFJekIsdUJBQXFEOzs7Ozs7SUFlckQsdUJBQXNCOzs7Ozs7SUFNdEIsNkJBQTBCOzs7OztJQUsxQiw0QkFBNEQ7Ozs7O0lBRTVELHVCQUF1Qzs7Ozs7SUFHckMsOEJBQW9DOzs7OztJQUNwQyx3QkFBb0MiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIElucHV0LFxuICBPcHRpb25hbCxcbiAgT3V0cHV0LFxuICBFdmVudEVtaXR0ZXIsXG4gIFRlbXBsYXRlUmVmXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRG9tU2FuaXRpemVyIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5pbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWthLXRvcGJhcicsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGhlYWRlclxuICAgICAgY2xhc3M9XCJ0b3BiYXJcIlxuICAgICAgcm9sZT1cImJhbm5lclwiXG4gICAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImJyYW5kICsgJyAnICsgcHJvZHVjdE5hbWVcIj5cblxuICAgICAgPGRpdiBjbGFzcz1cImNvbnRhaW5lclwiICpuZ0lmPVwiaW5zaWRlQ29udGFpbmVyIGVsc2UgZWxzZVRwbFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiZWxzZVRwbFwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZWxzZVRwbD5cbiAgICAgICAgPG5nLXRlbXBsYXRlXG4gICAgICAgICAgKm5nSWY9XCJpc1RlbXBsYXRlKGJyYW5kKVwiXG4gICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRdPVwiYnJhbmRcIj5cbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgPGFcbiAgICAgICAgICAqbmdJZj1cIiFpc1RlbXBsYXRlKGJyYW5kKVwiXG4gICAgICAgICAgY2xhc3M9XCJ0b3BiYXJfX25hbWVcIlxuICAgICAgICAgIFtocmVmXT1cImhyZWZcIlxuICAgICAgICAgIChjbGljayk9XCJuYXZpZ2F0ZSgkZXZlbnQpXCI+XG4gICAgICAgICAgPGltZyAqbmdJZj1cImxvZ29TcmNcIiBbc3JjXT1cImxvZ29TcmNcIiBjbGFzcz1cInRvcGJhcl9fbG9nb1wiIFthdHRyLmFsdF09XCJicmFuZFwiIC8+XG4gICAgICAgICAgPHNwYW4gKm5nSWY9XCIhbG9nb1NyY1wiIGNsYXNzPVwidG9wYmFyX19uYW1lLS1wcmVmaXhcIj57e2JyYW5kfX08L3NwYW4+XG4gICAgICAgICAgPHNwYW4gKm5nSWY9XCJwcm9kdWN0TmFtZVwiIGNsYXNzPVwidG9wYmFyX19uYW1lLS1zdWZpeFwiPnt7cHJvZHVjdE5hbWV9fTwvc3Bhbj5cbiAgICAgICAgPC9hPlxuICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgICA8L25nLXRlbXBsYXRlPlxuICAgIDwvaGVhZGVyPlxuICBgXG59KVxuZXhwb3J0IGNsYXNzIFRvcGJhciB7XG4gIC8qKlxuICAgKiAgUHV0IHRvcGJhciBjb250ZW50cyBpbnNpZGUgYSBjb250YWluZXIuIERlZmF1bHRzIHRvIGBmYWxzZWBcbiAgICovXG4gIEBJbnB1dCgpIGluc2lkZUNvbnRhaW5lciA9IGZhbHNlO1xuICAvKipcbiAgICogTGFiZWwgdGhhdCBzaG93cyB0byB0aGUgcmlnaHQgb2YgdGhlIGBicmFuZGAuXG4gICAqL1xuICBASW5wdXQoKSBwcm9kdWN0TmFtZTogc3RyaW5nO1xuICAvKipcbiAgICogU291cmNlIGZvciB0aGUgaGVhZGVyIGxvZ28uXG4gICAqL1xuICBASW5wdXQoKSBsb2dvU3JjOiBzdHJpbmc7XG4gIC8qKlxuICAgKiBUb3AgbGV2ZWwgYnJhbmRpbmcuIERlZmF1bHRzIHRvIFwiS3VzaGtpXCJcbiAgICovXG4gIEBJbnB1dCgpIGJyYW5kOiBzdHJpbmcgfCBUZW1wbGF0ZVJlZjxhbnk+ID0gJ0t1c2hraSc7XG4gIC8qKlxuICAgKiBPcHRpb25hbCBsaW5rIGZvciB0aGUgaGVhZGVyXG4gICAqL1xuICBASW5wdXQoKSBzZXQgaHJlZih2OiBzdHJpbmcpIHtcbiAgICB0aGlzLl9ocmVmID0gdjtcbiAgfVxuXG4gIGdldCBocmVmKCkge1xuICAgIHJldHVybiB0aGlzLmRvbVNhbml0aXplci5ieXBhc3NTZWN1cml0eVRydXN0VXJsKHRoaXMuX2hyZWYpIGFzIHN0cmluZztcbiAgfVxuICAvKipcbiAgICogQXJyYXkgb2YgY29tbWFuZHMgdG8gc2VuZCB0byB0aGUgcm91dGVyIHdoZW4gdGhlIGxpbmsgaXMgYWN0aXZhdGVkXG4gICAqIFNlZTogaHR0cHM6Ly9hbmd1bGFyLmlvL2FwaS9yb3V0ZXIvUm91dGVyI25hdmlnYXRlXG4gICAqL1xuICBASW5wdXQoKSByb3V0ZTogYW55W107XG5cbiAgLyoqXG4gICAqIFJvdXRlciBvcHRpb25zLiBVc2VkIGluIGNvbmp1bmN0aW9uIHdpdGggYHJvdXRlYFxuICAgKiBTZWU6IGh0dHBzOi8vYW5ndWxhci5pby9hcGkvcm91dGVyL1JvdXRlciNuYXZpZ2F0ZVxuICAgKi9cbiAgQElucHV0KCkgcm91dGVFeHRyYXM6IGFueTtcblxuICAvKipcbiAgICogRW1pdHMgdGhlIG5hdmlnYXRpb24gc3RhdHVzIHByb21pc2Ugd2hlbiB0aGUgbGluayBpcyBhY3RpdmF0ZWRcbiAgICovXG4gIEBPdXRwdXQoKSBuYXZpZ2F0aW9uID0gbmV3IEV2ZW50RW1pdHRlcjxQcm9taXNlPGJvb2xlYW4+PigpO1xuXG4gIHByb3RlY3RlZCBfaHJlZiA9ICdqYXZhc2NyaXB0OnZvaWQoMCknO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHByb3RlY3RlZCBkb21TYW5pdGl6ZXI6IERvbVNhbml0aXplcixcbiAgICBAT3B0aW9uYWwoKSBwcm90ZWN0ZWQgcm91dGVyOiBSb3V0ZXJcbiAgKSB7IH1cblxuICBwdWJsaWMgaXNUZW1wbGF0ZSh2YWx1ZSkge1xuICAgIHJldHVybiB2YWx1ZSBpbnN0YW5jZW9mIFRlbXBsYXRlUmVmO1xuICB9XG5cbiAgbmF2aWdhdGUoZXZlbnQpIHtcbiAgICBpZiAodGhpcy5yb3V0ZXIgJiYgdGhpcy5yb3V0ZSkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIGNvbnN0IHN0YXR1cyA9IHRoaXMucm91dGVyLm5hdmlnYXRlKHRoaXMucm91dGUsIHRoaXMucm91dGVFeHRyYXMpO1xuICAgICAgdGhpcy5uYXZpZ2F0aW9uLmVtaXQoc3RhdHVzKTtcbiAgICB9XG4gIH1cbn1cbiJdfQ==