@datarailsshared/datarailsshared 1.3.13 → 1.3.15
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.
- package/assets/styles/img/spinner.gif +0 -0
- package/bundles/datarailsshared-datarailsshared.umd.js +113 -32
- package/bundles/datarailsshared-datarailsshared.umd.js.map +1 -1
- package/datarailsshared-datarailsshared-1.3.15.tgz +0 -0
- package/datarailsshared-datarailsshared.metadata.json +1 -1
- package/esm2015/lib/dr-dropdown/dr-dropdown.component.js +14 -3
- package/esm2015/lib/dr-inputs/button/button.component.js +4 -4
- package/esm2015/lib/dr-inputs/dr-input/dr-input.component.js +1 -1
- package/esm2015/lib/dr-inputs/dr-inputs.module.js +13 -2
- package/esm2015/lib/dr-inputs/dr-toggle-button/dr-toggle-button.component.js +52 -0
- package/esm2015/lib/dr-popover/dr-popover.component.js +5 -26
- package/esm2015/lib/dr-popover/dr-popover.directive.js +29 -4
- package/esm2015/lib/dr-tabs/dr-tabs.component.js +1 -1
- package/esm2015/lib/models/dropdown.js +1 -1
- package/esm2015/public-api.js +2 -1
- package/fesm2015/datarailsshared-datarailsshared.js +108 -33
- package/fesm2015/datarailsshared-datarailsshared.js.map +1 -1
- package/lib/dr-dropdown/dr-dropdown.component.d.ts +1 -0
- package/lib/dr-inputs/dr-toggle-button/dr-toggle-button.component.d.ts +17 -0
- package/lib/dr-popover/dr-popover.component.d.ts +1 -5
- package/lib/dr-popover/dr-popover.directive.d.ts +6 -2
- package/lib/models/dropdown.d.ts +2 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
- package/datarailsshared-datarailsshared-1.3.13.tgz +0 -0
|
Binary file
|
|
@@ -1419,7 +1419,7 @@
|
|
|
1419
1419
|
multi: true
|
|
1420
1420
|
}],
|
|
1421
1421
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
1422
|
-
styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:\"
|
|
1422
|
+
styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:\"Poppins\",sans-serif;border:1px solid #C3C4CE;border-radius:6px;color:#85889c;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#85889c}:host:focus-within{border-color:#21b8f1!important;color:#151b3f}:host.disabled{pointer-events:none;border:none;color:#85889c;background:#E5E6EA}:host.ng-valid.ng-dirty{border-color:#03a678}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#de2833!important}:host.ng-untouched.ng-valid{border-color:#c3c4ce}:host input{display:flex;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input:disabled{border:none;color:#85889c;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host .clear-icon{visibility:hidden}:host.clearable .clear-icon,:host.ng-touched.ng-invalid .clear-icon{visibility:visible;content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91783 5.00001L9.03353 1.88395C9.11924 1.79818 9.16651 1.68374 9.16665 1.56171C9.16665 1.43962 9.11937 1.32504 9.03353 1.2394L8.76047 0.966415C8.67463 0.880433 8.56023 0.833344 8.43808 0.833344C8.31612 0.833344 8.20166 0.880433 8.11582 0.966415L5.00013 4.08227L1.88428 0.966415C1.79858 0.880433 1.68404 0.833344 1.56196 0.833344C1.44001 0.833344 1.32556 0.880433 1.23985 0.966415L0.966646 1.2394C0.788869 1.41719 0.788869 1.70637 0.966646 1.88395L4.08242 5.00001L0.966646 8.11593C0.880873 8.20184 0.833677 8.31628 0.833677 8.43831C0.833677 8.56034 0.880873 8.67478 0.966646 8.76062L1.23978 9.03361C1.32548 9.11952 1.44 9.16668 1.56188 9.16668C1.68397 9.16668 1.7985 9.11952 1.88421 9.03361L5.00005 5.91769L8.11575 9.03361C8.20159 9.11952 8.31605 9.16668 8.438 9.16668H8.43815C8.56017 9.16668 8.67456 9.11952 8.7604 9.03361L9.03346 8.76062C9.11916 8.67484 9.16643 8.56034 9.16643 8.43831C9.16643 8.31628 9.11916 8.20184 9.03346 8.116L5.91783 5.00001Z\" fill=\"%2351566F\"/></svg> ');margin:auto 8px;cursor:pointer}:host span+span,:host span+img{margin-left:0}:host.search-type{padding:0 16px;border-radius:16px}:host.search-type.ng-valid{border-color:#c3c4ce}:host.search-type .search-icon{content:url('data:image/svg+xml; utf8, <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.5816 10.2097C11.4878 10.1157 11.3605 10.0629 11.2277 10.0629H10.8175C10.7473 10.0629 10.6799 10.035 10.6303 9.98534C10.5322 9.88724 10.527 9.73044 10.6132 9.62178C11.4154 8.6112 11.8925 7.33534 11.8925 5.94625C11.8925 2.66209 9.23042 0 5.94625 0C2.66209 0 0 2.66209 0 5.94625C0 9.23042 2.66209 11.8925 5.94625 11.8925C7.33523 11.8925 8.611 11.4155 9.62155 10.6172C9.7304 10.5312 9.88711 10.5366 9.9852 10.6347C10.0349 10.6845 10.0629 10.7519 10.0629 10.8223V11.2277C10.0629 11.3605 10.1157 11.4878 10.2097 11.5816L14.2834 15.6472C14.4787 15.8421 14.795 15.8419 14.9901 15.6468L15.6468 14.9901C15.8419 14.795 15.8421 14.4787 15.6472 14.2834L11.5816 10.2097ZM5.94625 10.0629C3.67296 10.0629 1.82962 8.21955 1.82962 5.94625C1.82962 3.67296 3.67296 1.82962 5.94625 1.82962C8.21955 1.82962 10.0629 3.67296 10.0629 5.94625C10.0629 8.21955 8.21955 10.0629 5.94625 10.0629Z\" fill=\"%23BCBCBC\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}:host.with-button{padding-right:0}:host.with-button button{color:#0061ff;background:#F6F7F8;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #C3C4CE}:host ::ng-deep img[prefixIcon],:host ::ng-deep img[suffixIcon],:host ::ng-deep i[prefixIcon],:host ::ng-deep i[suffixIcon]{position:relative;margin:auto 8px}:host ::ng-deep img[prefixIcon],:host ::ng-deep i[prefixIcon]{margin-left:0}:host ::ng-deep img[suffixIcon],:host ::ng-deep i[suffixIcon]{margin-right:0}\n"]
|
|
1423
1423
|
},] }
|
|
1424
1424
|
];
|
|
1425
1425
|
DrInputComponent.ctorParameters = function () { return [
|
|
@@ -1847,6 +1847,61 @@
|
|
|
1847
1847
|
checkedChange: [{ type: i0.Output }]
|
|
1848
1848
|
};
|
|
1849
1849
|
|
|
1850
|
+
var DrToggleButtonComponent = /** @class */ (function () {
|
|
1851
|
+
function DrToggleButtonComponent(cdr) {
|
|
1852
|
+
this.cdr = cdr;
|
|
1853
|
+
this._disabled = false;
|
|
1854
|
+
this.onChange = function () { };
|
|
1855
|
+
this.onTouched = function () { };
|
|
1856
|
+
}
|
|
1857
|
+
Object.defineProperty(DrToggleButtonComponent.prototype, "disabled", {
|
|
1858
|
+
set: function (value) {
|
|
1859
|
+
this.setDisabledState(value);
|
|
1860
|
+
},
|
|
1861
|
+
enumerable: false,
|
|
1862
|
+
configurable: true
|
|
1863
|
+
});
|
|
1864
|
+
DrToggleButtonComponent.prototype.writeValue = function (value) {
|
|
1865
|
+
this.selectedValue = value;
|
|
1866
|
+
this.cdr.markForCheck();
|
|
1867
|
+
};
|
|
1868
|
+
DrToggleButtonComponent.prototype.registerOnChange = function (fn) {
|
|
1869
|
+
this.onChange = fn;
|
|
1870
|
+
};
|
|
1871
|
+
DrToggleButtonComponent.prototype.registerOnTouched = function (fn) {
|
|
1872
|
+
this.onTouched = fn;
|
|
1873
|
+
};
|
|
1874
|
+
DrToggleButtonComponent.prototype.setDisabledState = function (isDisabled) {
|
|
1875
|
+
this._disabled = isDisabled;
|
|
1876
|
+
};
|
|
1877
|
+
DrToggleButtonComponent.prototype.setValue = function (item) {
|
|
1878
|
+
this.selectedValue = item;
|
|
1879
|
+
this.onChange(this.selectedValue);
|
|
1880
|
+
this.onTouched();
|
|
1881
|
+
this.cdr.markForCheck();
|
|
1882
|
+
};
|
|
1883
|
+
return DrToggleButtonComponent;
|
|
1884
|
+
}());
|
|
1885
|
+
DrToggleButtonComponent.decorators = [
|
|
1886
|
+
{ type: i0.Component, args: [{
|
|
1887
|
+
selector: 'dr-toggle-button',
|
|
1888
|
+
template: "<div class=\"toggle-container\" [class.disabled]=\"this._disabled \">\r\n <div *ngFor=\"let item of items\" (click)=\"setValue(item)\"\r\n [class.selected]=\"item === selectedValue\"\r\n class=\"toggle-container__item\">\r\n {{item.name || item}}\r\n </div>\r\n</div>\r\n",
|
|
1889
|
+
providers: [
|
|
1890
|
+
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: i0.forwardRef(function () { return DrToggleButtonComponent; }), multi: true }
|
|
1891
|
+
],
|
|
1892
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
1893
|
+
styles: [".toggle-container{display:flex;flex-wrap:nowrap;background:#F6F7F8;border:1px solid #C3C4CE;box-sizing:border-box;border-radius:20px;height:28px}.toggle-container.disabled{pointer-events:none}.toggle-container__item{height:28px;display:flex;align-items:center;justify-content:center;padding:4px 16px;border-radius:20px;margin:-1px;cursor:pointer}.toggle-container__item.selected{background:#F3F7FF;border:1px solid #579BF2;color:#0061ff;font-weight:600}\n"]
|
|
1894
|
+
},] }
|
|
1895
|
+
];
|
|
1896
|
+
DrToggleButtonComponent.ctorParameters = function () { return [
|
|
1897
|
+
{ type: i0.ChangeDetectorRef }
|
|
1898
|
+
]; };
|
|
1899
|
+
DrToggleButtonComponent.propDecorators = {
|
|
1900
|
+
items: [{ type: i0.Input }],
|
|
1901
|
+
selectedValue: [{ type: i0.Input }],
|
|
1902
|
+
disabled: [{ type: i0.Input }]
|
|
1903
|
+
};
|
|
1904
|
+
|
|
1850
1905
|
var ISpinnerOptions = /** @class */ (function (_super) {
|
|
1851
1906
|
__extends(ISpinnerOptions, _super);
|
|
1852
1907
|
function ISpinnerOptions() {
|
|
@@ -1953,8 +2008,8 @@
|
|
|
1953
2008
|
DrButtonComponent.decorators = [
|
|
1954
2009
|
{ type: i0.Component, args: [{
|
|
1955
2010
|
selector: 'dr-button',
|
|
1956
|
-
template: "<button (click)=\"onClick($event)\" [disabled]=\"disabled\" [attr.is-loading]=\"isLoading\" [attr.bold]=\"isBold\"\r\n
|
|
1957
|
-
styles: [":host{display:inline-block}:host button[theme]{cursor:pointer;border-radius:16px;padding:5px 16px;font-family:\"Poppins\";font-style:normal;font-weight:400;font-size:14px;line-height:22px;color:#4e566c;border:1px solid #7F7FDD;display:flex;justify-content:space-between;align-items:center;height:32px}:host button[theme] .dr{padding:0;margin-left:5.35px;margin-right:8.64px}:host button[theme] .dr-spinner{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}@keyframes rotate{0%{transform:rotate()}to{transform:rotate(360deg)}}:host button[theme][theme~=secondary]{padding:5px 16px;background:#FFFFFF;border-radius:16px;min-width:90px}:host button[theme][theme~=secondary]:hover:not([disabled
|
|
2011
|
+
template: "<button (click)=\"onClick($event)\" [disabled]=\"disabled\" [attr.is-loading]=\"isLoading\" [attr.bold]=\"isBold\"\r\n [attr.icon]=\"!!icon\" [attr.theme]=\"theme\">\r\n <ng-container *ngIf=\"!isLoading\">\r\n <i *ngIf=\"icon\" class=\"dr\" [ngClass]=\"icon\" [style.color]=\"iconColor || 'inherit'\"></i>\r\n <ng-content></ng-content>\r\n </ng-container>\r\n <i *ngIf=\"isLoading\" class=\"dr dr-spinner\"></i>\r\n</button>\r\n",
|
|
2012
|
+
styles: [":host{display:inline-block}:host button[theme]{cursor:pointer;border-radius:16px;padding:5px 16px;font-family:\"Poppins\";font-style:normal;font-weight:400;font-size:14px;line-height:22px;color:#4e566c;border:1px solid #7F7FDD;display:flex;justify-content:space-between;align-items:center;height:32px}:host button[theme] .dr{padding:0;margin-left:5.35px;margin-right:8.64px}:host button[theme] .dr-spinner{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}@keyframes rotate{0%{transform:rotate()}to{transform:rotate(360deg)}}:host button[theme][theme~=secondary]{padding:5px 16px;background:#FFFFFF;border-radius:16px;min-width:90px}:host button[theme][theme~=secondary]:hover:not([disabled]){color:#4e566c;transition:.2ms ease-in all;background:#F2F2FB;box-shadow:0 4px 14px #0000001a;border:1px solid #4646CE;border-radius:16px}:host button[theme][theme~=secondary]:active{box-shadow:none;background:#F2F2FB}:host button[theme][theme~=secondary][disabled]{background:#F0F1F4;color:#727583;border:none;cursor:default}:host button[theme][theme~=secondary][is-loading=true]{justify-content:center;padding:5px 16px}:host button[theme][theme~=primary]{background:#4646CE;color:#fff;border:none;min-width:90px}:host button[theme][theme~=primary]:hover:not([disabled]){transition:.2ms ease-in all;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);box-shadow:0 4px 14px #0000001a;border-radius:16px;border:none}:host button[theme][theme~=primary]:active{background:#25258C}:host button[theme][theme~=primary][disabled]{background:#F0F1F4;color:#727583;border:none;cursor:default}:host button[theme][theme~=primary][is-loading=true]{justify-content:center;padding:5px 16px}:host button[theme][theme~=danger]{background:#BF1D30;color:#fff;border:none;min-width:90px}:host button[theme][theme~=danger]:hover:not([disabled]){transition:.2ms ease-in all;background:linear-gradient(96.89deg,#740e1a 0%,#BF1D30 100%);box-shadow:0 4px 14px #0000001a;border-radius:16px;border:none}:host button[theme][theme~=danger]:active{background:#740e1a}:host button[theme][theme~=danger][disabled]{background:#F0F1F4;color:#727583;border:none;cursor:default}:host button[theme][theme~=danger][is-loading=true]{justify-content:center;padding:5px 16px}:host button[theme][theme~=ghost]{background:none;border:none;color:#151b3f;padding:4px 8px}:host button[theme][theme~=ghost] .dr{margin-left:4.5px;margin-right:12.5px}:host button[theme][theme~=ghost]:hover:not([disabled]){color:#4646ce;background:#F2F2FB;border-radius:4px}:host button[theme][theme~=ghost][disabled]{color:#727583;cursor:default}:host button[theme][theme~=text-link]{background:none;border:none;color:#0b5af9;text-decoration:underline}:host button[theme][theme~=text-link][disabled]{color:#727583}:host button[theme][theme~=primary-icon]{padding:8px;width:28px;height:28px;justify-content:center;color:#fff;background:#4646CE;border:none}:host button[theme][theme~=primary-icon]:hover,:host button[theme][theme~=primary-icon]:active{background:linear-gradient(96.89deg,#131318 0%,#4646CE 100%)}:host button[theme][theme~=primary-icon][disabled]{color:#bcbcbc;background:#E5E6EA;cursor:default}:host button[theme][theme~=primary-icon] .dr{margin:0}:host button[theme][theme~=secondary-icon]{background:white;padding:8px;width:28px;height:28px;justify-content:center;color:#4e566c;border:1px solid #7F7FDD}:host button[theme][theme~=secondary-icon]:hover,:host button[theme][theme~=secondary-icon]:active{color:#4646ce;background:#F2F2FB}:host button[theme][theme~=secondary-icon][disabled]{color:#bcbcbc;background:#E5E6EA;border:none;cursor:default}:host button[theme][theme~=secondary-icon] .dr{margin:0}:host button[theme][theme~=icon]{background:none;padding:8px;width:28px;height:28px;justify-content:center;color:#4e566c;border:none}:host button[theme][theme~=icon]:hover,:host button[theme][theme~=icon]:active{background:#F0F3FC;color:#4646ce}:host button[theme][theme~=icon][disabled]{color:#bcbcbc;border:none;cursor:default}:host button[theme][theme~=icon][disabled]:hover,:host button[theme][theme~=icon][disabled]:active{background:none}:host button[theme][theme~=icon] .dr{margin:0}:host button[theme][bold=true]{font-weight:600}:host button[theme][icon=true]{padding-left:8px}:host button[theme][icon=false]{justify-content:center}\n"]
|
|
1958
2013
|
},] }
|
|
1959
2014
|
];
|
|
1960
2015
|
DrButtonComponent.ctorParameters = function () { return []; };
|
|
@@ -2231,30 +2286,13 @@
|
|
|
2231
2286
|
}());
|
|
2232
2287
|
|
|
2233
2288
|
var DrPopoverComponent = /** @class */ (function () {
|
|
2234
|
-
function DrPopoverComponent(cdr, componentFactoryResolver, viewContainerRef
|
|
2289
|
+
function DrPopoverComponent(cdr, componentFactoryResolver, viewContainerRef) {
|
|
2235
2290
|
this.cdr = cdr;
|
|
2236
2291
|
this.componentFactoryResolver = componentFactoryResolver;
|
|
2237
2292
|
this.viewContainerRef = viewContainerRef;
|
|
2238
|
-
this.elementRef = elementRef;
|
|
2239
|
-
this.popoverRef = popoverRef;
|
|
2240
2293
|
this.class = '';
|
|
2241
2294
|
this.isContentTemplate = false;
|
|
2242
2295
|
}
|
|
2243
|
-
DrPopoverComponent.prototype.clickOutside = function (e) {
|
|
2244
|
-
var isTargetHost = this.hostRef instanceof i0.ElementRef && (this.hostRef.nativeElement === e.target || this.hostRef.nativeElement.contains(e.target));
|
|
2245
|
-
var isTargetInPopover = this.elementRef.nativeElement.contains(e.target);
|
|
2246
|
-
var isTargetInDatepicker = e.target.closest('mat-datepicker-popup');
|
|
2247
|
-
var isTargetInSelect = e.target.closest('ng-dropdown-panel');
|
|
2248
|
-
var isTargetInDatepickerContent = e.target.closest('mat-datepicker-content');
|
|
2249
|
-
if (!isTargetHost
|
|
2250
|
-
&& !isTargetInPopover
|
|
2251
|
-
&& !isTargetInDatepicker
|
|
2252
|
-
&& !isTargetInSelect
|
|
2253
|
-
&& !isTargetInDatepickerContent
|
|
2254
|
-
&& !this.manualClosing) {
|
|
2255
|
-
this.popoverRef.close();
|
|
2256
|
-
}
|
|
2257
|
-
};
|
|
2258
2296
|
DrPopoverComponent.prototype.ngOnInit = function () {
|
|
2259
2297
|
this.isContentTemplate = this.content instanceof i0.TemplateRef;
|
|
2260
2298
|
if (!this.isContentTemplate) {
|
|
@@ -2280,9 +2318,7 @@
|
|
|
2280
2318
|
DrPopoverComponent.ctorParameters = function () { return [
|
|
2281
2319
|
{ type: i0.ChangeDetectorRef },
|
|
2282
2320
|
{ type: i0.ComponentFactoryResolver },
|
|
2283
|
-
{ type: i0.ViewContainerRef }
|
|
2284
|
-
{ type: i0.ElementRef },
|
|
2285
|
-
{ type: DrPopoverRef }
|
|
2321
|
+
{ type: i0.ViewContainerRef }
|
|
2286
2322
|
]; };
|
|
2287
2323
|
DrPopoverComponent.propDecorators = {
|
|
2288
2324
|
content: [{ type: i0.Input }],
|
|
@@ -2290,8 +2326,7 @@
|
|
|
2290
2326
|
class: [{ type: i0.Input }],
|
|
2291
2327
|
hostRef: [{ type: i0.Input }],
|
|
2292
2328
|
manualClosing: [{ type: i0.Input }],
|
|
2293
|
-
popoverContainer: [{ type: i0.ViewChild, args: ['popoverContainer', { read: i0.ElementRef, static: true },] }]
|
|
2294
|
-
clickOutside: [{ type: i0.HostListener, args: ['document:mouseup', ['$event'],] }]
|
|
2329
|
+
popoverContainer: [{ type: i0.ViewChild, args: ['popoverContainer', { read: i0.ElementRef, static: true },] }]
|
|
2295
2330
|
};
|
|
2296
2331
|
|
|
2297
2332
|
var DEFAULT_CONFIG = {
|
|
@@ -2376,9 +2411,11 @@
|
|
|
2376
2411
|
]; };
|
|
2377
2412
|
|
|
2378
2413
|
var DrPopoverDirective = /** @class */ (function () {
|
|
2379
|
-
function DrPopoverDirective(elementRef, drPopoverService) {
|
|
2414
|
+
function DrPopoverDirective(elementRef, renderer, drPopoverService, document) {
|
|
2380
2415
|
this.elementRef = elementRef;
|
|
2416
|
+
this.renderer = renderer;
|
|
2381
2417
|
this.drPopoverService = drPopoverService;
|
|
2418
|
+
this.document = document;
|
|
2382
2419
|
this.contentContext = {};
|
|
2383
2420
|
this.position = 'bottom';
|
|
2384
2421
|
this.class = '';
|
|
@@ -2396,11 +2433,30 @@
|
|
|
2396
2433
|
}
|
|
2397
2434
|
};
|
|
2398
2435
|
DrPopoverDirective.prototype.closePopover = function (res) {
|
|
2436
|
+
if (this.clickOutsideEvent) {
|
|
2437
|
+
this.clickOutsideEvent();
|
|
2438
|
+
}
|
|
2399
2439
|
if (this.popoverRef) {
|
|
2400
2440
|
this.popoverRef.close(res);
|
|
2401
2441
|
this.popoverRef = null;
|
|
2402
2442
|
}
|
|
2403
2443
|
};
|
|
2444
|
+
DrPopoverDirective.prototype.clickOutside = function (e) {
|
|
2445
|
+
var _a, _b, _c;
|
|
2446
|
+
var isTargetHost = this.elementRef instanceof i0.ElementRef && (this.elementRef.nativeElement === e.target || this.elementRef.nativeElement.contains(e.target));
|
|
2447
|
+
var isTargetInPopover = (_c = (_b = (_a = this.popoverRef) === null || _a === void 0 ? void 0 : _a.componentRef) === null || _b === void 0 ? void 0 : _b.location) === null || _c === void 0 ? void 0 : _c.nativeElement.contains(e.target);
|
|
2448
|
+
var isTargetInDatepicker = e.target.closest('mat-datepicker-popup');
|
|
2449
|
+
var isTargetInSelect = e.target.closest('ng-dropdown-panel');
|
|
2450
|
+
var isTargetInDatepickerContent = e.target.closest('mat-datepicker-content');
|
|
2451
|
+
if (!isTargetHost
|
|
2452
|
+
&& !isTargetInPopover
|
|
2453
|
+
&& !isTargetInDatepicker
|
|
2454
|
+
&& !isTargetInSelect
|
|
2455
|
+
&& !isTargetInDatepickerContent
|
|
2456
|
+
&& !this.manualClosing) {
|
|
2457
|
+
this.popoverRef.close();
|
|
2458
|
+
}
|
|
2459
|
+
};
|
|
2404
2460
|
DrPopoverDirective.prototype.renderPopover = function () {
|
|
2405
2461
|
var _this = this;
|
|
2406
2462
|
var popoverRef = this.popoverRef = this.drPopoverService.open(this.content, {
|
|
@@ -2416,6 +2472,7 @@
|
|
|
2416
2472
|
_this.popoverClose.emit(res);
|
|
2417
2473
|
_this.showStateChange.emit({ isShown: !!_this.popoverRef });
|
|
2418
2474
|
});
|
|
2475
|
+
this.clickOutsideEvent = this.renderer.listen(this.document, 'click', this.clickOutside.bind(this));
|
|
2419
2476
|
};
|
|
2420
2477
|
DrPopoverDirective.prototype.ngOnDestroy = function () {
|
|
2421
2478
|
this.closePopover();
|
|
@@ -2429,7 +2486,9 @@
|
|
|
2429
2486
|
];
|
|
2430
2487
|
DrPopoverDirective.ctorParameters = function () { return [
|
|
2431
2488
|
{ type: i0.ElementRef },
|
|
2432
|
-
{ type:
|
|
2489
|
+
{ type: i0.Renderer2 },
|
|
2490
|
+
{ type: DrPopoverService },
|
|
2491
|
+
{ type: undefined, decorators: [{ type: i0.Inject, args: [common.DOCUMENT,] }] }
|
|
2433
2492
|
]; };
|
|
2434
2493
|
DrPopoverDirective.propDecorators = {
|
|
2435
2494
|
content: [{ type: i0.Input, args: ['drPopover',] }],
|
|
@@ -2518,6 +2577,17 @@
|
|
|
2518
2577
|
return act.disabled(act.data);
|
|
2519
2578
|
}
|
|
2520
2579
|
};
|
|
2580
|
+
DrDropdownComponent.prototype.selected = function (act) {
|
|
2581
|
+
if (!act.selected) {
|
|
2582
|
+
return false;
|
|
2583
|
+
}
|
|
2584
|
+
if (typeof act.selected === 'boolean') {
|
|
2585
|
+
return act.selected;
|
|
2586
|
+
}
|
|
2587
|
+
else {
|
|
2588
|
+
return act.selected(act.data);
|
|
2589
|
+
}
|
|
2590
|
+
};
|
|
2521
2591
|
DrDropdownComponent.prototype.tooltipToShow = function (act) {
|
|
2522
2592
|
if (act.toolTipIfDisabled || this.disabled(act) || !act.toolTip) {
|
|
2523
2593
|
return '';
|
|
@@ -2546,9 +2616,9 @@
|
|
|
2546
2616
|
DrDropdownComponent.decorators = [
|
|
2547
2617
|
{ type: i0.Component, args: [{
|
|
2548
2618
|
selector: 'dr-dropdown',
|
|
2549
|
-
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)\"
|
|
2619
|
+
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(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",
|
|
2550
2620
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
2551
|
-
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.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.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"]
|
|
2621
|
+
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"]
|
|
2552
2622
|
},] }
|
|
2553
2623
|
];
|
|
2554
2624
|
DrDropdownComponent.ctorParameters = function () { return [
|
|
@@ -2763,7 +2833,7 @@
|
|
|
2763
2833
|
{ type: i0.Component, args: [{
|
|
2764
2834
|
selector: 'dr-tabs',
|
|
2765
2835
|
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",
|
|
2766
|
-
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:\"
|
|
2836
|
+
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:\"Poppins\",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"]
|
|
2767
2837
|
},] }
|
|
2768
2838
|
];
|
|
2769
2839
|
DrTabsComponent.ctorParameters = function () { return []; };
|
|
@@ -2854,7 +2924,17 @@
|
|
|
2854
2924
|
},] }
|
|
2855
2925
|
];
|
|
2856
2926
|
|
|
2857
|
-
var components$1 = [
|
|
2927
|
+
var components$1 = [
|
|
2928
|
+
DrButtonComponent,
|
|
2929
|
+
RadioButtonComponent,
|
|
2930
|
+
CheckboxComponent,
|
|
2931
|
+
DrInputComponent,
|
|
2932
|
+
DrSelectComponent,
|
|
2933
|
+
DrToggleComponent,
|
|
2934
|
+
DrToggleButtonComponent,
|
|
2935
|
+
DrDatePickerComponent,
|
|
2936
|
+
DrDatePickerFormatDirective
|
|
2937
|
+
];
|
|
2858
2938
|
var DrInputsModule = /** @class */ (function () {
|
|
2859
2939
|
function DrInputsModule() {
|
|
2860
2940
|
}
|
|
@@ -3051,6 +3131,7 @@
|
|
|
3051
3131
|
exports.DrTabsModule = DrTabsModule;
|
|
3052
3132
|
exports.DrTagComponent = DrTagComponent;
|
|
3053
3133
|
exports.DrTagModule = DrTagModule;
|
|
3134
|
+
exports.DrToggleButtonComponent = DrToggleButtonComponent;
|
|
3054
3135
|
exports.DrToggleComponent = DrToggleComponent;
|
|
3055
3136
|
exports.DrTooltipDirective = DrTooltipDirective;
|
|
3056
3137
|
exports.DrTooltipModule = DrTooltipModule;
|