@sd-angular/core 19.0.0-beta.31 → 19.0.0-beta.33

package/fesm2022/sd-angular-core-forms-textarea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-forms-textarea.mjs","sources":["../../../projects/sd-angular/forms/textarea/src/textarea.component.ts","../../../projects/sd-angular/forms/textarea/src/textarea.component.html","../../../projects/sd-angular/forms/textarea/sd-angular-core-forms-textarea.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n  AfterViewInit,\r\n  ChangeDetectorRef,\r\n  Component,\r\n  ContentChild,\r\n  ElementRef,\r\n  EventEmitter,\r\n  Inject,\r\n  Input,\r\n  OnDestroy,\r\n  OnInit,\r\n  Optional,\r\n  Output,\r\n  ViewChild,\r\n} from '@angular/core';\r\nimport {\r\n  AbstractControl,\r\n  AsyncValidatorFn,\r\n  FormGroup,\r\n  FormsModule,\r\n  NgForm,\r\n  ReactiveFormsModule,\r\n  ValidatorFn,\r\n  Validators,\r\n} from '@angular/forms';\r\nimport { MatFormFieldAppearance, MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdLabelDefDirective, SdSuffixDefDirective, SdViewDefDirective } from '@sd-angular/core/forms/directives';\r\nimport { ISdFormConfiguration, SD_FORM_CONFIGURATION, SdCustomValidator, SdFormControl } from '@sd-angular/core/forms/models';\r\nimport { SdSize } from '@sd-angular/core/utilities';\r\nimport { NumberUtilities } from '@sd-angular/core/utilities/extensions';\r\nimport { Subscription } from 'rxjs';\r\nimport * as uuid from 'uuid';\r\nimport { SdLabel } from '@sd-angular/core/forms/label';\r\nimport { SdEmptyPipe } from '@sd-angular/core/pipes';\r\n\r\n@Component({\r\n  selector: 'sd-textarea',\r\n  templateUrl: './textarea.component.html',\r\n  styleUrls: ['./textarea.component.scss'],\r\n  standalone: true,\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    SdLabel,\r\n    SdEmptyPipe,\r\n  ],\r\n})\r\nexport class SdTextarea implements OnInit, AfterViewInit, OnDestroy {\r\n  id = `I${uuid.v4()}`;\r\n  autoId?: string;\r\n  @Input('autoId') set _autoId(val: string | undefined | null) {\r\n    if (!val) {\r\n      return;\r\n    }\r\n    this.autoId = `forms-textarea-${val}`;\r\n  }\r\n\r\n  #name = uuid.v4();\r\n  @Input() set name(val: string | undefined) {\r\n    if (val) {\r\n      this.#name = val;\r\n    }\r\n  }\r\n\r\n  @Input() size?: SdSize = 'md';\r\n\r\n  @Input() appearance: MatFormFieldAppearance = 'outline';\r\n\r\n  #form?: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup | undefined | null) {\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  label?: string;\r\n  @Input('label') set _label(val: string | undefined) {\r\n    this.label = val;\r\n  }\r\n\r\n  helperText?: string;\r\n  @Input('helperText') set _helperText(val: string | undefined) {\r\n    this.helperText = val;\r\n  }\r\n\r\n  @Input() placeholder = '';\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  hideInlineError = false;\r\n  @Input('hideInlineError') set _hideInlineError(val: boolean | '' | undefined | null) {\r\n    this.hideInlineError = val === '' || !!val;\r\n  }\r\n  required = false;\r\n  @Input('required') set _required(val: boolean | '' | undefined | null) {\r\n    this.required = val === '' || !!val;\r\n    this.#updateValidator();\r\n  }\r\n  maxlength: number | null = null;\r\n  @Input('maxlength') set _maxlength(val: number | undefined | null) {\r\n    if (val !== undefined && val !== null) {\r\n      this.maxlength = +val;\r\n      this.#updateValidator();\r\n    } else {\r\n      this.maxlength = null;\r\n      this.#updateValidator();\r\n    }\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?: SdCustomValidator;\r\n  @Input() set validator(validator: SdCustomValidator | undefined) {\r\n    this.#validator = validator;\r\n    this.#updateValidator();\r\n  }\r\n  inlineError?: string;\r\n  @Input('inlineError') set _inlineError(val: string) {\r\n    this.inlineError = val;\r\n    this.#updateValidator();\r\n  }\r\n  @Input() set disabled(val: boolean | '' | undefined | null) {\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\r\n  viewed = false;\r\n  @Input('viewed') set _viewed(val: boolean | '' | undefined | null) {\r\n    this.viewed = val === '' || !!val;\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) sdViewDef?: SdViewDefDirective;\r\n  @ContentChild(SdLabelDefDirective) sdLabelDef?: SdLabelDefDirective;\r\n  @ContentChild(SdSuffixDefDirective) sdSuffixDef?: SdSuffixDefDirective;\r\n\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(SD_FORM_CONFIGURATION)\r\n    @Optional()\r\n    private formConfig: ISdFormConfiguration\r\n  ) {}\r\n\r\n  ngOnInit() {\r\n    this.appearance = this.appearance || this.formConfig?.appearance;\r\n    this.#subscription.add(\r\n      this.formControl.sdChanges.subscribe(() => {\r\n        this.ref.markForCheck();\r\n      })\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.sdViewDef?.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  #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 (NumberUtilities.isPositiveInteger(this.maxlength)) {\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    if (this.inlineError) {\r\n      validators.push(this.customInlineErrorValidator());\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  // Hàm tạo Validators tùy chỉnh cho inlineError\r\n  customInlineErrorValidator(): ValidatorFn {\r\n    return (): Record<string, any> | null => {\r\n      return { inlineError: true };\r\n    };\r\n  }\r\n\r\n  #customValidator = (func: (value: any) => string | Promise<string>): AsyncValidatorFn => {\r\n    return async (c: AbstractControl): Promise<Record<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","@if (viewed) {\r\n  @if (sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  } @else if (label) {\r\n    <div class=\"T14R text-black400\">{{ label }}</div>\r\n  }\r\n  <div class=\"T14M\">{{ formControl.value | sdEmpty}}</div>\r\n} @else {\r\n  @if (!appearance && sdLabelDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"sdLabelDef!.templateRef\"> </ng-container>\r\n  }\r\n  @if (!appearance && label && !sdLabelDef?.templateRef) {\r\n    <sd-label [label]=\"label\" [required]=\"required\"></sd-label>\r\n  }\r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"sdViewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    @if (sdViewDef?.templateRef && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          sdViewDef!.templateRef;\r\n          context: {\r\n            value: formControl.value\r\n          }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size === 'md'\"\r\n        [class.sd-sm]=\"size === 'sm'\"\r\n        [class.hide-inline-error]=\"hideInlineError\"\r\n        [appearance]=\"appearance\">\r\n        @if (appearance && label) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ label }}</span>\r\n              @if (helperText) {\r\n                <mat-icon [matTooltip]=\"helperText\" matTooltipPosition=\"above\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        <textarea\r\n          matInput\r\n          [placeholder]=\"placeholder || label || ''\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"required\"\r\n          autocomplete=\"off\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [rows]=\"rows\"\r\n          [attr.data-autoId]=\"autoId\"\r\n          spellcheck=\"false\"\r\n          #textarea>\r\n        </textarea>\r\n\r\n        @if (maxlength && !formControl.disabled) {\r\n          <span matSuffix>{{ formControl.value?.length || 0 }}/{{ maxlength }}</span>\r\n        }\r\n        <mat-error *ngIf=\"formControl.touched && formControl.errors?.['required']\">\r\n          <ng-container *ngIf=\"!hideInlineError\">{{ 'Vui lòng nhập thông tin' }}</ng-container>\r\n        </mat-error>\r\n        <mat-error *ngIf=\"formControl.touched && formControl.errors?.['maxlength']\">\r\n          <ng-container *ngIf=\"!hideInlineError\"\r\n            >{{ 'Số ký tự tối đa: ' }} <strong>{{ maxlength }}</strong>\r\n          </ng-container>\r\n        </mat-error>\r\n        <mat-error *ngIf=\"formControl.touched && formControl.errors?.['pattern']\">\r\n          <ng-container *ngIf=\"!hideInlineError\">{{ 'Định dạng không hợp lệ' }}</ng-container>\r\n        </mat-error>\r\n        <mat-error *ngIf=\"formControl.touched && formControl.errors?.['customValidator']\">\r\n          <ng-container *ngIf=\"!hideInlineError\">{{ formControl.errors?.['customValidator'] }}</ng-container>\r\n        </mat-error>\r\n        <mat-error *ngIf=\"formControl.touched && formControl.errors?.['inlineError']\">\r\n          <ng-container *ngIf=\"!hideInlineError\">{{ inlineError }}</ng-container>\r\n        </mat-error>\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"sd-angular-core-forms-textarea.mjs","sources":["../../../projects/sd-angular/forms/textarea/src/textarea.component.ts","../../../projects/sd-angular/forms/textarea/src/textarea.component.html","../../../projects/sd-angular/forms/textarea/sd-angular-core-forms-textarea.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n  AfterViewInit,\r\n  booleanAttribute,\r\n  ChangeDetectorRef,\r\n  Component,\r\n  ElementRef,\r\n  inject,\r\n  input,\r\n  model,\r\n  computed,\r\n  effect,\r\n  untracked,\r\n  OnDestroy,\r\n  OnInit,\r\n  output,\r\n  viewChild,\r\n  contentChild\r\n} from '@angular/core';\r\nimport {\r\n  AbstractControl,\r\n  AsyncValidatorFn,\r\n  FormGroup,\r\n  FormsModule,\r\n  NgForm,\r\n  ReactiveFormsModule,\r\n  ValidatorFn,\r\n  Validators,\r\n} from '@angular/forms';\r\nimport { MatFormFieldAppearance, MatFormFieldModule } from '@angular/material/form-field';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatInputModule } from '@angular/material/input';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdLabelDefDirective, SdSuffixDefDirective, SdViewDefDirective } from '@sd-angular/core/forms/directives';\r\nimport { ISdFormConfiguration, SD_FORM_CONFIGURATION, SdCustomValidator, SdFormControl } from '@sd-angular/core/forms/models';\r\nimport { SdSize } from '@sd-angular/core/utilities';\r\nimport { NumberUtilities } from '@sd-angular/core/utilities/extensions';\r\nimport { Subscription } from 'rxjs';\r\nimport * as uuid from 'uuid';\r\nimport { SdLabel } from '@sd-angular/core/forms/label';\r\nimport { SdEmptyPipe } from '@sd-angular/core/pipes';\r\n\r\n@Component({\r\n  selector: 'sd-textarea',\r\n  templateUrl: './textarea.component.html',\r\n  styleUrls: ['./textarea.component.scss'],\r\n  standalone: true,\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    SdLabel,\r\n    SdEmptyPipe,\r\n  ],\r\n})\r\nexport class SdTextarea implements OnInit, AfterViewInit, OnDestroy {\r\n  id = `I${uuid.v4()}`;\r\n\r\n  // ==========================================\r\n  // 1. SIGNAL QUERIES\r\n  // ==========================================\r\n  textareaRef = viewChild<ElementRef<HTMLTextAreaElement>>('textarea');\r\n  sdViewDef = contentChild(SdViewDefDirective);\r\n  sdLabelDef = contentChild(SdLabelDefDirective);\r\n  sdSuffixDef = contentChild(SdSuffixDefDirective);\r\n\r\n  // ==========================================\r\n  // 2. INJECTS\r\n  // ==========================================\r\n  private ref = inject(ChangeDetectorRef);\r\n  private formConfig = inject(SD_FORM_CONFIGURATION, { optional: true });\r\n\r\n  // ==========================================\r\n  // 3. SIGNAL INPUTS & MODEL\r\n  // ==========================================\r\n  autoIdInput = input<string | undefined | null>(undefined, { alias: 'autoId' });\r\n  autoId = computed(() => this.autoIdInput() ? `forms-textarea-${this.autoIdInput()}` : undefined);\r\n  name = input<string>(uuid.v4());\r\n\r\n  size = input<SdSize>('md');\r\n  form = input<NgForm | FormGroup | undefined | null>();\r\n  label = input<string | undefined>();\r\n  helperText = input<string | undefined>();\r\n  placeholder = input<string>('');\r\n  rows = input<number>(5);\r\n  \r\n  hideInlineError = input(false, { transform: booleanAttribute });\r\n  required = input(false, { transform: booleanAttribute });\r\n  disabled = input(false, { transform: booleanAttribute });\r\n  viewed = input(false, { transform: booleanAttribute });\r\n  autoHeight = input(false, { transform: booleanAttribute });\r\n\r\n  maxlength = input<number | null, unknown>(null, { \r\n    transform: (v) => (v != null && NumberUtilities.isPositiveInteger(Number(v))) ? Number(v) : null \r\n  });\r\n  \r\n  pattern = input<string | undefined>();\r\n  validator = input<SdCustomValidator | undefined>();\r\n  inlineError = input<string | undefined>();\r\n\r\n  appearanceInput = input<MatFormFieldAppearance | undefined>(undefined, { alias: 'appearance' });\r\n  appearance = computed(() => this.appearanceInput() ?? this.formConfig?.appearance ?? 'outline');\r\n\r\n  valueModel = model<any>(undefined, { alias: 'model' });\r\n\r\n  // ==========================================\r\n  // 4. SIGNAL OUTPUTS\r\n  // ==========================================\r\n  sdChange = output<any>();\r\n\r\n  // ==========================================\r\n  // 5. INTERNAL STATE & STREAMS\r\n  // ==========================================\r\n  formControl = new SdFormControl();\r\n  #subscription = new Subscription();\r\n  isFocused = false;\r\n\r\n  constructor() {\r\n    // EFFECT 1: Sync model thay đổi từ bên ngoài\r\n    effect(() => {\r\n      const val = this.valueModel();\r\n      untracked(() => {\r\n        if (this.formControl.value !== val) {\r\n          this.formControl.setValue(val, { emitEvent: false });\r\n          // [IMPROVE] Cập nhật chiều cao khi value đổi từ bên ngoài\r\n          if (this.autoHeight()) this.#adjustHeight();\r\n        }\r\n      });\r\n    });\r\n\r\n    // EFFECT 2: Sync Disable\r\n    effect(() => {\r\n      if (this.disabled()) this.formControl.disable({ emitEvent: false });\r\n      else this.formControl.enable({ emitEvent: false });\r\n    });\r\n\r\n    // EFFECT 3: Update Validators\r\n    effect(() => {\r\n      const req = this.required();\r\n      const maxLen = this.maxlength();\r\n      const pat = this.pattern();\r\n      const val = this.validator();\r\n      const inl = this.inlineError();\r\n\r\n      untracked(() => this.#updateValidator(req, maxLen, pat, val, inl));\r\n    });\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#subscription.add(this.formControl.sdChanges.subscribe(() => this.ref.markForCheck()));\r\n    this.#subscription.add(this.formControl.valueChanges.subscribe(this.#onChange));\r\n\r\n    const formGroup = this.form() instanceof NgForm ? (this.form() as NgForm).form : this.form() as FormGroup;\r\n    formGroup?.addControl(this.name(), this.formControl);\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    if (this.autoHeight()) {\r\n      setTimeout(() => this.#adjustHeight(), 0);\r\n    }\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    const formGroup = this.form() instanceof NgForm ? (this.form() as NgForm).form : this.form() as FormGroup;\r\n    formGroup?.removeControl(this.name());\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  // Hàm private tính toán chiều cao mượt mà\r\n  #adjustHeight() {\r\n    const el = this.textareaRef()?.nativeElement;\r\n    if (el) {\r\n      el.style.height = 'auto';\r\n      el.style.overflowY = 'hidden';\r\n      el.style.height = `${el.scrollHeight}px`;\r\n    }\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.sdViewDef()?.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.textareaRef()?.nativeElement?.blur();\r\n  };\r\n\r\n  focus = () => {\r\n    this.isFocused = true;\r\n    setTimeout(() => {\r\n      this.textareaRef()?.nativeElement?.focus();\r\n    }, 100);\r\n  };\r\n\r\n  #onChange = (value: any) => {\r\n    if (this.autoHeight()) {\r\n      this.#adjustHeight();\r\n    }\r\n    this.valueModel.set(value);\r\n    this.sdChange.emit(value);\r\n  };\r\n\r\n  #updateValidator = (\r\n    req: boolean, maxLen: number | null, pat: string | undefined, \r\n    val: SdCustomValidator | undefined, inl: string | undefined\r\n  ) => {\r\n    this.formControl.clearValidators();\r\n    this.formControl.clearAsyncValidators();\r\n    const validators: ValidatorFn[] = [];\r\n    const asyncValidators: AsyncValidatorFn[] = [];\r\n\r\n    if (req) validators.push(Validators.required);\r\n    if (maxLen != null) validators.push(Validators.maxLength(maxLen));\r\n    if (pat) validators.push(Validators.pattern(pat));\r\n    if (val) asyncValidators.push(this.#customValidator(val));\r\n    if (inl) validators.push(this.customInlineErrorValidator());\r\n\r\n    this.formControl.setValidators(validators.length ? validators : null);\r\n    this.formControl.setAsyncValidators(asyncValidators.length ? asyncValidators : null);\r\n    this.formControl.updateValueAndValidity({ emitEvent: false });\r\n  };\r\n\r\n  customInlineErrorValidator(): ValidatorFn {\r\n    return (): Record<string, any> | null => ({ inlineError: true });\r\n  }\r\n\r\n  #customValidator = (func: (value: any) => string | Promise<string>): AsyncValidatorFn => {\r\n    return async (c: AbstractControl): Promise<Record<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) return { customValidator: message };\r\n          return null;\r\n        }\r\n        if (result) return { customValidator: result };\r\n        return null;\r\n      }\r\n      return null;\r\n    };\r\n  };\r\n}","@let lbl = label();\r\n@let app = appearance();\r\n@let hideErr = hideInlineError();\r\n@let viewDef = sdViewDef();\r\n@let lblDef = sdLabelDef();\r\n@let hText = helperText();\r\n@let req = required();\r\n@let maxLen = maxlength();\r\n\r\n@if (viewed()) {\r\n  @if (lblDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"lblDef!.templateRef\"> </ng-container>\r\n  } @else if (lbl) {\r\n    <div class=\"T14R text-black400\">{{ lbl }}</div>\r\n  }\r\n  <div class=\"T14M\">{{ formControl.value | sdEmpty }}</div>\r\n} @else {\r\n  @if (!app && lblDef?.templateRef) {\r\n    <ng-container *ngTemplateOutlet=\"lblDef!.templateRef\"> </ng-container>\r\n  }\r\n  @if (!app && lbl && !lblDef?.templateRef) {\r\n    <sd-label [label]=\"lbl\" [required]=\"req\"></sd-label>\r\n  }\r\n  \r\n  <div\r\n    class=\"d-flex align-items-center\"\r\n    [class.sd-view]=\"viewDef?.templateRef\"\r\n    [class.c-focused]=\"isFocused\"\r\n    [class.c-disabled]=\"formControl.disabled\"\r\n    (click)=\"onClick()\"\r\n    aria-hidden=\"true\">\r\n    \r\n    @if (viewDef?.templateRef && !isFocused) {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"\r\n          viewDef!.templateRef;\r\n          context: { value: formControl.value }\r\n        \">\r\n      </ng-container>\r\n    } @else {\r\n      <mat-form-field\r\n        [class.sd-md]=\"size() === 'md'\"\r\n        [class.sd-sm]=\"size() === 'sm'\"\r\n        [class.hide-inline-error]=\"hideErr\"\r\n        [appearance]=\"app!\">\r\n        \r\n        @if (app && lbl) {\r\n          <mat-label style=\"display: inline-block\">\r\n            <div style=\"display: flex; align-items: center; gap: 4px\">\r\n              <span>{{ lbl }}</span>\r\n              @if (hText) {\r\n                <mat-icon [matTooltip]=\"hText\" matTooltipPosition=\"above\">info_outline</mat-icon>\r\n              }\r\n            </div>\r\n          </mat-label>\r\n        }\r\n        \r\n        <textarea\r\n          matInput\r\n          [placeholder]=\"placeholder() || lbl || ''\"\r\n          [formControl]=\"formControl\"\r\n          [required]=\"req\"\r\n          autocomplete=\"off\"\r\n          (focus)=\"onFocus()\"\r\n          (blur)=\"onBlur()\"\r\n          [rows]=\"rows()\"\r\n          [attr.data-autoId]=\"autoId()\"\r\n          spellcheck=\"false\"\r\n          #textarea>\r\n        </textarea>\r\n\r\n        @if (maxLen !== null && !formControl.disabled) {\r\n          <span matSuffix>{{ formControl.value?.length || 0 }}/{{ maxLen }}</span>\r\n        }\r\n\r\n        @if (formControl.touched && formControl.errors?.['required']) {\r\n          <mat-error>\r\n            @if (!hideErr) {\r\n              {{ 'Vui lòng nhập thông tin' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n\r\n        @if (formControl.touched && formControl.errors?.['maxlength']) {\r\n          <mat-error>\r\n            @if (!hideErr) {\r\n              {{ 'Số ký tự tối đa: ' }} <strong>{{ maxLen }}</strong>\r\n            }\r\n          </mat-error>\r\n        }\r\n\r\n        @if (formControl.touched && formControl.errors?.['pattern']) {\r\n          <mat-error>\r\n            @if (!hideErr) {\r\n              {{ 'Định dạng không hợp lệ' }}\r\n            }\r\n          </mat-error>\r\n        }\r\n\r\n        @if (formControl.touched && formControl.errors?.['customValidator']) {\r\n          <mat-error>\r\n            @if (!hideErr) {\r\n              {{ formControl.errors?.['customValidator'] }}\r\n            }\r\n          </mat-error>\r\n        }\r\n\r\n        @if (formControl.touched && formControl.errors?.['inlineError']) {\r\n          <mat-error>\r\n            @if (!hideErr) {\r\n              {{ inlineError() }}\r\n            }\r\n          </mat-error>\r\n        }\r\n      </mat-form-field>\r\n    }\r\n  </div>\r\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/sd-angular-core-modules-layout.mjs

@@ -769,7 +769,7 @@ class LayoutSidebarComponent {
         return count;
     };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LayoutSidebarComponent, deps: [{ token: i1$2.Router }, { token: SD_LAYOUT_CONFIGURATION }, { token: SdLayoutStorageService }, { token: MenuFocusPipe }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: LayoutSidebarComponent, isStandalone: true, selector: "lib-layout-sidebar", inputs: { isShowSidebar: "isShowSidebar", _menus: ["menus", "_menus"] }, outputs: { expandSideBar: "expandSideBar", popupUserMenuClosed: "popupUserMenuClosed", popupUserMenuOpened: "popupUserMenuOpened", showSideBar: "showSideBar" }, ngImport: i0, template: "@if (sidebar) {\r\n  <div class=\"wrapper\" [style.height]=\"isMobileOrTablet ? screenHeight + 'px' : '100%'\">\r\n    <div class=\"c-header\">\r\n      @if (sidebar.logoUrl) {\r\n        <div class=\"c-logo\">\r\n          <a href=\"javascript:;\" (click)=\"openHomePage()\">\r\n            <img alt=\"logo\" [src]=\"sidebar.logoUrl\" />\r\n          </a>\r\n        </div>\r\n      }\r\n      <div class=\"c-title-menu-group\">\r\n        <span>{{ titleMenuGroup || sidebar.defaultTitle || 'Back Office' }}</span>\r\n      </div>\r\n    </div>\r\n    <div class=\"c-body\">\r\n      <div class=\"c-menu\">\r\n        <!-- Icon menu-group -->\r\n        <div class=\"c-menu-group\">\r\n          @for (nodeMenuGroup of menusOrigin; track nodeMenuGroup.id) {\r\n            <button\r\n              (mouseenter)=\"onMouseOverMenuGroupNode($event, nodeMenuGroup)\"\r\n              (mouseleave)=\"onMouseLeaveMenuGroupNode($event, nodeMenuGroup)\"\r\n              (click)=\"expandMenuGroup(nodeMenuGroup)\"\r\n              [matTooltip]=\"nodeMenuGroup.tooltipTitle || nodeMenuGroup.title\"\r\n              [matTooltipClass]=\"'c-tooltip-menu-group-7a22ab15-0083-4d4c-9c0c-00a30bc8c140'\"\r\n              [matTooltipPosition]=\"'right'\"\r\n              style=\"padding: 0; margin: 0; border: none; background-color: transparent\">\r\n              <mat-icon\r\n                class=\"c-menu-group-icon\"\r\n                [ngStyle]=\"{\r\n                  color: idMenuGroupActive === nodeMenuGroup?.id ? sidebar.brandColor || '#2962FF' : '#8C8C8C',\r\n                  backgroundColor: idMenuGroupActive === nodeMenuGroup?.id ? sidebar.brandLightColor || '#F8F9FA' : 'transparent',\r\n                }\">\r\n                {{ nodeMenuGroup.icon }}\r\n              </mat-icon>\r\n            </button>\r\n          }\r\n        </div>\r\n        <!-- End -->\r\n\r\n        <!-- Gi\u00E1 tr\u1ECB menu-group -->\r\n        <div class=\"c-menu-tree\">\r\n          @if (totalMenuInMenusByGroup >= 10) {\r\n            <div style=\"padding: 0px 4px\" class=\"c-menu-tree-search\">\r\n              <sd-input size=\"sm\" placeholder=\"T\u00ECm ki\u1EBFm\" [model]=\"searchText\" (sdChange)=\"onFilterSearchText($event)\">\r\n                <ng-template sdSuffixDef>\r\n                  @if (searchText) {\r\n                    <mat-icon class=\"c-search-prefix-icon cancel\" (click)=\"onClearSearchText()\">cancel</mat-icon>\r\n                  } @else {\r\n                    <mat-icon class=\"c-search-prefix-icon search\">search</mat-icon>\r\n                  }\r\n                </ng-template>\r\n              </sd-input>\r\n            </div>\r\n          }\r\n          <div class=\"c-menu-tree-container\">\r\n            <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\" [style.backgroundColor]=\"'transparent'\">\r\n              <mat-nested-tree-node *matTreeNodeDef=\"let node; when: !hasChild\">\r\n                <li\r\n                  class=\"c-menu-node\"\r\n                  (mouseenter)=\"onMouseOverMenuNode($event, node)\"\r\n                  (mouseleave)=\"onMouseLeaveMenuNode($event, node)\"\r\n                  [ngStyle]=\"{\r\n                    backgroundColor: (currentPath | menuFocus: node) ? sidebar.brandLightColor || '#F8F9FA' : 'transparent',\r\n                  }\">\r\n                  <div aria-hidden=\"true\" class=\"c-menu-node-description\" (click)=\"navigate(node)\" [class.d-none]=\"!isShowSidebar\">\r\n                    <div\r\n                      class=\"c-menu-node-description-content\"\r\n                      [ngStyle]=\"{\r\n                        color: (currentPath | menuFocus: node) ? sidebar.brandColor || '#2962FF' : '#1F1F1F',\r\n                      }\"\r\n                      [innerHTML]=\"node.title | highLightSearch: searchText | sdSafeHtml\"></div>\r\n                  </div>\r\n                </li>\r\n              </mat-nested-tree-node>\r\n\r\n              <mat-nested-tree-node\r\n                *matTreeNodeDef=\"let node; when: hasChild\"\r\n                aria-hidden=\"true\"\r\n                [class]=\"{ expanded: treeControl.isExpanded(node), isfocus: currentPath | menuFocus: node }\">\r\n                <li>\r\n                  <div\r\n                    class=\"c-menu-node\"\r\n                    (mouseenter)=\"onMouseOverMenuNode($event, node)\"\r\n                    (mouseleave)=\"onMouseLeaveMenuNode($event, node)\">\r\n                    <div class=\"d-flex align-items-center\" style=\"gap: 10px; width: 100%\">\r\n                      <div [class.d-none]=\"!isShowSidebar\" class=\"c-menu-node-description\" (click)=\"onToggleMenuNode(node)\">\r\n                        <div\r\n                          class=\"c-menu-node-description-content\"\r\n                          [innerHTML]=\"node.title | highLightSearch: searchText | sdSafeHtml\"></div>\r\n                        <mat-icon class=\"c-menu-node-description-icon-expand\">\r\n                          {{ treeControl.isExpanded(node) ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}\r\n                        </mat-icon>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <ul class=\"p-0\" [class.d-none]=\"!treeControl.isExpanded(node)\">\r\n                    <ng-container matTreeNodeOutlet></ng-container>\r\n                  </ul>\r\n                </li>\r\n              </mat-nested-tree-node>\r\n            </mat-tree>\r\n          </div>\r\n        </div>\r\n        <!-- End -->\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"c-footer\">\r\n      <lib-layout-user\r\n        [isMobileOrTablet]=\"isMobileOrTablet\"\r\n        (menuOpened)=\"onUserMenuOpened()\"\r\n        (menuClosed)=\"onUserMenuClosed()\"\r\n        [isShowSidebar]=\"isShowSidebar\"\r\n        (toggleMenuLock)=\"toggleMenuLock($event)\">\r\n      </lib-layout-user>\r\n    </div>\r\n\r\n    <div class=\"c-vertical\"></div>\r\n  </div>\r\n}\r\n", styles: ["::ng-deep .mat-mdc-tooltip-panel:has(.c-tooltip-menu-group-7a22ab15-0083-4d4c-9c0c-00a30bc8c140){pointer-events:none}:host ::ng-deep .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:16px!important}:host ::ng-deep .mat-nested-tree-node ul .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:32px!important}:host ::ng-deep .mat-nested-tree-node ul .mat-nested-tree-node ul .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:48px!important}ul,li{margin-top:0;margin-bottom:0;list-style-type:none}.wrapper{display:flex;flex-direction:column;width:290px;background-color:#fff}.wrapper .c-header{display:flex;align-items:center;height:52px;padding:3px;gap:16px}.wrapper .c-header .c-logo{display:flex;justify-content:center;align-items:center;width:52px;height:52px}.wrapper .c-header .c-logo img{width:32px;height:32px;object-fit:cover}.wrapper .c-header .c-title-menu-group{display:flex;align-items:center;font-size:18px;font-weight:500;flex:1}.wrapper .c-body{flex:1;overflow-y:hidden}.wrapper .c-body .c-menu{height:100%;display:flex}.wrapper .c-body .c-menu .c-menu-group{display:flex;flex-direction:column;align-items:center;width:60px;overflow-y:scroll;scrollbar-width:none}.wrapper .c-body .c-menu .c-menu-group .c-menu-group-icon{display:flex;justify-content:center;align-items:center;min-height:50px;width:52px;border-radius:8px}.wrapper .c-body .c-menu .c-menu-tree{flex:1;display:flex;flex-direction:column;padding:3px 4px 3px 3px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon{cursor:pointer;color:#757575;padding:0}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon.search{width:20px;height:20px;font-size:18px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon.cancel{width:16px;height:16px;font-size:16px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container{flex:1;overflow-y:scroll;scrollbar-width:none}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node{width:100%;display:flex;cursor:pointer;min-height:44px;padding:8px;border-radius:8px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-icon{display:flex;justify-content:center;align-items:center;height:100%}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description{flex:1;display:flex;align-items:center}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description .c-menu-node-description-content{flex:1;display:flex;align-items:center;flex-wrap:wrap;white-space:pre-wrap;font-size:15px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description .c-menu-node-description-icon-expand{text-align:left;background-color:transparent;border:none;font-size:20px}.wrapper .c-footer{height:80px}.wrapper .c-vertical{position:fixed;height:100vh;left:58px;width:2px;background-color:#f8f9fa;pointer-events:none}\n"], dependencies: [{ kind: "component", type: SdInput, selector: "sd-input", inputs: ["autoId", "name", "appearance", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "model", "required", "readonly", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "disabled", "viewed", "hyperlink", "tooltip"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "sdFocusForceBlur", "keyupEnter"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i6.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i6.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "component", type: i6.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i6.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "pipe", type: SdSafeHtmlPipe, name: "sdSafeHtml" }, { kind: "ngmodule", type: MatInputModule }, { kind: "pipe", type: MenuFocusPipe, name: "menuFocus" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: HighlightSearchPipe, name: "highLightSearch" }, { kind: "directive", type: SdSuffixDefDirective, selector: "[sdSuffixDef]" }, { kind: "component", type: LayoutUserComponent, selector: "lib-layout-user", inputs: ["isMobileOrTablet", "isMenuLock", "isShowSidebar"], outputs: ["menuClosed", "menuOpened", "toggleMenuLock"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: LayoutSidebarComponent, isStandalone: true, selector: "lib-layout-sidebar", inputs: { isShowSidebar: "isShowSidebar", _menus: ["menus", "_menus"] }, outputs: { expandSideBar: "expandSideBar", popupUserMenuClosed: "popupUserMenuClosed", popupUserMenuOpened: "popupUserMenuOpened", showSideBar: "showSideBar" }, ngImport: i0, template: "@if (sidebar) {\r\n  <div class=\"wrapper\" [style.height]=\"isMobileOrTablet ? screenHeight + 'px' : '100%'\">\r\n    <div class=\"c-header\">\r\n      @if (sidebar.logoUrl) {\r\n        <div class=\"c-logo\">\r\n          <a href=\"javascript:;\" (click)=\"openHomePage()\">\r\n            <img alt=\"logo\" [src]=\"sidebar.logoUrl\" />\r\n          </a>\r\n        </div>\r\n      }\r\n      <div class=\"c-title-menu-group\">\r\n        <span>{{ titleMenuGroup || sidebar.defaultTitle || 'Back Office' }}</span>\r\n      </div>\r\n    </div>\r\n    <div class=\"c-body\">\r\n      <div class=\"c-menu\">\r\n        <!-- Icon menu-group -->\r\n        <div class=\"c-menu-group\">\r\n          @for (nodeMenuGroup of menusOrigin; track nodeMenuGroup.id) {\r\n            <button\r\n              (mouseenter)=\"onMouseOverMenuGroupNode($event, nodeMenuGroup)\"\r\n              (mouseleave)=\"onMouseLeaveMenuGroupNode($event, nodeMenuGroup)\"\r\n              (click)=\"expandMenuGroup(nodeMenuGroup)\"\r\n              [matTooltip]=\"nodeMenuGroup.tooltipTitle || nodeMenuGroup.title\"\r\n              [matTooltipClass]=\"'c-tooltip-menu-group-7a22ab15-0083-4d4c-9c0c-00a30bc8c140'\"\r\n              [matTooltipPosition]=\"'right'\"\r\n              style=\"padding: 0; margin: 0; border: none; background-color: transparent\">\r\n              <mat-icon\r\n                class=\"c-menu-group-icon\"\r\n                [ngStyle]=\"{\r\n                  color: idMenuGroupActive === nodeMenuGroup?.id ? sidebar.brandColor || '#2962FF' : '#8C8C8C',\r\n                  backgroundColor: idMenuGroupActive === nodeMenuGroup?.id ? sidebar.brandLightColor || '#F8F9FA' : 'transparent',\r\n                }\">\r\n                {{ nodeMenuGroup.icon }}\r\n              </mat-icon>\r\n            </button>\r\n          }\r\n        </div>\r\n        <!-- End -->\r\n\r\n        <!-- Gi\u00E1 tr\u1ECB menu-group -->\r\n        <div class=\"c-menu-tree\">\r\n          @if (totalMenuInMenusByGroup >= 10) {\r\n            <div style=\"padding: 0px 4px\" class=\"c-menu-tree-search\">\r\n              <sd-input size=\"sm\" placeholder=\"T\u00ECm ki\u1EBFm\" [model]=\"searchText\" (sdChange)=\"onFilterSearchText($event)\">\r\n                <ng-template sdSuffixDef>\r\n                  @if (searchText) {\r\n                    <mat-icon class=\"c-search-prefix-icon cancel\" (click)=\"onClearSearchText()\">cancel</mat-icon>\r\n                  } @else {\r\n                    <mat-icon class=\"c-search-prefix-icon search\">search</mat-icon>\r\n                  }\r\n                </ng-template>\r\n              </sd-input>\r\n            </div>\r\n          }\r\n          <div class=\"c-menu-tree-container\">\r\n            <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\" [style.backgroundColor]=\"'transparent'\">\r\n              <mat-nested-tree-node *matTreeNodeDef=\"let node; when: !hasChild\">\r\n                <li\r\n                  class=\"c-menu-node\"\r\n                  (mouseenter)=\"onMouseOverMenuNode($event, node)\"\r\n                  (mouseleave)=\"onMouseLeaveMenuNode($event, node)\"\r\n                  [ngStyle]=\"{\r\n                    backgroundColor: (currentPath | menuFocus: node) ? sidebar.brandLightColor || '#F8F9FA' : 'transparent',\r\n                  }\">\r\n                  <div aria-hidden=\"true\" class=\"c-menu-node-description\" (click)=\"navigate(node)\" [class.d-none]=\"!isShowSidebar\">\r\n                    <div\r\n                      class=\"c-menu-node-description-content\"\r\n                      [ngStyle]=\"{\r\n                        color: (currentPath | menuFocus: node) ? sidebar.brandColor || '#2962FF' : '#1F1F1F',\r\n                      }\"\r\n                      [innerHTML]=\"node.title | highLightSearch: searchText | sdSafeHtml\"></div>\r\n                  </div>\r\n                </li>\r\n              </mat-nested-tree-node>\r\n\r\n              <mat-nested-tree-node\r\n                *matTreeNodeDef=\"let node; when: hasChild\"\r\n                aria-hidden=\"true\"\r\n                [class]=\"{ expanded: treeControl.isExpanded(node), isfocus: currentPath | menuFocus: node }\">\r\n                <li>\r\n                  <div\r\n                    class=\"c-menu-node\"\r\n                    (mouseenter)=\"onMouseOverMenuNode($event, node)\"\r\n                    (mouseleave)=\"onMouseLeaveMenuNode($event, node)\">\r\n                    <div class=\"d-flex align-items-center\" style=\"gap: 10px; width: 100%\">\r\n                      <div [class.d-none]=\"!isShowSidebar\" class=\"c-menu-node-description\" (click)=\"onToggleMenuNode(node)\">\r\n                        <div\r\n                          class=\"c-menu-node-description-content\"\r\n                          [innerHTML]=\"node.title | highLightSearch: searchText | sdSafeHtml\"></div>\r\n                        <mat-icon class=\"c-menu-node-description-icon-expand\">\r\n                          {{ treeControl.isExpanded(node) ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}\r\n                        </mat-icon>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <ul class=\"p-0\" [class.d-none]=\"!treeControl.isExpanded(node)\">\r\n                    <ng-container matTreeNodeOutlet></ng-container>\r\n                  </ul>\r\n                </li>\r\n              </mat-nested-tree-node>\r\n            </mat-tree>\r\n          </div>\r\n        </div>\r\n        <!-- End -->\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"c-footer\">\r\n      <lib-layout-user\r\n        [isMobileOrTablet]=\"isMobileOrTablet\"\r\n        (menuOpened)=\"onUserMenuOpened()\"\r\n        (menuClosed)=\"onUserMenuClosed()\"\r\n        [isShowSidebar]=\"isShowSidebar\"\r\n        (toggleMenuLock)=\"toggleMenuLock($event)\">\r\n      </lib-layout-user>\r\n    </div>\r\n\r\n    <div class=\"c-vertical\"></div>\r\n  </div>\r\n}\r\n", styles: ["::ng-deep .mat-mdc-tooltip-panel:has(.c-tooltip-menu-group-7a22ab15-0083-4d4c-9c0c-00a30bc8c140){pointer-events:none}:host ::ng-deep .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:16px!important}:host ::ng-deep .mat-nested-tree-node ul .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:32px!important}:host ::ng-deep .mat-nested-tree-node ul .mat-nested-tree-node ul .mat-nested-tree-node ul .c-menu-node-description-content{margin-left:48px!important}ul,li{margin-top:0;margin-bottom:0;list-style-type:none}.wrapper{display:flex;flex-direction:column;width:290px;background-color:#fff}.wrapper .c-header{display:flex;align-items:center;height:52px;padding:3px;gap:16px}.wrapper .c-header .c-logo{display:flex;justify-content:center;align-items:center;width:52px;height:52px}.wrapper .c-header .c-logo img{width:32px;height:32px;object-fit:cover}.wrapper .c-header .c-title-menu-group{display:flex;align-items:center;font-size:18px;font-weight:500;flex:1}.wrapper .c-body{flex:1;overflow-y:hidden}.wrapper .c-body .c-menu{height:100%;display:flex}.wrapper .c-body .c-menu .c-menu-group{display:flex;flex-direction:column;align-items:center;width:60px;overflow-y:scroll;scrollbar-width:none}.wrapper .c-body .c-menu .c-menu-group .c-menu-group-icon{display:flex;justify-content:center;align-items:center;min-height:50px;width:52px;border-radius:8px}.wrapper .c-body .c-menu .c-menu-tree{flex:1;display:flex;flex-direction:column;padding:3px 4px 3px 3px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon{cursor:pointer;color:#757575;padding:0}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon.search{width:20px;height:20px;font-size:18px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-search .c-search-prefix-icon.cancel{width:16px;height:16px;font-size:16px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container{flex:1;overflow-y:scroll;scrollbar-width:none}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node{width:100%;display:flex;cursor:pointer;min-height:44px;padding:8px;border-radius:8px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-icon{display:flex;justify-content:center;align-items:center;height:100%}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description{flex:1;display:flex;align-items:center}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description .c-menu-node-description-content{flex:1;display:flex;align-items:center;flex-wrap:wrap;white-space:pre-wrap;font-size:15px}.wrapper .c-body .c-menu .c-menu-tree .c-menu-tree-container .c-menu-node .c-menu-node-description .c-menu-node-description-icon-expand{text-align:left;background-color:transparent;border:none;font-size:20px}.wrapper .c-footer{height:80px}.wrapper .c-vertical{position:fixed;height:100vh;left:58px;width:2px;background-color:#f8f9fa;pointer-events:none}\n"], dependencies: [{ kind: "component", type: SdInput, selector: "sd-input", inputs: ["autoId", "name", "appearance", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "required", "readonly", "disabled", "viewed", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "hyperlink", "tooltip", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "sdFocusForceBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i6.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i6.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "component", type: i6.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i6.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "pipe", type: SdSafeHtmlPipe, name: "sdSafeHtml" }, { kind: "ngmodule", type: MatInputModule }, { kind: "pipe", type: MenuFocusPipe, name: "menuFocus" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: HighlightSearchPipe, name: "highLightSearch" }, { kind: "directive", type: SdSuffixDefDirective, selector: "[sdSuffixDef]" }, { kind: "component", type: LayoutUserComponent, selector: "lib-layout-user", inputs: ["isMobileOrTablet", "isMenuLock", "isShowSidebar"], outputs: ["menuClosed", "menuOpened", "toggleMenuLock"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LayoutSidebarComponent, decorators: [{
             type: Component,