@leanix/components 0.2.94 → 0.2.98

Sign up to get free protection for your applications and to get access to all the features.
@@ -2,7 +2,7 @@
2
2
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/cdk/portal'), require('@angular/cdk/overlay'), require('lodash/fp'), require('@ngx-translate/core'), require('@angular/platform-browser'), require('rxjs'), require('rxjs/operators'), require('color'), require('date-fns'), require('lodash'), require('marked'), require('@angular/cdk/drag-drop'), require('@angular/forms'), require('ngx-bootstrap/datepicker'), require('ngx-infinite-scroll'), require('@angular/cdk/a11y'), require('@angular/cdk/bidi'), require('@angular/animations'), require('@ncstate/sat-popover'), require('@angular/cdk/coercion'), require('@angular/router')) :
3
3
  typeof define === 'function' && define.amd ? define('@leanix/components', ['exports', '@angular/common', '@angular/core', '@angular/cdk/portal', '@angular/cdk/overlay', 'lodash/fp', '@ngx-translate/core', '@angular/platform-browser', 'rxjs', 'rxjs/operators', 'color', 'date-fns', 'lodash', 'marked', '@angular/cdk/drag-drop', '@angular/forms', 'ngx-bootstrap/datepicker', 'ngx-infinite-scroll', '@angular/cdk/a11y', '@angular/cdk/bidi', '@angular/animations', '@ncstate/sat-popover', '@angular/cdk/coercion', '@angular/router'], factory) :
4
4
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.leanix = global.leanix || {}, global.leanix.components = {}), global.ng.common, global.ng.core, global.ng.cdk.portal, global.ng.cdk.overlay, global.fp, global.i1$2, global.ng.platformBrowser, global.rxjs, global.rxjs.operators, global.Color, global.dateFns, global._, global.marked, global.ng.cdk.dragDrop, global.ng.forms, global.i1$3, global.i3$1, global.ng.cdk.a11y, global.ng.cdk.bidi, global.ng.animations, global.i1$5, global.ng.cdk.coercion, global.ng.router));
5
- }(this, (function (exports, i2, i0, i3, i1, fp, i1$2, i1$1, i6, operators, Color, dateFns, _, marked, i3$3, i3$2, i1$3, i3$1, i2$1, i1$4, animations, i1$5, coercion, i3$4) { 'use strict';
5
+ })(this, (function (exports, i2, i0, i3, i1, fp, i1$2, i1$1, i6, operators, Color, dateFns, _, marked, i3$3, i3$2, i1$3, i3$1, i2$1, i1$4, animations, i1$5, coercion, i3$4) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -13,14 +13,12 @@
13
13
  var d = Object.getOwnPropertyDescriptor(e, k);
14
14
  Object.defineProperty(n, k, d.get ? d : {
15
15
  enumerable: true,
16
- get: function () {
17
- return e[k];
18
- }
16
+ get: function () { return e[k]; }
19
17
  });
20
18
  }
21
19
  });
22
20
  }
23
- n['default'] = e;
21
+ n["default"] = e;
24
22
  return Object.freeze(n);
25
23
  }
26
24
 
@@ -1052,7 +1050,7 @@
1052
1050
  return SpinnerComponent;
1053
1051
  }());
1054
1052
  SpinnerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: SpinnerComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1055
- SpinnerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: SpinnerComponent, selector: "lx-spinner", inputs: { fadeBackground: "fadeBackground" }, host: { properties: { "class.fadeBackgroundFromInput": "this.fadeBackground" } }, ngImport: i0__namespace, template: "<div class=\"container\">\n <div class=\"middle\">\n <div class=\"center\">\n <div class=\"spinner\">\n <div class=\"rect1\"></div>\n <div class=\"rect2\"></div>\n <div class=\"rect3\"></div>\n <div class=\"rect4\"></div>\n <div class=\"rect5\"></div>\n </div>\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}:host{font-size:2em;font-weight:300}:host(.fullSpace){position:absolute;right:0;left:0;top:0;bottom:0;z-index:1000}:host(.fullSpaceFixed){position:fixed;right:0;left:0;top:0;bottom:0;z-index:1000}.container{display:table;height:100%;width:100%}.middle{display:table-cell;vertical-align:middle}.center{text-align:center}:host(.fadeBackground),:host(.fadeBackgroundFromInput){background-color:rgba(255,255,255,.6)}.spinner{margin:0 auto;width:55px;height:25px;text-align:center;font-size:10px}.spinner>div{height:100%;width:6px;background-color:#1666ee;display:inline-block;margin:0 1px;-webkit-animation:sk-stretchdelay 1.2s ease-in-out infinite;animation:sk-stretchdelay 1.2s ease-in-out infinite}.spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}"] });
1053
+ SpinnerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: SpinnerComponent, selector: "lx-spinner", inputs: { fadeBackground: "fadeBackground" }, host: { properties: { "class.fadeBackgroundFromInput": "this.fadeBackground" } }, ngImport: i0__namespace, template: "<div class=\"container\">\n <div class=\"middle\">\n <div class=\"center\">\n <div class=\"spinner\">\n <div class=\"rect1\"></div>\n <div class=\"rect2\"></div>\n <div class=\"rect3\"></div>\n <div class=\"rect4\"></div>\n <div class=\"rect5\"></div>\n </div>\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}:host{font-size:2em;font-weight:300}:host(.fullSpace){position:absolute;right:0;left:0;top:0;bottom:0;z-index:1000}:host(.fullSpaceFixed){position:fixed;right:0;left:0;top:0;bottom:0;z-index:1000}.container{display:table;height:100%;width:100%}.middle{display:table-cell;vertical-align:middle}.center{text-align:center}:host(.fadeBackground),:host(.fadeBackgroundFromInput){background-color:hsla(0,0%,100%,.6)}.spinner{margin:0 auto;width:55px;height:25px;text-align:center;font-size:10px}.spinner>div{height:100%;width:6px;background-color:#1666ee;display:inline-block;margin:0 1px;-webkit-animation:sk-stretchdelay 1.2s ease-in-out infinite;animation:sk-stretchdelay 1.2s ease-in-out infinite}.spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}"] });
1056
1054
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: SpinnerComponent, decorators: [{
1057
1055
  type: i0.Component,
1058
1056
  args: [{
@@ -3576,7 +3574,7 @@
3576
3574
  return DragAndDropListComponent;
3577
3575
  }());
3578
3576
  DragAndDropListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
3579
- DragAndDropListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListComponent, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight", items: "items", itemIdProperty: "itemIdProperty" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, queries: [{ propertyName: "itemTemplateRef", first: true, predicate: ["itemTemplate"], descendants: true }, { propertyName: "_items", predicate: DragAndDropListItemComponent }], ngImport: i0__namespace, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<ul cdkDropList class=\"list\" [cdkDropListData]=\"items$ | async\" (cdkDropListDropped)=\"drop($event)\">\n <ng-container *ngIf=\"items; else contentChildList\">\n <li\n *ngFor=\"let item of items; let index = index; trackBy: trackById\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"item[itemIdProperty!]\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item, index: index }\"></ng-container>\n </li>\n </ng-container>\n <ng-template #contentChildList>\n <li\n *ngFor=\"let itemComponent of items$ | async\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"itemComponent.item\"\n [cdkDragDisabled]=\"!itemComponent.draggable\"\n >\n <lx-drag-and-drop-list-item\n class=\"dragAndDropItem\"\n [item]=\"itemComponent.item\"\n [draggable]=\"itemComponent.draggable\"\n [actions]=\"itemComponent.actions\"\n (action)=\"emitContentChildAction($event)\"\n ></lx-drag-and-drop-list-item>\n </li>\n </ng-template>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}@-webkit-keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@-webkit-keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@-webkit-keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}:host{display:block}.list{list-style-type:none;width:100%;border:1px solid #99a5bb;display:block;border-radius:3px;padding:0;color:#526179;background:#fff}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item{cursor:move;border-bottom:1px solid #99a5bb}.item:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.item:last-child{border-bottom-left-radius:3px;border-bottom-right-radius:3px;border-bottom:0}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:1px solid #99a5bb!important;box-shadow:0 3px 4px rgba(116,116,116,.3)}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating,.list.cdk-drop-list-dragging .item:not(.cdk-drag-placeholder){transition:transform .18s;transition-delay:0s;transition-timing-function:ease}"], components: [{ type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2__namespace.AsyncPipe } });
3577
+ DragAndDropListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: DragAndDropListComponent, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight", items: "items", itemIdProperty: "itemIdProperty" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, queries: [{ propertyName: "itemTemplateRef", first: true, predicate: ["itemTemplate"], descendants: true }, { propertyName: "_items", predicate: DragAndDropListItemComponent }], ngImport: i0__namespace, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<ul cdkDropList class=\"list\" [cdkDropListData]=\"items$ | async\" (cdkDropListDropped)=\"drop($event)\">\n <ng-container *ngIf=\"items; else contentChildList\">\n <li\n *ngFor=\"let item of items; let index = index; trackBy: trackById\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"item[itemIdProperty!]\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplateRef; context: { $implicit: item, index: index }\"></ng-container>\n </li>\n </ng-container>\n <ng-template #contentChildList>\n <li\n *ngFor=\"let itemComponent of items$ | async\"\n class=\"item\"\n cdkDrag\n cdkDragLockAxis=\"y\"\n [cdkDragData]=\"itemComponent.item\"\n [cdkDragDisabled]=\"!itemComponent.draggable\"\n >\n <lx-drag-and-drop-list-item\n class=\"dragAndDropItem\"\n [item]=\"itemComponent.item\"\n [draggable]=\"itemComponent.draggable\"\n [actions]=\"itemComponent.actions\"\n (action)=\"emitContentChildAction($event)\"\n ></lx-drag-and-drop-list-item>\n </li>\n </ng-template>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}@-webkit-keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@keyframes spinOnceFadeInKeyFrames{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(-180deg)}}@-webkit-keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@keyframes spinOnceFadeOutKeyFrames{0%{opacity:1;transform:rotate(-180deg)}to{opacity:0;transform:rotate(0deg)}}@-webkit-keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideUpKeyFrames{0%{transform:translateY(10px);opacity:0}20%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@-webkit-keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}:host{display:block}.list{list-style-type:none;width:100%;border:1px solid #99a5bb;display:block;border-radius:3px;padding:0;color:#526179;background:#fff}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item{cursor:move;border-bottom:1px solid #99a5bb}.item:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.item:last-child{border-bottom-left-radius:3px;border-bottom-right-radius:3px;border-bottom:0}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:1px solid #99a5bb!important;box-shadow:0 3px 4px hsla(0,0%,45%,.3)}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating,.list.cdk-drop-list-dragging .item:not(.cdk-drag-placeholder){transition:transform .18s;transition-delay:0s;transition-timing-function:ease}"], components: [{ type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i2__namespace.AsyncPipe } });
3580
3578
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: DragAndDropListComponent, decorators: [{
3581
3579
  type: i0.Component,
3582
3580
  args: [{
@@ -4411,6 +4409,7 @@
4411
4409
  this.closeOnScroll = false;
4412
4410
  this.disabled = false;
4413
4411
  this.maxHeight = 'none';
4412
+ this.closeOnSelect = true;
4414
4413
  this.highlightedOptionIndex$ = new i6.BehaviorSubject(0);
4415
4414
  this._open = false;
4416
4415
  this.isSubdropdownExpanded = false;
@@ -4473,7 +4472,7 @@
4473
4472
  });
4474
4473
  /** Combined stream of all of the child options' select outputs. */
4475
4474
  this._options.changes
4476
- .pipe(operators.startWith(this._options), operators.switchMap(function () { return i6.merge.apply(void 0, __spreadArray(__spreadArray([], __read(_this._options.map(function (option) { return option.select; }))), __read(_this._options.map(function (option) { return option.selectedClick; })))); }), operators.delay(0), operators.takeUntil(this.destroyed$))
4475
+ .pipe(operators.startWith(this._options), operators.filter(function () { return _this.closeOnSelect; }), operators.switchMap(function () { return i6.merge.apply(void 0, __spreadArray(__spreadArray([], __read(_this._options.map(function (option) { return option.select; }))), __read(_this._options.map(function (option) { return option.selectedClick; })))); }), operators.delay(0), operators.takeUntil(this.destroyed$))
4477
4476
  .subscribe(function (_value) {
4478
4477
  _this.closeDropdown();
4479
4478
  });
@@ -4552,7 +4551,7 @@
4552
4551
  return OptionsDropdownComponent;
4553
4552
  }());
