@seniorsistemas/angular-components 17.7.3 → 17.7.5

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.
Files changed (50) hide show
  1. package/bundles/seniorsistemas-angular-components.umd.js +335 -235
  2. package/bundles/seniorsistemas-angular-components.umd.js.map +1 -1
  3. package/bundles/seniorsistemas-angular-components.umd.min.js +2 -2
  4. package/bundles/seniorsistemas-angular-components.umd.min.js.map +1 -1
  5. package/components/tiered-menu/components/tiered-menu/tiered-menu.component.d.ts +8 -4
  6. package/components/tiered-menu/components/tiered-menu-item/tiered-menu-item.component.d.ts +2 -1
  7. package/components/tiered-menu/components/tiered-menu-nested/tiered-menu-nested.component.d.ts +7 -4
  8. package/components/tiered-menu/models/tiered-menu-item-data.d.ts +2 -0
  9. package/components/tiered-menu/models/tiered-menu-item-internal-data.d.ts +2 -6
  10. package/components/tiered-menu/{tiered-menu.event.service.d.ts → services/tiered-menu.event.service.d.ts} +1 -8
  11. package/components/tiered-menu/services/tiered-menu.global.service.d.ts +4 -0
  12. package/components/tiered-menu/{tiered-menu.service.d.ts → services/tiered-menu.service.d.ts} +5 -3
  13. package/components/tiered-menu/tiered-menu.directive.d.ts +16 -14
  14. package/esm2015/components/ia-insight/components/ia-insight-card/components/ia-insight-card-loader/ia-insight-card-loader.component.js +3 -3
  15. package/esm2015/components/ia-insight/components/ia-insight-card/ia-insight-card.component.js +3 -2
  16. package/esm2015/components/tiered-menu/components/tiered-menu/tiered-menu.component.js +110 -51
  17. package/esm2015/components/tiered-menu/components/tiered-menu-item/tiered-menu-item.component.js +16 -8
  18. package/esm2015/components/tiered-menu/components/tiered-menu-nested/tiered-menu-nested.component.js +53 -9
  19. package/esm2015/components/tiered-menu/models/tiered-menu-item-data.js +1 -1
  20. package/esm2015/components/tiered-menu/models/tiered-menu-item-internal-data.js +1 -1
  21. package/esm2015/components/tiered-menu/services/tiered-menu.event.service.js +18 -0
  22. package/esm2015/components/tiered-menu/services/tiered-menu.global.service.js +9 -0
  23. package/esm2015/components/tiered-menu/services/tiered-menu.service.js +51 -0
  24. package/esm2015/components/tiered-menu/tiered-menu.directive.js +103 -109
  25. package/esm2015/components/tiered-menu/tiered-menu.module.js +8 -12
  26. package/esm2015/seniorsistemas-angular-components.js +18 -17
  27. package/esm5/components/ia-insight/components/ia-insight-card/components/ia-insight-card-loader/ia-insight-card-loader.component.js +3 -3
  28. package/esm5/components/ia-insight/components/ia-insight-card/ia-insight-card.component.js +3 -2
  29. package/esm5/components/tiered-menu/components/tiered-menu/tiered-menu.component.js +110 -51
  30. package/esm5/components/tiered-menu/components/tiered-menu-item/tiered-menu-item.component.js +16 -8
  31. package/esm5/components/tiered-menu/components/tiered-menu-nested/tiered-menu-nested.component.js +53 -9
  32. package/esm5/components/tiered-menu/models/tiered-menu-item-data.js +1 -1
  33. package/esm5/components/tiered-menu/models/tiered-menu-item-internal-data.js +1 -1
  34. package/esm5/components/tiered-menu/services/tiered-menu.event.service.js +19 -0
  35. package/esm5/components/tiered-menu/services/tiered-menu.global.service.js +12 -0
  36. package/esm5/components/tiered-menu/services/tiered-menu.service.js +54 -0
  37. package/esm5/components/tiered-menu/tiered-menu.directive.js +103 -110
  38. package/esm5/components/tiered-menu/tiered-menu.module.js +8 -12
  39. package/esm5/seniorsistemas-angular-components.js +18 -17
  40. package/fesm2015/seniorsistemas-angular-components.js +313 -214
  41. package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
  42. package/fesm5/seniorsistemas-angular-components.js +317 -218
  43. package/fesm5/seniorsistemas-angular-components.js.map +1 -1
  44. package/package.json +2 -1
  45. package/seniorsistemas-angular-components.d.ts +17 -16
  46. package/seniorsistemas-angular-components.metadata.json +1 -1
  47. package/esm2015/components/tiered-menu/tiered-menu.event.service.js +0 -39
  48. package/esm2015/components/tiered-menu/tiered-menu.service.js +0 -39
  49. package/esm5/components/tiered-menu/tiered-menu.event.service.js +0 -40
  50. package/esm5/components/tiered-menu/tiered-menu.service.js +0 -44
@@ -50,6 +50,7 @@ import { MessageService, ConfirmationService } from 'primeng/api';
50
50
  import { ProgressBarModule as ProgressBarModule$1 } from 'primeng/progressbar';
51
51
  import { DomSanitizer } from '@angular/platform-browser';
52
52
  import { Clipboard } from '@angular/cdk/clipboard';
53
+ import marked from 'marked';
53
54
  import Cropper from 'cropperjs';
54
55
  import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk/drag-drop';
55
56
  import * as elementResizeDetectorMaker_ from 'element-resize-detector';
@@ -12476,7 +12477,7 @@ let IAInsightCardComponent = class IAInsightCardComponent {
12476
12477
  this.insight.request$
12477
12478
  .pipe(first(), finalize(() => (this.isLoading = false)))
12478
12479
  .subscribe((content) => {
12479
- this.content = content;
12480
+ this.content = marked.marked(content);
12480
12481
  });
12481
12482
  }
12482
12483
  };
@@ -12548,8 +12549,8 @@ let IAInsightCardLoaderComponent = class IAInsightCardLoaderComponent {
12548
12549
  IAInsightCardLoaderComponent = __decorate([
12549
12550
  Component({
12550
12551
  selector: "s-ia-insight-card-loader",
12551
- template: "<div class=\"ia-insight-card-loader\">\n <div class=\"loader\">\n <div class=\"loader-icon\">\n <div sSVGFactory></div>\n </div>\n </div>\n \n <span class=\"loader-label\">{{ \"platform.angular_components.loading_insight\" | translate }}</span>\n</div>\n",
12552
- styles: [".ia-insight-card-loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}.ia-insight-card-loader .loader{-ms-flex-align:center;align-items:center;animation:2s linear infinite spin;border:2px solid #f1f7f8;border-top:2px solid #0fa389;border-radius:50%;display:-ms-flexbox;display:flex;height:48px;-ms-flex-pack:center;justify-content:center;width:48px}.ia-insight-card-loader .loader .loader-icon{animation:2s linear infinite reverse spin;height:64px;transform:translate(-50%,-50%);width:64px}.ia-insight-card-loader .loader-label{color:#888b99;font-family:\"Open Sans\",sans-serif;font-size:16px}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}"]
12552
+ template: "<div class=\"ia-insight-card-loader\">\n <div class=\"loader\">\n <div class=\"loader-icon\">\n <div *sSVGFactory=\"'iassist'\"></div>\n </div>\n </div>\n \n <span class=\"loader-label\">{{ \"platform.angular_components.loading_insight\" | translate }}</span>\n</div>\n",
12553
+ styles: [".ia-insight-card-loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}.ia-insight-card-loader .loader{-ms-flex-align:center;align-items:center;animation:2s linear infinite spin;border:2px solid #f1f7f8;border-top:2px solid #0fa389;border-radius:50%;display:-ms-flexbox;display:flex;height:48px;-ms-flex-pack:center;justify-content:center;width:48px}.ia-insight-card-loader .loader .loader-icon{animation:2s linear infinite reverse spin;height:32px;transform:translate(-50%,-50%)}.ia-insight-card-loader .loader-label{color:#888b99;font-family:\"Open Sans\",sans-serif;font-size:16px}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}"]
12553
12554
  })
12554
12555
  ], IAInsightCardLoaderComponent);
12555
12556
 
@@ -14952,46 +14953,31 @@ let TieredMenuEventService = class TieredMenuEventService {
14952
14953
  this.closeItemMenuEvent = new EventEmitter();
14953
14954
  this.createMenuEvent = new EventEmitter();
14954
14955
  }
14955
- emitIncrementCurrentItemEvent() {
14956
- this.incrementCurrentItemEvent.emit();
14957
- }
14958
- emitDecrementCurrentItemEvent() {
14959
- this.decrementCurrentItemEvent.emit();
14960
- }
14961
- emitCloseAllMenusEvent() {
14962
- this.closeAllMenusEvent.emit();
14963
- }
14964
- emitSelectItemEvent(item) {
14965
- this.selectItemEvent.emit(item);
14966
- }
14967
- emitOpenItemMenuEvent(item) {
14968
- this.openItemMenuEvent.emit(item);
14969
- }
14970
- emitCloseItemMenuEvent(item) {
14971
- this.closeItemMenuEvent.emit(item);
14972
- }
14973
- emitCreateMenuEvent(item) {
14974
- this.createMenuEvent.emit(item);
14975
- }
14976
14956
  };
