UNPKG

@indice/ng-components

Version:

Indice common components for Angular v12

31 lines 7.96 kB
import { Component, Inject } from '@angular/core'; import { APP_LANGUAGES } from '../../tokens'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; import * as i2 from "../../directives/click-outside.directive"; export class LanguageSelectionComponent { constructor(langsService) { this.langsService = langsService; this.menuExpanded = false; } ngOnInit() { } selectLang(option) { if (this.langsService?.setSelected) { this.langsService.setSelected(option.value); } } onClickOutside($event) { this.menuExpanded = false; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: LanguageSelectionComponent, deps: [{ token: APP_LANGUAGES }], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: LanguageSelectionComponent, selector: "lib-language-selection", ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n <button class=\"langs-button\" (click)=\"menuExpanded = !menuExpanded\">\r\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--Globe\"></i>\r\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\r\n <span *ngIf=\"lang.value === langsService?.selected\">{{lang.text}}</span>\r\n </ng-container>\r\n </button>\r\n\r\n <div\r\n [class]=\"menuExpanded ? 'langs-menu-expanded':'langs-menu-collapsed'\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <div class=\"py-1\" role=\"none\">\r\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\r\n <a (click)=\"selectLang(lang)\" *ngIf=\"lang.value != langsService?.selected\" class=\"nav-link-profile\" role=\"menuitem\" tabindex=\"-1\" id=\"menu-item-0\">\r\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--GlobeFavorite\"></i>\r\n {{lang.description}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: LanguageSelectionComponent, decorators: [{ type: Component, args: [{ selector: 'lib-language-selection', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n <button class=\"langs-button\" (click)=\"menuExpanded = !menuExpanded\">\r\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--Globe\"></i>\r\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\r\n <span *ngIf=\"lang.value === langsService?.selected\">{{lang.text}}</span>\r\n </ng-container>\r\n </button>\r\n\r\n <div\r\n [class]=\"menuExpanded ? 'langs-menu-expanded':'langs-menu-collapsed'\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <div class=\"py-1\" role=\"none\">\r\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\r\n <a (click)=\"selectLang(lang)\" *ngIf=\"lang.value != langsService?.selected\" class=\"nav-link-profile\" role=\"menuitem\" tabindex=\"-1\" id=\"menu-item-0\">\r\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--GlobeFavorite\"></i>\r\n {{lang.description}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</div>\r\n" }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [APP_LANGUAGES] }] }] }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFuZ3VhZ2Utc2VsZWN0aW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWNvbXBvbmVudHMvc3JjL2xpYi9jb250cm9scy9sYW5ndWFnZS1zZWxlY3Rpb24vbGFuZ3VhZ2Utc2VsZWN0aW9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWNvbXBvbmVudHMvc3JjL2xpYi9jb250cm9scy9sYW5ndWFnZS1zZWxlY3Rpb24vbGFuZ3VhZ2Utc2VsZWN0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzFELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxjQUFjLENBQUM7Ozs7QUFPN0MsTUFBTSxPQUFPLDBCQUEwQjtJQUdyQyxZQUEwQyxZQUE4QztRQUE5QyxpQkFBWSxHQUFaLFlBQVksQ0FBa0M7UUFEakYsaUJBQVksR0FBRyxLQUFLLENBQUM7SUFDZ0UsQ0FBQztJQUU3RixRQUFRO0lBQ1IsQ0FBQztJQUVNLFVBQVUsQ0FBQyxNQUFrQjtRQUNsQyxJQUFJLElBQUksQ0FBQyxZQUFZLEVBQUUsV0FBVyxFQUFFLENBQUM7WUFDbkMsSUFBSSxDQUFDLFlBQVksQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzlDLENBQUM7SUFDSCxDQUFDO0lBRU0sY0FBYyxDQUFDLE1BQVc7UUFDL0IsSUFBSSxDQUFDLFlBQVksR0FBRyxLQUFLLENBQUM7SUFDNUIsQ0FBQzs4R0FoQlUsMEJBQTBCLGtCQUdqQixhQUFhO2tHQUh0QiwwQkFBMEIsOERDVHZDLDhpQ0FvQkE7OzJGRFhhLDBCQUEwQjtrQkFKdEMsU0FBUzsrQkFDRSx3QkFBd0I7OzBCQU1yQixNQUFNOzJCQUFDLGFBQWEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBNZW51T3B0aW9uIH0gZnJvbSAnLi8uLi8uLi90eXBlcyc7XHJcbmltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQVBQX0xBTkdVQUdFUyB9IGZyb20gJy4uLy4uL3Rva2Vucyc7XHJcbmltcG9ydCB7IElBcHBMYW5ndWFnZXNTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vdHlwZXMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItbGFuZ3VhZ2Utc2VsZWN0aW9uJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vbGFuZ3VhZ2Utc2VsZWN0aW9uLmNvbXBvbmVudC5odG1sJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgTGFuZ3VhZ2VTZWxlY3Rpb25Db21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuICBwdWJsaWMgbWVudUV4cGFuZGVkID0gZmFsc2U7XHJcbiAgY29uc3RydWN0b3IoQEluamVjdChBUFBfTEFOR1VBR0VTKSBwdWJsaWMgbGFuZ3NTZXJ2aWNlOiBJQXBwTGFuZ3VhZ2VzU2VydmljZSB8IHVuZGVmaW5lZCkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gIH1cclxuXHJcbiAgcHVibGljIHNlbGVjdExhbmcob3B0aW9uOiBNZW51T3B0aW9uKTogdm9pZCB7XHJcbiAgICBpZiAodGhpcy5sYW5nc1NlcnZpY2U/LnNldFNlbGVjdGVkKSB7XHJcbiAgICAgIHRoaXMubGFuZ3NTZXJ2aWNlLnNldFNlbGVjdGVkKG9wdGlvbi52YWx1ZSk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgb25DbGlja091dHNpZGUoJGV2ZW50OiBhbnkpOiB2b2lkIHtcclxuICAgIHRoaXMubWVudUV4cGFuZGVkID0gZmFsc2U7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJyZWxhdGl2ZVwiIChjbGlja091dHNpZGUpPVwib25DbGlja091dHNpZGUoJGV2ZW50KVwiPlxyXG4gIDxidXR0b24gY2xhc3M9XCJsYW5ncy1idXR0b25cIiAoY2xpY2spPVwibWVudUV4cGFuZGVkID0gIW1lbnVFeHBhbmRlZFwiPlxyXG4gICAgPGkgY2xhc3M9XCJ0ZXh0LXhzIG1yLTEgbXMtSWNvbiBtcy1JY29uLS1HbG9iZVwiPjwvaT5cclxuICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IGxhbmcgb2YgbGFuZ3NTZXJ2aWNlPy5vcHRpb25zIHwgYXN5bmNcIj5cclxuICAgICAgPHNwYW4gKm5nSWY9XCJsYW5nLnZhbHVlID09PSBsYW5nc1NlcnZpY2U/LnNlbGVjdGVkXCI+e3tsYW5nLnRleHR9fTwvc3Bhbj5cclxuICAgIDwvbmctY29udGFpbmVyPlxyXG4gIDwvYnV0dG9uPlxyXG5cclxuICA8ZGl2XHJcbiAgICBbY2xhc3NdPVwibWVudUV4cGFuZGVkID8gJ2xhbmdzLW1lbnUtZXhwYW5kZWQnOidsYW5ncy1tZW51LWNvbGxhcHNlZCdcIiByb2xlPVwibWVudVwiIGFyaWEtb3JpZW50YXRpb249XCJ2ZXJ0aWNhbFwiIGFyaWEtbGFiZWxsZWRieT1cIm1lbnUtYnV0dG9uXCIgdGFiaW5kZXg9XCItMVwiPlxyXG4gICAgPGRpdiBjbGFzcz1cInB5LTFcIiByb2xlPVwibm9uZVwiPlxyXG4gICAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCBsYW5nIG9mIGxhbmdzU2VydmljZT8ub3B0aW9ucyB8IGFzeW5jXCI+XHJcbiAgICAgICAgPGEgKGNsaWNrKT1cInNlbGVjdExhbmcobGFuZylcIiAqbmdJZj1cImxhbmcudmFsdWUgIT0gbGFuZ3NTZXJ2aWNlPy5zZWxlY3RlZFwiIGNsYXNzPVwibmF2LWxpbmstcHJvZmlsZVwiIHJvbGU9XCJtZW51aXRlbVwiIHRhYmluZGV4PVwiLTFcIiBpZD1cIm1lbnUtaXRlbS0wXCI+XHJcbiAgICAgICAgICA8aSBjbGFzcz1cInRleHQteHMgbXItMSBtcy1JY29uIG1zLUljb24tLUdsb2JlRmF2b3JpdGVcIj48L2k+XHJcbiAgICAgICAgICB7e2xhbmcuZGVzY3JpcHRpb259fVxyXG4gICAgICAgIDwvYT5cclxuICAgICAgPC9uZy1jb250YWluZXI+XHJcbiAgICA8L2Rpdj5cclxuICA8L2Rpdj5cclxuPC9kaXY+XHJcbiJdfQ==