@leanix/components 0.2.212 → 0.2.215
Sign up to get free protection for your applications and to get access to all the features.
- package/bundles/leanix-components.umd.js +17 -4
- package/bundles/leanix-components.umd.js.map +1 -1
- package/esm2015/lib/forms-ui/components/options-sub-dropdown/options-sub-dropdown.component.js +16 -2
- package/esm2015/lib/forms-ui/components/options-sub-dropdown/options-sub-dropdown.component.js.map +1 -1
- package/esm2015/lib/modal-ui/components/modal/modal.component.js +2 -2
- package/esm2015/lib/modal-ui/components/modal/modal.component.js.map +1 -1
- package/fesm2015/leanix-components.js +17 -4
- package/fesm2015/leanix-components.js.map +1 -1
- package/lib/forms-ui/components/options-sub-dropdown/options-sub-dropdown.component.d.ts +3 -1
- package/package.json +3 -3
@@ -4621,6 +4621,7 @@
|
|
4621
4621
|
this.hidden = true;
|
4622
4622
|
this.mouseInside$ = new i6.BehaviorSubject(false);
|
4623
4623
|
this.destroyed$ = new i6.Subject();
|
4624
|
+
this.maxHeight$ = new i6.BehaviorSubject('none');
|
4624
4625
|
}
|
4625
4626
|
OptionsSubDropdownComponent.prototype.mouseenter = function () {
|
4626
4627
|
this.mouseInside$.next(true);
|
@@ -4642,8 +4643,20 @@
|
|
4642
4643
|
.subscribe(function (show) {
|
4643
4644
|
_this.hidden = !show;
|
4644
4645
|
_this.changeDetection.markForCheck();
|
4646
|
+
if (show) {
|
4647
|
+
_this.updateMaxHeight(_this.trigger.elementRef);
|
4648
|
+
}
|
4645
4649
|
});
|
4646
4650
|
};
|
4651
|
+
OptionsSubDropdownComponent.prototype.updateMaxHeight = function (elementRef) {
|
4652
|
+
var marginBottom = 8;
|
4653
|
+
var optionTopPosition = elementRef.nativeElement.getBoundingClientRect().top;
|
4654
|
+
var screenHeight = window.innerHeight;
|
4655
|
+
var maxHeight = screenHeight - optionTopPosition - marginBottom + "px";
|
4656
|
+
if (this.maxHeight$.getValue() !== maxHeight) {
|
4657
|
+
this.maxHeight$.next(maxHeight);
|
4658
|
+
}
|
4659
|
+
};
|
4647
4660
|
OptionsSubDropdownComponent.prototype.showByKeyboard = function () {
|
4648
4661
|
var optionChange$ = this.options.changes.pipe(operators.startWith(this.options), operators.map(function (options) { return options.toArray(); }), operators.map(function (options) { return options.map(function (option) {
|
4649
4662
|
option.isSuboption = true;
|
@@ -4669,13 +4682,13 @@
|
|
4669
4682
|
return OptionsSubDropdownComponent;
|
4670
4683
|
}());
|
4671
4684
|
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 });
|
4672
|
-
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
|
4685
|
+
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 #spacingContainer class=\"spacingContainer\" [class.left]=\"align === 'left'\">\n <ul\n #subDropdown\n class=\"sub-dropdown\"\n lxAutoclose\n [class.showScrollbar]=\"(maxHeight$ | async) !== 'none'\"\n [style.max-height]=\"(maxHeight$ | async) ?? 'none'\"\n (autoclose)=\"closeDropdown()\"\n >\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [":host{display:block}: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{position:relative;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::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}.sub-dropdown::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}.sub-dropdown::-webkit-scrollbar-track-piece{background-color:transparent}.sub-dropdown.showScrollbar{overflow-y:auto}"], directives: [{ type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], pipes: { "async": i2__namespace.AsyncPipe } });
|
4673
4686
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.4", ngImport: i0__namespace, type: OptionsSubDropdownComponent, decorators: [{
|
4674
4687
|
type: i0.Component,
|
4675
4688
|
args: [{
|
4676
4689
|
selector: 'lx-options-sub-dropdown',
|
4677
4690
|
templateUrl: 'options-sub-dropdown.component.html',
|
4678
|
-
styleUrls: ['options-sub-dropdown.component.
|
4691
|
+
styleUrls: ['options-sub-dropdown.component.scss']
|
4679
4692
|
}]
|
4680
4693
|
}], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { trigger: [{
|
4681
4694
|
type: i0.Input
|
@@ -6233,7 +6246,7 @@
|
|
6233
6246
|
});
|
6234
6247
|
}
|
6235
6248
|
else if (this.size === 'dialog-large') {
|
6236
|
-
var positionStrategy = this.overlay.position().global().top('
|
6249
|
+
var positionStrategy = this.overlay.position().global().top('4vh').centerHorizontally();
|
6237
6250
|
this.overlayRef = this.overlay.create({
|
6238
6251
|
panelClass: this.size,
|
6239
6252
|
positionStrategy: positionStrategy,
|
@@ -6244,7 +6257,7 @@
|
|
6244
6257
|
}
|
6245
6258
|
else {
|
6246
6259
|
// size 'dialog'
|
6247
|
-
var positionStrategy = this.overlay.position().global().top('
|
6260
|
+
var positionStrategy = this.overlay.position().global().top('8vh').centerHorizontally();
|
6248
6261
|
this.overlayRef = this.overlay.create({
|
6249
6262
|
panelClass: this.size,
|
6250
6263
|
minWidth: '600px',
|