@datarailsshared/datarailsshared 1.3.17 → 1.3.18

package/fesm2015/datarailsshared-datarailsshared.js

@@ -1078,7 +1078,7 @@ DrSelectComponent.decorators = [
                         useExisting: DrSelectComponent,
                         multi: true
                     }],
-                styles: [":host{width:100%;height:32px}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px!important;border:1px solid #C3C4CE;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#85889c}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#21b8f1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#151b3f;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-value{line-height:1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#151a41;height:24px;padding:2px 8px;font-size:12px;margin:2px 2px 2px 0;background:#E5E6EA;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0 0 0 9px!important;color:#51566f;font-size:16px;font-weight:bold}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#E5E6EA!important;border:1px solid #E5E6EA!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#bcbcbc!important}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#de2833}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{border:1px solid #DBDEE3;border-radius:6px!important;margin-top:8px!important;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:10px 12px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#F3F7FF;color:#151b3f}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:normal!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked:hover{background:#F6F7F8}\n"]
+                styles: [":host{width:100%;height:32px}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px!important;border:1px solid #C3C4CE;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#85889c}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#21b8f1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#151b3f;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-value{line-height:1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#151a41;height:24px;padding:2px 8px;font-size:12px;margin:2px 2px 2px 0;background:#E5E6EA;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0 0 0 9px!important;color:#51566f;font-size:16px;font-weight:bold}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#E5E6EA!important;border:1px solid #E5E6EA!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#bcbcbc!important}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#de2833}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{border:1px solid #DBDEE3;border-radius:6px!important;margin-top:8px!important;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:10px 12px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#F3F7FF;color:#151b3f}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:normal!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked:hover{background:#F6F7F8}\n"]
             },] }
 ];
 DrSelectComponent.propDecorators = {
@@ -1240,10 +1240,10 @@ const POPUP_POSITIONS = {
 const POPUP_ANIMATION = [
     transition(':enter', [
         style({ opacity: 0 }),
-        animate(300, style({ opacity: 1 })),
+        animate(150, style({ opacity: 1 })),
     ]),
     transition(':leave', [
-        animate(300, style({ opacity: 0 })),
+        animate(150, style({ opacity: 0 })),
     ]),
 ];
 
@@ -1817,6 +1817,31 @@ class DrPopoverRef {
     }
 }
 
+var DrPopoverAlignmentDimension;
+(function (DrPopoverAlignmentDimension) {
+    DrPopoverAlignmentDimension["Width"] = "width";
+    DrPopoverAlignmentDimension["Height"] = "height";
+})(DrPopoverAlignmentDimension || (DrPopoverAlignmentDimension = {}));
+const DEFAULT_CONFIG = {
+    hasBackdrop: false,
+    closeOnBackdropClick: false,
+    backdropClass: 'dr-popover-transparent-backdrop',
+};
+const DEFAULT_MODEL = {
+    position: 'bottom',
+    class: '',
+    overlayConfig: {},
+    manualClosing: { enabled: false },
+};
+function getAlignmentDimension(position) {
+    if (!POPUP_POSITIONS[position])
+        return DrPopoverAlignmentDimension.Width;
+    if ((position === null || position === void 0 ? void 0 : position.includes('left')) || (position === null || position === void 0 ? void 0 : position.includes('right'))) {
+        return DrPopoverAlignmentDimension.Height;
+    }
+    return DrPopoverAlignmentDimension.Width;
+}
+
 class DrPopoverComponent {
     constructor(cdr, componentFactoryResolver, viewContainerRef, elementRef, popoverRef) {
         this.cdr = cdr;
@@ -1826,6 +1851,7 @@ class DrPopoverComponent {
         this.popoverRef = popoverRef;
         this.class = '';
         this.isContentTemplate = false;
+        this.popover = true;
     }
     clickOutside(e) {
         const isTargetHost = this.hostRef instanceof ElementRef && (this.hostRef.nativeElement === e.target || this.hostRef.nativeElement.contains(e.target));
@@ -1849,6 +1875,9 @@ class DrPopoverComponent {
             Object.assign(this.componentRef.instance, this.contentContext);
             this.popoverContainer.nativeElement.appendChild(this.componentRef.location.nativeElement);
         }
+        if (this.alignment === 'host') {
+            this[getAlignmentDimension(this.position)] = '100%';
+        }
         this.cdr.detectChanges();
     }
 }
@@ -1876,22 +1905,15 @@ DrPopoverComponent.propDecorators = {
     class: [{ type: Input }],
     hostRef: [{ type: Input }],
     manualClosing: [{ type: Input }],
+    alignment: [{ type: Input }],
+    position: [{ type: Input }],
     popoverContainer: [{ type: ViewChild, args: ['popoverContainer', { read: ElementRef, static: true },] }],
+    width: [{ type: HostBinding, args: ['style.width',] }],
+    height: [{ type: HostBinding, args: ['style.height',] }],
+    popover: [{ type: HostBinding, args: ['@popover',] }],
     clickOutside: [{ type: HostListener, args: ['document:mouseup', ['$event'],] }]
 };
 
-const DEFAULT_CONFIG = {
-    hasBackdrop: false,
-    closeOnBackdropClick: false,
-    backdropClass: 'dr-popover-transparent-backdrop',
-};
-const DEFAULT_MODEL = {
-    position: 'bottom',
-    class: '',
-    overlayConfig: {},
-    manualClosing: { enabled: false },
-};
-
 class DrPopoverService {
     constructor(overlay, overlayPositionBuilder, injector) {
         this.overlay = overlay;
@@ -1905,10 +1927,10 @@ class DrPopoverService {
         const overlayRef = this.createOverlay(model);
         const popoverRef = new DrPopoverRef(overlayRef);
         this.attachOverlayContainer(content, model, overlayRef, popoverRef);
-        this.registerCloseListeners(model, overlayRef, popoverRef);
+        this.registerListeners(model, overlayRef, popoverRef);
         return popoverRef;
     }
-    attachOverlayContainer(content, { contentContext, position, class: elementClass, manualClosing, hostRef }, overlayRef, popoverRef) {
+    attachOverlayContainer(content, { contentContext, position, class: elementClass, manualClosing, hostRef, alignment }, overlayRef, popoverRef) {
         const componentPortal = new ComponentPortal(DrPopoverComponent, null, this.createInjector(popoverRef));
         const contentRef = overlayRef.attach(componentPortal);
         popoverRef.componentRef = contentRef;
@@ -1917,17 +1939,26 @@ class DrPopoverService {
         contentRef.instance.class = elementClass + ' ' + position;
         contentRef.instance.manualClosing = manualClosing;
         contentRef.instance.hostRef = hostRef;
+        contentRef.instance.alignment = alignment;
+        contentRef.instance.position = position;
     }
     createOverlay(popoverModel) {
         const overlayConfig = this.getOverlayConfig(popoverModel);
         return this.overlay.create(overlayConfig);
     }
     getOverlayConfig(popoverModel) {
+        if (!POPUP_POSITIONS[popoverModel.position])
+            throw new Error(`DrPopover does not support the '${popoverModel === null || popoverModel === void 0 ? void 0 : popoverModel.position}' position!`);
         const config = Object.assign(Object.assign({}, DEFAULT_CONFIG), popoverModel.overlayConfig || {});
+        const hostElement = this.getHostElement(popoverModel.hostRef);
         const positionStrategy = this.overlayPositionBuilder
             .flexibleConnectedTo(popoverModel.hostRef)
             .withPositions([POPUP_POSITIONS[popoverModel.position]]);
         const overlayConfig = new OverlayConfig(Object.assign({ scrollStrategy: this.overlay.scrollStrategies.noop(), positionStrategy }, config));
+        if (popoverModel.alignment === 'host' && hostElement) {
+            const alignmentDimension = getAlignmentDimension(popoverModel.position);
+            overlayConfig[alignmentDimension] = hostElement.getBoundingClientRect()[alignmentDimension];
+        }
         return overlayConfig;
     }
     createInjector(popoverRef) {
@@ -1936,15 +1967,31 @@ class DrPopoverService {
         ];
         return Injector.create({ providers: injectionTokens, parent: this.injector });
     }
-    registerCloseListeners(popoverModel, overlayRef, popoverRef) {
+    registerListeners(popoverModel, overlayRef, popoverRef) {
         const config = popoverModel.overlayConfig || {};
         const targetElement = popoverModel.targetElement;
+        const hostElement = this.getHostElement(popoverModel.hostRef);
         if ((config === null || config === void 0 ? void 0 : config.closeOnBackdropClick) && (config === null || config === void 0 ? void 0 : config.hasBackdrop)) {
             overlayRef.backdropClick().subscribe(() => popoverRef.close());
         }
         if (targetElement) {
             targetElement.addEventListener('mouseup', () => popoverRef.close(), { once: true });
         }
+        if (popoverModel.alignment === 'host' && hostElement) {
+            const alignmentDimension = getAlignmentDimension(popoverModel.position);
+            const resizeObserver = new ResizeObserver(entries => {
+                entries.forEach(host => overlayRef.updateSize({ [alignmentDimension]: host.target.getBoundingClientRect()[alignmentDimension] }));
+            });
+            resizeObserver.observe(hostElement);
+            popoverRef.onClose.pipe(first()).subscribe(() => resizeObserver.unobserve(hostElement));
+        }
+    }
+    getHostElement(hostRef) {
+        if (!hostRef || hostRef.x)
+            return null;
+        if (hostRef.nativeElement)
+            return hostRef.nativeElement;
+        return hostRef;
     }
 }
 DrPopoverService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DrPopoverService_Factory() { return new DrPopoverService(i0.ɵɵinject(i1.Overlay), i0.ɵɵinject(i1.OverlayPositionBuilder), i0.ɵɵinject(i0.INJECTOR)); }, token: DrPopoverService, providedIn: "root" });
@@ -1994,6 +2041,7 @@ class DrPopoverDirective {
             manualClosing: this.manualClosing,
             position: this.position,
             contentContext: this.contentContext,
+            alignment: this.alignment,
         });
         popoverRef.onClose.pipe(first()).subscribe((res) => {
             this.closePopover();
@@ -2021,6 +2069,7 @@ DrPopoverDirective.propDecorators = {
     class: [{ type: Input, args: ['drPopoverClass',] }],
     overlayConfig: [{ type: Input, args: ['drPopoverOverlayConfig',] }],
     manualClosing: [{ type: Input, args: ['drPopoverManualClosing',] }],
+    alignment: [{ type: Input, args: ['drPopoverAlignment',] }],
     popoverClose: [{ type: Output, args: ['drPopoverClose',] }],
     showStateChange: [{ type: Output, args: ['drPopoverShowStateChange',] }],
     togglePopover: [{ type: HostListener, args: ['click',] }]
@@ -2133,7 +2182,7 @@ DrDropdownComponent.decorators = [
                 selector: 'dr-dropdown',
                 template: "<div #menuContainer\r\n     (clickOutside)=\"onClickedOutside()\"\r\n     [drDropdownPosition]=\"option\"\r\n     [position]=\"position\"\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             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",
                 changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}.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{color:#bcbcbc;pointer-events:none}.dr-dropdown__container__item i:first-child{margin-right:8px}.dr-dropdown__container__item__text{margin-right:auto}.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-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
+                styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}.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{color:#bcbcbc;pointer-events:none}.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-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
             },] }
 ];
 DrDropdownComponent.ctorParameters = () => [
@@ -2580,5 +2629,5 @@ DrTabsModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { AnyTagComponent, CheckboxComponent, DateTagComponent, DateTagModule, DayTagComponent, DrAvatarComponent, DrAvatarModule, DrButtonComponent, DrDatePickerComponent, DrDatePickerFormatDirective, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrInputComponent, DrInputsModule, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrSelectComponent, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, ForecastTagComponent, ISpinnerOptions, ListTagComponent, ListTagModule, MonthTagComponent, QuarterTagComponent, RadioButtonComponent, TooltipComponent, WeekTagComponent, YearTagComponent, components$2 as ɵa, POPUP_ANIMATION as ɵb, CustomDateFormat as ɵc };
+export { AnyTagComponent, CheckboxComponent, DateTagComponent, DateTagModule, DayTagComponent, DrAvatarComponent, DrAvatarModule, DrButtonComponent, DrDatePickerComponent, DrDatePickerFormatDirective, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrInputComponent, DrInputsModule, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrSelectComponent, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, ForecastTagComponent, ISpinnerOptions, ListTagComponent, ListTagModule, MonthTagComponent, QuarterTagComponent, RadioButtonComponent, TooltipComponent, WeekTagComponent, YearTagComponent, components$2 as ɵa, POPUP_ANIMATION as ɵb, CustomDateFormat as ɵc };
 //# sourceMappingURL=datarailsshared-datarailsshared.js.map