14977
14957
  TieredMenuEventService = __decorate([
14978
14958
  Injectable()
14979
14959
  ], TieredMenuEventService);
14980
14960
 
14981
14961
  let TieredMenuService = class TieredMenuService {
14962
+ constructor() {
14963
+ this.currentItems = [];
14964
+ this.items = [];
14965
+ }
14982
14966
  normalizeData(items, parent) {
14983
14967
  return items.map((i) => {
14984
- if (i.submenu) {
14985
- i.submenu = this.normalizeData(i.submenu, i);
14968
+ const item = Object.assign({}, i);
14969
+ if (item.submenu) {
14970
+ item.submenu = this.normalizeData(item.submenu, item);
14986
14971
  }
14987
- i.id = `id-${Math.random().toString(36).substring(2, 9)}-${Date.now().toString(36)}`;
14988
- i.parent = parent;
14989
- i.isOpen = false;
14990
- return i;
14972
+ item.id = this._generateId();
14973
+ item.parent = parent;
14974
+ item.isOpen = false;
14975
+ return item;
14991
14976
  });
14992
14977
  }
14993
14978
  markAllItemsAsClosed(items) {
14994
- return items.map((item) => {
14979
+ return items.map((i) => {
14980
+ const item = Object.assign({}, i);
14995
14981
  if (item.submenu) {
14996
14982
  item.submenu = this.markAllItemsAsClosed(item.submenu);
14997
14983
  }
@@ -14999,16 +14985,22 @@ let TieredMenuService = class TieredMenuService {
14999
14985
  return item;
15000
14986
  });
15001
14987
  }
15002
- searchTheHierarchy(item1, item2) {
15003
- let itemAux = item2;
15004
- while (itemAux) {
15005
- if (itemAux === item1) {
14988
+ searchTheHierarchy(itemA, itemB) {
14989
+ let item = itemB;
14990
+ while (item) {
14991
+ if (item === itemA) {
15006
14992
  return true;
15007
14993
  }
15008
- itemAux = itemAux.parent;
14994
+ item = item.parent;
15009
14995
  }
15010
14996
  return false;
15011
14997
  }
14998
+ cloneItems(items) {
14999
+ return JSON.parse(JSON.stringify(items));
15000
+ }
15001
+ _generateId() {
15002
+ return `id-${Math.random().toString(36).substring(2, 9)}-${Math.random().toString(36).substring(2, 9)}-${Math.random().toString(36).substring(2, 9)}`;
15003
+ }
15012
15004
  };
15013
15005
  TieredMenuService = __decorate([
15014
15006
  Injectable()
@@ -15019,9 +15011,44 @@ let TieredMenuNestedComponent = class TieredMenuNestedComponent {
15019
15011
  this.tieredMenuService = tieredMenuService;
15020
15012
  this._tieredMenuEventService = _tieredMenuEventService;
15021
15013
  this.top = 0;
15022
- this.maxHeight = 0;
15014
+ this.left = 0;
15023
15015
  this._unsubscribe$ = new Subject();
15024
15016
  }
15017
+ onResize() {
15018
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15019
+ }
15020
+ onDocumentClick(event) {
15021
+ // Closing menu when clicked outside.
15022
+ const target = event.target;
15023
+ const clickedInside = target.closest("s-tiered-menu-item") || target.closest("s-tiered-menu-divider");
15024
+ if (!clickedInside) {
15025
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15026
+ }
15027
+ }
15028
+ onKeydownHandler(event) {
15029
+ switch (event.key) {
15030
+ case "Escape":
15031
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15032
+ break;
15033
+ case " ":
15034
+ case "Enter":
15035
+ this._tieredMenuEventService.selectItemEvent.emit(this.tieredMenuService.currentItem);
15036
+ break;
15037
+ case "ArrowLeft":
15038
+ // When nested I need a reference to the current item's parent item, otherwise just the current item.
15039
+ this._tieredMenuEventService.closeItemMenuEvent.emit(this.tieredMenuService.currentItem.parent);
15040
+ break;
15041
+ case "ArrowRight":
15042
+ this._tieredMenuEventService.openItemMenuEvent.emit(this.tieredMenuService.currentItem);
15043
+ break;
15044
+ case "ArrowUp":
15045
+ this._tieredMenuEventService.decrementCurrentItemEvent.emit();
15046
+ break;
15047
+ case "ArrowDown":
15048
+ this._tieredMenuEventService.incrementCurrentItemEvent.emit();
15049
+ break;
15050
+ }
15051
+ }
15025
15052
  ngOnInit() {
15026
15053
  this.tieredMenuService.currentItems = this.items;
15027
15054
  this._subscribeEvents();
@@ -15101,7 +15128,7 @@ let TieredMenuNestedComponent = class TieredMenuNestedComponent {
15101
15128
  if (item.command) {
15102
15129
  item.command();
15103
15130
  // Close all menus after the item was selected.
15104
- this._tieredMenuEventService.emitCloseAllMenusEvent();
15131
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15105
15132
  }
15106
15133
  });
15107
15134
  this._tieredMenuEventService.openItemMenuEvent
@@ -15113,7 +15140,7 @@ let TieredMenuNestedComponent = class TieredMenuNestedComponent {
15113
15140
  while ((_a = itemAux === null || itemAux === void 0 ? void 0 : itemAux.parent) === null || _a === void 0 ? void 0 : _a.parent) {
15114
15141
  itemAux = itemAux.parent;
15115
15142
  }
15116
- this._tieredMenuEventService.emitCloseItemMenuEvent((_b = itemAux.parent) !== null && _b !== void 0 ? _b : itemAux);
15143
+ this._tieredMenuEventService.closeItemMenuEvent.emit((_b = itemAux.parent) !== null && _b !== void 0 ? _b : itemAux);
15117
15144
  }
15118
15145
  this._lastOpenItem = item;
15119
15146
  this._openItem(item);
@@ -15131,19 +15158,29 @@ TieredMenuNestedComponent.ctorParameters = () => [
15131
15158
  { type: TieredMenuService },
15132
15159
  { type: TieredMenuEventService }
15133
15160
  ];
15161
+ __decorate([
15162
+ HostListener("window:resize")
15163
+ ], TieredMenuNestedComponent.prototype, "onResize", null);
15164
+ __decorate([
15165
+ HostListener("document:click", ["$event"])
15166
+ ], TieredMenuNestedComponent.prototype, "onDocumentClick", null);
15167
+ __decorate([
15168
+ HostListener("document:keydown", ["$event"])
15169
+ ], TieredMenuNestedComponent.prototype, "onKeydownHandler", null);
15134
15170
  TieredMenuNestedComponent = __decorate([
15135
15171
  Component({
15136
- template: "<div\n class=\"menu menu--nested\"\n [ngStyle]=\"{\n 'top': top + 'px',\n 'max-height': maxHeight + 'px'\n }\">\n <ng-container *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: items }\"></ng-container>\n</div>\n\n<ng-template #itemsTemplate let-items>\n <div *ngFor=\"let item of items\">\n <s-tiered-menu-item\n *ngIf=\"!item.divider\"\n [item]=\"item\"\n [focused]=\"item === tieredMenuService.currentItem\"\n [closeOnClick]=\"true\">\n </s-tiered-menu-item>\n\n <s-tiered-menu-divider *ngIf=\"item.divider\"></s-tiered-menu-divider>\n\n <div *ngIf=\"item.submenu && item.isOpen\">\n <div class=\"submenu\">\n <ng-container *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: item.submenu }\"></ng-container>\n </div>\n </div>\n </div>\n</ng-template>\n",
15137
- styles: [".menu{background-color:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;min-width:176px;padding:4px 0;position:fixed;z-index:9999;overflow:auto}.menu--nested{width:90vw;margin:0 5vw}.menu .submenu{margin-left:24px}"]
15172
+ template: "<div\n class=\"menu menu--nested\"\n [ngStyle]=\"{\n 'top': top + 'px',\n 'left': left + 'px'\n }\">\n <ng-container *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: items }\"></ng-container>\n</div>\n\n<ng-template #itemsTemplate let-items>\n <div *ngFor=\"let item of items\">\n <s-tiered-menu-item\n *ngIf=\"!item.divider\"\n [item]=\"item\"\n [focused]=\"item === tieredMenuService.currentItem\"\n [closeOnClick]=\"true\">\n </s-tiered-menu-item>\n\n <s-tiered-menu-divider *ngIf=\"item.divider\"></s-tiered-menu-divider>\n\n <div *ngIf=\"item.submenu && item.isOpen\">\n <div class=\"submenu\">\n <ng-container *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: item.submenu }\"></ng-container>\n </div>\n </div>\n </div>\n</ng-template>\n",
15173
+ styles: [".menu{background-color:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;min-width:176px;padding:4px 0;position:absolute;z-index:9999;overflow:auto;width:calc(100vw - 8px)}.menu .submenu{margin-left:24px}"]
15138
15174
  })
15139
15175
  ], TieredMenuNestedComponent);
15140
15176
 
15141
15177
  var TieredMenuComponent_1;
15142
15178
  let TieredMenuComponent = TieredMenuComponent_1 = class TieredMenuComponent {
15143
- constructor(_appRef, _componentFactoryResolver, _injector, tieredMenuService, _tieredMenuEventService) {
15179
+ constructor(_appRef, _componentFactoryResolver, _injector, _changeDetectorRef, tieredMenuService, _tieredMenuEventService) {
15144
15180
  this._appRef = _appRef;
15145
15181
  this._componentFactoryResolver = _componentFactoryResolver;
15146
15182
  this._injector = _injector;
15183
+ this._changeDetectorRef = _changeDetectorRef;
15147
15184
  this.tieredMenuService = tieredMenuService;
15148
15185
  this._tieredMenuEventService = _tieredMenuEventService;
15149
15186
  this.top = 0;
@@ -15153,6 +15190,54 @@ let TieredMenuComponent = TieredMenuComponent_1 = class TieredMenuComponent {
15153
15190
  this._unsubscribe$ = new Subject();
15154
15191
  this.destroyRequest = new EventEmitter();
15155
15192
  }
15193
+ onResize() {
15194
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15195
+ }
15196
+ onDocumentClick(event) {
15197
+ // Closing menu when clicked outside.
15198
+ const target = event.target;
15199
+ const clickedInside = target.closest("s-tiered-menu-item") || target.closest("s-tiered-menu-divider");
15200
+ if (!clickedInside) {
15201
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15202
+ }
15203
+ }
15204
+ onKeydownHandler(event) {
15205
+ switch (event.key) {
15206
+ case "Escape":
15207
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15208
+ break;
15209
+ case " ":
15210
+ case "Enter":
15211
+ if (!this.tieredMenuService.currentItem.disabled) {
15212
+ this._tieredMenuEventService.selectItemEvent.emit(this.tieredMenuService.currentItem);
15213
+ }
15214
+ break;
15215
+ case "ArrowLeft":
15216
+ if (this.items.includes(this.tieredMenuService.currentItem)) {
15217
+ this._tieredMenuEventService.closeItemMenuEvent.emit(this.tieredMenuService.currentItem);
15218
+ this._changeDetectorRef.detectChanges();
15219
+ }
15220
+ break;
15221
+ case "ArrowRight":
15222
+ if (!this.tieredMenuService.currentItem.disabled && this.items.includes(this.tieredMenuService.currentItem)) {
15223
+ this._tieredMenuEventService.openItemMenuEvent.emit(this.tieredMenuService.currentItem);
15224
+ event.stopImmediatePropagation();
15225
+ }
15226
+ break;
15227
+ case "ArrowUp":
15228
+ if (!this.tieredMenuService.currentItem || this.items.includes(this.tieredMenuService.currentItem)) {
15229
+ this._tieredMenuEventService.decrementCurrentItemEvent.emit();
15230
+ event.stopImmediatePropagation();
15231
+ }
15232
+ break;
15233
+ case "ArrowDown":
15234
+ if (!this.tieredMenuService.currentItem || this.items.includes(this.tieredMenuService.currentItem)) {
15235
+ this._tieredMenuEventService.incrementCurrentItemEvent.emit();
15236
+ event.stopImmediatePropagation();
15237
+ }
15238
+ break;
15239
+ }
15240
+ }
15156
15241
  ngOnInit() {
15157
15242
  this.tieredMenuService.currentItems = this.items;
15158
15243
  this._subscribeEvents();
@@ -15211,8 +15296,7 @@ let TieredMenuComponent = TieredMenuComponent_1 = class TieredMenuComponent {
15211
15296
  // Setting the menu items.
15212
15297
  this._componentRef.instance.items = items;
15213
15298
  // Subscribe menu events.
15214
- this._componentRef.instance.destroyRequest
15215
- .subscribe((propagate) => {
15299
+ this._componentRef.instance.destroyRequest.subscribe((propagate) => {
15216
15300
  this._destroy(propagate);
15217
15301
  });
15218
15302
  this._menuDivElement = domElem.querySelector(".menu");
@@ -15231,14 +15315,23 @@ let TieredMenuComponent = TieredMenuComponent_1 = class TieredMenuComponent {
15231
15315
  }
15232
15316
  }
15233
15317
  _setMenuPosition(position) {
15234
- var _a;
15318
+ var _a, _b;
15319
+ const ITEM_HEIGHT = 37;
15320
+ const DIVIDER_HEIGHT = 5;
15321
+ const PADDING = 8;
15235
15322
  if (this._componentRef !== null) {
15236
15323
  const { top, right, bottom, left } = position;
15324
+ const itemsCount = (_a = this._componentRef.instance.items) === null || _a === void 0 ? void 0 : _a.reduce((count, item) => {
15325
+ return !item.divider ? count + 1 : count;
15326
+ }, 0);
15327
+ const dividersCount = (_b = this._componentRef.instance.items) === null || _b === void 0 ? void 0 : _b.reduce((count, item) => {
15328
+ return item.divider ? count + 1 : count;
15329
+ }, 0);
15237
15330
  // I need to calculate the height of the component because the internal elements have not been created yet.
15238
- const menuHeight = ((_a = this.items) === null || _a === void 0 ? void 0 : _a.length) * 40;
15331
+ const menuHeight = itemsCount * ITEM_HEIGHT + dividersCount * DIVIDER_HEIGHT + PADDING + 8;
15239
15332
  const menuWidth = this._menuDivElement.getBoundingClientRect().width;
15240
- const rightFreeSpace = document.body.clientWidth - right;
15241
- const bottomFreeSpace = document.body.clientHeight - bottom;
15333
+ const rightFreeSpace = window.innerWidth - right;
15334
+ const bottomFreeSpace = window.innerHeight - bottom;
15242
15335
  if (rightFreeSpace > menuWidth) {
15243
15336
  this._componentRef.instance.left = right;
15244
15337
  }
@@ -15246,84 +15339,76 @@ let TieredMenuComponent = TieredMenuComponent_1 = class TieredMenuComponent {
15246
15339
  this._componentRef.instance.left = left - menuWidth;
15247
15340
  }
15248
15341
  if (bottomFreeSpace <= menuHeight) {
15249
- this._componentRef.instance.top = top - menuHeight;
15342
+ this._componentRef.instance.top = Math.max(window.innerHeight - menuHeight, window.scrollY);
15250
15343
  }
15251
15344
  else {
15252
- this._componentRef.instance.top = top;
15345
+ this._componentRef.instance.top = window.scrollY + top;
15253
15346
  }
15254
15347
  }
15255
15348
  }
15256
15349
  _subscribeEvents() {
15257
15350
  // Increment current item event.
15258
- this._tieredMenuEventService.incrementCurrentItemEvent
15259
- .pipe(takeUntil(this._unsubscribe$))
15260
- .subscribe(() => {
15351
+ this._tieredMenuEventService.incrementCurrentItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {
15261
15352
  this._incrementCurItem();
15262
15353
  });
15263
15354
  // Decrement current item event.
15264
- this._tieredMenuEventService.decrementCurrentItemEvent
15265
- .pipe(takeUntil(this._unsubscribe$))
15266
- .subscribe(() => {
15355
+ this._tieredMenuEventService.decrementCurrentItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {
15267
15356
  this._decrementCurItem();
15268
15357
  });
15269
15358
  // Select item event.
15270
- this._tieredMenuEventService.selectItemEvent
15271
- .pipe(takeUntil(this._unsubscribe$))
15272
- .subscribe((item) => {
15359
+ this._tieredMenuEventService.selectItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((item) => {
15273
15360
  if (item.submenu) {
15274
- this._tieredMenuEventService.emitOpenItemMenuEvent(item);
15361
+ this._tieredMenuEventService.openItemMenuEvent.emit(item);
15275
15362
  }
15276
15363
  else if (item.command) {
15277
- this._tieredMenuEventService.emitCloseAllMenusEvent();
15364
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15278
15365
  item.command();
15279
15366
  }
15280
15367
  });
15281
15368
  // Close all menus event.
15282
- this._tieredMenuEventService.closeAllMenusEvent
15283
- .pipe(takeUntil(this._unsubscribe$))
15284
- .subscribe(() => {
15369
+ this._tieredMenuEventService.closeAllMenusEvent.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {
15285
15370
  this._destroy();
15286
15371
  this.tieredMenuService.currentItem = null;
15287
15372
  this.tieredMenuService.currentItems = this.tieredMenuService.items;
15373
+ this.tieredMenuService.markAllItemsAsClosed(this.tieredMenuService.items);
15288
15374
  });
15289
15375
  // Open item menu event.
15290
- this._tieredMenuEventService.openItemMenuEvent
15291
- .pipe(takeUntil(this._unsubscribe$))
15292
- .subscribe((item) => {
15293
- item.isOpen = false;
15376
+ this._tieredMenuEventService.openItemMenuEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((item) => {
15294
15377
  if (this.tieredMenuService.currentItem) {
15295
15378
  if (this.tieredMenuService.currentItem.parent === item) {
15296
15379
  return;
15297
15380
  }
15298
15381
  if (!this.tieredMenuService.searchTheHierarchy(this.tieredMenuService.currentItem.parent, item)) {
15299
- let itemAux = this.tieredMenuService.currentItem;
15300
- while (itemAux.parent !== item.parent) {
15301
- this._tieredMenuEventService.emitCloseItemMenuEvent(itemAux);
15302
- itemAux = itemAux.parent;
15382
+ let current = this.tieredMenuService.currentItem;
15383
+ current.isOpen = false;
15384
+ while ((current === null || current === void 0 ? void 0 : current.parent) !== item.parent) {
15385
+ this._tieredMenuEventService.closeItemMenuEvent.emit(current);
15386
+ this._changeDetectorRef.detectChanges();
15387
+ current = current.parent;
15303
15388
  }
15304
- }
15305
- }
15306
- if (item.submenu) {
15307
- if (!item.isOpen) {
15308
- const { top, right, left, bottom } = document
15309
- .querySelector(`#${item.id}`)
15310
- .getBoundingClientRect();
15311
- const position = { top, right, left, bottom };
15312
- if (this.items.includes(item)) {
15313
- this._createMenu(item.submenu, position);
15314
- this.tieredMenuService.currentItems = item.submenu;
15315
- this.tieredMenuService.currentItem = item.submenu[0];
15389
+ if (current) {
15390
+ current.isOpen = false;
15316
15391
  }
15317
15392
  }
15318
15393
  }
15394
+ if (item.submenu && !item.isOpen && this.items.includes(item)) {
15395
+ const { top, right, left, bottom } = document.querySelector(`#${item.id}`).getBoundingClientRect();
15396
+ const position = { top, right, left, bottom };
15397
+ this._createMenu(item.submenu, position);
15398
+ this.tieredMenuService.currentItems = item.submenu;
15399
+ this.tieredMenuService.currentItem = item.submenu[0];
15400
+ item.isOpen = true;
15401
+ }
15319
15402
  });
15320
15403
  // Close item menu event.
15321
15404
  this._tieredMenuEventService.closeItemMenuEvent
15322
15405
  .pipe(takeUntil(this._unsubscribe$))
15323
15406
  .subscribe((item) => {
15324
15407
  var _a, _b;
15325
- if (this.items.includes(item)) {
15326
- item.isOpen = false;
15408
+ if (this.items.some((i) => i.id === item.id)) {
15409
+ if (item.parent) {
15410
+ item.parent.isOpen = false;
15411
+ }
15327
15412
  this.tieredMenuService.currentItems = ((_b = (_a = item === null || item === void 0 ? void 0 : item.parent) === null || _a === void 0 ? void 0 : _a.parent) === null || _b === void 0 ? void 0 : _b.submenu) || this.tieredMenuService.items;
15328
15413
  this.tieredMenuService.currentItem = item.parent;
15329
15414
  this.destroyRequest.emit(false);
@@ -15335,187 +15420,205 @@ TieredMenuComponent.ctorParameters = () => [
15335
15420
  { type: ApplicationRef },
15336
15421
  { type: ComponentFactoryResolver },
15337
15422
  { type: Injector },
15423
+ { type: ChangeDetectorRef },
15338
15424
  { type: TieredMenuService },
15339
15425
  { type: TieredMenuEventService }
15340
15426
  ];
15341
15427
  __decorate([
15342
15428
  Output()
15343
15429
  ], TieredMenuComponent.prototype, "destroyRequest", void 0);
15430
+ __decorate([
15431
+ HostListener("window:resize")
15432
+ ], TieredMenuComponent.prototype, "onResize", null);
15433
+ __decorate([
15434
+ HostListener("document:click", ["$event"])
15435
+ ], TieredMenuComponent.prototype, "onDocumentClick", null);
15436
+ __decorate([
15437
+ HostListener("document:keydown", ["$event"])
15438
+ ], TieredMenuComponent.prototype, "onKeydownHandler", null);
15344
15439
  TieredMenuComponent = TieredMenuComponent_1 = __decorate([
15345
15440
  Component({
15346
15441
  selector: "s-tiered-menu",
15347
- template: "<div class=\"menu\" [ngStyle]=\"{\n 'left': left + 'px',\n 'top': top + 'px'\n }\">\n\n <div *ngFor=\"let item of items\">\n <s-tiered-menu-item\n *ngIf=\"!item.divider\"\n [item]=\"item\"\n [focused]=\"item === tieredMenuService.currentItem\"\n triggerEvent=\"hover\"\n [closeOnClick]=\"false\">\n </s-tiered-menu-item>\n <s-tiered-menu-divider *ngIf=\"item.divider\"></s-tiered-menu-divider>\n </div>\n</div>",
15348
- styles: [".menu{background-color:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;min-width:176px;padding:4px 0;position:fixed;z-index:9999}"]
15442
+ template: "<div\n class=\"menu\"\n [ngStyle]=\"{\n 'left': left + 'px',\n 'top': top + 'px'\n }\">\n\n <div *ngFor=\"let item of items\">\n <s-tiered-menu-item\n *ngIf=\"!item.divider\"\n [item]=\"item\"\n [focused]=\"item === tieredMenuService.currentItem\"\n [highlight]=\"item.isOpen\"\n triggerEvent=\"hover\"\n [closeOnClick]=\"false\">\n </s-tiered-menu-item>\n <s-tiered-menu-divider *ngIf=\"item.divider\"></s-tiered-menu-divider>\n </div>\n</div>",
15443
+ styles: [".menu{background-color:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;max-height:100vh;min-width:176px;padding:4px 0;overflow-y:auto;position:absolute;z-index:9999}"]
15349
15444
  })
15350
15445
  ], TieredMenuComponent);
15351
15446
 
15447
+ let TieredMenuGlobalService = class TieredMenuGlobalService {
15448
+ };
15449
+ TieredMenuGlobalService = __decorate([
15450
+ Injectable()
15451
+ ], TieredMenuGlobalService);
15452
+
15352
15453
  let TieredMenuDirective = class TieredMenuDirective {
15353
- constructor(_elementRef, _appRef, _componentFactoryResolver, _injector, _tieredMenuEventService, _tieredMenuService) {
15454
+ constructor(_elementRef, _appRef, _componentFactoryResolver, _injector, _tieredMenuEventService, _tieredMenuService, _tieredMenuGlobalService, _changeDetectorRef) {
15354
15455
  this._elementRef = _elementRef;
15355
15456
  this._appRef = _appRef;
15356
15457
  this._componentFactoryResolver = _componentFactoryResolver;
15357
15458
  this._injector = _injector;
15358
15459
  this._tieredMenuEventService = _tieredMenuEventService;
15359
15460
  this._tieredMenuService = _tieredMenuService;
15461
+ this._tieredMenuGlobalService = _tieredMenuGlobalService;
15462
+ this._changeDetectorRef = _changeDetectorRef;
15463
+ this.items = [];
15464
+ this.triggerEvent = "click";
15360
15465
  this._componentRef = null;
15361
15466
  this._isNested = false;
15362
15467
  this._isOpen = false;
15363
15468
  this._unsubscribe$ = new Subject();
15364
- this.alwaysOpen = false;
15365
- this.triggerEvent = "click";
15469
+ }
15470
+ onClick(event) {
15471
+ var _a;
15472
+ if (this.triggerEvent === "click" && ((_a = this._tieredMenuService.items) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this._isOpen) {
15473
+ this._lastActiveElement = document.activeElement;
15474
+ this._createMenu();
15475
+ event.preventDefault();
15476
+ event.stopPropagation();
15477
+ }
15366
15478
  }
15367
15479
  ngOnInit() {
15368
- this._tieredMenuService.items = this._tieredMenuService.normalizeData(this.items);
15369
- this._tieredMenuService.currentItems = this._tieredMenuService.items;
15370
- this._tieredMenuService.currentItem = this._tieredMenuService.items[0];
15480
+ this._updateServiceItems();
15371
15481
  this._subscribeEvents();
15372
15482
  }
15373
- ngAfterViewInit() {
15374
- // setTimeout to create the menu after creating the elements.
15375
- if (this.alwaysOpen) {
15376
- setTimeout(() => {
15377
- this._createMenu();
15378
- }, 0);
15483
+ ngDoCheck() {
15484
+ if (!this.previousItems) {
15485
+ this.previousItems = this._tieredMenuService.cloneItems(this.items);
15486
+ }
15487
+ ;
15488
+ let hasChanges = false;
15489
+ if (this.items.length !== this.previousItems.length) {
15490
+ hasChanges = true;
15379
15491
  }
15492
+ else {
15493
+ for (let i = 0; i < this.items.length; i++) {
15494
+ if (!this._compareItems(this.items[i], this.previousItems[i])) {
15495
+ hasChanges = true;
15496
+ break;
15497
+ }
15498
+ }
15499
+ }
15500
+ if (hasChanges) {
15501
+ this._updateServiceItems();
15502
+ this._changeDetectorRef.detectChanges();
15503
+ this._rebuildMenu();
15504
+ }
15505
+ this.previousItems = this._tieredMenuService.cloneItems(this.items);
15380
15506
  }
15381
15507
  ngOnDestroy() {
15382
15508
  this._unsubscribe$.next();
15383
15509
  this._unsubscribe$.complete();
15384
15510
  this._destroy();
15385
15511
  }
15386
- onResize() {
15387
- if (!this.alwaysOpen) {
15388
- this._tieredMenuEventService.emitCloseAllMenusEvent();
15389
- }
15390
- }
15391
- onKeydownHandler(event) {
15392
- if (!this._isOpen)
15393
- return;
15394
- switch (event.key) {
15395
- case "Escape":
15396
- this._tieredMenuEventService.emitCloseAllMenusEvent();
15397
- break;
15398
- case " ":
15399
- case "Enter":
15400
- this._tieredMenuEventService.emitSelectItemEvent(this._tieredMenuService.currentItem);
15401
- break;
15402
- case "ArrowLeft":
15403
- // When nested I need a reference to the current item's parent item, otherwise just the current item.
15404
- this._tieredMenuEventService.emitCloseItemMenuEvent(this._isNested ? this._tieredMenuService.currentItem.parent : this._tieredMenuService.currentItem);
15405
- break;
15406
- case "ArrowRight":
15407
- this._tieredMenuEventService.emitOpenItemMenuEvent(this._tieredMenuService.currentItem);
15408
- break;
15409
- case "ArrowUp":
15410
- this._tieredMenuEventService.emitDecrementCurrentItemEvent();
15411
- break;
15412
- case "ArrowDown":
15413
- this._tieredMenuEventService.emitIncrementCurrentItemEvent();
15414
- break;
15415
- }
15416
- }
15417
- onClick(event) {
15418
- if (this.triggerEvent === "click" && this.items && this.items && !this._isOpen) {
15419
- this._lastActiveElement = document.activeElement;
15420
- this._createMenu();
15421
- event.preventDefault();
15422
- event.stopPropagation();
15423
- }
15424
- }
15425
- onDocumentClick(event) {
15426
- // Closing menu when clicked outside.
15427
- const target = event.target;
15428
- const clickedInside = target.closest("s-tiered-menu-item") || target.closest("s-tiered-menu-divider");
15429
- if (!clickedInside) {
15430
- this._tieredMenuEventService.emitCloseAllMenusEvent();
15431
- }
15432
- }
15433
15512
  _createMenu() {
15434
- var _a;
15435
- if (!this._componentRef && this.items) {
15436
- (_a = this._lastActiveElement) === null || _a === void 0 ? void 0 : _a.blur();
15513
+ var _a, _b, _c;
15514
+ if (!this._componentRef && ((_a = this._tieredMenuService.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
15515
+ (_b = this._tieredMenuGlobalService.lastInstance) === null || _b === void 0 ? void 0 : _b._destroy();
15516
+ this._tieredMenuGlobalService.lastInstance = this;
15517
+ (_c = this._lastActiveElement) === null || _c === void 0 ? void 0 : _c.blur();
15437
15518
  this._isOpen = true;
15438
15519
  this._isNested = document.body.clientWidth < 600;
15439
15520
  this._isNested ? this._createNestedMenu() : this._createTieredMenu();
15440
15521
  }
15441
15522
  }
15442
15523
  _createTieredMenu() {
15443
- if (!this._componentRef && this.items) {
15524
+ var _a;
15525
+ if (!this._componentRef && ((_a = this._tieredMenuService.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
15444
15526
  const componentFactory = this._componentFactoryResolver.resolveComponentFactory(TieredMenuComponent);
15445
15527
  this._componentRef = componentFactory.create(this._injector);
15446
15528
  this._appRef.attachView(this._componentRef.hostView);
15447
15529
  const domElem = this._componentRef.hostView.rootNodes[0];
15448
15530
  document.body.appendChild(domElem);
15449
15531
  this._setMenuComponentProperties();
15450
- this._componentRef.instance.destroyRequest
15451
- .pipe(takeUntil(this._unsubscribe$))
15452
- .subscribe(() => {
15532
+ this._componentRef.instance.destroyRequest.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {
15453
15533
  this._destroy();
15454
15534
  });
15455
- this._menuDivElement = domElem.querySelector(".menu");
15456
15535
  this._setMenuPosition();
15457
15536
  }
15458
15537
  }
15459
15538
  _createNestedMenu() {
15460
- if (!this._componentRef && this.items) {
15539
+ var _a;
15540
+ if (!this._componentRef && ((_a = this._tieredMenuService.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
15461
15541
  const componentFactory = this._componentFactoryResolver.resolveComponentFactory(TieredMenuNestedComponent);
15462
15542
  this._componentRef = componentFactory.create(this._injector);
15463
15543
  this._appRef.attachView(this._componentRef.hostView);
15464
15544
  const domElem = this._componentRef.hostView.rootNodes[0];
15465
15545
  document.body.appendChild(domElem);
15466
15546
  this._setMenuComponentProperties();
15467
- this._menuDivElement = domElem.querySelector(".menu");
15468
15547
  this._setMenuPosition();
15469
15548
  }
15470
15549
  }
15471
15550
  _destroy() {
15472
- var _a;
15473
- if (this._componentRef !== null && !this.alwaysOpen) {
15551
+ if (this._componentRef) {
15474
15552
  this._isOpen = false;
15475
15553
  window.clearTimeout(this._showTimeout);
15476
15554
  this._appRef.detachView(this._componentRef.hostView);
15477
15555
  this._componentRef.destroy();
15478
15556
  this._componentRef = null;
15479
- this._menuDivElement = null;
15480
- (_a = this._lastActiveElement) === null || _a === void 0 ? void 0 : _a.focus();
15481
15557
  this._tieredMenuService.currentItems = this._tieredMenuService.items;
15482
15558
  this._tieredMenuService.currentItem = this._tieredMenuService.items[0];
15559
+ this._tieredMenuEventService.closeAllMenusEvent.emit();
15483
15560
  }
15484
15561
  }
15485
15562
  _setMenuPosition() {
15563
+ var _a, _b;
15564
+ const ITEM_HEIGHT = 37;
15565
+ const ITEM_WIDTH = 176;
15566
+ const DIVIDER_HEIGHT = 5;
15567
+ const PADDING = 8;
15568
+ const MARGIN = 4;
15486
15569
  if (this._componentRef !== null) {
15487
- const { right, bottom, left } = this._elementRef.nativeElement.getBoundingClientRect();
15488
- const menuWidth = this._menuDivElement.getBoundingClientRect().width;
15489
- const rightFreeSpace = document.body.clientWidth - right;
15490
- const topPosition = bottom + 2;
15491
- this._componentRef.instance.top = topPosition;
15492
- if (!this._isNested) {
15493
- if (rightFreeSpace > menuWidth) {
15494
- this._componentRef.instance.left = left;
15495
- }
15496
- else {
15497
- this._componentRef.instance.left = left - menuWidth;
15498
- }
15570
+ this._componentRef.instance.top = 8;
15571
+ const { bottom, left, right } = this._elementRef.nativeElement.getBoundingClientRect();
15572
+ const itemsCount = (_a = this._componentRef.instance.items) === null || _a === void 0 ? void 0 : _a.reduce((count, item) => {
15573
+ return !item.divider ? count + 1 : count;
15574
+ }, 0);
15575
+ const dividersCount = (_b = this._componentRef.instance.items) === null || _b === void 0 ? void 0 : _b.reduce((count, item) => {
15576
+ return item.divider ? count + 1 : count;
15577
+ }, 0);
15578
+ const menuHeight = itemsCount * ITEM_HEIGHT + dividersCount * DIVIDER_HEIGHT + PADDING + MARGIN;
15579
+ const rightFreeSpace = window.innerWidth - right;
15580
+ const bottomFreeSpace = window.innerHeight - bottom;
15581
+ this._componentRef.instance.top = bottom;
15582
+ this._componentRef.instance.left = left;
15583
+ if (bottomFreeSpace <= menuHeight) {
15584
+ this._componentRef.instance.top = Math.max(bottom - menuHeight, 0);
15585
+ }
15586
+ else {
15587
+ this._componentRef.instance.top = bottom + MARGIN;
15588
+ }
15589
+ if (rightFreeSpace > 176) {
15590
+ this._componentRef.instance.left = left;
15499
15591
  }
15500
15592
  else {
15501
- // setting the maximum menu size to ensure its content is always visible. 10px margin.
15502
- this._componentRef.instance.maxHeight = window.innerHeight - topPosition - 10;
15593
+ this._componentRef.instance.left = right - ITEM_WIDTH;
15594
+ }
15595
+ if (this._isNested) {
15596
+ this._componentRef.instance.left = MARGIN;
15503
15597
  }
15504
15598
  }
15505
15599
  }
15506
15600
  _setMenuComponentProperties() {
15507
15601
  if (this._componentRef != null) {
15508
- this._componentRef.instance.items = this.items;
15602
+ this._componentRef.instance.items = this._tieredMenuService.items;
15509
15603
  }
15510
15604
  }
15511
15605
  _subscribeEvents() {
15512
- this._tieredMenuEventService.closeAllMenusEvent
15513
- .pipe(takeUntil(this._unsubscribe$))
15514
- .subscribe(() => {
15515
- this.items = this._tieredMenuService.markAllItemsAsClosed(this.items);
15606
+ this._tieredMenuEventService.closeAllMenusEvent.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {
15607
+ this._tieredMenuService.items = this._tieredMenuService.markAllItemsAsClosed(this._tieredMenuService.items);
15516
15608
  this._destroy();
15517
15609
  });
15518
15610
  }
15611
+ _compareItems(item1, item2) {
15612
+ return JSON.stringify(item1) === JSON.stringify(item2);
15613
+ }
15614
+ _rebuildMenu() {
15615
+ this._destroy();
15616
+ }
15617
+ _updateServiceItems() {
15618
+ this._tieredMenuService.items = this._tieredMenuService.normalizeData(this.items);
15619
+ this._tieredMenuService.currentItems = this._tieredMenuService.items;
15620
+ this._tieredMenuService.currentItem = this._tieredMenuService.items[0];
15621
+ }
15519
15622
  };
15520
15623
  TieredMenuDirective.ctorParameters = () => [
15521
15624
  { type: ElementRef },
@@ -15523,59 +15626,65 @@ TieredMenuDirective.ctorParameters = () => [
15523
15626
  { type: ComponentFactoryResolver },
15524
15627
  { type: Injector },
15525
15628
  { type: TieredMenuEventService },
15526
- { type: TieredMenuService }
15629
+ { type: TieredMenuService },
15630
+ { type: TieredMenuGlobalService },
15631
+ { type: ChangeDetectorRef }
15527
15632
  ];
15528
15633
  __decorate([
15529
15634
  Input()
15530
15635
  ], TieredMenuDirective.prototype, "items", void 0);
15531
- __decorate([
15532
- Input()
15533
- ], TieredMenuDirective.prototype, "alwaysOpen", void 0);
15534
15636
  __decorate([
15535
15637
  Input()
15536
15638
  ], TieredMenuDirective.prototype, "triggerEvent", void 0);
15537
- __decorate([
15538
- HostListener("window:resize")
15539
- ], TieredMenuDirective.prototype, "onResize", null);
15540
- __decorate([
15541
- HostListener("document:keydown", ["$event"])
15542
- ], TieredMenuDirective.prototype, "onKeydownHandler", null);
15543
15639
  __decorate([
15544
15640
  HostListener("click", ["$event"])
15545
15641
  ], TieredMenuDirective.prototype, "onClick", null);
15546
- __decorate([
15547
- HostListener("document:click", ["$event"])
15548
- ], TieredMenuDirective.prototype, "onDocumentClick", null);
15549
15642
  TieredMenuDirective = __decorate([
15550
15643
  Directive({
15551
15644
  selector: "[sTieredMenu]",
15645
+ providers: [TieredMenuEventService, TieredMenuService],
15552
15646
  })
15553
15647
  ], TieredMenuDirective);
15554
15648
 
15649
+ let TieredMenuDividerComponent = class TieredMenuDividerComponent {
15650
+ };
15651
+ TieredMenuDividerComponent = __decorate([
15652
+ Component({
15653
+ selector: "s-tiered-menu-divider",
15654
+ template: "<div class=\"divider\"></div>",
15655
+ styles: [".divider{margin:2px 0;height:1px;background-color:#ccc}"]
15656
+ })
15657
+ ], TieredMenuDividerComponent);
15658
+
15555
15659
  let TieredMenuItemComponent = class TieredMenuItemComponent {
15556
15660
  constructor(_tieredMenuEventService) {
15557
15661
  this._tieredMenuEventService = _tieredMenuEventService;
15558
15662
  this.focused = false;
15663
+ this.highlight = false;
15559
15664
  this.triggerEvent = "click";
15560
15665
  this.closeOnClick = false;
15561
15666
  }
15562
15667
  onClick() {
15668
+ if (this.item.disabled)
15669
+ return;
15563
15670
  if (this.item.submenu) {
15564
15671
  if (!this.item.isOpen) {
15565
- this._tieredMenuEventService.emitOpenItemMenuEvent(this.item);
15672
+ this._tieredMenuEventService.openItemMenuEvent.emit(this.item);
15566
15673
  }
15567
15674
  else if (this.closeOnClick) {
15568
- this._tieredMenuEventService.emitCloseItemMenuEvent(this.item);
15675
+ this._tieredMenuEventService.closeItemMenuEvent.emit(this.item);
15569
15676
  }
15570
15677
  }
15571
15678
  else {
15572
- this._tieredMenuEventService.emitSelectItemEvent(this.item);
15679
+ this._tieredMenuEventService.selectItemEvent.emit(this.item);
15573
15680
  }
15574
15681
  }
15575
15682
  onMouseEnter() {
15683
+ if (this.item.disabled)
15684
+ return;
15576
15685
  if (this.triggerEvent === "hover" && !this.item.isOpen) {
15577
15686
  this._showTimeout = window.setTimeout(() => {
15578
- this._tieredMenuEventService.emitOpenItemMenuEvent(this.item);
15687
+ this._tieredMenuEventService.openItemMenuEvent.emit(this.item);
15579
15688
  }, 300);
15580
15689
  }
15581
15690
  }
@@ -15592,6 +15701,9 @@ __decorate([
15592
15701
  __decorate([
15593
15702
  Input()
15594
15703
  ], TieredMenuItemComponent.prototype, "focused", void 0);
15704
+ __decorate([
15705
+ Input()
15706
+ ], TieredMenuItemComponent.prototype, "highlight", void 0);
15595
15707
  __decorate([
15596
15708
  Input()
15597
15709
  ], TieredMenuItemComponent.prototype, "triggerEvent", void 0);
@@ -15611,21 +15723,11 @@ __decorate([
15611
15723
  TieredMenuItemComponent = __decorate([
15612
15724
  Component({
15613
15725
  selector: "s-tiered-menu-item",
15614
- template: "<div\n [id]=\"item.id\"\n class=\"tiered-menu-item\"\n [ngClass]=\"{\n 'tiered-menu-item--open': item.isOpen,\n 'tiered-menu-item--focused': focused\n }\">\n <div class=\"tiered-menu-item-content\">\n <span class=\"icon\" [ngClass]=\"item.iconClass\"></span>\n <span class=\"label\">{{ item.label }}</span>\n </div>\n <span\n *ngIf=\"item.submenu\"\n class=\"submenu-icon\"\n [ngClass]=\"{\n 'fas': true,\n 'fa-chevron-left': item.isOpen,\n 'fa-chevron-right': !item.isOpen\n }\">\n </span>\n</div>",
15615
- styles: [".tiered-menu-item{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:8px 16px;-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.tiered-menu-item .tiered-menu-item-content .label{margin:0 12px}.tiered-menu-item:hover{background-color:#e9e6e6}.tiered-menu-item--focused{background-color:#ccc!important}.tiered-menu-item--open{background-color:#e4e2e2}"]
15726
+ template: "<div\n [id]=\"item.id\"\n class=\"tiered-menu-item\"\n [ngClass]=\"{\n 'tiered-menu-item--open': item.isOpen,\n 'tiered-menu-item--focused': focused,\n 'tiered-menu-item--disabled': item.disabled\n }\">\n <div class=\"tiered-menu-item-content\">\n <span class=\"icon\" [ngClass]=\"item.iconClass\"></span>\n <span class=\"label\">{{ item.label }}</span>\n </div>\n <span\n *ngIf=\"item.submenu\"\n class=\"submenu-icon\"\n [ngClass]=\"{\n 'fas': true,\n 'fa-chevron-left': item.isOpen,\n 'fa-chevron-right': !item.isOpen\n }\">\n </span>\n</div>",
15727
+ styles: [".tiered-menu-item{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:8px 16px;-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.tiered-menu-item .tiered-menu-item-content .label{margin:0 12px}.tiered-menu-item:hover{background-color:#e9e6e6}.tiered-menu-item--focused{background-color:#ccc!important}.tiered-menu-item--open{background-color:#e4e2e2}.tiered-menu-item--disabled{opacity:50%;cursor:default}"]
15616
15728
  })
15617
15729
  ], TieredMenuItemComponent);
15618
15730
 
15619
- let TieredMenuDividerComponent = class TieredMenuDividerComponent {
15620
- };
15621
- TieredMenuDividerComponent = __decorate([
15622
- Component({
15623
- selector: "s-tiered-menu-divider",
15624
- template: "<div class=\"divider\"></div>",
15625
- styles: [".divider{margin:2px 0;height:1px;background-color:#ccc}"]
15626
- })
15627
- ], TieredMenuDividerComponent);
15628
-
15629
15731
  let TieredMenuModule = class TieredMenuModule {
15630
15732
  };
15631
15733
  TieredMenuModule = __decorate([
@@ -15641,10 +15743,7 @@ TieredMenuModule = __decorate([
15641
15743
  TieredMenuDividerComponent,
15642
15744
  ],
15643
15745
  exports: [TieredMenuDirective],
15644
- providers: [
15645
- TieredMenuEventService,
15646
- TieredMenuService,
15647
- ],
15746
+ providers: [TieredMenuGlobalService],
15648
15747
  })
15649
15748
  ], TieredMenuModule);
15650
15749
 
@@ -16550,5 +16649,5 @@ const fallback = {
16550
16649
  * Generated bundle index. Do not edit.
16551
16650
  */
16552
16651
 
16553
- export { AccordionComponent, AccordionModule, AccordionPanelComponent, AngularComponentsModule, AutocompleteField, BadgeColors, BadgeComponent, BadgeModule, BaseFieldComponent, BignumberField, BignumberInputDirective, BignumberInputModule, BooleanField, BooleanOptionsLabel, BreadcrumbComponent, BreadcrumbModule, Breakpoints, ButtonComponent, ButtonModule, ButtonPriority, ButtonSize, CalendarField, CalendarLocaleOptions, CalendarMaskDirective, CalendarMaskModule, CardComponent, CardModule, CardTemplateTypes, ChipsField, CodeEditorModule, CollapseLinkComponent, CollapseLinkModule, ControlErrorsComponent, ControlErrorsModule, CountryPhonePickerComponent, CountryPhonePickerModule, CurrencyField, CustomFieldsComponent, CustomFieldsModule, CustomFieldsService, DEFAULT_CALENDAR_LOCALE_OPTIONS, DEFAULT_LOCALE_OPTIONS, DEFAULT_NUMBER_LOCALE_OPTIONS, DebounceUtils, DoubleClickDirective, DynamicConfig, DynamicFormComponent, DynamicFormModule, DynamicType, EditableOverlayDirective, EditableOverlayModule, EmptyStateComponent, EmptyStateModule, EnumBadgeColors, EnumColumnFieldType, EnumSeverity, ExportUtils, Field, FieldType, Fieldset, FileUploadComponent, FileUploadModule, FileValidation, FormField, GanttComponent, GanttModule, GlobalSearchComponent, GlobalSearchDropdownItemComponent, GlobalSearchModule, GlobalSearchSizeEnum, HostProjectConfigsInjectionToken, IAInsightComponent, IAInsightModule, IAInsightTemplateTypes, ImageCropperComponent, ImageCropperModule, ImageCropperService, InfoSignDirective, InfoSignModule, KanbanComponent, KanbanModule, KanbanTemplateTypes, Languages, LoadingStateComponent, LoadingStateDirective, LoadingStateModule, LocaleModule, LocaleOptions, LocaleService, LocalizedCurrencyPipe, LocalizedCurrencyPipeOptions, LocalizedDateImpurePipe, LocalizedDatePipe, LocalizedNumberInputDirective, LocalizedNumberInputModule, LocalizedNumberPipe, LocalizedTimeImpurePipe, LocalizedTimePipe, LongPressDirective, LookupComponent, LookupField, MaskFormatterModule, MaskFormatterPipe, MouseEventsModule, NavigationDirective, NumberAlignmentOption, NumberField, NumberInputDirective, NumberInputModule, NumberLocaleOptions, ObjectCardComponent, ObjectCardFieldComponent, ObjectCardMainComponent, ObjectCardModule, Option, Ordination, PanelComponent, PanelModule, PasswordField, PasswordStrengthComponent, PasswordStrengthDirective, PasswordStrengthModule, PasswordStrengthPositions, PasswordStrengths, ProductHeaderComponent, ProductHeaderModule, ProfilePicturePickerComponent, ProfilePicturePickerModule, ProgressBarColors, ProgressBarComponent, ProgressBarModule, RadioButtonField, RatingScaleComponent, RatingScaleModule, RationButtonOption, RowTogllerDirective, SVGFactoryDirective, SVGFactoryModule, Section, SelectButtonComponent, SelectButtonModule, SelectField, SelectOption, SidebarComponent, SidebarModule, SlidePanelComponent, SlidePanelModule, SplitButtonComponent, SplitButtonModule, SplitButtonType, StatsCardComponent, StatsCardModule, StepState, StepsComponent, StepsModule, Structure, SwitchComponent, SwitchModule, TableFrozenPositionDirective, TableHeaderCheckboxComponent, TableHeaderCheckboxModule, TableModule, TaxCalculationLanguageConfigs, TextAreaField, TextField, Themes, ThumbnailComponent, ThumbnailModule, ThumbnailSize, TieredMenuDirective, TieredMenuModule, TileComponent, TileModule, TimelineComponent, TimelineItem, TimelineItemSeverity, TimelineItemSize, TimelineModule, TokenListComponent, TokenListModule, TooltipModule, TooltipPosition, ValidateErrors, ViewMode, WorkspaceSwitchComponent, WorkspaceSwitchModule, countries, fallback, TooltipComponent as ɵa, TooltipDirective as ɵb, LocalizedNumberInputModule as ɵba, NumberInputModule as ɵbb, NumberFieldComponent as ɵbc, CurrencyFieldModule as ɵbd, CurrencyFieldComponent as ɵbe, NumberFieldModule$1 as ɵbf, BignumberInputModule as ɵbg, BignumberFieldComponent as ɵbh, AutocompleteFieldComponent as ɵbi, BooleanFieldComponent as ɵbj, BooleanSwitchFieldComponent as ɵbk, CalendarFieldComponent as ɵbl, ChipsFieldComponent as ɵbm, CountryPhonePickerFieldComponent as ɵbn, DynamicFieldComponent as ɵbo, DynamicFormDirective as ɵbp, FieldsetComponent as ɵbq, FileUploadComponent$1 as ɵbr, LookupFieldComponent as ɵbs, PasswordFieldComponent as ɵbt, RadioButtonComponent as ɵbu, RowComponent as ɵbv, SectionComponent as ɵbw, SelectFieldComponent as ɵbx, SliderFieldComponent as ɵby, TextAreaFieldComponent as ɵbz, TemplateDirective as ɵc, TextAreaIAFieldComponent as ɵca, IAssistService as ɵcb, DecimalField as ɵcd, SideTableComponent as ɵce, ThumbnailService as ɵcf, InfiniteScrollModule as ɵcg, InfiniteScrollDirective as ɵch, IAInsightSidebarComponent as ɵci, IAInsightCardComponent as ɵcj, IAInsightCardLoaderComponent as ɵck, StructureModule as ɵcl, HeaderComponent as ɵcm, FooterComponent as ɵcn, KanbanEventService as ɵco, KanbanItemComponent as ɵcp, KanbanColumnComponent as ɵcq, KanbanItemDraggingComponent as ɵcr, NumberLocaleOptions as ɵcs, BorderButtonModule as ɵct, BorderButtonComponent as ɵcu, ProgressBarDeterminateComponent as ɵcv, ProgressBarIndeterminateComponent as ɵcw, SelectButtonItemComponent as ɵcx, SlidePanelService as ɵcy, TieredMenuEventService as ɵcz, TemplateModule as ɵd, TieredMenuService as ɵda, TieredMenuComponent as ɵdb, TieredMenuNestedComponent as ɵdc, TieredMenuItemComponent as ɵdd, TieredMenuDividerComponent as ɵde, TimelineItemModule as ɵdf, TimelineIconItemComponent as ɵdg, HorizontalTimelineModule as ɵdh, HorizontalTimelineComponent as ɵdi, VerticalTimelineModule as ɵdj, VerticalTimelineComponent as ɵdk, RangeLineComponent as ɵdl, CollapseOptionComponent as ɵdm, CollapsedItemsComponent as ɵdn, VerticalItemsComponent as ɵdo, CustomTranslationsModule as ɵe, CodeEditorComponent as ɵf, CoreFacade as ɵg, CodeMirror6Core as ɵh, CountryPhonePickerService as ɵi, LocalizedCurrencyImpurePipe as ɵj, LocalizedBignumberPipe as ɵk, LocalizedBignumberImpurePipe as ɵl, NumericPipe as ɵm, NumericService as ɵn, EmptyStateGoBackComponent as ɵo, IAssistIconComponent as ɵp, SeniorIconComponent as ɵq, DotsIndicatorComponent as ɵr, LoadingIndicatorComponent as ɵs, FileUploadService as ɵt, InfoSignComponent as ɵu, TableColumnsComponent as ɵv, TablePagingComponent as ɵw, TextFieldModule as ɵx, TextFieldComponent as ɵy, NumberFieldModule as ɵz };
16652
+ export { AccordionComponent, AccordionModule, AccordionPanelComponent, AngularComponentsModule, AutocompleteField, BadgeColors, BadgeComponent, BadgeModule, BaseFieldComponent, BignumberField, BignumberInputDirective, BignumberInputModule, BooleanField, BooleanOptionsLabel, BreadcrumbComponent, BreadcrumbModule, Breakpoints, ButtonComponent, ButtonModule, ButtonPriority, ButtonSize, CalendarField, CalendarLocaleOptions, CalendarMaskDirective, CalendarMaskModule, CardComponent, CardModule, CardTemplateTypes, ChipsField, CodeEditorModule, CollapseLinkComponent, CollapseLinkModule, ControlErrorsComponent, ControlErrorsModule, CountryPhonePickerComponent, CountryPhonePickerModule, CurrencyField, CustomFieldsComponent, CustomFieldsModule, CustomFieldsService, DEFAULT_CALENDAR_LOCALE_OPTIONS, DEFAULT_LOCALE_OPTIONS, DEFAULT_NUMBER_LOCALE_OPTIONS, DebounceUtils, DoubleClickDirective, DynamicConfig, DynamicFormComponent, DynamicFormModule, DynamicType, EditableOverlayDirective, EditableOverlayModule, EmptyStateComponent, EmptyStateModule, EnumBadgeColors, EnumColumnFieldType, EnumSeverity, ExportUtils, Field, FieldType, Fieldset, FileUploadComponent, FileUploadModule, FileValidation, FormField, GanttComponent, GanttModule, GlobalSearchComponent, GlobalSearchDropdownItemComponent, GlobalSearchModule, GlobalSearchSizeEnum, HostProjectConfigsInjectionToken, IAInsightComponent, IAInsightModule, IAInsightTemplateTypes, ImageCropperComponent, ImageCropperModule, ImageCropperService, InfoSignDirective, InfoSignModule, KanbanComponent, KanbanModule, KanbanTemplateTypes, Languages, LoadingStateComponent, LoadingStateDirective, LoadingStateModule, LocaleModule, LocaleOptions, LocaleService, LocalizedCurrencyPipe, LocalizedCurrencyPipeOptions, LocalizedDateImpurePipe, LocalizedDatePipe, LocalizedNumberInputDirective, LocalizedNumberInputModule, LocalizedNumberPipe, LocalizedTimeImpurePipe, LocalizedTimePipe, LongPressDirective, LookupComponent, LookupField, MaskFormatterModule, MaskFormatterPipe, MouseEventsModule, NavigationDirective, NumberAlignmentOption, NumberField, NumberInputDirective, NumberInputModule, NumberLocaleOptions, ObjectCardComponent, ObjectCardFieldComponent, ObjectCardMainComponent, ObjectCardModule, Option, Ordination, PanelComponent, PanelModule, PasswordField, PasswordStrengthComponent, PasswordStrengthDirective, PasswordStrengthModule, PasswordStrengthPositions, PasswordStrengths, ProductHeaderComponent, ProductHeaderModule, ProfilePicturePickerComponent, ProfilePicturePickerModule, ProgressBarColors, ProgressBarComponent, ProgressBarModule, RadioButtonField, RatingScaleComponent, RatingScaleModule, RationButtonOption, RowTogllerDirective, SVGFactoryDirective, SVGFactoryModule, Section, SelectButtonComponent, SelectButtonModule, SelectField, SelectOption, SidebarComponent, SidebarModule, SlidePanelComponent, SlidePanelModule, SplitButtonComponent, SplitButtonModule, SplitButtonType, StatsCardComponent, StatsCardModule, StepState, StepsComponent, StepsModule, Structure, SwitchComponent, SwitchModule, TableFrozenPositionDirective, TableHeaderCheckboxComponent, TableHeaderCheckboxModule, TableModule, TaxCalculationLanguageConfigs, TextAreaField, TextField, Themes, ThumbnailComponent, ThumbnailModule, ThumbnailSize, TieredMenuDirective, TieredMenuModule, TileComponent, TileModule, TimelineComponent, TimelineItem, TimelineItemSeverity, TimelineItemSize, TimelineModule, TokenListComponent, TokenListModule, TooltipModule, TooltipPosition, ValidateErrors, ViewMode, WorkspaceSwitchComponent, WorkspaceSwitchModule, countries, fallback, TooltipComponent as ɵa, TooltipDirective as ɵb, LocalizedNumberInputModule as ɵba, NumberInputModule as ɵbb, NumberFieldComponent as ɵbc, CurrencyFieldModule as ɵbd, CurrencyFieldComponent as ɵbe, NumberFieldModule$1 as ɵbf, BignumberInputModule as ɵbg, BignumberFieldComponent as ɵbh, AutocompleteFieldComponent as ɵbi, BooleanFieldComponent as ɵbj, BooleanSwitchFieldComponent as ɵbk, CalendarFieldComponent as ɵbl, ChipsFieldComponent as ɵbm, CountryPhonePickerFieldComponent as ɵbn, DynamicFieldComponent as ɵbo, DynamicFormDirective as ɵbp, FieldsetComponent as ɵbq, FileUploadComponent$1 as ɵbr, LookupFieldComponent as ɵbs, PasswordFieldComponent as ɵbt, RadioButtonComponent as ɵbu, RowComponent as ɵbv, SectionComponent as ɵbw, SelectFieldComponent as ɵbx, SliderFieldComponent as ɵby, TextAreaFieldComponent as ɵbz, TemplateDirective as ɵc, TextAreaIAFieldComponent as ɵca, IAssistService as ɵcb, DecimalField as ɵcd, SideTableComponent as ɵce, ThumbnailService as ɵcf, InfiniteScrollModule as ɵcg, InfiniteScrollDirective as ɵch, IAInsightSidebarComponent as ɵci, IAInsightCardComponent as ɵcj, IAInsightCardLoaderComponent as ɵck, StructureModule as ɵcl, HeaderComponent as ɵcm, FooterComponent as ɵcn, KanbanEventService as ɵco, KanbanItemComponent as ɵcp, KanbanColumnComponent as ɵcq, KanbanItemDraggingComponent as ɵcr, NumberLocaleOptions as ɵcs, BorderButtonModule as ɵct, BorderButtonComponent as ɵcu, ProgressBarDeterminateComponent as ɵcv, ProgressBarIndeterminateComponent as ɵcw, SelectButtonItemComponent as ɵcx, SlidePanelService as ɵcy, TieredMenuEventService as ɵcz, TemplateModule as ɵd, TieredMenuService as ɵda, TieredMenuGlobalService as ɵdb, TieredMenuComponent as ɵdc, TieredMenuNestedComponent as ɵdd, TieredMenuItemComponent as ɵde, TieredMenuDividerComponent as ɵdf, TimelineItemModule as ɵdg, TimelineIconItemComponent as ɵdh, HorizontalTimelineModule as ɵdi, HorizontalTimelineComponent as ɵdj, VerticalTimelineModule as ɵdk, VerticalTimelineComponent as ɵdl, RangeLineComponent as ɵdm, CollapseOptionComponent as ɵdn, CollapsedItemsComponent as ɵdo, VerticalItemsComponent as ɵdp, CustomTranslationsModule as ɵe, CodeEditorComponent as ɵf, CoreFacade as ɵg, CodeMirror6Core as ɵh, CountryPhonePickerService as ɵi, LocalizedCurrencyImpurePipe as ɵj, LocalizedBignumberPipe as ɵk, LocalizedBignumberImpurePipe as ɵl, NumericPipe as ɵm, NumericService as ɵn, EmptyStateGoBackComponent as ɵo, IAssistIconComponent as ɵp, SeniorIconComponent as ɵq, DotsIndicatorComponent as ɵr, LoadingIndicatorComponent as ɵs, FileUploadService as ɵt, InfoSignComponent as ɵu, TableColumnsComponent as ɵv, TablePagingComponent as ɵw, TextFieldModule as ɵx, TextFieldComponent as ɵy, NumberFieldModule as ɵz };
16554
16653
  //# sourceMappingURL=seniorsistemas-angular-components.js.map