@sd-angular/core 1.1.85 → 1.1.87

package/fesm2015/sd-angular-core-textarea.js

@@ -1,11 +1,11 @@
-import { EventEmitter, Component, ChangeDetectorRef, Input, Output, ViewChild, ContentChild, NgModule } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectorRef, Inject, Optional, Input, Output, ViewChild, ContentChild, NgModule } from '@angular/core';
 import { Validators, NgForm, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { __classPrivateFieldGet, __awaiter, __classPrivateFieldSet } from 'tslib';
 import { v4 } from 'uuid';
 import { Subscription } from 'rxjs';
 import hash from 'object-hash';
-import { SdFormControl, SdViewDefDirective, SdCommonModule } from '@sd-angular/core/common';
+import { SdFormControl, FORM_CONFIG, SdViewDefDirective, SdCommonModule } from '@sd-angular/core/common';
 import { MatIconModule } from '@angular/material/icon';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -14,8 +14,9 @@ import { SdTranslateModule } from '@sd-angular/core/translate';
 
 var _name, _form, _pattern, _validator, _autoHeight_1, _subscription, _onChange, _onInput, _updateValidator, _customValidator;
 class SdTextarea {
-    constructor(ref) {
+    constructor(ref, formConfig) {
         this.ref = ref;
+        this.formConfig = formConfig;
         _name.set(this, v4());
         _form.set(this, void 0);
         this.rows = 5;
@@ -174,13 +175,13 @@ class SdTextarea {
         __classPrivateFieldSet(this, _autoHeight_1, (val === '') || val);
     }
     ngOnInit() {
-        var _a;
+        var _a, _b;
+        this.appearance = this.appearance || ((_a = this.formConfig) === null || _a === void 0 ? void 0 : _a.appearance);
         __classPrivateFieldGet(this, _subscription).add(this.formControl.sdChanges.subscribe(() => {
-            // this.formControl.updateValueAndValidity();
             this.ref.markForCheck();
         }));
         __classPrivateFieldGet(this, _subscription).add(this.formControl.valueChanges.subscribe(__classPrivateFieldGet(this, _onChange)));
-        (_a = __classPrivateFieldGet(this, _form)) === null || _a === void 0 ? void 0 : _a.addControl(__classPrivateFieldGet(this, _name), this.formControl);
+        (_b = __classPrivateFieldGet(this, _form)) === null || _b === void 0 ? void 0 : _b.addControl(__classPrivateFieldGet(this, _name), this.formControl);
     }
     ngAfterViewInit() {
         var _a, _b, _c, _d;
@@ -198,15 +199,17 @@ _name = new WeakMap(), _form = new WeakMap(), _pattern = new WeakMap(), _validat
 SdTextarea.decorators = [
     { type: Component, args: [{
                 selector: 'sd-textarea',
-                template: "<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !isFocused; else default\">\r\n    <ng-container *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field appearance=\"outline\" [class.c-no-label]=\"!label\">\r\n      <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n      <textarea matInput placeholder=\"{{placeholder || label}}\" [formControl]=\"formControl\" [required]=\"required\"\r\n        autocomplete=\"off\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [rows]=\"rows\" [maxlength]=\"maxlength\"\r\n        [attr.data-qclabel]=\"label\" [attr.data-qcid]=\"qcId\" #textarea></textarea>\r\n      <span *ngIf=\"maxlength && !formControl.disabled\" matSuffix>{{formControl?.value?.length ||\r\n        0}}/{{maxlength}}</span>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.maxlength\">\r\n        {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.pattern\">\r\n        {{'Pattern error' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.customValidator\">\r\n        <strong>{{formControl.errors?.customValidator}}</strong>\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>",
+                template: "<label *ngIf=\"!appearance && label\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\"\r\n  *ngIf=\"required\">*</span></label>\r\n<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !isFocused; else default\">\r\n    <ng-container *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field appearance=\"outline\" [class.c-no-label]=\"!label\">\r\n      <mat-label *ngIf=\"appearance && label\">{{ label }}</mat-label>\r\n      <textarea matInput placeholder=\"{{placeholder || label}}\" [formControl]=\"formControl\" [required]=\"required\"\r\n        autocomplete=\"off\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [rows]=\"rows\" [maxlength]=\"maxlength\"\r\n        [attr.data-qclabel]=\"label\" [attr.data-qcid]=\"qcId\" #textarea></textarea>\r\n      <span *ngIf=\"maxlength && !formControl.disabled\" matSuffix>{{formControl?.value?.length ||\r\n        0}}/{{maxlength}}</span>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.maxlength\">\r\n        {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.pattern\">\r\n        {{'Pattern error' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.customValidator\">\r\n        <strong>{{formControl.errors?.customValidator}}</strong>\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>",
                 styles: [":host ::ng-deep textarea.mat-input-element{resize:none}:host ::ng-deep .mat-form-field.c-no-label .mat-form-field-infix{border-top:0}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}"]
             },] }
 ];
 SdTextarea.ctorParameters = () => [
-    { type: ChangeDetectorRef }
+    { type: ChangeDetectorRef },
+    { type: undefined, decorators: [{ type: Inject, args: [FORM_CONFIG,] }, { type: Optional }] }
 ];
 SdTextarea.propDecorators = {
     name: [{ type: Input }],
+    appearance: [{ type: Input }],
     form: [{ type: Input }],
     _label: [{ type: Input, args: ['label',] }],
     placeholder: [{ type: Input }],

package/fesm2015/sd-angular-core-textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-textarea.js","sources":["../../../../projects/sd-core/textarea/src/lib/textarea.component.ts","../../../../projects/sd-core/textarea/src/lib/textarea.module.ts","../../../../projects/sd-core/textarea/sd-angular-core-textarea.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, ViewEncapsulation, OnInit, ContentChild, ViewChild, ElementRef } from '@angular/core';\r\n\r\nimport * as uuid from 'uuid';\r\nimport { AbstractControl, AsyncValidatorFn, FormGroup, NgForm, ValidatorFn, Validators } from '@angular/forms';\r\nimport { Subscription } from 'rxjs';\r\nimport hash from 'object-hash';\r\nimport { SdFormControl, SdViewDefDirective } from '@sd-angular/core/common';\r\n\r\n@Component({\r\n  selector: 'sd-textarea',\r\n  templateUrl: './textarea.component.html',\r\n  styleUrls: ['./textarea.component.scss']\r\n})\r\n\r\nexport class SdTextarea implements OnInit, AfterViewInit, OnDestroy {\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  qcId: string;\r\n  label: string;\r\n  @Input('label') set _label(val: string) {\r\n    this.label = val;\r\n    this.qcId = hash({\r\n      selector: 'sd-textarea',\r\n      label: val\r\n    });\r\n  };\r\n  @Input() placeholder: string;\r\n  @Input() rows = 5;\r\n  @Input() set model(value: any) {\r\n    if (this.formControl.value !== value) {\r\n      this.formControl.setValue(value);\r\n    }\r\n  }\r\n  @Output() modelChange = new EventEmitter();\r\n  @Output() sdChange = new EventEmitter<any>();\r\n\r\n  // Optional\r\n  required = false;\r\n  @Input('required') set _required(val: boolean | '') {\r\n    this.required = (val === '') || val;\r\n    this.#updateValidator();\r\n  }\r\n  maxlength: number;\r\n  @Input('maxlength') set _maxlength(val: number) {\r\n    this.maxlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n  #pattern: string;\r\n  @Input() set pattern(val: string) {\r\n    this.#pattern = val;\r\n    this.#updateValidator();\r\n  }\r\n  #validator: (value: any) => string | Promise<string>;\r\n  @Input() set validator(validator: (value: any) => string | Promise<string>) {\r\n    this.#validator = validator;\r\n    this.#updateValidator();\r\n  }\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.formControl.disable();\r\n    } else {\r\n      this.formControl.enable();\r\n    }\r\n  }\r\n  #autoHeight = false;\r\n  @Input('autoHeight') set _autoHeight(val: boolean | '') {\r\n    this.#autoHeight = (val === '') || val;\r\n  }\r\n  @ViewChild('textarea') textarea: ElementRef;\r\n  @ContentChild(SdViewDefDirective) sdView: SdViewDefDirective;\r\n  isFocused = false;\r\n  formControl = new SdFormControl();\r\n  #subscription = new Subscription();\r\n  constructor(private ref: ChangeDetectorRef) {\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#subscription.add(this.formControl.sdChanges.subscribe(() => {\r\n      // this.formControl.updateValueAndValidity();\r\n      this.ref.markForCheck();\r\n    }));\r\n    this.#subscription.add(this.formControl.valueChanges.subscribe(this.#onChange));\r\n    this.#form?.addControl(this.#name, this.formControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    if(this.#autoHeight) {\r\n      this.textarea?.nativeElement?.setAttribute('style',`height: ${this.textarea?.nativeElement?.scrollHeight}px;overflow-y:hidden;`)\r\n    }\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  onFocus = () => {\r\n    this.isFocused = true;\r\n  }\r\n\r\n  onBlur = () => {\r\n    this.isFocused = false;\r\n    const val: string = (this.formControl.value ?? '').toString();\r\n    if (val.length > val.trim().length) {\r\n      this.formControl.setValue(val.trim());\r\n    }\r\n  }\r\n\r\n  onClick = () => {\r\n    if(this.sdView?.templateRef) {\r\n      if(!this.formControl.disabled && !this.isFocused) {\r\n        this.focus();\r\n      }\r\n    }\r\n  }\r\n\r\n  blur = () => {\r\n    this.textarea?.nativeElement?.blur();\r\n  }\r\n\r\n  focus = () => {\r\n    this.isFocused = true;\r\n    setTimeout(() => {\r\n      this.textarea?.nativeElement?.focus();\r\n    }, 100);\r\n  }\r\n\r\n  #onChange = (value: any) => {\r\n    if(this.#autoHeight) {\r\n      this.textarea.nativeElement.style.height = 'auto';\r\n    this.textarea.nativeElement.style.height = (this.textarea.nativeElement.scrollHeight) + 'px';\r\n    }\r\n    this.modelChange.emit(value);\r\n    this.sdChange.emit(value);\r\n  }\r\n\r\n  #onInput = function () {\r\n    // this.style.height = 'auto';\r\n    // this.style.height = (this.scrollHeight) + 'px';\r\n  }\r\n\r\n  #updateValidator = () => {\r\n    this.formControl.clearValidators();\r\n    this.formControl.clearAsyncValidators();\r\n    const validators: ValidatorFn[] = [];\r\n    const asyncValidators: AsyncValidatorFn[] = [];\r\n    if (this.required) {\r\n      validators.push(Validators.required);\r\n    }\r\n    if (this.maxlength > 0) {\r\n      validators.push(Validators.maxLength(this.maxlength));\r\n    }\r\n    if (this.#pattern) {\r\n      validators.push(Validators.pattern(this.#pattern));\r\n    }\r\n    if (this.#validator) {\r\n      asyncValidators.push(this.#customValidator(this.#validator));\r\n    }\r\n    this.formControl.setValidators(validators);\r\n    this.formControl.setAsyncValidators(asyncValidators);\r\n    this.formControl.updateValueAndValidity();\r\n  }\r\n\r\n  #customValidator = (func: (value: any) => string | Promise<string>): AsyncValidatorFn => {\r\n    return async (c: AbstractControl): Promise<{ [key: string]: any } | null> => {\r\n      const value = c.value || null;\r\n      if (func && typeof (func) === 'function') {\r\n        const result = func(value);\r\n        if (result instanceof Promise) {\r\n          const message = await result;\r\n          if (message) {\r\n            return {\r\n              customValidator: message\r\n            };\r\n          }\r\n          return null;\r\n        }\r\n        if (result) {\r\n          return {\r\n            customValidator: result\r\n          };\r\n        }\r\n        return null;\r\n      }\r\n      return null;\r\n    };\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdTextarea } from './textarea.component';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { SdCommonModule } from '@sd-angular/core/common';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatFormFieldModule,\r\n    MatInputModule,\r\n    MatIconModule,\r\n    MatTooltipModule,\r\n    SdTranslateModule,\r\n    SdCommonModule\r\n  ],\r\n  declarations: [\r\n    SdTextarea\r\n  ],\r\n  exports: [\r\n    SdCommonModule,\r\n    SdTextarea\r\n  ]\r\n})\r\nexport class SdTextareaModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}
+{"version":3,"file":"sd-angular-core-textarea.js","sources":["../../../../projects/sd-core/textarea/src/lib/textarea.component.ts","../../../../projects/sd-core/textarea/src/lib/textarea.module.ts","../../../../projects/sd-core/textarea/sd-angular-core-textarea.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, ViewEncapsulation, OnInit, ContentChild, ViewChild, ElementRef, Inject, Optional } from '@angular/core';\r\n\r\nimport * as uuid from 'uuid';\r\nimport { AbstractControl, AsyncValidatorFn, FormGroup, NgForm, ValidatorFn, Validators } from '@angular/forms';\r\nimport { Subscription } from 'rxjs';\r\nimport hash from 'object-hash';\r\nimport { FORM_CONFIG, IFormConfiguration, SdFormControl, SdViewDefDirective } from '@sd-angular/core/common';\r\nimport { MatFormFieldAppearance } from '@angular/material/form-field';\r\n\r\n@Component({\r\n  selector: 'sd-textarea',\r\n  templateUrl: './textarea.component.html',\r\n  styleUrls: ['./textarea.component.scss']\r\n})\r\n\r\nexport class SdTextarea implements OnInit, AfterViewInit, OnDestroy {\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n  @Input() appearance: MatFormFieldAppearance;\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n  qcId: string;\r\n  label: string;\r\n  @Input('label') set _label(val: string) {\r\n    this.label = val;\r\n    this.qcId = hash({\r\n      selector: 'sd-textarea',\r\n      label: val\r\n    });\r\n  };\r\n  @Input() placeholder: string;\r\n  @Input() rows = 5;\r\n  @Input() set model(value: any) {\r\n    if (this.formControl.value !== value) {\r\n      this.formControl.setValue(value);\r\n    }\r\n  }\r\n  @Output() modelChange = new EventEmitter();\r\n  @Output() sdChange = new EventEmitter<any>();\r\n\r\n  // Optional\r\n  required = false;\r\n  @Input('required') set _required(val: boolean | '') {\r\n    this.required = (val === '') || val;\r\n    this.#updateValidator();\r\n  }\r\n  maxlength: number;\r\n  @Input('maxlength') set _maxlength(val: number) {\r\n    this.maxlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n  #pattern: string;\r\n  @Input() set pattern(val: string) {\r\n    this.#pattern = val;\r\n    this.#updateValidator();\r\n  }\r\n  #validator: (value: any) => string | Promise<string>;\r\n  @Input() set validator(validator: (value: any) => string | Promise<string>) {\r\n    this.#validator = validator;\r\n    this.#updateValidator();\r\n  }\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.formControl.disable();\r\n    } else {\r\n      this.formControl.enable();\r\n    }\r\n  }\r\n  #autoHeight = false;\r\n  @Input('autoHeight') set _autoHeight(val: boolean | '') {\r\n    this.#autoHeight = (val === '') || val;\r\n  }\r\n  @ViewChild('textarea') textarea: ElementRef;\r\n  @ContentChild(SdViewDefDirective) sdView: SdViewDefDirective;\r\n  isFocused = false;\r\n  formControl = new SdFormControl();\r\n  #subscription = new Subscription();\r\n  constructor(\r\n    private ref: ChangeDetectorRef,\r\n    @Inject(FORM_CONFIG) @Optional() private formConfig: IFormConfiguration) {\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.appearance = this.appearance || this.formConfig?.appearance;\r\n    this.#subscription.add(this.formControl.sdChanges.subscribe(() => {\r\n      this.ref.markForCheck();\r\n    }));\r\n    this.#subscription.add(this.formControl.valueChanges.subscribe(this.#onChange));\r\n    this.#form?.addControl(this.#name, this.formControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    if (this.#autoHeight) {\r\n      this.textarea?.nativeElement?.setAttribute('style', `height: ${this.textarea?.nativeElement?.scrollHeight}px;overflow-y:hidden;`)\r\n    }\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  onFocus = () => {\r\n    this.isFocused = true;\r\n  }\r\n\r\n  onBlur = () => {\r\n    this.isFocused = false;\r\n    const val: string = (this.formControl.value ?? '').toString();\r\n    if (val.length > val.trim().length) {\r\n      this.formControl.setValue(val.trim());\r\n    }\r\n  }\r\n\r\n  onClick = () => {\r\n    if (this.sdView?.templateRef) {\r\n      if (!this.formControl.disabled && !this.isFocused) {\r\n        this.focus();\r\n      }\r\n    }\r\n  }\r\n\r\n  blur = () => {\r\n    this.textarea?.nativeElement?.blur();\r\n  }\r\n\r\n  focus = () => {\r\n    this.isFocused = true;\r\n    setTimeout(() => {\r\n      this.textarea?.nativeElement?.focus();\r\n    }, 100);\r\n  }\r\n\r\n  #onChange = (value: any) => {\r\n    if (this.#autoHeight) {\r\n      this.textarea.nativeElement.style.height = 'auto';\r\n      this.textarea.nativeElement.style.height = (this.textarea.nativeElement.scrollHeight) + 'px';\r\n    }\r\n    this.modelChange.emit(value);\r\n    this.sdChange.emit(value);\r\n  }\r\n\r\n  #onInput = function () {\r\n    // this.style.height = 'auto';\r\n    // this.style.height = (this.scrollHeight) + 'px';\r\n  }\r\n\r\n  #updateValidator = () => {\r\n    this.formControl.clearValidators();\r\n    this.formControl.clearAsyncValidators();\r\n    const validators: ValidatorFn[] = [];\r\n    const asyncValidators: AsyncValidatorFn[] = [];\r\n    if (this.required) {\r\n      validators.push(Validators.required);\r\n    }\r\n    if (this.maxlength > 0) {\r\n      validators.push(Validators.maxLength(this.maxlength));\r\n    }\r\n    if (this.#pattern) {\r\n      validators.push(Validators.pattern(this.#pattern));\r\n    }\r\n    if (this.#validator) {\r\n      asyncValidators.push(this.#customValidator(this.#validator));\r\n    }\r\n    this.formControl.setValidators(validators);\r\n    this.formControl.setAsyncValidators(asyncValidators);\r\n    this.formControl.updateValueAndValidity();\r\n  }\r\n\r\n  #customValidator = (func: (value: any) => string | Promise<string>): AsyncValidatorFn => {\r\n    return async (c: AbstractControl): Promise<{ [key: string]: any } | null> => {\r\n      const value = c.value || null;\r\n      if (func && typeof (func) === 'function') {\r\n        const result = func(value);\r\n        if (result instanceof Promise) {\r\n          const message = await result;\r\n          if (message) {\r\n            return {\r\n              customValidator: message\r\n            };\r\n          }\r\n          return null;\r\n        }\r\n        if (result) {\r\n          return {\r\n            customValidator: result\r\n          };\r\n        }\r\n        return null;\r\n      }\r\n      return null;\r\n    };\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdTextarea } from './textarea.component';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport { SdCommonModule } from '@sd-angular/core/common';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    MatFormFieldModule,\r\n    MatInputModule,\r\n    MatIconModule,\r\n    MatTooltipModule,\r\n    SdTranslateModule,\r\n    SdCommonModule\r\n  ],\r\n  declarations: [\r\n    SdTextarea\r\n  ],\r\n  exports: [\r\n    SdCommonModule,\r\n    SdTextarea\r\n  ]\r\n})\r\nexport class SdTextareaModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sd-angular/core",
-  "version": "1.1.85",
+  "version": "1.1.87",
   "homepage": "https://www.facebook.com/DarkP3ter",
   "author": {
     "name": "darkpeter",

package/textarea/sd-angular-core-textarea.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdTextareaModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":19,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":20,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":21,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdTextarea"}],"exports":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":27,"character":4},{"__symbolic":"reference","name":"SdTextarea"}]}]}],"members":{}},"SdTextarea":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"sd-textarea","template":"<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !isFocused; else default\">\r\n    <ng-container *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field appearance=\"outline\" [class.c-no-label]=\"!label\">\r\n      <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n      <textarea matInput placeholder=\"{{placeholder || label}}\" [formControl]=\"formControl\" [required]=\"required\"\r\n        autocomplete=\"off\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [rows]=\"rows\" [maxlength]=\"maxlength\"\r\n        [attr.data-qclabel]=\"label\" [attr.data-qcid]=\"qcId\" #textarea></textarea>\r\n      <span *ngIf=\"maxlength && !formControl.disabled\" matSuffix>{{formControl?.value?.length ||\r\n        0}}/{{maxlength}}</span>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.maxlength\">\r\n        {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.pattern\">\r\n        {{'Pattern error' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.customValidator\">\r\n        <strong>{{formControl.errors?.customValidator}}</strong>\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>","styles":[":host ::ng-deep textarea.mat-input-element{resize:none}:host ::ng-deep .mat-form-field.c-no-label .mat-form-field-infix{border-top:0}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}"]}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"_label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3},"arguments":["label"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"rows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":48,"character":3}}]}],"_required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3},"arguments":["required"]}]}],"_maxlength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3},"arguments":["maxlength"]}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":71,"character":3}}]}],"_autoHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":3},"arguments":["autoHeight"]}]}],"textarea":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":83,"character":3},"arguments":["textarea"]}]}],"sdView":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":84,"character":3},"arguments":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdViewDefDirective","line":84,"character":16}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":88,"character":27}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}}},"origins":{"SdTextareaModule":"./src/lib/textarea.module","SdTextarea":"./src/lib/textarea.component"},"importAs":"@sd-angular/core/textarea"}
+{"__symbolic":"module","version":4,"metadata":{"SdTextareaModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":19,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/translate","name":"SdTranslateModule","line":20,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":21,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdTextarea"}],"exports":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdCommonModule","line":27,"character":4},{"__symbolic":"reference","name":"SdTextarea"}]}]}],"members":{}},"SdTextarea":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"sd-textarea","template":"<label *ngIf=\"!appearance && label\" class=\"d-block mb-0 T14M\">{{label}} <span class=\"text-danger mb-2\"\r\n  *ngIf=\"required\">*</span></label>\r\n<div class=\"d-flex align-items-center\" [class.sd-view]=\"sdView?.templateRef\" [class.c-focused]=\"isFocused\"\r\n  [class.c-disabled]=\"formControl.disabled\" (click)=\"onClick()\">\r\n  <ng-container *ngIf=\"sdView?.templateRef && !isFocused; else default\">\r\n    <ng-container *ngTemplateOutlet=\"sdView.templateRef;context: { value: formControl.value }\">\r\n    </ng-container>\r\n  </ng-container>\r\n  <ng-template #default>\r\n    <mat-form-field appearance=\"outline\" [class.c-no-label]=\"!label\">\r\n      <mat-label *ngIf=\"appearance && label\">{{ label }}</mat-label>\r\n      <textarea matInput placeholder=\"{{placeholder || label}}\" [formControl]=\"formControl\" [required]=\"required\"\r\n        autocomplete=\"off\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" [rows]=\"rows\" [maxlength]=\"maxlength\"\r\n        [attr.data-qclabel]=\"label\" [attr.data-qcid]=\"qcId\" #textarea></textarea>\r\n      <span *ngIf=\"maxlength && !formControl.disabled\" matSuffix>{{formControl?.value?.length ||\r\n        0}}/{{maxlength}}</span>\r\n      <mat-error *ngIf=\"formControl.errors?.required\">\r\n        {{'This field is required' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.maxlength\">\r\n        {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.pattern\">\r\n        {{'Pattern error' | sdTranslate}}\r\n      </mat-error>\r\n      <mat-error *ngIf=\"formControl.errors?.customValidator\">\r\n        <strong>{{formControl.errors?.customValidator}}</strong>\r\n      </mat-error>\r\n    </mat-form-field>\r\n  </ng-template>\r\n</div>","styles":[":host ::ng-deep textarea.mat-input-element{resize:none}:host ::ng-deep .mat-form-field.c-no-label .mat-form-field-infix{border-top:0}.sd-view:not(.c-focused):not(.c-disabled):hover{background-color:#ebecf0}"]}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"appearance":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"form":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"_label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3},"arguments":["label"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"rows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"modelChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":49,"character":3}}]}],"sdChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"_required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3},"arguments":["required"]}]}],"_maxlength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3},"arguments":["maxlength"]}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"validator":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"_autoHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3},"arguments":["autoHeight"]}]}],"textarea":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":85,"character":3},"arguments":["textarea"]}]}],"sdView":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":86,"character":3},"arguments":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"SdViewDefDirective","line":86,"character":16}]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":92,"character":5},"arguments":[{"__symbolic":"reference","module":"@sd-angular/core/common","name":"FORM_CONFIG","line":92,"character":12}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":92,"character":26}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":91,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/common","name":"IFormConfiguration","line":92,"character":57}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}}},"origins":{"SdTextareaModule":"./src/lib/textarea.module","SdTextarea":"./src/lib/textarea.component"},"importAs":"@sd-angular/core/textarea"}

package/textarea/src/lib/textarea.component.d.ts

@@ -1,10 +1,13 @@
 import { EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, OnInit, ElementRef } from '@angular/core';
 import { FormGroup, NgForm } from '@angular/forms';
-import { SdFormControl, SdViewDefDirective } from '@sd-angular/core/common';
+import { IFormConfiguration, SdFormControl, SdViewDefDirective } from '@sd-angular/core/common';
+import { MatFormFieldAppearance } from '@angular/material/form-field';
 export declare class SdTextarea implements OnInit, AfterViewInit, OnDestroy {
     #private;
     private ref;
+    private formConfig;
     set name(val: string);
+    appearance: MatFormFieldAppearance;
     set form(val: NgForm | FormGroup);
     qcId: string;
     label: string;
@@ -26,7 +29,7 @@ export declare class SdTextarea implements OnInit, AfterViewInit, OnDestroy {
     sdView: SdViewDefDirective;
     isFocused: boolean;
     formControl: SdFormControl;
-    constructor(ref: ChangeDetectorRef);
+    constructor(ref: ChangeDetectorRef, formConfig: IFormConfiguration);
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;