@datarailsshared/datarailsshared 1.4.60 → 1.4.61-dragons

package/bundles/datarailsshared-datarailsshared.umd.js

@@ -1704,6 +1704,7 @@
             this.optionWithDescription = false;
             this.keyDownFn = function () { return true; };
             this.change = new i0.EventEmitter();
+            this.asTextView = false;
             this.onChange = function () { };
             this.onTouched = function () { };
             try {
@@ -1722,6 +1723,13 @@
                 finally { if (e_1) throw e_1.error; }
             }
         }
+        Object.defineProperty(DrSelectComponent.prototype, "textView", {
+            set: function (val) {
+                this.asTextView = val;
+            },
+            enumerable: false,
+            configurable: true
+        });
         DrSelectComponent.prototype.writeValue = function (value) {
             this.selectedItem = value;
             this.onChange(this.selectedItem);
@@ -1760,7 +1768,7 @@
                             useExisting: DrSelectComponent,
                             multi: true
                         }],
-                    styles: [":host{width:100%;height:32px}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px!important;border:1px solid #C3C4CE;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#85889c}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#21b8f1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#151b3f;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#151a41;height:24px;padding:2px 8px;font-size:12px;margin:2px 2px 2px 0;background:#E5E6EA;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0 0 0 9px!important;color:#51566f;font-size:16px;font-weight:bold}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#E5E6EA!important;border:1px solid #E5E6EA!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#bcbcbc!important}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#de2833}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{border:1px solid #DBDEE3;border-radius:6px!important;margin-top:8px!important;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#F3F7FF;color:#151b3f}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:normal!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked:hover{background:#F6F7F8}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:97%;word-break:break-word;color:#4e566c;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#0c142b}\n"]
+                    styles: [":host{width:100%;height:32px}:host.textView::ng-deep{width:auto}:host.textView::ng-deep ng-select.ng-select .ng-select-container{border:none!important;cursor:pointer}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{-webkit-text-decoration-line:underline;text-decoration-line:underline;color:#0b5af9}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow{border:none;width:auto;height:auto;display:flex;-webkit-text-decoration-line:none;text-decoration-line:none;top:0}:host.textView::ng-deep ng-select.ng-select .ng-select-container .ng-arrow:before{content:\"\\e959\";font-family:DataRails;font-size:24px;color:#000}:host.no-left-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-left-radius:0!important;border-top-left-radius:0!important}:host.no-right-border-radius ::ng-deep ng-select.ng-select .ng-select-container{border-bottom-right-radius:0!important;border-top-right-radius:0!important}:host.no-right-border ::ng-deep ng-select.ng-select .ng-select-container{border-right:none!important}:host.no-left-border ::ng-deep ng-select.ng-select .ng-select-container{border-left:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container{min-height:32px;height:32px;width:100%;border-radius:6px!important;border:1px solid #C3C4CE;box-shadow:none!important}:host ::ng-deep ng-select.ng-select .ng-select-container:hover{border-color:#85889c}:host ::ng-deep ng-select.ng-select .ng-select-container:focus-within{border-color:#21b8f1}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-input{top:0!important;line-height:30px;padding:0 50px 0 8px!important;color:#151b3f;font-size:14px;font-weight:400}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container{padding:0 0 0 8px;height:100%;overflow:auto;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select .ng-select-container .ng-value-container .ng-input{padding:0 0 0 3px!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container{max-height:58px;height:100%}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container{max-height:58px;font-size:14px;line-height:18px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#151a41;height:24px;padding:2px 8px;font-size:12px;margin:2px 2px 2px 0;background:#E5E6EA;display:flex;flex-direction:row-reverse;align-items:center;border-radius:12px}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-label{line-height:20px;padding:0!important}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon{border:none!important;padding:0 0 0 9px!important;color:#51566f;font-size:16px;font-weight:bold}:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon,:host ::ng-deep ng-select.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value-icon:hover{background:transparent!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within{background:#E5E6EA!important;border:1px solid #E5E6EA!important}:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:hover .ng-value,:host ::ng-deep ng-select.ng-select.ng-select-disabled .ng-select-container:focus-within .ng-value{color:#bcbcbc!important}:host ::ng-deep ng-select.ng-select.ng-select-single.ng-invalid.ng-touched .ng-select-container,:host ::ng-deep ng-select.ng-select.ng-select-multiple.ng-invalid.ng-touched .ng-select-container{border-color:#de2833}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select{border:1px solid #DBDEE3;border-radius:6px!important;margin-top:8px!important;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:empty{display:none}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;min-height:36px;padding:8px 12px;font-size:14px;line-height:22px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option>.ng-option-label{text-overflow:ellipsis;overflow:hidden}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-marked{background:#fff}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{background:#F3F7FF;color:#151b3f}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected span,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked span{font-weight:normal!important}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected:hover,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked:hover{background:#F6F7F8}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{max-width:97%;word-break:break-word;color:#4e566c;font-weight:400;font-size:12px;line-height:20px}::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description,::ng-deep ng-dropdown-panel.ng-dropdown-panel.dr-select.ng-option-selected.ng-option-marked .dr-select__option-with-desc__wrapper .dr-select__option-with-desc__description{color:#0c142b}\n"]
                 },] }
     ];
     DrSelectComponent.ctorParameters = function () { return [
@@ -1786,11 +1794,13 @@
         id: [{ type: i0.Input }],
         keyDownFn: [{ type: i0.Input }],
         selectedItem: [{ type: i0.Input }],
+        textView: [{ type: i0.Input }],
         change: [{ type: i0.Output }],
         labelTemplate: [{ type: i0.ContentChild, args: ['labelTemplate',] }],
         optionTemplate: [{ type: i0.ContentChild, args: ['optionTemplate',] }],
         optionHeaderTemplate: [{ type: i0.ContentChild, args: ['optionHeaderTemplate',] }],
-        optionFooterTemplate: [{ type: i0.ContentChild, args: ['optionFooterTemplate',] }]
+        optionFooterTemplate: [{ type: i0.ContentChild, args: ['optionFooterTemplate',] }],
+        asTextView: [{ type: i0.HostBinding, args: ['class.textView',] }]
     };
 
     var DrAvatarComponent = /** @class */ (function () {
@@ -3502,6 +3512,69 @@
     ];
     DrLayoutBodyComponent.ctorParameters = function () { return []; };
 
+    var DrErrorComponent = /** @class */ (function () {
+        function DrErrorComponent(cdr) {
+            this.cdr = cdr;
+            this.destroyed$ = new rxjs.Subject();
+            this.label = 'Field error';
+        }
+        Object.defineProperty(DrErrorComponent.prototype, "control", {
+            set: function (value) {
+                var _this = this;
+                if (value) {
+                    this._control = value;
+                    this.cdr.markForCheck();
+                    this._control.valueChanges.pipe(operators.takeUntil(this.destroyed$)).subscribe(function () {
+                        _this.cdr.markForCheck();
+                    });
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(DrErrorComponent.prototype, "errorString", {
+            get: function () {
+                var _a;
+                if (this._control.hasError('required')) {
+                    return 'Field is required!';
+                }
+                return ((_a = this._control.errors) === null || _a === void 0 ? void 0 : _a.errorString) || null;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(DrErrorComponent.prototype, "isWarning", {
+            get: function () {
+                var _a;
+                return (_a = this._control.errors) === null || _a === void 0 ? void 0 : _a.isWarning;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        DrErrorComponent.prototype.ngOnInit = function () {
+        };
+        DrErrorComponent.prototype.ngOnDestroy = function () {
+            this.destroyed$.next();
+            this.destroyed$.complete();
+        };
+        return DrErrorComponent;
+    }());
+    DrErrorComponent.decorators = [
+        { type: i0.Component, args: [{
+                    template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n     [drTooltip]=\"errorString\"\n     class=\"error-container\"\n     [class.warning]=\"isWarning\">\n    <i class=\"dr-icon-status-error mr-2\"></i>\n    <span>{{label}}</span>\n</div>\n",
+                    selector: 'dr-error',
+                    changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;cursor:pointer;width:auto;color:#bf1d30}:host .error-container i{font-size:16px}:host .error-container span{font-family:\"Poppins\",sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}\n"]
+                },] }
+    ];
+    DrErrorComponent.ctorParameters = function () { return [
+        { type: i0.ChangeDetectorRef }
+    ]; };
+    DrErrorComponent.propDecorators = {
+        control: [{ type: i0.Input }],
+        label: [{ type: i0.Input }]
+    };
+
     var DrModelDebounceChangeDirective = /** @class */ (function () {
         function DrModelDebounceChangeDirective(ngModel) {
             this.ngModel = ngModel;
@@ -4462,6 +4535,26 @@
                 },] }
     ];
 
+    var DrErrorModule = /** @class */ (function () {
+        function DrErrorModule() {
+        }
+        return DrErrorModule;
+    }());
+    DrErrorModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        forms.FormsModule,
+                        DrTooltipModule
+                    ],
+                    exports: [DrErrorComponent],
+                    providers: [],
+                    declarations: [
+                        DrErrorComponent
+                    ],
+                },] }
+    ];
+
     /* components */
 
     /**
@@ -4489,6 +4582,8 @@
     exports.DrDropdownModule = DrDropdownModule;
     exports.DrDropdownPositionDirective = DrDropdownPositionDirective;
     exports.DrDropdownService = DrDropdownService;
+    exports.DrErrorComponent = DrErrorComponent;
+    exports.DrErrorModule = DrErrorModule;
     exports.DrInputComponent = DrInputComponent;
     exports.DrInputsModule = DrInputsModule;
     exports.DrLayoutBodyComponent = DrLayoutBodyComponent;