desy-angular 5.1.1 → 5.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3895,6 +3895,7 @@
3895
3895
  _this.quitFocus = new i0.EventEmitter();
3896
3896
  _this.isFocus = false;
3897
3897
  _this.isHover = false;
3898
+ _this._matchesValidText = false; // True si el contenido del item encaja con los criterios de búsqueda y se está filtrando
3898
3899
  return _this;
3899
3900
  }
3900
3901
  TreeItemComponent.prototype.ngOnChanges = function (changes) {
@@ -4152,6 +4153,7 @@
4152
4153
  var itemText = this.hiddenWrapper.nativeElement.textContent;
4153
4154
  matches = SearchUtils.containsAnyWordFrom(itemText, value);
4154
4155
  }
4156
+ this._matchesValidText = value ? matches : false;
4155
4157
  return matches;
4156
4158
  };
4157
4159
  TreeItemComponent.prototype.getKey = function () {
@@ -4174,6 +4176,9 @@
4174
4176
  }
4175
4177
  return parentKey;
4176
4178
  };
4179
+ TreeItemComponent.prototype.isActive = function () {
4180
+ return this.active || this._matchesValidText;
4181
+ };
4177
4182
  /*
4178
4183
  * Métodos privados
4179
4184
  */
@@ -4192,7 +4197,7 @@
4192
4197
  TreeItemComponent.decorators = [
4193
4198
  { type: i0.Component, args: [{
4194
4199
  selector: 'desy-tree-item',
4195
- template: "<li *ngIf=\"allParentsExpanded && !isHidden(); else hidden\"\r\n [id]=\"id\"\r\n [class]=\"'c-tree__item focus:outline-none'\"\r\n [ngClass]=\"{\r\n 'ml-4': subLevel === 0,\r\n 'ml-8': subLevel !== 0,\r\n 'c-tree__item--focus': isFocus && !sub,\r\n 'c-tree__item--hover': isHover && !sub,\r\n 'font-bold': active && subLevel === 0\r\n }\"\r\n (focusin)=\"handleItemFocus(true, !sub)\"\r\n (focusout)=\"handleItemFocus(false, !sub)\"\r\n (mouseover)=\"handleItemHover(true, !sub)\"\r\n (mouseout)=\"handleItemHover(false, !sub)\"\r\n (keydown.home)=\"handleHome($event, !sub)\"\r\n (keydown.end)=\"handleEnd($event, !sub)\"\r\n (keydown.arrowup)=\"handleArrowUp($event, !sub)\"\r\n (keydown.arrowdown)=\"handleArrowDown($event, !sub)\"\r\n (keydown.arrowright)=\"handleArrowRight($event, !sub)\"\r\n (keydown.arrowleft)=\"handleArrowLeft($event, !sub)\"\r\n role=\"treeitem\"\r\n [attr.aria-expanded]=\"sub ? (expanded ? 'true' : 'false') : null\"\r\n [attr.aria-current]=\"active && subLevel === 0 ? 'page' : null\"\r\n [attr.disabled]=\"disabled && subLevel === 0 ? 'disabled' : null\"\r\n [attr.aria-disabled]=\"disabled && subLevel === 0 ? 'true' : null\"\r\n [attr.tabIndex]=\"disabled && subLevel === 0 ? '-1' : null\">\r\n <div *ngIf=\"!sub && subLevel !== 0; else childrenTree\"\r\n [id]=\"id\"\r\n [class]=\"['block', classes] | makeHtmlList\"\r\n [ngClass]=\"{'font-bold': active}\"\r\n [attr.title]=\"title ? title : null\"\r\n [attr.disabled]=\"disabled ? 'disabled' : null\"\r\n\r\n [attr.role]=\"role ? role : 'tree'\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : (disabled ? 'true' : null)\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : (active ? 'page' : null)\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.aria-modal]=\"ariaModal ? ariaModal : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : (disabled ? '-1' : null)\">\r\n <div class=\"font-bold\" *ngIf=\"active; else checkbox\">\r\n <ng-container *ngTemplateOutlet=\"checkbox\"></ng-container>\r\n </div>\r\n </div>\r\n</li>\r\n\r\n<ng-template #childrenTree>\r\n <div *ngIf=\"sub; else checkbox\" class=\"w-full h-full\"\r\n [ngClass]=\"{'c-tree__item--focus': isFocus && sub, 'c-tree__item--hover': isHover && sub}\"\r\n (focusin)=\"handleItemFocus(true)\"\r\n (focusout)=\"handleItemFocus(false)\"\r\n (mouseover)=\"handleItemHover(true)\"\r\n (mouseout)=\"handleItemHover(false)\"\r\n (keydown.home)=\"handleHome($event)\"\r\n (keydown.end)=\"handleEnd($event)\"\r\n (keydown.arrowup)=\"handleArrowUp($event)\"\r\n (keydown.arrowdown)=\"handleArrowDown($event)\"\r\n (keydown.arrowright)=\"handleArrowRight($event)\"\r\n (keydown.arrowLeft)=\"handleArrowLeft($event)\">\r\n <div [class]=\"['w-full flex items-center relative focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-left', classes] | makeHtmlList\"\r\n\r\n [attr.role]=\"role ? role : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.aria-modal]=\"ariaModal ? ariaModal : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <span class=\"absolute top-3 -left-4 flex items-center w-4 h-2.5 text-primary-base font-bold\">\r\n <svg (click)=\"expandSub(false)\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10 10\" width=\"10\" height=\"10\" aria-hidden=\"true\" class=\"c-tree__minus\"><path fill=\"currentColor\" d=\"M9.286 5.714H.714a.714.714 0 010-1.428h8.572a.714.714 0 010 1.428z\"/></svg>\r\n <svg (click)=\"expandSub(true)\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10 10\" width=\"10\" height=\"10\" aria-hidden=\"true\" class=\"c-tree__plus\"><path fill=\"currentColor\" d=\"M9.286 4.286H5.893a.179.179 0 01-.179-.179V.714a.714.714 0 00-1.428 0v3.393a.179.179 0 01-.179.179H.714a.714.714 0 000 1.428h3.393a.179.179 0 01.179.179v3.393a.714.714 0 001.428 0V5.893a.179.179 0 01.179-.179h3.393a.714.714 0 000-1.428z\"/></svg>\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"checkbox\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <ng-container *desyCustomInnerContent=\"{ component: sub }\"></ng-container>\r\n</ng-template>\r\n\r\n<!-- Se incorpora el contenido m\u00EDnimo para funcionar con el objetivo de mejorar el rendimiento -->\r\n<ng-template #hidden>\r\n <li class=\"hidden\">\r\n <div #hiddenWrapper>\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </div>\r\n <ng-container *desyCustomInnerContent=\"{ component: sub }\"></ng-container>\r\n </li>\r\n</ng-template>\r\n\r\n<ng-template #checkbox>\r\n <desy-tree-checkbox [name]=\"name ? name : parentName\"\r\n [id]=\"getId()\"\r\n [value]=\"value\"\r\n [classes]=\"classes\"\r\n [type]=\"type\"\r\n [(checked)]=\"checked\" (checkedChange)=\"handleCheckboxChange($event)\"\r\n [hasError]=\"inheritedHasError\"\r\n [disabled]=\"disabled\"\r\n [hasDividers]=\"hasDividers\"\r\n [describedBy]=\"[inheritedDescribedBy, hint?.id] | makeHtmlList\"\r\n [isIndeterminate]=\"isIndeterminate\"\r\n [(indeterminateChecked)]=\"indeterminateChecked\"\r\n (indeterminateCheckedChange)=\"handleIndeterminateCheckedChange($event)\"\r\n\r\n [labelComponent]=\"label\"\r\n [hintComponent]=\"hint\"\r\n\r\n [role]=\"role\"\r\n [ariaLabel]=\"ariaLabel\"\r\n [ariaDescribedBy]=\"ariaDescribedBy\"\r\n [ariaLabelledBy]=\"ariaLabelledBy\"\r\n [ariaHidden]=\"ariaHidden\"\r\n [ariaDisabled]=\"ariaDisabled\"\r\n [ariaControls]=\"ariaControls\"\r\n [ariaCurrent]=\"ariaCurrent\"\r\n [ariaLive]=\"ariaLive\"\r\n [ariaExpanded]=\"ariaExpanded\"\r\n [ariaErrorMessage]=\"ariaErrorMessage\"\r\n [ariaHasPopup]=\"ariaHasPopup\"\r\n [ariaModal]=\"ariaModal\"\r\n [tabindex]=\"tabindex\">\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </desy-tree-checkbox>\r\n</ng-template>\r\n\r\n<ng-template #content>\r\n <ng-content select=\"desy-label\"></ng-content>\r\n <ng-content select=\"desy-hint\"></ng-content>\r\n</ng-template>\r\n",
4200
+ template: "<li *ngIf=\"allParentsExpanded && !isHidden(); else hidden\"\r\n [id]=\"id\"\r\n [class]=\"'c-tree__item focus:outline-none'\"\r\n [ngClass]=\"{\r\n 'ml-4': subLevel === 0,\r\n 'ml-8': subLevel !== 0,\r\n 'c-tree__item--focus': isFocus && !sub,\r\n 'c-tree__item--hover': isHover && !sub\r\n }\"\r\n (focusin)=\"handleItemFocus(true, !sub)\"\r\n (focusout)=\"handleItemFocus(false, !sub)\"\r\n (mouseover)=\"handleItemHover(true, !sub)\"\r\n (mouseout)=\"handleItemHover(false, !sub)\"\r\n (keydown.home)=\"handleHome($event, !sub)\"\r\n (keydown.end)=\"handleEnd($event, !sub)\"\r\n (keydown.arrowup)=\"handleArrowUp($event, !sub)\"\r\n (keydown.arrowdown)=\"handleArrowDown($event, !sub)\"\r\n (keydown.arrowright)=\"handleArrowRight($event, !sub)\"\r\n (keydown.arrowleft)=\"handleArrowLeft($event, !sub)\"\r\n role=\"treeitem\"\r\n [attr.aria-expanded]=\"sub ? (expanded ? 'true' : 'false') : null\"\r\n [attr.aria-current]=\"isActive() && subLevel === 0 ? 'page' : null\"\r\n [attr.disabled]=\"disabled && subLevel === 0 ? 'disabled' : null\"\r\n [attr.aria-disabled]=\"disabled && subLevel === 0 ? 'true' : null\"\r\n [attr.tabIndex]=\"disabled && subLevel === 0 ? '-1' : null\">\r\n <div *ngIf=\"!sub && subLevel !== 0; else childrenTree\"\r\n [id]=\"id\"\r\n [class]=\"['block', classes] | makeHtmlList\"\r\n [attr.title]=\"title ? title : null\"\r\n [attr.disabled]=\"disabled ? 'disabled' : null\"\r\n\r\n [attr.role]=\"role ? role : 'tree'\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : (disabled ? 'true' : null)\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : (isActive() ? 'page' : null)\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.aria-modal]=\"ariaModal ? ariaModal : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : (disabled ? '-1' : null)\">\r\n <ng-container *ngTemplateOutlet=\"checkbox\"></ng-container>\r\n </div>\r\n</li>\r\n\r\n<ng-template #childrenTree>\r\n <div *ngIf=\"sub; else checkbox\" class=\"w-full h-full\"\r\n [ngClass]=\"{'c-tree__item--focus': isFocus && sub, 'c-tree__item--hover': isHover && sub}\"\r\n (focusin)=\"handleItemFocus(true)\"\r\n (focusout)=\"handleItemFocus(false)\"\r\n (mouseover)=\"handleItemHover(true)\"\r\n (mouseout)=\"handleItemHover(false)\"\r\n (keydown.home)=\"handleHome($event)\"\r\n (keydown.end)=\"handleEnd($event)\"\r\n (keydown.arrowup)=\"handleArrowUp($event)\"\r\n (keydown.arrowdown)=\"handleArrowDown($event)\"\r\n (keydown.arrowright)=\"handleArrowRight($event)\"\r\n (keydown.arrowLeft)=\"handleArrowLeft($event)\">\r\n <div [class]=\"['w-full flex items-center relative focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black text-left', classes] | makeHtmlList\"\r\n\r\n [attr.role]=\"role ? role : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.aria-modal]=\"ariaModal ? ariaModal : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <span class=\"absolute top-3 -left-4 flex items-center w-4 h-2.5 text-primary-base font-bold\">\r\n <svg (click)=\"expandSub(false)\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10 10\" width=\"10\" height=\"10\" aria-hidden=\"true\" class=\"c-tree__minus\"><path fill=\"currentColor\" d=\"M9.286 5.714H.714a.714.714 0 010-1.428h8.572a.714.714 0 010 1.428z\"/></svg>\r\n <svg (click)=\"expandSub(true)\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10 10\" width=\"10\" height=\"10\" aria-hidden=\"true\" class=\"c-tree__plus\"><path fill=\"currentColor\" d=\"M9.286 4.286H5.893a.179.179 0 01-.179-.179V.714a.714.714 0 00-1.428 0v3.393a.179.179 0 01-.179.179H.714a.714.714 0 000 1.428h3.393a.179.179 0 01.179.179v3.393a.714.714 0 001.428 0V5.893a.179.179 0 01.179-.179h3.393a.714.714 0 000-1.428z\"/></svg>\r\n </span>\r\n <ng-container *ngTemplateOutlet=\"checkbox\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <ng-container *desyCustomInnerContent=\"{ component: sub }\"></ng-container>\r\n</ng-template>\r\n\r\n<!-- Se incorpora el contenido m\u00EDnimo para funcionar con el objetivo de mejorar el rendimiento -->\r\n<ng-template #hidden>\r\n <li class=\"hidden\">\r\n <div #hiddenWrapper>\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </div>\r\n <ng-container *desyCustomInnerContent=\"{ component: sub }\"></ng-container>\r\n </li>\r\n</ng-template>\r\n\r\n<ng-template #checkbox>\r\n <desy-tree-checkbox [name]=\"name ? name : parentName\"\r\n [id]=\"getId()\"\r\n [value]=\"value\"\r\n [classes]=\"classes\"\r\n [type]=\"type\"\r\n [(checked)]=\"checked\" (checkedChange)=\"handleCheckboxChange($event)\"\r\n [hasError]=\"inheritedHasError\"\r\n [disabled]=\"disabled\"\r\n [hasDividers]=\"hasDividers\"\r\n [describedBy]=\"[inheritedDescribedBy, hint?.id] | makeHtmlList\"\r\n [isIndeterminate]=\"isIndeterminate\"\r\n [(indeterminateChecked)]=\"indeterminateChecked\"\r\n (indeterminateCheckedChange)=\"handleIndeterminateCheckedChange($event)\"\r\n\r\n [labelComponent]=\"label\"\r\n [hintComponent]=\"hint\"\r\n\r\n [role]=\"role\"\r\n [ariaLabel]=\"ariaLabel\"\r\n [ariaDescribedBy]=\"ariaDescribedBy\"\r\n [ariaLabelledBy]=\"ariaLabelledBy\"\r\n [ariaHidden]=\"ariaHidden\"\r\n [ariaDisabled]=\"ariaDisabled\"\r\n [ariaControls]=\"ariaControls\"\r\n [ariaCurrent]=\"ariaCurrent\"\r\n [ariaLive]=\"ariaLive\"\r\n [ariaExpanded]=\"ariaExpanded\"\r\n [ariaErrorMessage]=\"ariaErrorMessage\"\r\n [ariaHasPopup]=\"ariaHasPopup\"\r\n [ariaModal]=\"ariaModal\"\r\n [tabindex]=\"tabindex\">\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </desy-tree-checkbox>\r\n</ng-template>\r\n\r\n<ng-template #content>\r\n <div class=\"font-bold\" *ngIf=\"isActive(); else contentLabel\">\r\n <ng-container *ngTemplateOutlet=\"contentLabel\"></ng-container>\r\n </div>\r\n <ng-content select=\"desy-hint\"></ng-content>\r\n</ng-template>\r\n\r\n<ng-template #contentLabel>\r\n <ng-content select=\"desy-label\"></ng-content>\r\n</ng-template>\r\n",
4196
4201
  providers: [
4197
4202
  {
4198
4203
  provide: ITreeItem,
@@ -5520,6 +5525,11 @@
5520
5525
  }
5521
5526
  }
5522
5527
  };
5528
+ NavComponent.prototype.simulateClick = function (event, item, index) {
5529
+ event.preventDefault();
5530
+ var element = document.getElementById(this.getItemId(item, index));
5531
+ element === null || element === void 0 ? void 0 : element.click();
5532
+ };
5523
5533
  NavComponent.prototype.isFocusableItem = function (item) {
5524
5534
  return !item.active && !item.disabled;
5525
5535
  };
@@ -5528,7 +5538,7 @@
5528
5538
  NavComponent.decorators = [
5529
5539
  { type: i0.Component, args: [{
5530
5540
  selector: 'desy-nav',
5531
- template: "<ng-template #innerHtml>\r\n <ng-container *ngFor=\"let item of getItemList(); index as i\">\r\n <li>\r\n <span *ngIf=\"item.active\"\r\n [class]=\"['flex items-center px-base py-sm font-semibold', item.classes] | makeHtmlList\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"hasNav ? 'true' : 'page'\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n [attr.tabindex]=\"item.tabindex\"\r\n (click)=\"onClick($event, item)\">\r\n <strong>\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n </strong>\r\n </span>\r\n <a *ngIf=\"!item.active && item.href\"\r\n [href]=\"item.href | externalHref\" [target]=\"item.target\"\r\n [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'pointer-events-none': item.disabled}\"\r\n [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"item.ariaCurrent ? item.ariaCurrent : null\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n (desyContentEmpty)=\"handleContentEmpty(i)\"\r\n (keydown.arrowUp)=\"movePrevious($event, i)\"\r\n (keydown.arrowDown)=\"moveNext($event, i)\"\r\n (click)=\"onClick($event, item)\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n <svg #desyContentEmptyIgnore *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\r\n </a>\r\n <a *ngIf=\"!item.active && !item.href\"\r\n [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"\r\n [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'pointer-events-none': item.disabled}\"\r\n [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"item.ariaCurrent ? item.ariaCurrent : null\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n (keydown.arrowUp)=\"movePrevious($event, i)\"\r\n (keydown.arrowDown)=\"moveNext($event, i)\"\r\n (click)=\"onClick($event, item)\"\r\n (desyContentEmpty)=\"handleContentEmpty(i)\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n <svg #desyContentEmptyIgnore *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\r\n </a>\r\n </li>\r\n <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\r\n <div class=\"sr-only\">Separador</div>\r\n </li>\r\n </ng-container>\r\n</ng-template>\r\n\r\n\r\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\r\n [class]=\"['text-sm', classes] | makeHtmlList\"\r\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\r\n</ul>\r\n<ng-template #wrapIntoNav>\r\n <nav [class]=\"['text-sm', classes] | makeHtmlList\"\r\n [attr.role]=\"role ? role : null\"\r\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\r\n </ul>\r\n </nav>\r\n</ng-template>\r\n"
5541
+ template: "<ng-template #innerHtml>\r\n <ng-container *ngFor=\"let item of getItemList(); index as i\">\r\n <li>\r\n <span *ngIf=\"item.active\"\r\n [class]=\"['flex items-center px-base py-sm font-semibold', item.classes] | makeHtmlList\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-disabled]=\"item.disabled ? item.disabled : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"hasNav ? 'true' : 'page'\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n [attr.tabindex]=\"item.tabindex\"\r\n (click)=\"onClick($event, item)\">\r\n <strong>\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n </strong>\r\n </span>\r\n <a *ngIf=\"!item.active && item.href\"\r\n [href]=\"item.href | externalHref\" [target]=\"item.target\"\r\n [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'pointer-events-none': item.disabled}\"\r\n [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"item.ariaCurrent ? item.ariaCurrent : null\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n (desyContentEmpty)=\"handleContentEmpty(i)\"\r\n (keydown.arrowUp)=\"movePrevious($event, i)\"\r\n (keydown.arrowDown)=\"moveNext($event, i)\"\r\n (click)=\"onClick($event, item)\"\r\n (keydown.space)=\"simulateClick($event, item, i)\"\r\n (keydown.enter)=\"simulateClick($event, item, i)\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n <svg #desyContentEmptyIgnore *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\r\n </a>\r\n <a *ngIf=\"!item.active && !item.href\"\r\n [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment\"\r\n [class]=\"['flex items-center px-base py-sm hover:bg-primary-base hover:text-white focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'pointer-events-none': item.disabled}\"\r\n [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n [attr.tabindex]=\"item.disabled ? -1 : item.tabindex\"\r\n [attr.id]=\"getItemId(item, i)\"\r\n [attr.title]=\"item.title ? item.title : null\"\r\n [attr.role]=\"item.role ? item.role : null\"\r\n [attr.aria-label]=\"item.ariaLabel ? item.ariaLabel : null\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy ? item.ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy ? item.ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"item.ariaHidden ? item.ariaHidden : null\"\r\n [attr.aria-controls]=\"item.ariaControls ? item.ariaControls : null\"\r\n [attr.aria-current]=\"item.ariaCurrent ? item.ariaCurrent : null\"\r\n [attr.aria-live]=\"item.ariaLive ? item.ariaLive : null\"\r\n [attr.aria-expanded]=\"item.ariaExpanded ? item.ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage ? item.ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup ? item.ariaHasPopup : null\"\r\n (keydown.arrowUp)=\"movePrevious($event, i)\"\r\n (keydown.arrowDown)=\"moveNext($event, i)\"\r\n (click)=\"onClick($event, item)\"\r\n (keydown.space)=\"simulateClick($event, item, i)\"\r\n (keydown.enter)=\"simulateClick($event, item, i)\"\r\n (desyContentEmpty)=\"handleContentEmpty(i)\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: item.html, text: item.text }\"></ng-container>\r\n <svg #desyContentEmptyIgnore *ngIf=\"item.disabled\" viewBox=\"0 0 140 140\" height=\"1em\" width=\"1em\" xmlns=\"http://www.w3.org/2000/svg\" class=\"inline-block align-middle ml-sm text-neutral-base fill-current\" aria-hidden=\"true\" focusable=\"false\" ><path d=\"M70 0a70 70 0 1070 70A70.08 70.08 0 0070 0zM20 70a50 50 0 0174.8-43.4 2.51 2.51 0 011.23 1.84 2.48 2.48 0 01-.71 2.1L30.54 95.32a2.51 2.51 0 01-3.94-.52A49.63 49.63 0 0120 70zm100 0a50 50 0 01-74.8 43.4 2.51 2.51 0 01-1.23-1.84 2.48 2.48 0 01.71-2.1l64.78-64.78a2.51 2.51 0 013.94.52A49.63 49.63 0 01120 70z\"/></svg>\r\n </a>\r\n </li>\r\n <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\r\n <div class=\"sr-only\">Separador</div>\r\n </li>\r\n </ng-container>\r\n</ng-template>\r\n\r\n\r\n<ul *ngIf=\"!hasNav; else wrapIntoNav\"\r\n [class]=\"['text-sm', classes] | makeHtmlList\"\r\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\r\n</ul>\r\n<ng-template #wrapIntoNav>\r\n <nav [class]=\"['text-sm', classes] | makeHtmlList\"\r\n [attr.role]=\"role ? role : null\"\r\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\r\n [attr.aria-describedby]=\"ariaDescribedBy ? ariaDescribedBy : null\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy ? ariaLabelledBy : null\"\r\n [attr.aria-hidden]=\"ariaHidden ? ariaHidden : null\"\r\n [attr.aria-disabled]=\"ariaDisabled ? ariaDisabled : null\"\r\n [attr.aria-controls]=\"ariaControls ? ariaControls : null\"\r\n [attr.aria-current]=\"ariaCurrent ? ariaCurrent : null\"\r\n [attr.aria-live]=\"ariaLive ? ariaLive : null\"\r\n [attr.aria-expanded]=\"ariaExpanded ? ariaExpanded : null\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage ? ariaErrorMessage : null\"\r\n [attr.aria-haspopup]=\"ariaHasPopup ? ariaHasPopup : null\"\r\n [attr.tabindex]=\"tabindex ? tabindex : null\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"innerHtml\"></ng-container>\r\n </ul>\r\n </nav>\r\n</ng-template>\r\n"
5532
5542
  },] }
5533
5543
  ];
5534
5544
  NavComponent.propDecorators = {
@@ -6149,21 +6159,12 @@
6149
6159
  var subItems = sub instanceof MenuVerticalItemSubComponent ? sub.itemComponents.toArray() : sub.items;
6150
6160
  return subItems && subItems.length > 0 ? subItems : null;
6151
6161
  };
6152
- MenuVerticalComponent.prototype.focus = function (id, idFocus) {
6153
- var elementToQuitFocus = document.getElementById(id);
6154
- elementToQuitFocus.blur();
6155
- if (idFocus) {
6156
- var elementToFocus = document.getElementById(idFocus);
6157
- elementToFocus.tabIndex = 0;
6158
- elementToFocus === null || elementToFocus === void 0 ? void 0 : elementToFocus.focus();
6159
- }
6160
- };
6161
6162
  return MenuVerticalComponent;
6162
6163
  }(AccessibilityComponent));
6163
6164
  MenuVerticalComponent.decorators = [
6164
6165
  { type: i0.Component, args: [{
6165
6166
  selector: 'desy-menu-vertical',
6166
- template: "<!--\r\n Template para ser utilizado tanto por los items como por los subitems:\r\n - item: Item que representa\r\n - index: indice del item en la lista\r\n - id: identificador del item\r\n - isRoot: si pertenece al nivel raiz\r\n-->\r\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\r\n <ng-container *ngIf=\"item\">\r\n <li class=\"m-base\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\r\n <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\r\n <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [href]=\"item.href | externalHref\"\r\n [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{\r\n 'underline': hasUnderline,\r\n 'hover:text-primary-base hover:underline': !item.disabled,\r\n 'no-underline pointer-events-none': item.disabled,\r\n 'font-bold': item.active\r\n }\"\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.target]=\"item.target ? item.target : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </a>\r\n <ng-template #hasRouterLink>\r\n <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\r\n Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\r\n Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\r\n https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\r\n <a [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\r\n [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\r\n [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{\r\n 'underline': hasUnderline,\r\n 'hover:text-primary-base hover:underline': !item.disabled,\r\n 'no-underline pointer-events-none': item.disabled,\r\n 'font-bold': item.active\r\n }\"\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.target]=\"item.target ? item.target : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\"\r\n \r\n (click)=\"focus(id, item.fragment ? item.fragment : null)\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #notHref>\r\n <span [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [class]=\"['block px-xs', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'font-bold': item.active}\"\r\n\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </span>\r\n </ng-template>\r\n <ng-container *ngIf=\"isRoot && sub\">\r\n <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\r\n [attr.aria-describedby]=\"sub.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"sub.ariaErrorMessage\"\r\n [attr.aria-label]=\"sub.ariaLabel\"\r\n [attr.aria-labelledby]=\"sub.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"sub.ariaHidden\"\r\n [attr.aria-disabled]=\"sub.ariaDisabled\"\r\n [attr.aria-controls]=\"sub.ariaControls\"\r\n [attr.aria-current]=\"sub.ariaCurrent\"\r\n [attr.aria-live]=\"sub.ariaLive\"\r\n [attr.aria-expanded]=\"sub.ariaExpanded\"\r\n [attr.aria-haspopup]=\"sub.ariaHasPopup\"\r\n [attr.tabindex]=\"sub.tabindex\">\r\n <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n item: subItem,\r\n id: getSubItemId(item, index, subIndex),\r\n index: subIndex,\r\n isRoot: false\r\n }\">\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n <div *ngIf=\"!getSubItems(sub)\"\r\n [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\r\n [id]=\"'sub-' + id\">\r\n <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </li>\r\n <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\r\n <div class=\"sr-only\">Separador</div>\r\n </li>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<nav [ngClass]=\"classes\"\r\n [attr.role]=\"(role ? role : null)\"\r\n [attr.aria-describedby]=\"ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-hidden]=\"ariaHidden\"\r\n [attr.aria-disabled]=\"ariaDisabled\"\r\n [attr.aria-controls]=\"ariaControls\"\r\n [attr.aria-current]=\"ariaCurrent\"\r\n [attr.aria-live]=\"ariaLive\"\r\n [attr.aria-expanded]=\"ariaExpanded\"\r\n [attr.aria-haspopup]=\"ariaHasPopup\"\r\n [attr.tabindex]=\"tabindex\">\r\n <ul class=\"text-base\">\r\n <ng-container *ngFor=\"let item of getItems(); index as index\">\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n</nav>\r\n",
6167
+ template: "<!--\r\n Template para ser utilizado tanto por los items como por los subitems:\r\n - item: Item que representa\r\n - index: indice del item en la lista\r\n - id: identificador del item\r\n - isRoot: si pertenece al nivel raiz\r\n-->\r\n<ng-template #itemTemplate let-item=\"item\" let-index=\"index\" let-id=\"id\" let-sub=\"sub\" let-isRoot=\"isRoot\">\r\n <ng-container *ngIf=\"item\">\r\n <li class=\"m-base\" [ngClass]=\"{'origin-top-left text-sm': !isRoot}\">\r\n <ng-container *ngIf=\"item.href || item.routerLink; else notHref\">\r\n <a *ngIf=\"item.href; else hasRouterLink\" [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [href]=\"item.href | externalHref\"\r\n [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{\r\n 'underline': hasUnderline,\r\n 'hover:text-primary-base hover:underline': !item.disabled,\r\n 'no-underline pointer-events-none': item.disabled,\r\n 'font-bold': item.active\r\n }\"\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.target]=\"item.target ? item.target : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </a>\r\n <ng-template #hasRouterLink>\r\n <!-- Todos los enlaces que admiten o href o routerLink estar\u00EDa bien unificarlos (en todos los componentes).\r\n Para ello, ser\u00EDa necesario crear una directiva para a\u00F1adir o quitar la directiva routerLink si no tiene href.\r\n Sin embargo, esto no es posible actualmente, ya que Angular todav\u00EDa no permite a\u00F1adir directivas din\u00E1micamente:\r\n https://angular.io/guide/roadmap#support-adding-directives-to-host-elements -->\r\n <a [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [routerLink]=\"item.routerLink\" [fragment]=\"item.fragment ? item.fragment : null\"\r\n [routerLinkActive]=\"item.routerLinkActiveClasses ? item.routerLinkActiveClasses : []\"\r\n [class]=\"['block px-xs focus:bg-warning-base focus:outline-none focus:shadow-outline-focus focus:text-black', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{\r\n 'underline': hasUnderline,\r\n 'hover:text-primary-base hover:underline': !item.disabled,\r\n 'no-underline pointer-events-none': item.disabled,\r\n 'font-bold': item.active\r\n }\"\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.target]=\"item.target ? item.target : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #notHref>\r\n <span [attr.id]=\"id\"\r\n (desyContentEmpty)=\"handleItemContentEmpty(index, isRoot)\"\r\n [class]=\"['block px-xs', item.classes] | makeHtmlList\"\r\n [ngClass]=\"{'font-bold': item.active}\"\r\n\r\n [attr.title]=\"item.title\"\r\n [attr.tabindex]=\"item.disabled ? -1 : null\"\r\n [attr.aria-current]=\"item.active ? 'page' : null\"\r\n [attr.aria-disabled]=\"item.disabled\"\r\n [attr.aria-describedby]=\"item.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"item.ariaErrorMessage\"\r\n [attr.aria-label]=\"item.ariaLabel\"\r\n [attr.aria-labelledby]=\"item.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"item.ariaHidden\"\r\n [attr.aria-controls]=\"item.ariaControls\"\r\n [attr.aria-live]=\"item.ariaLive\"\r\n [attr.aria-expanded]=\"item.ariaExpanded\"\r\n [attr.aria-haspopup]=\"item.ariaHasPopup\"\r\n [attr.disabled]=\"item.disabled\">\r\n <ng-container *desyCustomInnerContent=\"{ component: item, html: getItemHtml(item), text: item.text }\"></ng-container>\r\n </span>\r\n </ng-template>\r\n <ng-container *ngIf=\"isRoot && sub\">\r\n <ul *ngIf=\"getSubItems(sub)\" [ngClass]=\"sub.classes\"\r\n [attr.aria-describedby]=\"sub.ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"sub.ariaErrorMessage\"\r\n [attr.aria-label]=\"sub.ariaLabel\"\r\n [attr.aria-labelledby]=\"sub.ariaLabelledBy\"\r\n [attr.aria-hidden]=\"sub.ariaHidden\"\r\n [attr.aria-disabled]=\"sub.ariaDisabled\"\r\n [attr.aria-controls]=\"sub.ariaControls\"\r\n [attr.aria-current]=\"sub.ariaCurrent\"\r\n [attr.aria-live]=\"sub.ariaLive\"\r\n [attr.aria-expanded]=\"sub.ariaExpanded\"\r\n [attr.aria-haspopup]=\"sub.ariaHasPopup\"\r\n [attr.tabindex]=\"sub.tabindex\">\r\n <ng-container *ngFor=\"let subItem of getSubItems(sub); index as subIndex\">\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n item: subItem,\r\n id: getSubItemId(item, index, subIndex),\r\n index: subIndex,\r\n isRoot: false\r\n }\">\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n <div *ngIf=\"!getSubItems(sub)\"\r\n [class]=\"['mb-base px-xs origin-top-left text-sm text-neutral-dark', sub.classes] | makeHtmlList\"\r\n [id]=\"'sub-' + id\">\r\n <ng-container *desyCustomInnerContent=\"{ component: sub, html: sub.html }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </li>\r\n <li *ngIf=\"item.divider\" class=\"my-sm border-b border-neutral-base\" aria-hidden=\"true\">\r\n <div class=\"sr-only\">Separador</div>\r\n </li>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<nav [ngClass]=\"classes\"\r\n [attr.role]=\"(role ? role : null)\"\r\n [attr.aria-describedby]=\"ariaDescribedBy\"\r\n [attr.aria-errormessage]=\"ariaErrorMessage\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-hidden]=\"ariaHidden\"\r\n [attr.aria-disabled]=\"ariaDisabled\"\r\n [attr.aria-controls]=\"ariaControls\"\r\n [attr.aria-current]=\"ariaCurrent\"\r\n [attr.aria-live]=\"ariaLive\"\r\n [attr.aria-expanded]=\"ariaExpanded\"\r\n [attr.aria-haspopup]=\"ariaHasPopup\"\r\n [attr.tabindex]=\"tabindex\">\r\n <ul class=\"text-base\">\r\n <ng-container *ngFor=\"let item of getItems(); index as index\">\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: item, id: getId(item, index), index: index, sub: getItemSub(item), isRoot: true }\">\r\n </ng-container>\r\n </ng-container>\r\n </ul>\r\n</nav>\r\n",
6167
6168
  animations: [
6168
6169
  animations.trigger('displayMenuVertical', [
6169
6170
  animations.state('void', animations.style({