4554
4553
  OptionsDropdownComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: OptionsDropdownComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
4555
- OptionsDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: { align: "align", closeOnScroll: "closeOnScroll", disabled: "disabled", maxHeight: "maxHeight" }, queries: [{ propertyName: "trigger", first: true, predicate: KeyboardActionSourceDirective, descendants: true }, { propertyName: "_options", predicate: OptionComponent, descendants: true }], ngImport: i0__namespace, template: "<div (click)=\"open = !open\" class=\"triggerContainer\">\n <ng-content select=\"[lxKeyboardActionSource]\"></ng-content>\n</div>\n<ul\n *ngIf=\"open\"\n [class.left]=\"align === 'left'\"\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n lxAutoclose\n (autoclose)=\"closeDropdown()\"\n>\n <ng-content></ng-content>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}:host{display:inline-block;position:relative}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px rgba(0,0,0,.15);border:1px solid #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4554
+ OptionsDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: { align: "align", closeOnScroll: "closeOnScroll", disabled: "disabled", maxHeight: "maxHeight", closeOnSelect: "closeOnSelect" }, queries: [{ propertyName: "trigger", first: true, predicate: KeyboardActionSourceDirective, descendants: true }, { propertyName: "_options", predicate: OptionComponent, descendants: true }], ngImport: i0__namespace, template: "<div (click)=\"open = !open\" class=\"triggerContainer\">\n <ng-content select=\"[lxKeyboardActionSource]\"></ng-content>\n</div>\n<ul\n *ngIf=\"open\"\n [class.left]=\"align === 'left'\"\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n lxAutoclose\n (autoclose)=\"closeDropdown()\"\n>\n <ng-content></ng-content>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}:host{display:inline-block;position:relative}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px rgba(0,0,0,.15);border:1px solid #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
4556
4555
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: OptionsDropdownComponent, decorators: [{
4557
4556
  type: i0.Component,
4558
4557
  args: [{
@@ -4569,6 +4568,8 @@
4569
4568
  type: i0.Input
4570
4569
  }], maxHeight: [{
4571
4570
  type: i0.Input
4571
+ }], closeOnSelect: [{
4572
+ type: i0.Input
4572
4573
  }], trigger: [{
4573
4574
  type: i0.ContentChild,
4574
4575
  args: [KeyboardActionSourceDirective]
@@ -4612,7 +4613,7 @@
4612
4613
  option.isSuboption = true;
4613
4614
  return option;
4614
4615
  }); }));
