@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>
66 lines • 5.68 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, HostBinding } from '@angular/core';
import { BreakpointObserver } from '@angular/cdk/layout';
var Frame = /** @class */ (function () {
function Frame(breakpointObserver) {
var _this = this;
this.baseClass = true;
this.mobile = false;
breakpointObserver.observe('(max-width: 768px)').subscribe((/**
* @param {?} result
* @return {?}
*/
function (result) {
if (result.matches) {
_this.activateHandsetLayout();
}
else {
_this.activateDesktopLayout();
}
}));
}
/**
* @return {?}
*/
Frame.prototype.activateHandsetLayout = /**
* @return {?}
*/
function () {
this.mobile = true;
};
/**
* @return {?}
*/
Frame.prototype.activateDesktopLayout = /**
* @return {?}
*/
function () {
this.mobile = false;
};
Frame.decorators = [
{ type: Component, args: [{
selector: 'suka-frame',
template: "\n <div class=\"frame__header\">\n <ng-content select=\"suka-topbar\"></ng-content>\n </div>\n\n <ng-template #navigationTemplate>\n <ng-content select=\"suka-navigation\"></ng-content>\n </ng-template>\n\n <div class=\"frame__nav\" *ngIf=\"!mobile\">\n <ng-container *ngTemplateOutlet=\"navigationTemplate\"></ng-container>\n </div>\n\n <div class=\"frame__main\">\n <ng-content select=\"suka-page\"></ng-content>\n </div>\n\n <div class=\"frame__mobile-nav\" *ngIf=\"mobile\">\n <suka-mobile-navigation>\n <ng-container *ngTemplateOutlet=\"navigationTemplate\"></ng-container>\n </suka-mobile-navigation>\n </div>\n\n <ng-content></ng-content>\n "
}] }
];
/** @nocollapse */
Frame.ctorParameters = function () { return [
{ type: BreakpointObserver }
]; };
Frame.propDecorators = {
baseClass: [{ type: HostBinding, args: ['class.frame',] }],
mobile: [{ type: HostBinding, args: ['class.frame--mobile',] }]
};
return Frame;
}());
export { Frame };
if (false) {
/** @type {?} */
Frame.prototype.baseClass;
/** @type {?} */
Frame.prototype.mobile;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZnJhbWUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGt1c2hraS9uZy1zdWthLyIsInNvdXJjZXMiOlsibGliL2ZyYW1lL2ZyYW1lLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkQsT0FBTyxFQUFlLGtCQUFrQixFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFFdEU7SUFnQ0UsZUFBWSxrQkFBc0M7UUFBbEQsaUJBUUM7UUFYMkIsY0FBUyxHQUFHLElBQUksQ0FBQztRQUNULFdBQU0sR0FBRyxLQUFLLENBQUM7UUFHakQsa0JBQWtCLENBQUMsT0FBTyxDQUFDLG9CQUFvQixDQUFDLENBQUMsU0FBUzs7OztRQUFDLFVBQUEsTUFBTTtZQUMvRCxJQUFJLE1BQU0sQ0FBQyxPQUFPLEVBQUU7Z0JBQ2xCLEtBQUksQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO2FBQzlCO2lCQUFNO2dCQUNMLEtBQUksQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO2FBQzlCO1FBQ0gsQ0FBQyxFQUFDLENBQUM7SUFDTCxDQUFDOzs7O0lBRUQscUNBQXFCOzs7SUFBckI7UUFDRSxJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQztJQUNyQixDQUFDOzs7O0lBRUQscUNBQXFCOzs7SUFBckI7UUFDRSxJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztJQUN0QixDQUFDOztnQkFoREYsU0FBUyxTQUFDO29CQUNULFFBQVEsRUFBRSxZQUFZO29CQUN0QixRQUFRLEVBQUUsa3RCQXdCVDtpQkFDRjs7OztnQkE3QnFCLGtCQUFrQjs7OzRCQStCckMsV0FBVyxTQUFDLGFBQWE7eUJBQ3pCLFdBQVcsU0FBQyxxQkFBcUI7O0lBbUJwQyxZQUFDO0NBQUEsQUFqREQsSUFpREM7U0FyQlksS0FBSzs7O0lBQ2hCLDBCQUE2Qzs7SUFDN0MsdUJBQW1EIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBIb3N0QmluZGluZyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQnJlYWtwb2ludHMsIEJyZWFrcG9pbnRPYnNlcnZlciB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9sYXlvdXQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWthLWZyYW1lJyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IGNsYXNzPVwiZnJhbWVfX2hlYWRlclwiPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwic3VrYS10b3BiYXJcIj48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG5cbiAgICA8bmctdGVtcGxhdGUgI25hdmlnYXRpb25UZW1wbGF0ZT5cbiAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJzdWthLW5hdmlnYXRpb25cIj48L25nLWNvbnRlbnQ+XG4gICAgPC9uZy10ZW1wbGF0ZT5cblxuICAgIDxkaXYgY2xhc3M9XCJmcmFtZV9fbmF2XCIgKm5nSWY9XCIhbW9iaWxlXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwibmF2aWdhdGlvblRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XG4gICAgPC9kaXY+XG5cbiAgICA8ZGl2IGNsYXNzPVwiZnJhbWVfX21haW5cIj5cbiAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInN1a2EtcGFnZVwiPjwvbmctY29udGVudD5cbiAgICA8L2Rpdj5cblxuICAgIDxkaXYgY2xhc3M9XCJmcmFtZV9fbW9iaWxlLW5hdlwiICpuZ0lmPVwibW9iaWxlXCI+XG4gICAgICA8c3VrYS1tb2JpbGUtbmF2aWdhdGlvbj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cIm5hdmlnYXRpb25UZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPC9zdWthLW1vYmlsZS1uYXZpZ2F0aW9uPlxuICAgIDwvZGl2PlxuXG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICBgXG59KVxuZXhwb3J0IGNsYXNzIEZyYW1lIHtcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5mcmFtZScpIGJhc2VDbGFzcyA9IHRydWU7XG4gIEBIb3N0QmluZGluZygnY2xhc3MuZnJhbWUtLW1vYmlsZScpIG1vYmlsZSA9IGZhbHNlO1xuXG4gIGNvbnN0cnVjdG9yKGJyZWFrcG9pbnRPYnNlcnZlcjogQnJlYWtwb2ludE9ic2VydmVyKSB7XG4gICAgYnJlYWtwb2ludE9ic2VydmVyLm9ic2VydmUoJyhtYXgtd2lkdGg6IDc2OHB4KScpLnN1YnNjcmliZShyZXN1bHQgPT4ge1xuICAgICAgaWYgKHJlc3VsdC5tYXRjaGVzKSB7XG4gICAgICAgIHRoaXMuYWN0aXZhdGVIYW5kc2V0TGF5b3V0KCk7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICB0aGlzLmFjdGl2YXRlRGVza3RvcExheW91dCgpO1xuICAgICAgfVxuICAgIH0pO1xuICB9XG5cbiAgYWN0aXZhdGVIYW5kc2V0TGF5b3V0KCkge1xuICAgIHRoaXMubW9iaWxlID0gdHJ1ZTtcbiAgfVxuXG4gIGFjdGl2YXRlRGVza3RvcExheW91dCgpIHtcbiAgICB0aGlzLm1vYmlsZSA9IGZhbHNlO1xuICB9XG59XG4iXX0=