fundamental-ngx
Version:
SAP Fundamentals, implemented in Angular
118 lines • 9.45 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Input, ElementRef, Output, EventEmitter, Directive, HostListener, Inject, HostBinding } from '@angular/core';
import { AbstractFdNgxClass } from '../../utils/abstract-fd-ngx-class';
/**
* The component that represents a navigation link.
* ```html
* <a fd-side-nav-link>
* <a [attr.href]="'#'">Link Item</a>
* </a>
* ```
*/
export class SideNavigationLinkDirective extends AbstractFdNgxClass {
/**
* @hidden
* @param {?} elementRef
*/
constructor(elementRef) {
super(elementRef);
this.elementRef = elementRef;
/**
* Whether the link has a sublist.
*/
this.hasSublist = false;
/**
* Whether the sub list is opened or closed
*/
this.onSubListOpenChange = new EventEmitter();
this.sublistIsOpen = false;
this.role = this.hasSublist ? 'button' : '';
this.hasPopup = this.hasSublist;
this.tabindex = this.hasSublist ? '0' : '';
}
/**
* @hidden
* @return {?}
*/
_setProperties() {
this._addClassToElement('fd-side-nav__link');
if (this.hasSublist) {
this._addClassToElement('has-child');
this._addStyleToElement('cursor', 'pointer');
this.elementRef.nativeElement.setAttribute('aria-expanded', this.sublistIsOpen);
}
if (this.sublistIsOpen && this.hasSublist) {
this._addClassToElement('is-selected');
}
}
/**
* @hidden
* @param {?} event
* @return {?}
*/
onKeypressHandler(event) {
if (this.hasSublist && (event.code === 'Enter' || event.code === 'Space')) {
event.preventDefault();
this.changeSubListIsOpen();
}
}
/**
* @return {?}
*/
changeSubListIsOpen() {
if (this.hasSublist) {
this.sublistIsOpen = !this.sublistIsOpen;
this.onSubListOpenChange.emit(this.sublistIsOpen);
this.ngOnChanges();
}
}
}
SideNavigationLinkDirective.decorators = [
{ type: Directive, args: [{
// tslint:disable-next-line:directive-selector
selector: '[fd-side-nav-link]',
},] }
];
/** @nocollapse */
SideNavigationLinkDirective.ctorParameters = () => [
{ type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] }
];
SideNavigationLinkDirective.propDecorators = {
hasSublist: [{ type: Input }],
onSubListOpenChange: [{ type: Output }],
sublistIsOpen: [{ type: Input }],
role: [{ type: HostBinding, args: ['attr.role',] }],
hasPopup: [{ type: HostBinding, args: ['attr.aria-haspopup',] }],
tabindex: [{ type: HostBinding, args: ['tabindex',] }],
onKeypressHandler: [{ type: HostListener, args: ['keypress', ['$event.target'],] }],
changeSubListIsOpen: [{ type: HostListener, args: ['click', ['$event.target'],] }]
};
if (false) {
/**
* Whether the link has a sublist.
* @type {?}
*/
SideNavigationLinkDirective.prototype.hasSublist;
/**
* Whether the sub list is opened or closed
* @type {?}
*/
SideNavigationLinkDirective.prototype.onSubListOpenChange;
/** @type {?} */
SideNavigationLinkDirective.prototype.sublistIsOpen;
/** @type {?} */
SideNavigationLinkDirective.prototype.role;
/** @type {?} */
SideNavigationLinkDirective.prototype.hasPopup;
/** @type {?} */
SideNavigationLinkDirective.prototype.tabindex;
/**
* @type {?}
* @private
*/
SideNavigationLinkDirective.prototype.elementRef;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZS1uYXZpZ2F0aW9uLWxpbmsuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vZnVuZGFtZW50YWwtbmd4LyIsInNvdXJjZXMiOlsibGliL3NpZGUtbmF2aWdhdGlvbi9zaWRlLW5hdmlnYXRpb24tbGluay9zaWRlLW5hdmlnYXRpb24tbGluay5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFDSCxLQUFLLEVBQ0wsVUFBVSxFQUNWLE1BQU0sRUFDTixZQUFZLEVBQ1osU0FBUyxFQUFFLFlBQVksRUFBRSxNQUFNLEVBQVUsV0FBVyxFQUN2RCxNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQzs7Ozs7Ozs7O0FBY3ZFLE1BQU0sT0FBTywyQkFBNEIsU0FBUSxrQkFBa0I7Ozs7O0lBK0IvRCxZQUF3QyxVQUFzQjtRQUMxRCxLQUFLLENBQUMsVUFBVSxDQUFDLENBQUM7UUFEa0IsZUFBVSxHQUFWLFVBQVUsQ0FBWTs7OztRQTNCOUQsZUFBVSxHQUFZLEtBQUssQ0FBQzs7OztRQUk1Qix3QkFBbUIsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBR2xELGtCQUFhLEdBQVksS0FBSyxDQUFDO1FBRUwsU0FBSSxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBQzlCLGFBQVEsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDO1FBQ3JDLGFBQVEsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztJQWtCL0QsQ0FBQzs7Ozs7SUFmRCxjQUFjO1FBQ1YsSUFBSSxDQUFDLGtCQUFrQixDQUFDLG1CQUFtQixDQUFDLENBQUM7UUFDN0MsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ2pCLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUNyQyxJQUFJLENBQUMsa0JBQWtCLENBQUMsUUFBUSxFQUFFLFNBQVMsQ0FBQyxDQUFDO1lBQzdDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLFlBQVksQ0FBQyxlQUFlLEVBQUUsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQ25GO1FBQ0QsSUFBSSxJQUFJLENBQUMsYUFBYSxJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDdkMsSUFBSSxDQUFDLGtCQUFrQixDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQzFDO0lBQ0wsQ0FBQzs7Ozs7O0lBU0QsaUJBQWlCLENBQUMsS0FBSztRQUNuQixJQUFJLElBQUksQ0FBQyxVQUFVLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxLQUFLLE9BQU8sSUFBSSxLQUFLLENBQUMsSUFBSSxLQUFLLE9BQU8sQ0FBQyxFQUFFO1lBQ3ZFLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUN2QixJQUFJLENBQUMsbUJBQW1CLEVBQUUsQ0FBQztTQUM5QjtJQUNMLENBQUM7Ozs7SUFHRCxtQkFBbUI7UUFDZixJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDakIsSUFBSSxDQUFDLGFBQWEsR0FBRyxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUM7WUFDekMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7WUFDbEQsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ3RCO0lBQ0wsQ0FBQzs7O1lBdkRKLFNBQVMsU0FBQzs7Z0JBRVAsUUFBUSxFQUFFLG9CQUFvQjthQUNqQzs7OztZQWxCRyxVQUFVLHVCQWtERyxNQUFNLFNBQUMsVUFBVTs7O3lCQTVCN0IsS0FBSztrQ0FJTCxNQUFNOzRCQUdOLEtBQUs7bUJBR0wsV0FBVyxTQUFDLFdBQVc7dUJBQ3ZCLFdBQVcsU0FBQyxvQkFBb0I7dUJBQ2hDLFdBQVcsU0FBQyxVQUFVO2dDQXFCdEIsWUFBWSxTQUFDLFVBQVUsRUFBRSxDQUFDLGVBQWUsQ0FBQztrQ0FRMUMsWUFBWSxTQUFDLE9BQU8sRUFBRSxDQUFDLGVBQWUsQ0FBQzs7Ozs7OztJQXpDeEMsaURBQzRCOzs7OztJQUc1QiwwREFDa0Q7O0lBRWxELG9EQUMrQjs7SUFFL0IsMkNBQWlFOztJQUNqRSwrQ0FBOEQ7O0lBQzlELCtDQUErRDs7Ozs7SUFnQm5ELGlEQUFrRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gICAgSW5wdXQsXG4gICAgRWxlbWVudFJlZixcbiAgICBPdXRwdXQsXG4gICAgRXZlbnRFbWl0dGVyLFxuICAgIERpcmVjdGl2ZSwgSG9zdExpc3RlbmVyLCBJbmplY3QsIE9uSW5pdCwgSG9zdEJpbmRpbmdcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBYnN0cmFjdEZkTmd4Q2xhc3MgfSBmcm9tICcuLi8uLi91dGlscy9hYnN0cmFjdC1mZC1uZ3gtY2xhc3MnO1xuXG4vKipcbiAqIFRoZSBjb21wb25lbnQgdGhhdCByZXByZXNlbnRzIGEgbmF2aWdhdGlvbiBsaW5rLlxuICogYGBgaHRtbFxuICogICAgPGEgZmQtc2lkZS1uYXYtbGluaz5cbiAqICAgICAgICA8YSBbYXR0ci5ocmVmXT1cIicjJ1wiPkxpbmsgSXRlbTwvYT5cbiAqICAgIDwvYT5cbiAqIGBgYFxuICovXG5ARGlyZWN0aXZlKHtcbiAgICAvLyB0c2xpbnQ6ZGlzYWJsZS1uZXh0LWxpbmU6ZGlyZWN0aXZlLXNlbGVjdG9yXG4gICAgc2VsZWN0b3I6ICdbZmQtc2lkZS1uYXYtbGlua10nLFxufSlcbmV4cG9ydCBjbGFzcyBTaWRlTmF2aWdhdGlvbkxpbmtEaXJlY3RpdmUgZXh0ZW5kcyBBYnN0cmFjdEZkTmd4Q2xhc3Mge1xuXG4gICAgLyoqIFdoZXRoZXIgdGhlIGxpbmsgaGFzIGEgc3VibGlzdC4gKi9cbiAgICBASW5wdXQoKVxuICAgIGhhc1N1Ymxpc3Q6IGJvb2xlYW4gPSBmYWxzZTtcblxuICAgIC8qKiBXaGV0aGVyIHRoZSBzdWIgbGlzdCBpcyBvcGVuZWQgb3IgY2xvc2VkICovXG4gICAgQE91dHB1dCgpXG4gICAgb25TdWJMaXN0T3BlbkNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICAgIEBJbnB1dCgpXG4gICAgc3VibGlzdElzT3BlbjogYm9vbGVhbiA9IGZhbHNlO1xuXG4gICAgQEhvc3RCaW5kaW5nKCdhdHRyLnJvbGUnKSByb2xlID0gdGhpcy5oYXNTdWJsaXN0ID8gJ2J1dHRvbicgOiAnJztcbiAgICBASG9zdEJpbmRpbmcoJ2F0dHIuYXJpYS1oYXNwb3B1cCcpIGhhc1BvcHVwID0gdGhpcy5oYXNTdWJsaXN0O1xuICAgIEBIb3N0QmluZGluZygndGFiaW5kZXgnKSB0YWJpbmRleCA9IHRoaXMuaGFzU3VibGlzdCA/ICcwJyA6ICcnO1xuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBfc2V0UHJvcGVydGllcygpIHtcbiAgICAgICAgdGhpcy5fYWRkQ2xhc3NUb0VsZW1lbnQoJ2ZkLXNpZGUtbmF2X19saW5rJyk7XG4gICAgICAgIGlmICh0aGlzLmhhc1N1Ymxpc3QpIHtcbiAgICAgICAgICAgIHRoaXMuX2FkZENsYXNzVG9FbGVtZW50KCdoYXMtY2hpbGQnKTtcbiAgICAgICAgICAgIHRoaXMuX2FkZFN0eWxlVG9FbGVtZW50KCdjdXJzb3InLCAncG9pbnRlcicpO1xuICAgICAgICAgICAgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQuc2V0QXR0cmlidXRlKCdhcmlhLWV4cGFuZGVkJywgdGhpcy5zdWJsaXN0SXNPcGVuKTtcbiAgICAgICAgfVxuICAgICAgICBpZiAodGhpcy5zdWJsaXN0SXNPcGVuICYmIHRoaXMuaGFzU3VibGlzdCkge1xuICAgICAgICAgICAgdGhpcy5fYWRkQ2xhc3NUb0VsZW1lbnQoJ2lzLXNlbGVjdGVkJyk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIGNvbnN0cnVjdG9yKEBJbmplY3QoRWxlbWVudFJlZikgcHJpdmF0ZSBlbGVtZW50UmVmOiBFbGVtZW50UmVmKSB7XG4gICAgICAgIHN1cGVyKGVsZW1lbnRSZWYpO1xuICAgIH1cblxuICAgIC8qKiBAaGlkZGVuICovXG4gICAgQEhvc3RMaXN0ZW5lcigna2V5cHJlc3MnLCBbJyRldmVudC50YXJnZXQnXSlcbiAgICBvbktleXByZXNzSGFuZGxlcihldmVudCkge1xuICAgICAgICBpZiAodGhpcy5oYXNTdWJsaXN0ICYmIChldmVudC5jb2RlID09PSAnRW50ZXInIHx8IGV2ZW50LmNvZGUgPT09ICdTcGFjZScpKSB7XG4gICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgdGhpcy5jaGFuZ2VTdWJMaXN0SXNPcGVuKCk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBASG9zdExpc3RlbmVyKCdjbGljaycsIFsnJGV2ZW50LnRhcmdldCddKVxuICAgIGNoYW5nZVN1Ykxpc3RJc09wZW4oKSB7XG4gICAgICAgIGlmICh0aGlzLmhhc1N1Ymxpc3QpIHtcbiAgICAgICAgICAgIHRoaXMuc3VibGlzdElzT3BlbiA9ICF0aGlzLnN1Ymxpc3RJc09wZW47XG4gICAgICAgICAgICB0aGlzLm9uU3ViTGlzdE9wZW5DaGFuZ2UuZW1pdCh0aGlzLnN1Ymxpc3RJc09wZW4pO1xuICAgICAgICAgICAgdGhpcy5uZ09uQ2hhbmdlcygpO1xuICAgICAgICB9XG4gICAgfVxufVxuIl19