4615
- return i6.combineLatest(this.trigger.highlight.asObservable(), optionChange$).pipe(operators.delay(0), // Need tick delay to get option highlighted and filter it out after
4616
+ return i6.combineLatest([this.trigger.highlight.asObservable(), optionChange$]).pipe(operators.delay(0), // Need tick delay to get option highlighted and filter it out after
4616
4617
  operators.map(function (_a) {
4617
4618
  var _b = __read(_a, 2), isHighlighted = _b[0], options = _b[1];
4618
4619
  return isHighlighted || options.some(function (option) { return option.isHighlighted; });
@@ -4623,7 +4624,7 @@
4623
4624
  var mouseEnterTrigger$ = i6.fromEvent(this.trigger.elementRef.nativeElement, 'mouseenter');
4624
4625
  var mouseLeaveTrigger$ = i6.fromEvent(this.trigger.elementRef.nativeElement, 'mouseleave');
4625
4626
  var showOnEnterMouse$ = mouseEnterTrigger$.pipe(operators.map(function () { return true; }));
4626
- var showOnEnterSubmenu$ = mouseEnterTrigger$.pipe(operators.switchMap(function () { return mouseLeaveTrigger$.pipe(operators.debounceTime(300)); }), operators.switchMap(function () { return _this.mouseInside$; }));
4627
+ var showOnEnterSubmenu$ = mouseEnterTrigger$.pipe(operators.switchMap(function () { return mouseLeaveTrigger$; }), operators.switchMap(function () { return _this.mouseInside$; }));
4627
4628
  return i6.merge(showOnEnterMouse$, showOnEnterSubmenu$);
4628
4629
  };
4629
4630
  OptionsSubDropdownComponent.prototype.closeDropdown = function () {
@@ -4632,7 +4633,7 @@
4632
4633
  return OptionsSubDropdownComponent;
4633
4634
  }());
4634
4635
  OptionsSubDropdownComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: OptionsSubDropdownComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
4635
- OptionsSubDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: OptionsSubDropdownComponent, selector: "lx-options-sub-dropdown", inputs: { trigger: "trigger", align: "align" }, host: { listeners: { "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "class.hidden": "this.hidden" } }, queries: [{ propertyName: "options", predicate: OptionComponent, descendants: true }], ngImport: i0__namespace, template: "<ul class=\"sub-dropdown\" [class.left]=\"align === 'left'\" lxAutoclose (autoclose)=\"closeDropdown()\">\n <ng-content></ng-content>\n</ul>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}:host.hidden{display:none}.sub-dropdown{position:absolute;left:calc(100% + 4px);transform:translateY(-32px);padding:0;background-color:#fff;border:1px solid #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px rgba(0,0,0,.15);text-align:left;list-style:none}.sub-dropdown.left{left:auto;right:calc(100% + 4px)}"], directives: [{ type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }] });
4636
+ OptionsSubDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: OptionsSubDropdownComponent, selector: "lx-options-sub-dropdown", inputs: { trigger: "trigger", align: "align" }, host: { listeners: { "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "class.hidden": "this.hidden" } }, queries: [{ propertyName: "options", predicate: OptionComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"spacingContainer\" [class.left]=\"align === 'left'\">\n <ul class=\"sub-dropdown\" lxAutoclose (autoclose)=\"closeDropdown()\">\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [":root{--lx-color-danger:#f96464;--lx-color-grey80:#c2c9d6;--lx-color-grey90:#e1e5eb}:host.hidden{display:none}.spacingContainer{position:absolute;left:100%;transform:translateY(-32px);padding:0 0 0 4px}.spacingContainer.left{left:auto;right:100%;padding:0 4px 0 0}.sub-dropdown{padding:0;background-color:#fff;border:1px solid #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px rgba(0,0,0,.15);text-align:left;list-style:none}"], directives: [{ type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }] });
4636
4637
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: OptionsSubDropdownComponent, decorators: [{
4637
4638
  type: i0.Component,
4638
4639
  args: [{
@@ -5582,7 +5583,7 @@
5582
5583
  return SortingDropdownComponent;
5583
5584
  }());
5584
5585
  SortingDropdownComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: SortingDropdownComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
5585
- SortingDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: SortingDropdownComponent, selector: "lx-sorting-dropdown", inputs: { currentSorting: "currentSorting", sortingOptions: "sortingOptions" }, outputs: { apply: "apply" }, ngImport: i0__namespace, template: "<lx-options-dropdown *ngIf=\"currentSorting\">\n <lx-sorting-dropdown-trigger\n lxKeyboardActionSource\n [label]=\"NAME + '.sortBy' | translate\"\n [currentSortingLabel]=\"getSortLabel(currentSorting?.key) | translate\"\n >\n </lx-sorting-dropdown-trigger>\n <lx-option-group (select)=\"applySortingMode($event)\">\n <lx-option *ngFor=\"let option of sortingOptions\" [value]=\"option\" [selected]=\"option.key === currentSorting?.key\">\n {{ getSortLabel(option?.key) | translate }}\n </lx-option>\n </lx-option-group>\n <lx-option-group (select)=\"applySortingDirection($event)\">\n <lx-option *ngFor=\"let sortDirection of sortingDirections\" [value]=\"sortDirection\" [selected]=\"sortDirection === currentSorting?.order\">\n {{ 'sorting.' + currentSorting?.key + '.' + sortDirection | translate }}\n </lx-option>\n </lx-option-group>\n</lx-options-dropdown>\n", styles: [""], components: [{ type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: ["align", "closeOnScroll", "disabled", "maxHeight"] }, { type: SortingDropdownTriggerComponent, selector: "lx-sorting-dropdown-trigger", inputs: ["label", "currentSortingLabel", "disabled"] }, { type: OptionGroupComponent, selector: "lx-option-group", inputs: ["hasSelectedState", "label"], outputs: ["select"] }, { type: OptionComponent, selector: "lx-option", inputs: ["selected", "isHighlighted", "disabled", "value", "hasSelectedState"], outputs: ["select", "highlight", "selectedClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: KeyboardActionSourceDirective, selector: "[lxKeyboardActionSource]", exportAs: ["keyboardActionSource"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$2.TranslatePipe } });
5586
+ SortingDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.4", type: SortingDropdownComponent, selector: "lx-sorting-dropdown", inputs: { currentSorting: "currentSorting", sortingOptions: "sortingOptions" }, outputs: { apply: "apply" }, ngImport: i0__namespace, template: "<lx-options-dropdown *ngIf=\"currentSorting\">\n <lx-sorting-dropdown-trigger\n lxKeyboardActionSource\n [label]=\"NAME + '.sortBy' | translate\"\n [currentSortingLabel]=\"getSortLabel(currentSorting?.key) | translate\"\n >\n </lx-sorting-dropdown-trigger>\n <lx-option-group (select)=\"applySortingMode($event)\">\n <lx-option *ngFor=\"let option of sortingOptions\" [value]=\"option\" [selected]=\"option.key === currentSorting?.key\">\n {{ getSortLabel(option?.key) | translate }}\n </lx-option>\n </lx-option-group>\n <lx-option-group (select)=\"applySortingDirection($event)\">\n <lx-option *ngFor=\"let sortDirection of sortingDirections\" [value]=\"sortDirection\" [selected]=\"sortDirection === currentSorting?.order\">\n {{ 'sorting.' + currentSorting?.key + '.' + sortDirection | translate }}\n </lx-option>\n </lx-option-group>\n</lx-options-dropdown>\n", styles: [""], components: [{ type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: ["align", "closeOnScroll", "disabled", "maxHeight", "closeOnSelect"] }, { type: SortingDropdownTriggerComponent, selector: "lx-sorting-dropdown-trigger", inputs: ["label", "currentSortingLabel", "disabled"] }, { type: OptionGroupComponent, selector: "lx-option-group", inputs: ["hasSelectedState", "label"], outputs: ["select"] }, { type: OptionComponent, selector: "lx-option", inputs: ["selected", "isHighlighted", "disabled", "value", "hasSelectedState"], outputs: ["select", "highlight", "selectedClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: KeyboardActionSourceDirective, selector: "[lxKeyboardActionSource]", exportAs: ["keyboardActionSource"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$2.TranslatePipe } });
5586
5587
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: SortingDropdownComponent, decorators: [{
5587
5588
  type: i0.Component,
5588
5589
  args: [{
@@ -6865,5 +6866,5 @@
6865
6866
 
6866
6867
  Object.defineProperty(exports, '__esModule', { value: true });
6867
6868
 
6868
- })));
6869
+ }));
6869
6870
  //# sourceMappingURL=leanix-components.umd.js.map