@datarailsshared/datarailsshared 1.3.34 → 1.3.35

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.
@@ -1731,7 +1731,7 @@
1731
1731
  DrSelectComponent.decorators = [
1732
1732
  { type: i0.Component, args: [{
1733
1733
  selector: 'dr-select',
1734
- template: " <ng-select [(ngModel)]=\"selectedItem\"\r\n [items]=\"items\"\r\n [bindLabel]=\"bindLabel\"\r\n [bindValue]=\"bindValue\"\r\n [multiple]=\"multiple\"\r\n [addTag]=\"addTag\"\r\n [appendTo]=\"appendTo\"\r\n [clearable]=\"clearable\"\r\n [searchable]=\"searchable\"\r\n [hideSelected]=\"hideSelected\"\r\n [placeholder]=\"placeholder\"\r\n [loading]=\"loading\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [id]=\"id\"\r\n [keyDownFn]=\"keyDownFn\"\r\n [searchFn]=\"searchFn\"\r\n (change)=\"change.emit(selectedItem); onChange(selectedItem)\"\r\n class=\"dr-select\">\r\n <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n </ng-select>\r\n",
1734
+ template: " <ng-select [(ngModel)]=\"selectedItem\"\r\n [items]=\"items\"\r\n [bindLabel]=\"bindLabel\"\r\n [bindValue]=\"bindValue\"\r\n [multiple]=\"multiple\"\r\n [addTag]=\"addTag\"\r\n [appendTo]=\"appendTo\"\r\n [clearable]=\"clearable\"\r\n [searchable]=\"searchable\"\r\n [hideSelected]=\"hideSelected\"\r\n [placeholder]=\"placeholder\"\r\n [loading]=\"loading\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [id]=\"id\"\r\n [keyDownFn]=\"keyDownFn\"\r\n [searchFn]=\"searchFn\"\r\n (change)=\"change.emit(selectedItem); onChange(selectedItem)\"\r\n class=\"dr-select\">\r\n <ng-template *ngIf=\"optionHeaderTemplate\" ng-header-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"optionHeaderTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"labelTemplate\" ng-label-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"labelTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"optionTemplate\" ng-option-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n <ng-template *ngIf=\"optionFooterTemplate\" ng-footer-tmp let-item=\"item\">\r\n <ng-container [ngTemplateOutlet]=\"optionFooterTemplate\" [ngTemplateOutletContext]=\"{item: item}\"></ng-container>\r\n </ng-template>\r\n </ng-select>\r\n",
1735
1735
  providers: [{
1736
1736
  provide: forms.NG_VALUE_ACCESSOR,
1737
1737
  useExisting: DrSelectComponent,
@@ -1765,7 +1765,8 @@
1765
1765
  change: [{ type: i0.Output }],
1766
1766
  labelTemplate: [{ type: i0.ContentChild, args: ['labelTemplate',] }],
1767
1767
  optionTemplate: [{ type: i0.ContentChild, args: ['optionTemplate',] }],
1768
- optionHeaderTemplate: [{ type: i0.ContentChild, args: ['optionHeaderTemplate',] }]
1768
+ optionHeaderTemplate: [{ type: i0.ContentChild, args: ['optionHeaderTemplate',] }],
1769
+ optionFooterTemplate: [{ type: i0.ContentChild, args: ['optionFooterTemplate',] }]
1769
1770
  };
1770
1771
 
1771
1772
  var DrAvatarComponent = /** @class */ (function () {
@@ -2977,9 +2978,12 @@
2977
2978
  }
2978
2979
  };
2979
2980
  DrDropdownComponent.prototype.tooltipToShow = function (act) {
2980
- if (act.toolTipIfDisabled && !this.disabled(act) && !act.toolTip)
2981
+ if (act.toolTipIfDisabled && !this.disabled(act))
2981
2982
  return '';
2982
- return act.toolTip || act.title;
2983
+ return act.toolTip;
2984
+ };
2985
+ DrDropdownComponent.prototype.tooltipPosition = function (widthMoreRight) {
2986
+ return widthMoreRight ? 'right' : 'left';
2983
2987
  };
2984
2988
  DrDropdownComponent.prototype.action = function (act) {
2985
2989
  if (!this.disabled(act)) {
@@ -3004,9 +3008,9 @@
3004
3008
  DrDropdownComponent.decorators = [
3005
3009
  { type: i0.Component, args: [{
3006
3010
  selector: 'dr-dropdown',
3007
- template: "<div #menuContainer\r\n (clickOutside)=\"onClickedOutside()\"\r\n [drDropdownPosition]=\"option\"\r\n [position]=\"position\"\r\n [class]=\"containerClass\"\r\n class=\"dr-dropdown\">\r\n <div class=\"dr-dropdown__container\">\r\n <div *ngFor=\"let act of list | drDropdownItemShowPipe\"\r\n (click)=\"action(act)\"\r\n [drTooltip]=\"tooltipToShow(act)\"\r\n [drTooltipPosition]=\"'top'\"\r\n [drTooltipOptions]=\"{ withoutArrow: true }\"\r\n [drTooltipClass]=\"'dr-dropdown__tooltip'\"\r\n class=\"dr-dropdown__container__item\"\r\n [class.item-disabled]=\"disabled(act)\"\r\n [class.item-selected]=\"selected(act)\">\r\n <i *ngIf=\"act.icon\" [class]=\"act.icon\"></i>\r\n <span class=\"dr-dropdown__container__item__text\">{{act.title}}</span>\r\n <i *ngFor=\"let actionIcon of act.actionIcons\"\r\n [class]=\"actionIcon.icon\"\r\n [class.showOnHover]=\"actionIcon.showOnHover\"\r\n (click)=\"onActionIconClick($event, actionIcon, act.data)\"></i>\r\n <i *ngIf=\"act.children?.length\" class=\"dr-icon-arrow-right\"></i>\r\n <dr-dropdown *ngIf=\"act.children?.length\" [options]=\"act.childOptions\"></dr-dropdown>\r\n </div>\r\n </div>\r\n</div>\r\n",
3011
+ template: "<div #menuContainer\r\n (clickOutside)=\"onClickedOutside()\"\r\n [drDropdownPosition]=\"option\"\r\n #dropdownPosition=\"dropdownPosition\"\r\n [position]=\"position\"\r\n [class]=\"containerClass\"\r\n class=\"dr-dropdown\">\r\n <div class=\"dr-dropdown__container\">\r\n <div *ngFor=\"let act of list | drDropdownItemShowPipe\"\r\n (click)=\"action(act)\"\r\n [drTooltip]=\"tooltipToShow(act)\"\r\n [drTooltipPosition]=\"tooltipPosition(dropdownPosition.widthMoreRight)\"\r\n [drTooltipOptions]=\"{ withoutArrow: true }\"\r\n [drTooltipClass]=\"'dr-dropdown__tooltip'\"\r\n class=\"dr-dropdown__container__item\"\r\n [class.item-disabled]=\"disabled(act)\"\r\n [class.item-selected]=\"selected(act)\">\r\n <i *ngIf=\"act.icon\" [class]=\"act.icon\"></i>\r\n <span class=\"dr-dropdown__container__item__text\">{{act.title}}</span>\r\n <i *ngFor=\"let actionIcon of act.actionIcons\"\r\n [class]=\"actionIcon.icon\"\r\n [class.showOnHover]=\"actionIcon.showOnHover\"\r\n (click)=\"onActionIconClick($event, actionIcon, act.data)\"></i>\r\n <i *ngIf=\"act.children?.length\" class=\"dr-icon-arrow-right\"></i>\r\n <dr-dropdown *ngIf=\"act.children?.length\" [options]=\"act.childOptions\"></dr-dropdown>\r\n </div>\r\n </div>\r\n</div>\r\n",
3008
3012
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
3009
- styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}::ng-deep .cdk-overlay-container{z-index:10400}::ng-deep .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown{position:absolute;z-index:-1;top:0;left:0;width:auto}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;border-radius:4px;box-shadow:0 4px 8px 1px #00000040;padding:8px 0;overflow-y:auto;max-height:60vh}.dr-dropdown__container__item{display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}.dr-dropdown__container__item:hover{background-color:#f6f7f8}.dr-dropdown__container__item:hover .showOnHover{visibility:visible}.dr-dropdown__container__item.item-selected{background:#F3F7FF}.dr-dropdown__container__item.item-disabled,.dr-dropdown__container__item.item-disabled i,.dr-dropdown__container__item.item-disabled .dr-dropdown__container__item__text{color:#bcbcbc}.dr-dropdown__container__item i:first-child{margin-right:8px}.dr-dropdown__container__item__text{margin-right:auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dr-dropdown__container__item i,.dr-dropdown__container__item__text{color:#151b3f}.dr-dropdown__container__item .showOnHover{visibility:hidden}.dr-dropdown.content-top{transform:translate(-50%,-100%)}.dr-dropdown.content-top-left{transform:translate(-100%,-100%)}.dr-dropdown.content-bottom{transform:translate(-50%,50%)}.dr-dropdown.content-bottom-left{transform:translate(-90%,35%)}.dr-dropdown.content-bottom-right{transform:translateY(45%)}.dr-dropdown.content-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
3013
+ styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}::ng-deep .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown{position:absolute;z-index:-1;top:0;left:0;width:auto}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;border-radius:4px;box-shadow:0 4px 8px 1px #00000040;padding:8px 0;overflow-y:auto;max-height:60vh}.dr-dropdown__container__item{display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}.dr-dropdown__container__item:hover{background-color:#f6f7f8}.dr-dropdown__container__item:hover .showOnHover{visibility:visible}.dr-dropdown__container__item.item-selected{background:#F3F7FF}.dr-dropdown__container__item.item-disabled,.dr-dropdown__container__item.item-disabled i,.dr-dropdown__container__item.item-disabled .dr-dropdown__container__item__text{color:#bcbcbc}.dr-dropdown__container__item i:first-child{margin-right:8px}.dr-dropdown__container__item__text{margin-right:auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dr-dropdown__container__item i,.dr-dropdown__container__item__text{color:#151b3f}.dr-dropdown__container__item .showOnHover{visibility:hidden}.dr-dropdown.content-top{transform:translate(-50%,-100%)}.dr-dropdown.content-top-left{transform:translate(-100%,-100%)}.dr-dropdown.content-bottom{transform:translate(-50%,50%)}.dr-dropdown.content-bottom-left{transform:translate(-90%,35%)}.dr-dropdown.content-bottom-right{transform:translateY(45%)}.dr-dropdown.content-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
3010
3014
  },] }
3011
3015
  ];
3012
3016
  DrDropdownComponent.ctorParameters = function () { return [
@@ -3127,6 +3131,8 @@
3127
3131
  var heightMoreWindowBottom = menuHeight + this.drDropdownPosition.y > window.innerHeight;
3128
3132
  var heightMoreWindowTop = menuHeight - this.drDropdownPosition.y + this.drDropdownPosition.height / 2 > 48; // header height;
3129
3133
  var widthMoreWindowRight = this.drDropdownPosition.x + 250 > window.innerWidth;
3134
+ var spaceBetweenElAndRightBorder = window.innerWidth - (this.drDropdownPosition.x + this.el.nativeElement.offsetWidth);
3135
+ this.widthMoreRight = this.drDropdownPosition.x < spaceBetweenElAndRightBorder;
3130
3136
  if (heightMoreWindowBottom) {
3131
3137
  this.position = 'top';
3132
3138
  }
@@ -3155,6 +3161,7 @@
3155
3161
  var defaultChildPadding = 3;
3156
3162
  var widthMoreWindowRight = window.innerWidth - this.position.clientX - this.el.nativeElement.offsetWidth - defaultPadding;
3157
3163
  var widthMoreWindowBottom = window.innerHeight - this.position.clientY - this.el.nativeElement.offsetHeight - defaultPadding;
3164
+ this.widthMoreRight = !(widthMoreWindowRight < 0);
3158
3165
  var calculatedHorizantallyPos = widthMoreWindowRight < 0
3159
3166
  ? -this.position.x + -defaultChildPadding
3160
3167
  : this.position.x + defaultChildPadding + xDifference;
@@ -3168,7 +3175,8 @@
3168
3175
  }());
3169
3176
  DrDropdownPositionDirective.decorators = [
3170
3177
  { type: i0.Directive, args: [{
3171
- selector: '[drDropdownPosition]'
3178
+ selector: '[drDropdownPosition]',
3179
+ exportAs: 'dropdownPosition'
3172
3180
  },] }
3173
3181
  ];
3174
3182
  DrDropdownPositionDirective.ctorParameters = function () { return [