@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>
70 lines • 5.29 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';
export class MobileNavigation {
constructor() {
this.role = 'complementary';
this.hostClass = true;
/**
* Controls the expanded (`true`) or collapsed (`false`) state when on a small screen.
*/
this.expanded = false;
/**
* Controls the hidden (`true`) or visible (`false`) state
*/
this.hidden = false;
}
/**
* @return {?}
*/
toggle() {
this.expanded = !this.expanded;
}
}
MobileNavigation.decorators = [
{ type: Component, args: [{
selector: 'suka-mobile-navigation',
template: `
<button class="nav-toggle" (click)="toggle()"><suka-icon icon="menu"></suka-icon> Navegación</button>
<div class="backdrop--dark"></div>
<div class="mobile-navigation__nav-wrapper">
<div class="mobile-nav-trigger" (click)="toggle()"></div>
<div class="mobile-nav">
<div class="mobile-nav__header">
Navegación
<button sukaButton="plain" (click)="toggle()" size="sm"><suka-icon icon="x"></suka-icon></button>
</div>
<ng-content></ng-content>
</div>
</div>
`,
encapsulation: ViewEncapsulation.None
}] }
];
/** @nocollapse */
MobileNavigation.ctorParameters = () => [];
MobileNavigation.propDecorators = {
role: [{ type: HostBinding, args: ['attr.role',] }],
hostClass: [{ type: HostBinding, args: ['class.mobile-navigation',] }],
expanded: [{ type: HostBinding, args: ['class.mobile-navigation--expanded',] }, { type: Input }],
hidden: [{ type: HostBinding, args: ['class.mobile-navigation--hidden',] }, { type: Input }]
};
if (false) {
/** @type {?} */
MobileNavigation.prototype.role;
/** @type {?} */
MobileNavigation.prototype.hostClass;
/**
* Controls the expanded (`true`) or collapsed (`false`) state when on a small screen.
* @type {?}
*/
MobileNavigation.prototype.expanded;
/**
* Controls the hidden (`true`) or visible (`false`) state
* @type {?}
*/
MobileNavigation.prototype.hidden;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9iaWxlLW5hdmlnYXRpb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGt1c2hraS9uZy1zdWthLyIsInNvdXJjZXMiOlsibGliL25hdmlnYXRpb24vbW9iaWxlLW5hdmlnYXRpb24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULFdBQVcsRUFDWCxLQUFLLEVBQ0wsaUJBQWlCLEVBQ2xCLE1BQU0sZUFBZSxDQUFDO0FBb0J2QixNQUFNLE9BQU8sZ0JBQWdCO0lBWTNCO1FBWDBCLFNBQUksR0FBRyxlQUFlLENBQUM7UUFDVCxjQUFTLEdBQUcsSUFBSSxDQUFDOzs7O1FBSUUsYUFBUSxHQUFHLEtBQUssQ0FBQzs7OztRQUluQixXQUFNLEdBQUcsS0FBSyxDQUFDO0lBRXhELENBQUM7Ozs7SUFFakIsTUFBTTtRQUNKLElBQUksQ0FBQyxRQUFRLEdBQUcsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDO0lBQ2pDLENBQUM7OztZQWxDRixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLHdCQUF3QjtnQkFDbEMsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7O0dBYVQ7Z0JBQ0QsYUFBYSxFQUFFLGlCQUFpQixDQUFDLElBQUk7YUFDdEM7Ozs7O21CQUVFLFdBQVcsU0FBQyxXQUFXO3dCQUN2QixXQUFXLFNBQUMseUJBQXlCO3VCQUlyQyxXQUFXLFNBQUMsbUNBQW1DLGNBQUcsS0FBSztxQkFJdkQsV0FBVyxTQUFDLGlDQUFpQyxjQUFHLEtBQUs7Ozs7SUFUdEQsZ0NBQWlEOztJQUNqRCxxQ0FBeUQ7Ozs7O0lBSXpELG9DQUE0RTs7Ozs7SUFJNUUsa0NBQXdFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBIb3N0QmluZGluZyxcbiAgSW5wdXQsXG4gIFZpZXdFbmNhcHN1bGF0aW9uXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWthLW1vYmlsZS1uYXZpZ2F0aW9uJyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8YnV0dG9uIGNsYXNzPVwibmF2LXRvZ2dsZVwiIChjbGljayk9XCJ0b2dnbGUoKVwiPjxzdWthLWljb24gaWNvbj1cIm1lbnVcIj48L3N1a2EtaWNvbj4gTmF2ZWdhY2nDs248L2J1dHRvbj5cbiAgICA8ZGl2IGNsYXNzPVwiYmFja2Ryb3AtLWRhcmtcIj48L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwibW9iaWxlLW5hdmlnYXRpb25fX25hdi13cmFwcGVyXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwibW9iaWxlLW5hdi10cmlnZ2VyXCIgKGNsaWNrKT1cInRvZ2dsZSgpXCI+PC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwibW9iaWxlLW5hdlwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwibW9iaWxlLW5hdl9faGVhZGVyXCI+XG4gICAgICAgICAgTmF2ZWdhY2nDs25cbiAgICAgICAgICA8YnV0dG9uIHN1a2FCdXR0b249XCJwbGFpblwiIChjbGljayk9XCJ0b2dnbGUoKVwiIHNpemU9XCJzbVwiPjxzdWthLWljb24gaWNvbj1cInhcIj48L3N1a2EtaWNvbj48L2J1dHRvbj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICBgLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lXG59KVxuZXhwb3J0IGNsYXNzIE1vYmlsZU5hdmlnYXRpb24ge1xuICBASG9zdEJpbmRpbmcoJ2F0dHIucm9sZScpIHJvbGUgPSAnY29tcGxlbWVudGFyeSc7XG4gIEBIb3N0QmluZGluZygnY2xhc3MubW9iaWxlLW5hdmlnYXRpb24nKSBob3N0Q2xhc3MgPSB0cnVlO1xuICAvKipcbiAgICogQ29udHJvbHMgdGhlIGV4cGFuZGVkIChgdHJ1ZWApIG9yIGNvbGxhcHNlZCAoYGZhbHNlYCkgc3RhdGUgd2hlbiBvbiBhIHNtYWxsIHNjcmVlbi5cbiAgICovXG4gIEBIb3N0QmluZGluZygnY2xhc3MubW9iaWxlLW5hdmlnYXRpb24tLWV4cGFuZGVkJykgQElucHV0KCkgZXhwYW5kZWQgPSBmYWxzZTtcbiAgLyoqXG4gICAqIENvbnRyb2xzIHRoZSBoaWRkZW4gKGB0cnVlYCkgb3IgdmlzaWJsZSAoYGZhbHNlYCkgc3RhdGVcbiAgICovXG4gIEBIb3N0QmluZGluZygnY2xhc3MubW9iaWxlLW5hdmlnYXRpb24tLWhpZGRlbicpIEBJbnB1dCgpIGhpZGRlbiA9IGZhbHNlO1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgdG9nZ2xlKCkge1xuICAgIHRoaXMuZXhwYW5kZWQgPSAhdGhpcy5leHBhbmRlZDtcbiAgfVxufVxuIl19