@datarailsshared/datarailsshared 1.5.250 → 1.5.251

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.
@@ -11,7 +11,7 @@ import { NG_VALUE_ACCESSOR, FormGroup, FormControl, FormsModule, ReactiveFormsMo
11
11
  import { BehaviorSubject, Subject, noop as noop$1, from, merge as merge$1, fromEvent, throwError } from 'rxjs';
12
12
  import * as _ from 'lodash';
13
13
  import { find, reduce, isObject, isNil, map, isNumber, merge, forEach, some, orderBy, cloneDeep, filter as filter$1, includes, indexOf, pull, concat, isString, isBoolean } from 'lodash';
14
- import { skip, takeUntil, debounceTime, distinctUntilChanged, startWith, switchMap, filter, first, catchError, tap, finalize } from 'rxjs/operators';
14
+ import { skip, takeUntil, debounceTime, filter, distinctUntilChanged, startWith, switchMap, first, catchError, tap, finalize } from 'rxjs/operators';
15
15
  import * as i1$3 from '@angular/material/datepicker';
16
16
  import { MatCalendar, MatDatepickerModule } from '@angular/material/datepicker';
17
17
  import { transition, style, animate, trigger, state } from '@angular/animations';
@@ -2114,11 +2114,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2114
2114
  class DrModelDebounceChangeDirective {
2115
2115
  constructor(ngModel) {
2116
2116
  this.ngModel = ngModel;
2117
- this.debounce = 200;
2117
+ this.previousValue = null;
2118
+ this.debounce = 500;
2118
2119
  this.ngModelDebounceChange = new EventEmitter();
2119
2120
  }
2120
2121
  ngOnInit() {
2121
- this.subscription = this.ngModel.control.valueChanges.pipe(skip(1), debounceTime(this.debounce), distinctUntilChanged()).subscribe(value => this.ngModelDebounceChange.emit(value));
2122
+ this.subscription = this.ngModel.control.valueChanges.pipe(skip(1), debounceTime(this.debounce), filter(value => value !== this.previousValue), distinctUntilChanged()).subscribe(value => {
2123
+ this.previousValue = value;
2124
+ this.ngModelDebounceChange.emit(value);
2125
+ });
2122
2126
  }
2123
2127
  ngOnDestroy() {
2124
2128
  this.subscription.unsubscribe();
@@ -2198,7 +2202,7 @@ class DrInputComponent {
2198
2202
  this.placeholder = '';
2199
2203
  this.readonly = false;
2200
2204
  this.blur = new EventEmitter();
2201
- this.ngModelDebounceChange = new EventEmitter();
2205
+ this.modelDebounceChange = new EventEmitter();
2202
2206
  this.innerValue = null;
2203
2207
  this._disabled = null;
2204
2208
  this._elementClass = [];
@@ -2232,6 +2236,9 @@ class DrInputComponent {
2232
2236
  }
2233
2237
  if (this.type === 'search') {
2234
2238
  this._elementClass.push('search-type');
2239
+ if (!this.placeholder) {
2240
+ this.placeholder = 'Search...';
2241
+ }
2235
2242
  }
2236
2243
  }
2237
2244
  registerOnChange(fn) {
@@ -2260,8 +2267,8 @@ class DrInputComponent {
2260
2267
  this._disabled = isDisabled;
2261
2268
  this.cdr.markForCheck();
2262
2269
  }
2263
- onSearchClicked($event) {
2264
- this.searchHandler.emit($event);
2270
+ onSearchClicked() {
2271
+ this.searchHandler.emit(this.value);
2265
2272
  }
2266
2273
  onButtonClicked($event) {
2267
2274
  this.buttonHandler.emit($event);
@@ -2284,11 +2291,11 @@ class DrInputComponent {
2284
2291
  this.inputElement.nativeElement.focus();
2285
2292
  }
2286
2293
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
2287
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrInputComponent, selector: "dr-input", inputs: { disabled: "disabled", buttonOptions: "buttonOptions", type: "type", name: "name", placeholder: "placeholder", readonly: "readonly", clearable: "clearable", min: "min", max: "max", minLength: "minLength", maxlength: "maxlength", step: "step" }, outputs: { blur: "blur", ngModelDebounceChange: "ngModelDebounceChange", searchHandler: "searchHandler", clearHandler: "clearHandler", buttonHandler: "buttonHandler" }, host: { properties: { "class": "this.elementClass", "tabindex": "this.tabindex" } }, providers: [{
2294
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrInputComponent, selector: "dr-input", inputs: { disabled: "disabled", buttonOptions: "buttonOptions", type: "type", name: "name", placeholder: "placeholder", readonly: "readonly", clearable: "clearable", min: "min", max: "max", minLength: "minLength", maxlength: "maxlength", step: "step", searchMini: "searchMini" }, outputs: { blur: "blur", modelDebounceChange: "modelDebounceChange", searchHandler: "searchHandler", clearHandler: "clearHandler", buttonHandler: "buttonHandler" }, host: { properties: { "class.search-type-mini": "this.searchMini", "class": "this.elementClass", "tabindex": "this.tabindex" } }, providers: [{
2288
2295
  provide: NG_VALUE_ACCESSOR,
2289
2296
  useExisting: forwardRef((() => DrInputComponent)),
2290
2297
  multi: true
2291
- }], queries: [{ propertyName: "prefixIcon", first: true, predicate: ["prefix"], descendants: true }, { propertyName: "suffixIcon", first: true, predicate: ["suffix"], descendants: true }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputRef"], descendants: true }], ngImport: i0, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n<input #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"ngModelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minLength]=\"minLength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\"\n>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked($event)\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\"\n (click)=\"onButtonClicked($event)\">\n {{_buttonOptions.text}}\n</button>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background:#FFFFFF;border:1px solid #9EA1AA;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#4646ce}:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#F0F1F4}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host input{display:flex;font-size:14px;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host input:disabled{border:none;color:#aeabac;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 0 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 .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:#fff;background:#4646CE;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9EA1AA}:host.with-button.disabled button{color:#aeabac;background:#F0F1F4;border-left:1px solid #AEABAC}: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"], dependencies: [{ kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: DrModelDebounceChangeDirective, selector: "[ngModelDebounceChange]", inputs: ["debounce"], outputs: ["ngModelDebounceChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2298
+ }], queries: [{ propertyName: "prefixIcon", first: true, predicate: ["prefix"], descendants: true }, { propertyName: "suffixIcon", first: true, predicate: ["suffix"], descendants: true }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputRef"], descendants: true }], ngImport: i0, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n<input #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minLength]=\"minLength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\"\n>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked()\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\"\n (click)=\"onButtonClicked($event)\">\n {{_buttonOptions.text}}\n</button>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background:#FFFFFF;border:1px solid #9EA1AA;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#4646ce}:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#F0F1F4}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host input{display:flex;font-size:14px;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host input:disabled{border:none;color:#aeabac;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 0 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 .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.search-type.clearable .search-icon{margin-left:26px}:host.search-type.clearable .clear-icon+.search-icon{margin-left:8px}:host.search-type-mini{width:200px;min-height:28px;height:28px}:host.with-button{padding-right:0}:host.with-button button{color:#fff;background:#4646CE;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9EA1AA}:host.with-button.disabled button{color:#aeabac;background:#F0F1F4;border-left:1px solid #AEABAC}: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"], dependencies: [{ kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: DrModelDebounceChangeDirective, selector: "[ngModelDebounceChange]", inputs: ["debounce"], outputs: ["ngModelDebounceChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2292
2299
  }
2293
2300
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrInputComponent, decorators: [{
2294
2301
  type: Component,
@@ -2296,7 +2303,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2296
2303
  provide: NG_VALUE_ACCESSOR,
2297
2304
  useExisting: forwardRef((() => DrInputComponent)),
2298
2305
  multi: true
2299
- }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n<input #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"ngModelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minLength]=\"minLength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\"\n>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked($event)\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\"\n (click)=\"onButtonClicked($event)\">\n {{_buttonOptions.text}}\n</button>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background:#FFFFFF;border:1px solid #9EA1AA;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#4646ce}:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#F0F1F4}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host input{display:flex;font-size:14px;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host input:disabled{border:none;color:#aeabac;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 0 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 .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:#fff;background:#4646CE;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9EA1AA}:host.with-button.disabled button{color:#aeabac;background:#F0F1F4;border-left:1px solid #AEABAC}: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"] }]
2306
+ }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[prefixIcon]\"></ng-content>\n<input #inputRef\n [(ngModel)]=\"value\"\n (ngModelChange)=\"updateChanges()\"\n (ngModelDebounceChange)=\"modelDebounceChange.emit($event)\"\n (blur)=\"blur.emit(value); onTouched()\"\n [disabled]=\"_disabled\"\n [readonly]=\"readonly\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [name]=\"name\"\n [min]=\"min\"\n [max]=\"max\"\n [minLength]=\"minLength\"\n [maxlength]=\"maxlength\"\n [step]=\"step\"\n>\n<span *ngIf=\"value\" class=\"clear-icon\" (click)=\"onClear($event)\"></span>\n<span *ngIf=\"type === 'search'\" class=\"search-icon\" (click)=\"onSearchClicked()\"></span>\n<ng-content select=\"[suffixIcon]\"></ng-content>\n<button *ngIf=\"_buttonOptions.show || (_buttonOptions.showOnFocus && _buttonOptions.focusSet)\"\n (click)=\"onButtonClicked($event)\">\n {{_buttonOptions.text}}\n</button>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background:#FFFFFF;border:1px solid #9EA1AA;border-radius:6px;color:#333;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#4646ce}:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;color:#aeabac;border-color:#aeabac;background:#F0F1F4}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host input{display:flex;font-size:14px;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}:host input:disabled{border:none;color:#aeabac;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 0 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 .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.search-type.clearable .search-icon{margin-left:26px}:host.search-type.clearable .clear-icon+.search-icon{margin-left:8px}:host.search-type-mini{width:200px;min-height:28px;height:28px}:host.with-button{padding-right:0}:host.with-button button{color:#fff;background:#4646CE;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #9EA1AA}:host.with-button.disabled button{color:#aeabac;background:#F0F1F4;border-left:1px solid #AEABAC}: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"] }]
2300
2307
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { disabled: [{
2301
2308
  type: Input
2302
2309
  }], buttonOptions: [{
@@ -2321,9 +2328,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2321
2328
  type: Input
2322
2329
  }], step: [{
2323
2330
  type: Input
2331
+ }], searchMini: [{
2332
+ type: Input
2333
+ }, {
2334
+ type: HostBinding,
2335
+ args: ['class.search-type-mini']
2324
2336
  }], blur: [{
2325
2337
  type: Output
2326
- }], ngModelDebounceChange: [{
2338
+ }], modelDebounceChange: [{
2327
2339
  type: Output
2328
2340
  }], elementClass: [{
2329
2341
  type: HostBinding,
@@ -2454,7 +2466,7 @@ class DrSelectAddItemComponent {
2454
2466
  : this.values;
2455
2467
  }
2456
2468
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSelectAddItemComponent, deps: [{ token: DrSelectComponent }], target: i0.ɵɵFactoryTarget.Component }); }
2457
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrSelectAddItemComponent, selector: "dr-select-add-item", inputs: { dynamicAddLabel: "dynamicAddLabel", bindValue: "bindValue", values: "values" }, outputs: { dynamicValueAdded: "dynamicValueAdded" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["dynamicInputRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dr-select__dynamic-add dynamic-add\">\n <div class=\"dynamic-add__add-item\" (click)=\"onDynamicAdding()\">\n <i class=\"dr-icon-add\"></i>\n <p class=\"dynamic-add__add-item__text\">{{ dynamicAddLabel }}</p>\n </div>\n <div *ngIf=\"isDynamicAdding\" class=\"dynamic-add__field\">\n <dr-input #dynamicInputRef\n class=\"dynamic-add__field__input\"\n [class.dynamic-add__field__input--error]=\"!isDynamicValueValid() && isDirty\"\n [(ngModel)]=\"dynamicValue\"\n (keydown)=\"onDynamicAdd(dynamicValue, $event)\"\n placeholder=\"Type...\"></dr-input>\n <div class=\"dynamic-add__field__buttons\">\n <dr-button *ngIf=\"dynamicValue && isDynamicValueValid()\"\n theme=\"icon\"\n icon=\"dr-icon-approve\"\n iconSize=\"18px\"\n (click)=\"onDynamicAdd(dynamicValue)\"></dr-button>\n <dr-button theme=\"icon\"\n icon=\"dr-icon-exit\"\n iconSize=\"18px\"\n (click)=\"onDynamicAddingClose()\"></dr-button>\n </div>\n </div>\n</div>\n", styles: [".dynamic-add__add-item{cursor:pointer;display:flex;align-items:center;border-bottom:1px solid #dfe0e3;padding:6px}.dynamic-add__add-item:hover{background:#f9f7ff}.dynamic-add__add-item__text{font-size:14px;line-height:22px;margin:0}.dynamic-add__field{position:relative}.dynamic-add__field__buttons{position:absolute;top:0;right:0;bottom:0;display:flex;align-items:center}::ng-deep .ng-dropdown-panel .ng-dropdown-header:has(.dynamic-add){padding:0;border:none}::ng-deep .dynamic-add__field__input{padding-left:12px!important;height:36px!important;border:none!important;background:#f9f7ff!important;border-radius:0!important}::ng-deep .dynamic-add__field__input>input{background:#f9f7ff}::ng-deep .dynamic-add__field__input>input::placeholder{line-height:22px;font-size:14px;font-weight:400;color:#9ea1aa}::ng-deep .dynamic-add__field__input--error{background:#ffdfe4!important}::ng-deep .dynamic-add__field__input--error>input{background:#ffdfe4}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step"], outputs: ["blur", "ngModelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2469
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrSelectAddItemComponent, selector: "dr-select-add-item", inputs: { dynamicAddLabel: "dynamicAddLabel", bindValue: "bindValue", values: "values" }, outputs: { dynamicValueAdded: "dynamicValueAdded" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["dynamicInputRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dr-select__dynamic-add dynamic-add\">\n <div class=\"dynamic-add__add-item\" (click)=\"onDynamicAdding()\">\n <i class=\"dr-icon-add\"></i>\n <p class=\"dynamic-add__add-item__text\">{{ dynamicAddLabel }}</p>\n </div>\n <div *ngIf=\"isDynamicAdding\" class=\"dynamic-add__field\">\n <dr-input #dynamicInputRef\n class=\"dynamic-add__field__input\"\n [class.dynamic-add__field__input--error]=\"!isDynamicValueValid() && isDirty\"\n [(ngModel)]=\"dynamicValue\"\n (keydown)=\"onDynamicAdd(dynamicValue, $event)\"\n placeholder=\"Type...\"></dr-input>\n <div class=\"dynamic-add__field__buttons\">\n <dr-button *ngIf=\"dynamicValue && isDynamicValueValid()\"\n theme=\"icon\"\n icon=\"dr-icon-approve\"\n iconSize=\"18px\"\n (click)=\"onDynamicAdd(dynamicValue)\"></dr-button>\n <dr-button theme=\"icon\"\n icon=\"dr-icon-exit\"\n iconSize=\"18px\"\n (click)=\"onDynamicAddingClose()\"></dr-button>\n </div>\n </div>\n</div>\n", styles: [".dynamic-add__add-item{cursor:pointer;display:flex;align-items:center;border-bottom:1px solid #dfe0e3;padding:6px}.dynamic-add__add-item:hover{background:#f9f7ff}.dynamic-add__add-item__text{font-size:14px;line-height:22px;margin:0}.dynamic-add__field{position:relative}.dynamic-add__field__buttons{position:absolute;top:0;right:0;bottom:0;display:flex;align-items:center}::ng-deep .ng-dropdown-panel .ng-dropdown-header:has(.dynamic-add){padding:0;border:none}::ng-deep .dynamic-add__field__input{padding-left:12px!important;height:36px!important;border:none!important;background:#f9f7ff!important;border-radius:0!important}::ng-deep .dynamic-add__field__input>input{background:#f9f7ff}::ng-deep .dynamic-add__field__input>input::placeholder{line-height:22px;font-size:14px;font-weight:400;color:#9ea1aa}::ng-deep .dynamic-add__field__input--error{background:#ffdfe4!important}::ng-deep .dynamic-add__field__input--error>input{background:#ffdfe4}\n"], dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2458
2470
  }
2459
2471
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSelectAddItemComponent, decorators: [{
2460
2472
  type: Component,
@@ -6265,7 +6277,7 @@ class DialogModalWrapperComponent {
6265
6277
  this.destroy$.complete();
6266
6278
  }
6267
6279
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, deps: [{ token: i1$6.MatLegacyDialogRef }, { token: DialogService }, { token: MAT_LEGACY_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
6268
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *ngIf=\"dialogData.headerIconClass\"\n (click)=\"closeDialog()\"\n class=\"title-dialog__icon\"\n [class]=\"dialogData.headerIconClass\"\n data-test=\"dialogTitleIcon\"></i>\n <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n </h1>\n <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\n <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n <div *ngFor=\"let field of dialogData.fields\"\n class=\"dr-smart-form_group\"\n [class]=\"field.formGroupClass\"\n [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n <label *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n class=\"label p-0 d-flex align-items-center\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *ngIf=\"field.type === dialogFieldType.SELECT\"\n [searchable]=\"dialogData.searchable\"\n [clearable]=\"dialogData.clearable\"\n [formControlName]=\"field.name\"\n [bindLabel]=\"field.bindLabel || null\"\n [bindValue]=\"field.bindValue || null\"\n [selectedItem]=\"field.default\"\n [items]=\"field.items || (field.items$ | async)\"\n [loading]=\"fieldsItemsLoading[field.name] | async\"\n [required]=\"true\"\n [placeholder]=\"field.placeholder\">\n <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n <button (click)=\"footerAction(); close();\" class=\"dr-select-footer__btn\">\n <i *ngIf=\"dialogData.footerTemplateData.icon\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n [formControlName]=\"field.name\"\n [format]=\"field.datePickerFormat\"\n [placeholder]=\"field.placeholder\"></dr-date-picker>\n <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n {{ field.label }}\n </dr-checkbox>\n <label class=\"form-field-error-alert\" *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n {{ form.controls[field.name].errors.errorString }}\n </label>\n <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n {{ dialogData.errorMessage }}\n </label>\n <label class=\"form-error-alert\"\n *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n {{ dialogData.serverErrorMessage }}\n </label>\n </div>\n </div>\n </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <dr-button (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\n </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:16px 32px 22px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #DFE0E3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate"], outputs: ["checkedChange"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step"], outputs: ["blur", "ngModelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
6280
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *ngIf=\"dialogData.headerIconClass\"\n (click)=\"closeDialog()\"\n class=\"title-dialog__icon\"\n [class]=\"dialogData.headerIconClass\"\n data-test=\"dialogTitleIcon\"></i>\n <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n </h1>\n <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\n <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n <div *ngFor=\"let field of dialogData.fields\"\n class=\"dr-smart-form_group\"\n [class]=\"field.formGroupClass\"\n [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n <label *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n class=\"label p-0 d-flex align-items-center\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *ngIf=\"field.type === dialogFieldType.SELECT\"\n [searchable]=\"dialogData.searchable\"\n [clearable]=\"dialogData.clearable\"\n [formControlName]=\"field.name\"\n [bindLabel]=\"field.bindLabel || null\"\n [bindValue]=\"field.bindValue || null\"\n [selectedItem]=\"field.default\"\n [items]=\"field.items || (field.items$ | async)\"\n [loading]=\"fieldsItemsLoading[field.name] | async\"\n [required]=\"true\"\n [placeholder]=\"field.placeholder\">\n <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n <button (click)=\"footerAction(); close();\" class=\"dr-select-footer__btn\">\n <i *ngIf=\"dialogData.footerTemplateData.icon\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n [formControlName]=\"field.name\"\n [format]=\"field.datePickerFormat\"\n [placeholder]=\"field.placeholder\"></dr-date-picker>\n <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n {{ field.label }}\n </dr-checkbox>\n <label class=\"form-field-error-alert\" *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n {{ form.controls[field.name].errors.errorString }}\n </label>\n <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n {{ dialogData.errorMessage }}\n </label>\n <label class=\"form-error-alert\"\n *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n {{ dialogData.serverErrorMessage }}\n </label>\n </div>\n </div>\n </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <dr-button (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\n </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:16px 32px 22px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #DFE0E3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate"], outputs: ["checkedChange"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
6269
6281
  }
6270
6282
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, decorators: [{
6271
6283
  type: Component,