@datarailsshared/datarailsshared 1.3.10 → 1.3.11

package/bundles/datarailsshared-datarailsshared.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@angular/material/core'), require('@angular/material-moment-adapter'), require('moment'), require('@angular/animations'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/common'), require('rxjs'), require('rxjs/operators'), require('@angular/material/datepicker'), require('@angular/material/form-field'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/button-toggle'), require('@ng-select/ng-select'), require('@angular/material/tooltip')) :
-    typeof define === 'function' && define.amd ? define('@datarailsshared/datarailsshared', ['exports', '@angular/core', '@angular/forms', '@angular/material/core', '@angular/material-moment-adapter', 'moment', '@angular/animations', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/common', 'rxjs', 'rxjs/operators', '@angular/material/datepicker', '@angular/material/form-field', '@angular/material/input', '@angular/material/select', '@angular/material/button-toggle', '@ng-select/ng-select', '@angular/material/tooltip'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.datarailsshared = global.datarailsshared || {}, global.datarailsshared.datarailsshared = {}), global.ng.core, global.ng.forms, global.ng.material.core, global.ng.materialMomentAdapter, global.momentImported, global.ng.animations, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.common, global.rxjs, global.rxjs.operators, global.ng.material.datepicker, global.ng.material.formField, global.ng.material.input, global.ng.material.select, global.ng.material.buttonToggle, global.ngSelect, global.ng.material.tooltip));
-}(this, (function (exports, i0, forms, core, materialMomentAdapter, momentImported, animations, overlay, portal, common, rxjs, operators, datepicker, formField, input, select, buttonToggle, ngSelect, tooltip) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@angular/material/core'), require('@angular/material-moment-adapter'), require('moment'), require('@angular/animations'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/common'), require('rxjs'), require('rxjs/operators'), require('@angular/material/datepicker'), require('@angular/material/form-field'), require('@angular/material/input'), require('@angular/material/select'), require('@angular/material/button-toggle'), require('@ng-select/ng-select'), require('@angular/material/tooltip'), require('@angular/material/tabs')) :
+    typeof define === 'function' && define.amd ? define('@datarailsshared/datarailsshared', ['exports', '@angular/core', '@angular/forms', '@angular/material/core', '@angular/material-moment-adapter', 'moment', '@angular/animations', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/common', 'rxjs', 'rxjs/operators', '@angular/material/datepicker', '@angular/material/form-field', '@angular/material/input', '@angular/material/select', '@angular/material/button-toggle', '@ng-select/ng-select', '@angular/material/tooltip', '@angular/material/tabs'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.datarailsshared = global.datarailsshared || {}, global.datarailsshared.datarailsshared = {}), global.ng.core, global.ng.forms, global.ng.material.core, global.ng.materialMomentAdapter, global.momentImported, global.ng.animations, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.common, global.rxjs, global.rxjs.operators, global.ng.material.datepicker, global.ng.material.formField, global.ng.material.input, global.ng.material.select, global.ng.material.buttonToggle, global.ngSelect, global.ng.material.tooltip, global.ng.material.tabs));
+}(this, (function (exports, i0, forms, core, materialMomentAdapter, momentImported, animations, overlay, portal, common, rxjs, operators, datepicker, formField, input, select, buttonToggle, ngSelect, tooltip, tabs) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -2220,9 +2220,6 @@
                     Object.assign(this.componentRef.instance, this.contentContext);
                     template.nativeElement.appendChild(this.componentRef.location.nativeElement);
                 }
-                else {
-                    this.contentContext.closePopover = this.popoverRef.close.bind(this.popoverRef);
-                }
                 this.cdr.detectChanges();
             },
             enumerable: false,
@@ -2236,7 +2233,8 @@
             if (!isTargetHost
                 && !isTargetInPopover
                 && !isTargetInDatepicker
-                && !isTargetInSelect) {
+                && !isTargetInSelect
+                && !this.manualClosing) {
                 this.popoverRef.close();
             }
         };
@@ -2264,6 +2262,7 @@
         contentContext: [{ type: i0.Input }],
         class: [{ type: i0.Input }],
         hostRef: [{ type: i0.Input }],
+        manualClosing: [{ type: i0.Input }],
         popoverContainer: [{ type: i0.ViewChild, args: ['popoverContainer', { read: i0.ElementRef },] }],
         clickOutside: [{ type: i0.HostListener, args: ['document:mouseup', ['$event'],] }]
     };
@@ -2325,8 +2324,9 @@
             this.contentRef = this.overlayRef.attach(componentPortal);
             this.drPopoverRef.componentRef = this.contentRef;
             this.contentRef.instance.content = this.content;
-            this.contentRef.instance.contentContext = this.contentContext;
+            this.contentRef.instance.contentContext = Object.assign(Object.assign({}, this.contentContext), { closePopover: this.destroyPopover.bind(this) });
             this.contentRef.instance.class = this.class + ' ' + this.position;
+            this.contentRef.instance.manualClosing = this.manualClosing;
             this.contentRef.instance.hostRef = this.elementRef;
         };
         DrPopoverDirective.prototype.createOverlay = function (config) {
@@ -2373,6 +2373,7 @@
         position: [{ type: i0.Input, args: ['drPopoverPosition',] }],
         class: [{ type: i0.Input, args: ['drPopoverClass',] }],
         overlayConfig: [{ type: i0.Input, args: ['drPopoverOverlayConfig',] }],
+        manualClosing: [{ type: i0.Input, args: ['drPopoverManualClosing',] }],
         popoverClose: [{ type: i0.Output, args: ['drPopoverClose',] }],
         showStateChange: [{ type: i0.Output, args: ['drPopoverShowStateChange',] }],
         show: [{ type: i0.HostListener, args: ['click',] }]
@@ -2663,6 +2664,52 @@
                 },] }
     ];
 
+    var DrTabComponent = /** @class */ (function () {
+        function DrTabComponent() {
+        }
+        DrTabComponent.prototype.ngOnInit = function () {
+        };
+        return DrTabComponent;
+    }());
+    DrTabComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'dr-tab',
+                    template: "\n      <ng-template>\n          <ng-content></ng-content>\n      </ng-template>\n       "
+                },] }
+    ];
+    DrTabComponent.ctorParameters = function () { return []; };
+    DrTabComponent.propDecorators = {
+        label: [{ type: i0.Input }],
+        disabled: [{ type: i0.Input }],
+        contentTemplate: [{ type: i0.ViewChild, args: [i0.TemplateRef,] }]
+    };
+
+    var DrTabsComponent = /** @class */ (function () {
+        function DrTabsComponent() {
+            this.selectedTab = 0;
+            this.selectedTabChange = new i0.EventEmitter();
+        }
+        DrTabsComponent.prototype.selectedIndexChange = function ($event) {
+            this.selectedTab = $event;
+            this.selectedTabChange.emit($event);
+        };
+        return DrTabsComponent;
+    }());
+    DrTabsComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'dr-tabs',
+                    template: "<mat-tab-group disableRipple [selectedIndex]=\"selectedTab\"\r\n               (selectedIndexChange)=\"selectedIndexChange($event)\"\r\n               [class.with-radio]=\"withRadio\">\r\n  <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{tab.label}}\" [disabled]=\"tab.disabled\" >\r\n    <ng-container *ngIf=\"withRadio\">\r\n      <ng-template mat-tab-label>\r\n        <dr-radio-button [value]=\"index\"\r\n                         [(ngModel)]=\"selectedTab\">\r\n        </dr-radio-button>\r\n        {{tab.label}}\r\n      </ng-template>\r\n    </ng-container>\r\n\r\n    <ng-container *ngTemplateOutlet=\"tab.contentTemplate\" ></ng-container>\r\n  </mat-tab>\r\n</mat-tab-group>\r\n",
+                    styles: [":host{width:100%}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #D5DAE5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#579bf2;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:\"Nunito Sans\",sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#579bf2!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#F6F7F8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}\n"]
+                },] }
+    ];
+    DrTabsComponent.ctorParameters = function () { return []; };
+    DrTabsComponent.propDecorators = {
+        selectedTab: [{ type: i0.Input }],
+        withRadio: [{ type: i0.Input }],
+        selectedTabChange: [{ type: i0.Output }],
+        tabsContentList: [{ type: i0.ContentChildren, args: [DrTabComponent,] }]
+    };
+
     var components$2 = [DateTagComponent,
         DayTagComponent,
         WeekTagComponent,
@@ -2876,6 +2923,32 @@
                 },] }
     ];
 
+    var DrTabsModule = /** @class */ (function () {
+        function DrTabsModule() {
+        }
+        return DrTabsModule;
+    }());
+    DrTabsModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        tabs.MatTabsModule,
+                        forms.FormsModule,
+                        forms.ReactiveFormsModule,
+                        DrInputsModule
+                    ],
+                    exports: [
+                        DrTabsComponent,
+                        DrTabComponent
+                    ],
+                    providers: [],
+                    declarations: [
+                        DrTabsComponent,
+                        DrTabComponent
+                    ],
+                },] }
+    ];
+
     /* components */
 
     /**
@@ -2908,6 +2981,9 @@
     exports.DrSpinnerComponent = DrSpinnerComponent;
     exports.DrSpinnerDirective = DrSpinnerDirective;
     exports.DrSpinnerModule = DrSpinnerModule;
+    exports.DrTabComponent = DrTabComponent;
+    exports.DrTabsComponent = DrTabsComponent;
+    exports.DrTabsModule = DrTabsModule;
     exports.DrTagComponent = DrTagComponent;
     exports.DrTagModule = DrTagModule;
     exports.DrToggleComponent = DrToggleComponent;