@testgorilla/tgo-ui 11.9.0 → 11.11.0

package/fesm2022/testgorilla-tgo-ui-components-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testgorilla-tgo-ui-components-field.mjs","sources":["../../../components/field/field.component.ts","../../../components/field/field.component.html","../../../components/field/field.component.module.ts","../../../components/field/testgorilla-tgo-ui-components-field.ts"],"sourcesContent":["import { FocusMonitor } from '@angular/cdk/a11y';\nimport { CdkTextareaAutosize } from '@angular/cdk/text-field';\nimport { NgStyle, NgClass, AsyncPipe } from '@angular/common';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  computed,\n  DestroyRef,\n  DoCheck,\n  ElementRef,\n  EventEmitter,\n  HostBinding,\n  inject,\n  input,\n  Input,\n  NgZone,\n  OnInit,\n  Output,\n  ProviderToken,\n  signal,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { MatFormField, MatLabel, MatPrefix, MatHint } from '@angular/material/form-field';\nimport { MatIconRegistry, MatIcon } from '@angular/material/icon';\nimport { MatInput } from '@angular/material/input';\nimport { DomSanitizer } from '@angular/platform-browser';\n\nimport { BadgeVariant, BadgeComponent } from '@testgorilla/tgo-ui/components/badge';\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport {\n  ApplicationTheme,\n  DigitsOnlyDirective,\n  UiTranslatePipe,\n  HasValidationErrorPipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\nimport { FieldType } from './field.model';\n\n/**\n * A global counter used to generate unique field IDs.\n * This variable is incremented each time a new field ID is needed.\n *\n * @remarks\n * This is primarily used to ensure that each field component\n * has a unique identifier within the application / useful for their Aria Labels.\n */\nlet fieldID = 0;\n\n@Component({\n  selector: 'ui-field',\n  templateUrl: './field.component.html',\n  styleUrls: ['./field.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    MatFormField,\n    NgStyle,\n    NgClass,\n    MatLabel,\n    IconComponentModule,\n    MatIcon,\n    MatPrefix,\n    MatInput,\n    DigitsOnlyDirective,\n    CdkTextareaAutosize,\n    ButtonComponent,\n    MatHint,\n    ValidationErrorModule,\n    BadgeComponent,\n    AsyncPipe,\n    UiTranslatePipe,\n    HasValidationErrorPipe,\n  ],\n})\nexport class FieldComponent implements OnInit, ControlValueAccessor, DoCheck, AfterViewInit {\n  @HostBinding() class = 'ui-field';\n\n  /**\n   * Indicator of the autocomplete width\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @HostBinding('class.full-width')\n  @Input()\n  fullWidth = true;\n\n  /**\n   * Indicator of the field height\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @HostBinding('class.full-height')\n  @Input()\n  fullHeight = false;\n\n  /**\n   * Form field label\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() label? = '';\n\n  /**\n   * Form field label from html\n   *\n   * @memberof FieldComponent\n   */\n  labelHtml = input<string | null>(null);\n\n  /**\n   * Icon to display alongside the label\n   *\n   * @type {IconName}\n   * @memberof FieldComponent\n   */\n  @Input() labelIcon?: IconName;\n\n  /**\n   * Input name attribute\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() fieldName?: string;\n\n  /**\n   * Input placeholder\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() placeholder? = '';\n\n  /**\n   * Input id\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  id = input(`field-${fieldID++}`);\n\n  /**\n   * Input value\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() value = '';\n\n  /**\n   * Variant of badge to use\n   *\n   * @type {BadgeVariant}\n   * @memberof FieldComponent\n   */\n  @Input() badgeVariant?: BadgeVariant | undefined;\n\n  _errors: string[];\n  /**\n   * Input field errors\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() set errors(errors: string[]) {\n    this._errors = errors?.filter(Boolean) ?? [];\n    this.errorsLength = this.setErrorsLength();\n  }\n\n  /**\n   * Determines if input is disabled\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() disabled: boolean;\n\n  /**\n   * Input is required or not\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() required: boolean;\n\n  /**\n   * Input is readonly or not\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() readOnly = false;\n\n  /**\n   * Hint text\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() hintMessage = '';\n\n  /**\n   * Input type\n   *\n   * @type {FieldType}\n   * @memberof FieldComponent\n   */\n  @HostBinding('attr.field-class')\n  @Input()\n  type: FieldType = 'text';\n\n  /**\n   * Input is update only on blur\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() updateOnBlur = false;\n\n  /**\n   * allow only digits in input\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() allowOnlyDigits = false;\n\n  /**\n   * allow autocomplete off in input\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isAutocompleteOff = false;\n\n  /**\n   * allow negative numbers\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() allowNegative = true;\n\n  /**\n   * Show reserved content below form field\n   * @property showBottomContent\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() showBottomContent = true;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof FieldComponent\n   */\n  @HostBinding('attr.theme')\n  @Input()\n  applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() ariaLabel: string;\n\n  /**\n   * Show loading button. Only for text\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() loading = false;\n\n  /**\n   * Show icon when field is valid\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isValid = false;\n\n  /**\n   * Max characters number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() maxCharacters = 255;\n\n  /**\n   * Trim text on blur\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() trimOnBlur = false;\n  /**\n   * Trim text on submit\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() trimOnSubmit = false;\n  /**\n   * Max rows for multi-line type\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() maxRows = 0;\n  /**\n   * has text area counter\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() hasTextAreaCounter = true;\n\n  /**\n   * Hide in build errors for Reactive Forms\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() hideBuiltInErrors = false;\n\n  /**\n   * Hide label in errors\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() hideLabelInErrors = false;\n\n  /**\n   * Set maximum number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() max: number | undefined;\n\n  /**\n   * Set minimum number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() min: number | undefined;\n\n  /**\n   * Sets textarea height. Default 110\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() textareaHeight = 110;\n\n  /**\n   * Sets textarea borderless. Default false\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() borderless = false;\n\n  @Input() autosizableTextarea = false;\n\n  /**\n   * Indicates if this field is filled by AI\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isAIVariant = false;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria Labeled By Element Id.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaLabelledbyId = computed(() => `${this.id()}-labeledBy`);\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria LabeledBy Text.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaLabelledby = input<string | undefined>(undefined);\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria Described By Element Id.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaDescribedbyId = computed(() => `${this.id()}-describedBy`);\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria DescribedBy Text.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaDescribedby = input<string | undefined>(undefined);\n\n  /**\n   * Show state of error\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() hasError = false;\n\n  @Output() validateEvent = new EventEmitter<string>();\n  @Output() fieldBlur = new EventEmitter<void>();\n\n  @ViewChild('inputElement', { read: ElementRef }) field: ElementRef<HTMLInputElement>;\n  @ViewChild('autosize') autosize: CdkTextareaAutosize;\n\n  get getPasswordIcon(): IconName {\n    if (this.applicationTheme === 'classic') {\n      return this.showPassword ? 'Eye-hide' : 'Eye-view';\n    } else {\n      if (!this.isActiveField && !this.isActiveHover) {\n        return this.showPassword ? 'View-in-line' : 'Hide-in-line';\n      } else {\n        return this.showPassword ? 'View-filled' : 'Hide-filled';\n      }\n    }\n  }\n\n  isActiveField = false;\n  isActiveHover = false;\n\n  keyboardFocused = signal(false);\n\n  protected readonly translationContext = 'FIELD.';\n\n  /**\n   * @ignore\n   */\n  onChange: (value: string | number) => void = () => {};\n\n  /**\n   * @ignore\n   */\n  onTouch = () => {};\n\n  private readonly defaultAppTheme = inject(\n    'CANOPYUI_DEFAULT_APPLICATION_THEME' as unknown as ProviderToken<ApplicationTheme>,\n    {\n      optional: true,\n    }\n  );\n  private readonly matIconRegistry = inject(MatIconRegistry);\n  private readonly domSanitizer = inject(DomSanitizer);\n  private readonly cdr = inject(ChangeDetectorRef);\n  public ngControl = inject(NgControl, { optional: true, self: true });\n  private readonly focusMonitor = inject(FocusMonitor);\n  private readonly ngZone = inject(NgZone);\n  private readonly destroyRef = inject(DestroyRef);\n\n  constructor() {\n    if (this.defaultAppTheme) {\n      this.applicationTheme = this.defaultAppTheme;\n    }\n\n    if (this.ngControl !== null) {\n      this.ngControl.valueAccessor = this;\n    }\n  }\n\n  ngAfterViewInit(): void {\n    this.focusMonitor\n      .monitor(this.field)\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(origin =>\n        this.ngZone.run(() => {\n          queueMicrotask(() => {\n            this.keyboardFocused.set(origin === 'keyboard');\n          });\n        })\n      );\n\n    if (this.type === 'multi-line') {\n      this.autosize.resizeToFitContent(true);\n    }\n  }\n\n  /**\n   * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors\n   * to display validation errors that might happen (e.g. required)\n   */\n  ngDoCheck(): void {\n    if (this.ngControl?.touched || this.ngControl?.errors) {\n      this.cdr.markForCheck();\n    }\n  }\n\n  showClose: boolean;\n  showPassword: boolean;\n  currentType: string;\n  errorsLength: boolean;\n\n  ngOnInit(): void {\n    this.setSearchInput();\n    this.currentType = this.getType();\n  }\n\n  validate(): void {\n    this.validateEvent.emit(this.value);\n  }\n\n  //set search input initial value\n  setSearchInput(): void {\n    if (this.type === 'search' || this.type === 'collapsed-search') {\n      // eslint-disable-next-line no-restricted-syntax -- SECURITY: hardcoded first-party asset URL; MatIconRegistry.addSvgIcon requires SafeResourceUrl.\n      this.matIconRegistry.addSvgIcon('Search', this.domSanitizer.bypassSecurityTrustResourceUrl('/icons/Search.svg'));\n      if (this.value) {\n        this.showClose = true;\n      } else {\n        this.showClose = false;\n      }\n    } else {\n      this.showClose = false;\n    }\n  }\n\n  //change type for reveal password\n  getType(): string {\n    if (this.type === 'password' && this.showPassword) {\n      return 'text';\n    }\n    return this.type;\n  }\n\n  //Clear input value\n  clearValue(): void {\n    this.value = '';\n    this.onChange(this.value);\n    this.onChangeInputSearch();\n  }\n\n  //toggle for password\n  showPasswordClick() {\n    this.showPassword = !this.showPassword;\n    this.currentType = this.getType();\n  }\n\n  //Set options for search input\n  onChangeInputSearch() {\n    if (this.type === 'search' || this.type === 'collapsed-search') {\n      if (!this.value) {\n        this.showClose = false;\n      }\n      if (this.value) {\n        this.showClose = true;\n      }\n    }\n  }\n\n  // Set errors length for validation\n  // Consider only those errors which which are not empty\n  setErrorsLength(): boolean {\n    if (this._errors) {\n      return this._errors.filter(err => Boolean(err)).length > 0 ? true : false;\n    }\n    return false;\n  }\n\n  //Save input value\n  onInput(event: Event) {\n    this.value = (event.target as HTMLInputElement | HTMLTextAreaElement).value;\n    this.errorsLength = this.setErrorsLength();\n    if (!this.updateOnBlur) {\n      this.onTouch();\n    }\n    if (this.allowOnlyDigits && !this.allowNegative && Number(this.value) < 0) {\n      this.value = '0';\n    } else {\n      this.onChange(this.type === 'number' && this.value !== '' ? Number(this.value) : this.value);\n    }\n  }\n\n  writeValue(value?: string | number): void {\n    if (value !== null && value !== undefined) {\n      // The internal <input> value is always a string; a numeric form value\n      // renders identically once assigned (the input coerces it anyway).\n      this.value = String(value);\n    } else {\n      this.value = '';\n    }\n    this.onChangeInputSearch();\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: (value: string | number) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  onActive(state: boolean, action: string): void {\n    if (action === 'hover') {\n      this.isActiveHover = state;\n    } else if (action === 'focus') {\n      this.isActiveField = state;\n\n      if (!state && this.trimOnBlur) {\n        this.clearSpace();\n      }\n    }\n  }\n\n  onSubmit(): void {\n    if (this.trimOnSubmit) {\n      this.clearSpace();\n    }\n  }\n\n  private clearSpace(): void {\n    this.value = this.value.trim();\n    this.onChange(this.value);\n  }\n\n  onBlur(): void {\n    this.fieldBlur.emit();\n  }\n\n  trackByFn = (index: number, value: string) => value;\n\n  focus(): void {\n    this.field.nativeElement.focus();\n  }\n\n  refocusPasswordButton(btn: ButtonComponent) {\n    setTimeout(() => {\n      btn.focus('keyboard');\n    }, 0);\n  }\n}\n","<ng-container>\n  <mat-form-field\n    [ngStyle]=\"{\n      '--textarea-height': textareaHeight - 10 + 'px',\n      '--textarea-height-container': textareaHeight + 'px',\n    }\"\n    #uiField\n    appearance=\"outline\"\n    hideRequiredMarker=\"true\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError ? 'warn' : 'accent'\"\n    [ngClass]=\"{\n      'hide-bottom-content': !showBottomContent,\n      textarea: type === 'textarea' || type === 'textarea-scrollable',\n      'textarea-scrollable': type === 'textarea-scrollable',\n      'multi-line': type === 'multi-line',\n      'multi-line-textarea': type === 'multi-line' && autosizableTextarea && borderless,\n      'keyboard-focused': keyboardFocused(),\n      'has-label': !!label,\n      'has-value': !!value,\n      'text-area-borderless': borderless && (type === 'textarea' || type === 'textarea-scrollable'),\n    }\"\n    (mouseenter)=\"onActive(true, 'hover')\"\n    (mouseleave)=\"onActive(false, 'hover')\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"ariaDescribedbyId()\">\n      @if (required) {\n        <span>{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n      }\n      {{ ariaDescribedby() }}\n    </span>\n    <span [style.display]=\"'none'\" [id]=\"ariaLabelledbyId()\">\n      {{ ariaLabelledby() ?? label }}\n    </span>\n    @if (\n      (label || labelHtml()) &&\n      ((type !== 'search' && applicationTheme === 'classic') || applicationTheme !== 'classic')\n    ) {\n      <mat-label class=\"label-with-icon\">\n        @if (isAIVariant || labelIcon) {\n          <ui-icon [name]=\"isAIVariant ? 'Sparkle-in-line' : labelIcon!\" [size]=\"'16'\" class=\"label-icon\"></ui-icon>\n        }\n        <span>\n          @if (labelHtml()) {\n            <span [innerHTML]=\"labelHtml()\"></span>\n          } @else {\n            {{ label }}\n          }\n          @if (required) {\n            <span>*</span>\n          }\n        </span>\n      </mat-label>\n    }\n    @if (type === 'search' || type === 'collapsed-search') {\n      <mat-icon matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n    }\n    @if (type !== 'textarea' && type !== 'textarea-scrollable' && type !== 'multi-line') {\n      <input\n        data-testid=\"field-input\"\n        [readonly]=\"readOnly\"\n        matInput\n        #inputElement\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled || loading\"\n        [type]=\"currentType\"\n        (keyup.enter)=\"onSubmit()\"\n        [max]=\"max\"\n        [min]=\"min\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        digitsOnly\n        [autocomplete]=\"isAutocompleteOff ? 'off' : 'on'\"\n        [allowOnlyDigits]=\"allowOnlyDigits\"\n        [allowNegative]=\"allowNegative\"\n        (focusin)=\"onActive(true, 'focus')\"\n      />\n    } @else {\n      <textarea\n        matInput\n        #inputElement\n        #autosize=\"cdkTextareaAutosize\"\n        [readonly]=\"readOnly\"\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        (keyup.enter)=\"onSubmit()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"!label ? ariaLabel : ''\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        [cdkTextareaAutosize]=\"type === 'multi-line'\"\n        [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n        [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5\"\n        [attr.maxlength]=\"maxCharacters\"\n        (focusin)=\"onActive(true, 'focus')\"\n      ></textarea>\n    }\n\n    @if (type === 'search' || type === 'collapsed-search' || type === 'password' || type === 'validation-text') {\n      <div class=\"options\">\n        <div class=\"options-container\">\n          @if (showClose) {\n            <ui-button\n              variant=\"secondary\"\n              [justIcon]=\"true\"\n              class=\"close\"\n              iconName=\"Close\"\n              [label]=\"('COMMON.CLEAR' | uiTranslate | async)!\"\n              (buttonClickEvent)=\"clearValue()\"\n              [ariaLabel]=\"ariaLabel + '--' + ('COMMON.CLEAR' | uiTranslate | async)\"\n            ></ui-button>\n          }\n          @if (type === 'password') {\n            <ui-button\n              class=\"password\"\n              variant=\"secondary\"\n              [tooltip]=\"((showPassword ? 'FIELD.HIDE_PASSWORD' : 'FIELD.SHOW_PASSWORD') | uiTranslate | async)!\"\n              [justIcon]=\"true\"\n              role=\"switch\"\n              [attr.aria-checked]=\"showPassword\"\n              [iconName]=\"getPasswordIcon\"\n              [applicationTheme]=\"applicationTheme\"\n              (click)=\"showPasswordClick()\"\n              #btn\n              (keydown.enter)=\"refocusPasswordButton(btn)\"\n              (keydown.space)=\"refocusPasswordButton(btn)\"\n            ></ui-button>\n          }\n          @if (\n            type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\n          ) {\n            @if (!isValid) {\n              <ui-button\n                class=\"validation\"\n                [variant]=\"'text'\"\n                [applicationTheme]=\"'light'\"\n                [label]=\"'Validate'\"\n                [loading]=\"loading\"\n                (click)=\"validate()\"\n                [disabled]=\"disabled\"\n                [size]=\"'small'\"\n              ></ui-button>\n            }\n            @if (isValid) {\n              <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\"></ui-icon>\n            }\n          }\n        </div>\n      </div>\n    }\n    @if (\n      hasTextAreaCounter &&\n      (type === 'textarea' || type === 'textarea-scrollable') &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError)\n    ) {\n      <mat-hint class=\"info\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n    }\n\n    @if (\n      hintMessage &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError) &&\n      type !== 'textarea' &&\n      type !== 'textarea-scrollable'\n    ) {\n      <mat-hint class=\"info\">{{ hintMessage }}</mat-hint>\n    }\n\n    @if (errorsLength || (ngControl?.errors | hasValidationError)) {\n      <mat-hint class=\"error\">\n        @if (errorsLength) {\n          @for (error of _errors; track trackByFn($index, error)) {\n            <div class=\"errors\">\n              <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n              <span [innerHTML]=\"error\"></span>\n            </div>\n          }\n        }\n        @if (ngControl && !hideBuiltInErrors) {\n          <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n        }\n      </mat-hint>\n    }\n\n    @if (badgeVariant) {\n      <ui-badge class=\"field-badge\" [variant]=\"badgeVariant\"></ui-badge>\n    }\n  </mat-form-field>\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { DigitsOnlyDirective, UiTranslatePipe, HasValidationErrorPipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\nimport { FieldComponent } from './field.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatFormFieldModule,\n    MatInputModule,\n    IconComponentModule,\n    FormsModule,\n    ReactiveFormsModule,\n    ButtonComponentModule,\n    MatIconModule,\n    UiTranslatePipe,\n    ValidationErrorModule,\n    HasValidationErrorPipe,\n    DigitsOnlyDirective,\n    BadgeComponentModule,\n    FieldComponent,\n  ],\n  exports: [FieldComponent],\n})\nexport class FieldComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testgorilla-tgo-ui-components-field.mjs","sources":["../../../components/field/field.component.ts","../../../components/field/field.component.html","../../../components/field/field.component.module.ts","../../../components/field/testgorilla-tgo-ui-components-field.ts"],"sourcesContent":["import { FocusMonitor } from '@angular/cdk/a11y';\nimport { CdkTextareaAutosize } from '@angular/cdk/text-field';\nimport { NgStyle, NgClass, AsyncPipe } from '@angular/common';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  computed,\n  DestroyRef,\n  DoCheck,\n  ElementRef,\n  EventEmitter,\n  HostBinding,\n  inject,\n  input,\n  Input,\n  NgZone,\n  OnInit,\n  Output,\n  ProviderToken,\n  signal,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NgControl } from '@angular/forms';\nimport { MatFormField, MatLabel, MatPrefix, MatHint } from '@angular/material/form-field';\nimport { MatIconRegistry, MatIcon } from '@angular/material/icon';\nimport { MatInput } from '@angular/material/input';\nimport { DomSanitizer } from '@angular/platform-browser';\n\nimport { BadgeVariant, BadgeComponent } from '@testgorilla/tgo-ui/components/badge';\nimport { ButtonComponent } from '@testgorilla/tgo-ui/components/button';\nimport {\n  ApplicationTheme,\n  DigitsOnlyDirective,\n  UiTranslatePipe,\n  HasValidationErrorPipe,\n} from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\nimport { FieldType } from './field.model';\n\n/**\n * A global counter used to generate unique field IDs.\n * This variable is incremented each time a new field ID is needed.\n *\n * @remarks\n * This is primarily used to ensure that each field component\n * has a unique identifier within the application / useful for their Aria Labels.\n */\nlet fieldID = 0;\n\n@Component({\n  selector: 'ui-field',\n  templateUrl: './field.component.html',\n  styleUrls: ['./field.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    MatFormField,\n    NgStyle,\n    NgClass,\n    MatLabel,\n    IconComponentModule,\n    MatIcon,\n    MatPrefix,\n    MatInput,\n    DigitsOnlyDirective,\n    CdkTextareaAutosize,\n    ButtonComponent,\n    MatHint,\n    ValidationErrorModule,\n    BadgeComponent,\n    AsyncPipe,\n    UiTranslatePipe,\n    HasValidationErrorPipe,\n  ],\n})\nexport class FieldComponent implements OnInit, ControlValueAccessor, DoCheck, AfterViewInit {\n  @HostBinding() class = 'ui-field';\n\n  /**\n   * Indicator of the autocomplete width\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @HostBinding('class.full-width')\n  @Input()\n  fullWidth = true;\n\n  /**\n   * Indicator of the field height\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @HostBinding('class.full-height')\n  @Input()\n  fullHeight = false;\n\n  /**\n   * Form field label\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() label? = '';\n\n  /**\n   * Form field label from html\n   *\n   * @memberof FieldComponent\n   */\n  labelHtml = input<string | null>(null);\n\n  /**\n   * Icon to display alongside the label\n   *\n   * @type {IconName}\n   * @memberof FieldComponent\n   */\n  @Input() labelIcon?: IconName;\n\n  /**\n   * Input name attribute\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() fieldName?: string;\n\n  /**\n   * Input placeholder\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() placeholder? = '';\n\n  /**\n   * Input id\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  id = input(`field-${fieldID++}`);\n\n  /**\n   * Input value\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() value = '';\n\n  /**\n   * Variant of badge to use\n   *\n   * @type {BadgeVariant}\n   * @memberof FieldComponent\n   */\n  @Input() badgeVariant?: BadgeVariant | undefined;\n\n  _errors: string[];\n  /**\n   * Input field errors\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() set errors(errors: string[]) {\n    this._errors = errors?.filter(Boolean) ?? [];\n    this.errorsLength = this.setErrorsLength();\n  }\n\n  /**\n   * Determines if input is disabled\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() disabled: boolean;\n\n  /**\n   * Input is required or not\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() required: boolean;\n\n  /**\n   * Input is readonly or not\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() readOnly = false;\n\n  /**\n   * Hint text\n   *\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() hintMessage = '';\n\n  /**\n   * Input type\n   *\n   * @type {FieldType}\n   * @memberof FieldComponent\n   */\n  @HostBinding('attr.field-class')\n  @Input()\n  type: FieldType = 'text';\n\n  /**\n   * Input is update only on blur\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() updateOnBlur = false;\n\n  /**\n   * allow only digits in input\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() allowOnlyDigits = false;\n\n  /**\n   * allow autocomplete off in input\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isAutocompleteOff = false;\n\n  /**\n   * allow negative numbers\n   *\n   * @type {Boolean}\n   * @memberof FieldComponent\n   */\n  @Input() allowNegative = true;\n\n  /**\n   * Show reserved content below form field\n   * @property showBottomContent\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() showBottomContent = true;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof FieldComponent\n   */\n  @HostBinding('attr.theme')\n  @Input()\n  applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  @Input() ariaLabel: string;\n\n  readonly testId = input<string | null>(null);\n\n  protected readonly clearTestId = computed(() => (this.testId() ? `${this.testId()}-clear` : null));\n\n  protected readonly passwordToggleTestId = computed(() => (this.testId() ? `${this.testId()}-visibility` : null));\n\n  /**\n   * Show loading button. Only for text\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() loading = false;\n\n  /**\n   * Show icon when field is valid\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isValid = false;\n\n  /**\n   * Max characters number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() maxCharacters = 255;\n\n  /**\n   * Trim text on blur\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() trimOnBlur = false;\n  /**\n   * Trim text on submit\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() trimOnSubmit = false;\n  /**\n   * Max rows for multi-line type\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() maxRows = 0;\n  /**\n   * has text area counter\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() hasTextAreaCounter = true;\n\n  /**\n   * Hide in build errors for Reactive Forms\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() hideBuiltInErrors = false;\n\n  /**\n   * Hide label in errors\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() hideLabelInErrors = false;\n\n  /**\n   * Set maximum number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() max: number | undefined;\n\n  /**\n   * Set minimum number\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() min: number | undefined;\n\n  /**\n   * Sets textarea height. Default 110\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() textareaHeight = 110;\n\n  /**\n   * Sets textarea borderless. Default false\n   *\n   * @type {number}\n   * @memberof FieldComponent\n   */\n  @Input() borderless = false;\n\n  @Input() autosizableTextarea = false;\n\n  /**\n   * Indicates if this field is filled by AI\n   *\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() isAIVariant = false;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria Labeled By Element Id.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaLabelledbyId = computed(() => `${this.id()}-labeledBy`);\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria LabeledBy Text.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaLabelledby = input<string | undefined>(undefined);\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria Described By Element Id.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaDescribedbyId = computed(() => `${this.id()}-describedBy`);\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used for input field Aria DescribedBy Text.\n   * @type {string}\n   * @memberof FieldComponent\n   */\n  protected readonly ariaDescribedby = input<string | undefined>(undefined);\n\n  /**\n   * Show state of error\n   * @type {boolean}\n   * @memberof FieldComponent\n   */\n  @Input() hasError = false;\n\n  @Output() validateEvent = new EventEmitter<string>();\n  @Output() fieldBlur = new EventEmitter<void>();\n\n  @ViewChild('inputElement', { read: ElementRef }) field: ElementRef<HTMLInputElement>;\n  @ViewChild('autosize') autosize: CdkTextareaAutosize;\n\n  get getPasswordIcon(): IconName {\n    if (this.applicationTheme === 'classic') {\n      return this.showPassword ? 'Eye-hide' : 'Eye-view';\n    } else {\n      if (!this.isActiveField && !this.isActiveHover) {\n        return this.showPassword ? 'View-in-line' : 'Hide-in-line';\n      } else {\n        return this.showPassword ? 'View-filled' : 'Hide-filled';\n      }\n    }\n  }\n\n  isActiveField = false;\n  isActiveHover = false;\n\n  keyboardFocused = signal(false);\n\n  protected readonly translationContext = 'FIELD.';\n\n  /**\n   * @ignore\n   */\n  onChange: (value: string | number) => void = () => {};\n\n  /**\n   * @ignore\n   */\n  onTouch = () => {};\n\n  private readonly defaultAppTheme = inject(\n    'CANOPYUI_DEFAULT_APPLICATION_THEME' as unknown as ProviderToken<ApplicationTheme>,\n    {\n      optional: true,\n    }\n  );\n  private readonly matIconRegistry = inject(MatIconRegistry);\n  private readonly domSanitizer = inject(DomSanitizer);\n  private readonly cdr = inject(ChangeDetectorRef);\n  public ngControl = inject(NgControl, { optional: true, self: true });\n  private readonly focusMonitor = inject(FocusMonitor);\n  private readonly ngZone = inject(NgZone);\n  private readonly destroyRef = inject(DestroyRef);\n\n  constructor() {\n    if (this.defaultAppTheme) {\n      this.applicationTheme = this.defaultAppTheme;\n    }\n\n    if (this.ngControl !== null) {\n      this.ngControl.valueAccessor = this;\n    }\n  }\n\n  ngAfterViewInit(): void {\n    this.focusMonitor\n      .monitor(this.field)\n      .pipe(takeUntilDestroyed(this.destroyRef))\n      .subscribe(origin =>\n        this.ngZone.run(() => {\n          queueMicrotask(() => {\n            this.keyboardFocused.set(origin === 'keyboard');\n          });\n        })\n      );\n\n    if (this.type === 'multi-line') {\n      this.autosize.resizeToFitContent(true);\n    }\n  }\n\n  /**\n   * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors\n   * to display validation errors that might happen (e.g. required)\n   */\n  ngDoCheck(): void {\n    if (this.ngControl?.touched || this.ngControl?.errors) {\n      this.cdr.markForCheck();\n    }\n  }\n\n  showClose: boolean;\n  showPassword: boolean;\n  currentType: string;\n  errorsLength: boolean;\n\n  ngOnInit(): void {\n    this.setSearchInput();\n    this.currentType = this.getType();\n  }\n\n  validate(): void {\n    this.validateEvent.emit(this.value);\n  }\n\n  //set search input initial value\n  setSearchInput(): void {\n    if (this.type === 'search' || this.type === 'collapsed-search') {\n      // eslint-disable-next-line no-restricted-syntax -- SECURITY: hardcoded first-party asset URL; MatIconRegistry.addSvgIcon requires SafeResourceUrl.\n      this.matIconRegistry.addSvgIcon('Search', this.domSanitizer.bypassSecurityTrustResourceUrl('/icons/Search.svg'));\n      if (this.value) {\n        this.showClose = true;\n      } else {\n        this.showClose = false;\n      }\n    } else {\n      this.showClose = false;\n    }\n  }\n\n  //change type for reveal password\n  getType(): string {\n    if (this.type === 'password' && this.showPassword) {\n      return 'text';\n    }\n    return this.type;\n  }\n\n  //Clear input value\n  clearValue(): void {\n    this.value = '';\n    this.onChange(this.value);\n    this.onChangeInputSearch();\n  }\n\n  //toggle for password\n  showPasswordClick() {\n    this.showPassword = !this.showPassword;\n    this.currentType = this.getType();\n  }\n\n  //Set options for search input\n  onChangeInputSearch() {\n    if (this.type === 'search' || this.type === 'collapsed-search') {\n      if (!this.value) {\n        this.showClose = false;\n      }\n      if (this.value) {\n        this.showClose = true;\n      }\n    }\n  }\n\n  // Set errors length for validation\n  // Consider only those errors which which are not empty\n  setErrorsLength(): boolean {\n    if (this._errors) {\n      return this._errors.filter(err => Boolean(err)).length > 0 ? true : false;\n    }\n    return false;\n  }\n\n  //Save input value\n  onInput(event: Event) {\n    this.value = (event.target as HTMLInputElement | HTMLTextAreaElement).value;\n    this.errorsLength = this.setErrorsLength();\n    if (!this.updateOnBlur) {\n      this.onTouch();\n    }\n    if (this.allowOnlyDigits && !this.allowNegative && Number(this.value) < 0) {\n      this.value = '0';\n    } else {\n      this.onChange(this.type === 'number' && this.value !== '' ? Number(this.value) : this.value);\n    }\n  }\n\n  writeValue(value?: string | number): void {\n    if (value !== null && value !== undefined) {\n      // The internal <input> value is always a string; a numeric form value\n      // renders identically once assigned (the input coerces it anyway).\n      this.value = String(value);\n    } else {\n      this.value = '';\n    }\n    this.onChangeInputSearch();\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: (value: string | number) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  onActive(state: boolean, action: string): void {\n    if (action === 'hover') {\n      this.isActiveHover = state;\n    } else if (action === 'focus') {\n      this.isActiveField = state;\n\n      if (!state && this.trimOnBlur) {\n        this.clearSpace();\n      }\n    }\n  }\n\n  onSubmit(): void {\n    if (this.trimOnSubmit) {\n      this.clearSpace();\n    }\n  }\n\n  private clearSpace(): void {\n    this.value = this.value.trim();\n    this.onChange(this.value);\n  }\n\n  onBlur(): void {\n    this.fieldBlur.emit();\n  }\n\n  trackByFn = (index: number, value: string) => value;\n\n  focus(): void {\n    this.field.nativeElement.focus();\n  }\n\n  refocusPasswordButton(btn: ButtonComponent) {\n    setTimeout(() => {\n      btn.focus('keyboard');\n    }, 0);\n  }\n}\n","<ng-container>\n  <mat-form-field\n    [ngStyle]=\"{\n      '--textarea-height': textareaHeight - 10 + 'px',\n      '--textarea-height-container': textareaHeight + 'px',\n    }\"\n    #uiField\n    appearance=\"outline\"\n    hideRequiredMarker=\"true\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError ? 'warn' : 'accent'\"\n    [ngClass]=\"{\n      'hide-bottom-content': !showBottomContent,\n      textarea: type === 'textarea' || type === 'textarea-scrollable',\n      'textarea-scrollable': type === 'textarea-scrollable',\n      'multi-line': type === 'multi-line',\n      'multi-line-textarea': type === 'multi-line' && autosizableTextarea && borderless,\n      'keyboard-focused': keyboardFocused(),\n      'has-label': !!label,\n      'has-value': !!value,\n      'text-area-borderless': borderless && (type === 'textarea' || type === 'textarea-scrollable'),\n    }\"\n    (mouseenter)=\"onActive(true, 'hover')\"\n    (mouseleave)=\"onActive(false, 'hover')\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"ariaDescribedbyId()\">\n      @if (required) {\n        <span>{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n      }\n      {{ ariaDescribedby() }}\n    </span>\n    <span [style.display]=\"'none'\" [id]=\"ariaLabelledbyId()\">\n      {{ ariaLabelledby() ?? label }}\n    </span>\n    @if (\n      (label || labelHtml()) &&\n      ((type !== 'search' && applicationTheme === 'classic') || applicationTheme !== 'classic')\n    ) {\n      <mat-label class=\"label-with-icon\">\n        @if (isAIVariant || labelIcon) {\n          <ui-icon [name]=\"isAIVariant ? 'Sparkle-in-line' : labelIcon!\" [size]=\"'16'\" class=\"label-icon\"></ui-icon>\n        }\n        <span>\n          @if (labelHtml()) {\n            <span [innerHTML]=\"labelHtml()\"></span>\n          } @else {\n            {{ label }}\n          }\n          @if (required) {\n            <span>*</span>\n          }\n        </span>\n      </mat-label>\n    }\n    @if (type === 'search' || type === 'collapsed-search') {\n      <mat-icon matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n    }\n    @if (type !== 'textarea' && type !== 'textarea-scrollable' && type !== 'multi-line') {\n      <input\n        [attr.data-testid]=\"testId() ?? 'field-input'\"\n        [readonly]=\"readOnly\"\n        matInput\n        #inputElement\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled || loading\"\n        [type]=\"currentType\"\n        (keyup.enter)=\"onSubmit()\"\n        [max]=\"max\"\n        [min]=\"min\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        digitsOnly\n        [autocomplete]=\"isAutocompleteOff ? 'off' : 'on'\"\n        [allowOnlyDigits]=\"allowOnlyDigits\"\n        [allowNegative]=\"allowNegative\"\n        (focusin)=\"onActive(true, 'focus')\"\n      />\n    } @else {\n      <textarea\n        [attr.data-testid]=\"testId()\"\n        matInput\n        #inputElement\n        #autosize=\"cdkTextareaAutosize\"\n        [readonly]=\"readOnly\"\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        (keyup.enter)=\"onSubmit()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"!label ? ariaLabel : ''\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        [cdkTextareaAutosize]=\"type === 'multi-line'\"\n        [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n        [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5\"\n        [attr.maxlength]=\"maxCharacters\"\n        (focusin)=\"onActive(true, 'focus')\"\n      ></textarea>\n    }\n\n    @if (type === 'search' || type === 'collapsed-search' || type === 'password' || type === 'validation-text') {\n      <div class=\"options\">\n        <div class=\"options-container\">\n          @if (showClose) {\n            <ui-button\n              variant=\"secondary\"\n              [justIcon]=\"true\"\n              class=\"close\"\n              iconName=\"Close\"\n              [label]=\"('COMMON.CLEAR' | uiTranslate | async)!\"\n              (buttonClickEvent)=\"clearValue()\"\n              [ariaLabel]=\"ariaLabel + '--' + ('COMMON.CLEAR' | uiTranslate | async)\"\n              [testId]=\"clearTestId()\"\n            ></ui-button>\n          }\n          @if (type === 'password') {\n            <ui-button\n              class=\"password\"\n              variant=\"secondary\"\n              [tooltip]=\"((showPassword ? 'FIELD.HIDE_PASSWORD' : 'FIELD.SHOW_PASSWORD') | uiTranslate | async)!\"\n              [justIcon]=\"true\"\n              role=\"switch\"\n              [attr.aria-checked]=\"showPassword\"\n              [iconName]=\"getPasswordIcon\"\n              [applicationTheme]=\"applicationTheme\"\n              [testId]=\"passwordToggleTestId()\"\n              (click)=\"showPasswordClick()\"\n              #btn\n              (keydown.enter)=\"refocusPasswordButton(btn)\"\n              (keydown.space)=\"refocusPasswordButton(btn)\"\n            ></ui-button>\n          }\n          @if (\n            type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\n          ) {\n            @if (!isValid) {\n              <ui-button\n                class=\"validation\"\n                [variant]=\"'text'\"\n                [applicationTheme]=\"'light'\"\n                [label]=\"'Validate'\"\n                [loading]=\"loading\"\n                (click)=\"validate()\"\n                [disabled]=\"disabled\"\n                [size]=\"'small'\"\n              ></ui-button>\n            }\n            @if (isValid) {\n              <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\"></ui-icon>\n            }\n          }\n        </div>\n      </div>\n    }\n    @if (\n      hasTextAreaCounter &&\n      (type === 'textarea' || type === 'textarea-scrollable') &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError)\n    ) {\n      <mat-hint class=\"info\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n    }\n\n    @if (\n      hintMessage &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError) &&\n      type !== 'textarea' &&\n      type !== 'textarea-scrollable'\n    ) {\n      <mat-hint class=\"info\">{{ hintMessage }}</mat-hint>\n    }\n\n    @if (errorsLength || (ngControl?.errors | hasValidationError)) {\n      <mat-hint class=\"error\">\n        @if (errorsLength) {\n          @for (error of _errors; track trackByFn($index, error)) {\n            <div class=\"errors\">\n              <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n              <span [innerHTML]=\"error\"></span>\n            </div>\n          }\n        }\n        @if (ngControl && !hideBuiltInErrors) {\n          <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n        }\n      </mat-hint>\n    }\n\n    @if (badgeVariant) {\n      <ui-badge class=\"field-badge\" [variant]=\"badgeVariant\"></ui-badge>\n    }\n  </mat-form-field>\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { DigitsOnlyDirective, UiTranslatePipe, HasValidationErrorPipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\nimport { FieldComponent } from './field.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatFormFieldModule,\n    MatInputModule,\n    IconComponentModule,\n    FormsModule,\n    ReactiveFormsModule,\n    ButtonComponentModule,\n    MatIconModule,\n    UiTranslatePipe,\n    ValidationErrorModule,\n    HasValidationErrorPipe,\n    DigitsOnlyDirective,\n    BadgeComponentModule,\n    FieldComponent,\n  ],\n  exports: [FieldComponent],\n})\nexport class FieldComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-file-upload.mjs

@@ -61,6 +61,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
             }] } });
 
 class FileUploadComponent {
+    get successInputTestId() {
+        return this.testId ? `${this.testId}-success` : 'file-upload-success-input';
+    }
     get fileSizeInMB() {
         return this.file ? (this.file.size / (1024 * 1024)).toFixed(2) : null;
     }
@@ -81,6 +84,7 @@ class FileUploadComponent {
          * @memberof FileUploadComponent
          */
         this.disabled = false;
+        this.testId = null;
         /**
          * Existing file information
          *
@@ -239,13 +243,13 @@ class FileUploadComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FileUploadComponent, isStandalone: true, selector: "ui-file-upload", inputs: { maxFileSizeMB: "maxFileSizeMB", minFileSizeMB: "minFileSizeMB", supportedFileTypes: "supportedFileTypes", uploadProgress: "uploadProgress", showUploadProgress: "showUploadProgress", fileProcessingMessage: "fileProcessingMessage", errors: "errors", disabled: "disabled", file: "file", companyColor: "companyColor", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", showFileSize: "showFileSize" }, outputs: { OnDrop: "OnDrop" }, host: { properties: { "class": "this.class", "style.--color": "this.compColor" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FileUploadComponent, isStandalone: true, selector: "ui-file-upload", inputs: { maxFileSizeMB: "maxFileSizeMB", minFileSizeMB: "minFileSizeMB", supportedFileTypes: "supportedFileTypes", uploadProgress: "uploadProgress", showUploadProgress: "showUploadProgress", fileProcessingMessage: "fileProcessingMessage", errors: "errors", disabled: "disabled", testId: "testId", file: "file", companyColor: "companyColor", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", showFileSize: "showFileSize" }, outputs: { OnDrop: "OnDrop" }, host: { properties: { "class": "this.class", "style.--color": "this.compColor" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => FileUploadComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "fileDrop", first: true, predicate: ["fileDrop"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            data-testid=\"file-upload-input\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"'drag-and-drop'\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          data-testid=\"file-upload-success-input\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.upload-file-container{border-radius:8px;border:1px dashed #888888;background:#fff;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px;cursor:pointer}.upload-file-container:focus-visible{outline-offset:2px;outline:2px solid #242424;animation:focus-ring-animation .4s forwards}@keyframes focus-ring-animation{0%{outline-width:4px}to{outline-width:2px}}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-success,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-success ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-success ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-success input,.upload-file-container .upload-browse input{visibility:hidden;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-success .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:16px}.upload-file-container .upload-success .upload-success-text,.upload-file-container .upload-browse .upload-success-text{color:#3c9a13;display:flex;align-items:center;gap:8px}.upload-file-container .upload-success p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-success p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline;color:var(--color)}.upload-file-container .upload-success .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:16px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-success .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-success .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-success .errors .error-icon,.upload-file-container .upload-browse .errors .error-icon{margin-right:4px}.upload-file-container .upload-success .errors .error-icon svg,.upload-file-container .upload-browse .errors .error-icon svg{color:#cb7b7a}.upload-file-container .upload-success .errors .error-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors .error-icon mat-icon.size-16 svg{width:16px;height:16px}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-file-container[theme=dark],.upload-file-container[theme=light]{border-radius:10px;border-color:#242424}.upload-file-container[theme=dark].upload-file-container-disabled,.upload-file-container[theme=light].upload-file-container-disabled{border-color:#919191;color:#919191;background-color:#f4f4f4}.upload-file-container[theme=dark].upload-file-container-disabled .upload-icon svg,.upload-file-container[theme=light].upload-file-container-disabled .upload-icon svg{color:#919191}.upload-file-container[theme=dark].upload-errors,.upload-file-container[theme=light].upload-errors{border-color:#e02800}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):hover,.upload-file-container[theme=light]:not(.upload-file-container-disabled):hover{background:#f4f4f4;border-style:solid}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):active,.upload-file-container[theme=light]:not(.upload-file-container-disabled):active{background:#f4f4f4;transform:scale(.98)}.upload-file-container[theme=dark] .errors,.upload-file-container[theme=light] .errors{color:#e02800;font-size:14px}.upload-file-container[theme=dark] .errors .error-icon svg,.upload-file-container[theme=light] .errors .error-icon svg{color:#e02800}.upload-supported-files{left:0;position:absolute;top:100%;font-size:12px;line-height:16px;margin-top:8px;width:100%}.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:563px}.upload-supported-files span{font-weight:700;margin-right:5px}@media(max-width:600px){.upload-file-container,.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:100%}}.transparent{opacity:0}\n"], dependencies: [{ kind: "directive", type: DragDropDirective, selector: "[uiDragDrop]", outputs: ["fileDropped"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: ProgressBarComponent, selector: "ui-progress-bar", inputs: ["companyColor", "progress", "mode", "buffer", "applicationTheme", "ariaLabel", "ariaDescribedBy", "showPercentage"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], animations: [
+        ], viewQueries: [{ propertyName: "fileDrop", first: true, predicate: ["fileDrop"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            [attr.data-testid]=\"testId ?? 'file-upload-input'\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"drag-and-drop\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          [attr.data-testid]=\"successInputTestId\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.upload-file-container{border-radius:8px;border:1px dashed #888888;background:#fff;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px;cursor:pointer}.upload-file-container:focus-visible{outline-offset:2px;outline:2px solid #242424;animation:focus-ring-animation .4s forwards}@keyframes focus-ring-animation{0%{outline-width:4px}to{outline-width:2px}}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-success,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-success ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-success ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-success input,.upload-file-container .upload-browse input{visibility:hidden;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-success .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:16px}.upload-file-container .upload-success .upload-success-text,.upload-file-container .upload-browse .upload-success-text{color:#3c9a13;display:flex;align-items:center;gap:8px}.upload-file-container .upload-success p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-success p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline;color:var(--color)}.upload-file-container .upload-success .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:16px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-success .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-success .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-success .errors .error-icon,.upload-file-container .upload-browse .errors .error-icon{margin-right:4px}.upload-file-container .upload-success .errors .error-icon svg,.upload-file-container .upload-browse .errors .error-icon svg{color:#cb7b7a}.upload-file-container .upload-success .errors .error-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors .error-icon mat-icon.size-16 svg{width:16px;height:16px}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-file-container[theme=dark],.upload-file-container[theme=light]{border-radius:10px;border-color:#242424}.upload-file-container[theme=dark].upload-file-container-disabled,.upload-file-container[theme=light].upload-file-container-disabled{border-color:#919191;color:#919191;background-color:#f4f4f4}.upload-file-container[theme=dark].upload-file-container-disabled .upload-icon svg,.upload-file-container[theme=light].upload-file-container-disabled .upload-icon svg{color:#919191}.upload-file-container[theme=dark].upload-errors,.upload-file-container[theme=light].upload-errors{border-color:#e02800}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):hover,.upload-file-container[theme=light]:not(.upload-file-container-disabled):hover{background:#f4f4f4;border-style:solid}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):active,.upload-file-container[theme=light]:not(.upload-file-container-disabled):active{background:#f4f4f4;transform:scale(.98)}.upload-file-container[theme=dark] .errors,.upload-file-container[theme=light] .errors{color:#e02800;font-size:14px}.upload-file-container[theme=dark] .errors .error-icon svg,.upload-file-container[theme=light] .errors .error-icon svg{color:#e02800}.upload-supported-files{left:0;position:absolute;top:100%;font-size:12px;line-height:16px;margin-top:8px;width:100%}.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:563px}.upload-supported-files span{font-weight:700;margin-right:5px}@media(max-width:600px){.upload-file-container,.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:100%}}.transparent{opacity:0}\n"], dependencies: [{ kind: "directive", type: DragDropDirective, selector: "[uiDragDrop]", outputs: ["fileDropped"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: ProgressBarComponent, selector: "ui-progress-bar", inputs: ["companyColor", "progress", "mode", "buffer", "applicationTheme", "ariaLabel", "ariaDescribedBy", "showPercentage"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], animations: [
             trigger('inOutAnimation', [
                 transition(':enter', [
                     style({ opacity: 0, height: 0 }),
@@ -326,7 +330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                         AsyncPipe,
                         LowerCasePipe,
                         UiTranslatePipe,
-                    ], template: "<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            data-testid=\"file-upload-input\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"'drag-and-drop'\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          data-testid=\"file-upload-success-input\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.upload-file-container{border-radius:8px;border:1px dashed #888888;background:#fff;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px;cursor:pointer}.upload-file-container:focus-visible{outline-offset:2px;outline:2px solid #242424;animation:focus-ring-animation .4s forwards}@keyframes focus-ring-animation{0%{outline-width:4px}to{outline-width:2px}}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-success,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-success ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-success ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-success input,.upload-file-container .upload-browse input{visibility:hidden;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-success .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:16px}.upload-file-container .upload-success .upload-success-text,.upload-file-container .upload-browse .upload-success-text{color:#3c9a13;display:flex;align-items:center;gap:8px}.upload-file-container .upload-success p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-success p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline;color:var(--color)}.upload-file-container .upload-success .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:16px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-success .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-success .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-success .errors .error-icon,.upload-file-container .upload-browse .errors .error-icon{margin-right:4px}.upload-file-container .upload-success .errors .error-icon svg,.upload-file-container .upload-browse .errors .error-icon svg{color:#cb7b7a}.upload-file-container .upload-success .errors .error-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors .error-icon mat-icon.size-16 svg{width:16px;height:16px}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-file-container[theme=dark],.upload-file-container[theme=light]{border-radius:10px;border-color:#242424}.upload-file-container[theme=dark].upload-file-container-disabled,.upload-file-container[theme=light].upload-file-container-disabled{border-color:#919191;color:#919191;background-color:#f4f4f4}.upload-file-container[theme=dark].upload-file-container-disabled .upload-icon svg,.upload-file-container[theme=light].upload-file-container-disabled .upload-icon svg{color:#919191}.upload-file-container[theme=dark].upload-errors,.upload-file-container[theme=light].upload-errors{border-color:#e02800}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):hover,.upload-file-container[theme=light]:not(.upload-file-container-disabled):hover{background:#f4f4f4;border-style:solid}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):active,.upload-file-container[theme=light]:not(.upload-file-container-disabled):active{background:#f4f4f4;transform:scale(.98)}.upload-file-container[theme=dark] .errors,.upload-file-container[theme=light] .errors{color:#e02800;font-size:14px}.upload-file-container[theme=dark] .errors .error-icon svg,.upload-file-container[theme=light] .errors .error-icon svg{color:#e02800}.upload-supported-files{left:0;position:absolute;top:100%;font-size:12px;line-height:16px;margin-top:8px;width:100%}.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:563px}.upload-supported-files span{font-weight:700;margin-right:5px}@media(max-width:600px){.upload-file-container,.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:100%}}.transparent{opacity:0}\n"] }]
+                    ], template: "<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            [attr.data-testid]=\"testId ?? 'file-upload-input'\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"drag-and-drop\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          [attr.data-testid]=\"successInputTestId\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.upload-file-container{border-radius:8px;border:1px dashed #888888;background:#fff;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px;cursor:pointer}.upload-file-container:focus-visible{outline-offset:2px;outline:2px solid #242424;animation:focus-ring-animation .4s forwards}@keyframes focus-ring-animation{0%{outline-width:4px}to{outline-width:2px}}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-success,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-success ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-success ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-success input,.upload-file-container .upload-browse input{visibility:hidden;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-success .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:16px}.upload-file-container .upload-success .upload-success-text,.upload-file-container .upload-browse .upload-success-text{color:#3c9a13;display:flex;align-items:center;gap:8px}.upload-file-container .upload-success p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-success p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline;color:var(--color)}.upload-file-container .upload-success .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:16px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-success .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-success .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-success .errors .error-icon,.upload-file-container .upload-browse .errors .error-icon{margin-right:4px}.upload-file-container .upload-success .errors .error-icon svg,.upload-file-container .upload-browse .errors .error-icon svg{color:#cb7b7a}.upload-file-container .upload-success .errors .error-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors .error-icon mat-icon.size-16 svg{width:16px;height:16px}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-file-container[theme=dark],.upload-file-container[theme=light]{border-radius:10px;border-color:#242424}.upload-file-container[theme=dark].upload-file-container-disabled,.upload-file-container[theme=light].upload-file-container-disabled{border-color:#919191;color:#919191;background-color:#f4f4f4}.upload-file-container[theme=dark].upload-file-container-disabled .upload-icon svg,.upload-file-container[theme=light].upload-file-container-disabled .upload-icon svg{color:#919191}.upload-file-container[theme=dark].upload-errors,.upload-file-container[theme=light].upload-errors{border-color:#e02800}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):hover,.upload-file-container[theme=light]:not(.upload-file-container-disabled):hover{background:#f4f4f4;border-style:solid}.upload-file-container[theme=dark]:not(.upload-file-container-disabled):active,.upload-file-container[theme=light]:not(.upload-file-container-disabled):active{background:#f4f4f4;transform:scale(.98)}.upload-file-container[theme=dark] .errors,.upload-file-container[theme=light] .errors{color:#e02800;font-size:14px}.upload-file-container[theme=dark] .errors .error-icon svg,.upload-file-container[theme=light] .errors .error-icon svg{color:#e02800}.upload-supported-files{left:0;position:absolute;top:100%;font-size:12px;line-height:16px;margin-top:8px;width:100%}.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:563px}.upload-supported-files span{font-weight:700;margin-right:5px}@media(max-width:600px){.upload-file-container,.upload-supported-files[theme=dark],.upload-supported-files[theme=light]{max-width:100%}}.transparent{opacity:0}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -350,6 +354,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                 type: Input
             }], disabled: [{
                 type: Input
+            }], testId: [{
+                type: Input
             }], file: [{
                 type: Input
             }], companyColor: [{

package/fesm2022/testgorilla-tgo-ui-components-file-upload.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testgorilla-tgo-ui-components-file-upload.mjs","sources":["../../../components/file-upload/drag-drop.directive.ts","../../../components/file-upload/file-upload.component.ts","../../../components/file-upload/file-upload.component.html","../../../components/file-upload/file-upload.component.module.ts","../../../components/file-upload/testgorilla-tgo-ui-components-file-upload.ts"],"sourcesContent":["import { Directive, EventEmitter, HostBinding, HostListener, Output } from '@angular/core';\n\n@Directive({ selector: '[uiDragDrop]' })\nexport class DragDropDirective {\n  constructor() {}\n\n  @HostBinding('class.file-over') file: boolean;\n  @Output() fileDropped = new EventEmitter<FileList>();\n\n  // Dragover listener\n  @HostListener('dragover', ['$event']) onDragOver(event: Event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = true;\n  }\n\n  // Dragleave listener\n  @HostListener('dragleave', ['$event']) public onDragLeave(event: Event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = false;\n  }\n\n  // Drop listener\n  @HostListener('drop', ['$event']) public ondrop(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = false;\n    let files: FileList;\n    if (event.dataTransfer) {\n      files = event.dataTransfer.files;\n      if (files.length > 0) {\n        this.fileDropped.emit(files);\n      }\n    }\n  }\n}\n","import { animate, style, transition, trigger } from '@angular/animations';\nimport { NgClass, NgTemplateOutlet, AsyncPipe, LowerCasePipe } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  forwardRef,\n  HostBinding,\n  Inject,\n  inject,\n  Input,\n  OnChanges,\n  OnInit,\n  Optional,\n  Output,\n  SimpleChanges,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport { ApplicationTheme, Color, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponent } from '@testgorilla/tgo-ui/components/progress-bar';\n\nimport { DragDropDirective } from './drag-drop.directive';\n\n@Component({\n  selector: 'ui-file-upload',\n  templateUrl: './file-upload.component.html',\n  styleUrls: ['./file-upload.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => FileUploadComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  /* eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass */\n  animations: [\n    trigger('inOutAnimation', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n    trigger('inOutAnimationProgress', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n    trigger('inOutAnimationChange', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n  ],\n  imports: [\n    DragDropDirective,\n    NgClass,\n    NgTemplateOutlet,\n    IconComponent,\n    ProgressBarComponent,\n    AsyncPipe,\n    LowerCasePipe,\n    UiTranslatePipe,\n  ],\n})\nexport class FileUploadComponent implements OnInit, OnChanges, ControlValueAccessor {\n  @HostBinding() class = 'ui-file-upload';\n\n  /**\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() maxFileSizeMB: number;\n\n  /**\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() minFileSizeMB: number;\n\n  /**\n   * Supported files for input field\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() supportedFileTypes?: string;\n\n  /**\n   * Upload progress\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() uploadProgress: number;\n\n  /**\n   * Show Upload progress percentage or not\n   *\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() showUploadProgress = true;\n\n  /**\n   * Custom progress message\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() fileProcessingMessage: string | undefined;\n\n  /**\n   * File upload errors\n   *\n   * @type {string[]}\n   * @memberof FileUploadComponent\n   */\n  @Input() errors?: string[] | null;\n\n  /**\n   * File upload disabled\n   *\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() disabled = false;\n\n  /**\n   * Existing file information\n   *\n   * @type {(File | null)}\n   * @memberof FileUploadComponent\n   */\n  @Input() file: File | null = null;\n\n  /**\n   * Color of the file upload.\n   * Defaults to Test Gorilla primary color.\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() companyColor: string | null = '';\n\n  @HostBinding('style.--color')\n  compColor: string;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof FileUploadComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() ariaLabel: string;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * Whether to show the file size information.\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() showFileSize = true;\n\n  @Output() OnDrop: EventEmitter<File> = new EventEmitter<File>();\n\n  @ViewChild('fileDrop') fileDrop: ElementRef<HTMLInputElement>;\n\n  protected readonly translationContext = 'FILE_UPLOAD.';\n\n  /**\n   * @ignore\n   */\n  onChange = (_value: File | null) => {};\n\n  /**\n   * @ignore\n   */\n  onTouch = () => {};\n\n  get fileSizeInMB(): string | null {\n    return this.file ? (this.file.size / (1024 * 1024)).toFixed(2) : null;\n  }\n\n  isMissedMinSize = false;\n  progress = false;\n  success = false;\n  browse: boolean;\n  isCanceled = false;\n  colorUploadSuccess = Color.SUCCESS_50;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = defaultAppTheme;\n    }\n  }\n\n  ngOnInit(): void {\n    this.browse = true;\n  }\n\n  //When file is dropped\n  onFileDropped(files: FileList) {\n    this.emitFile(files);\n  }\n\n  //When input changes\n  onChangeUpload(event: Event) {\n    this.isCanceled = false;\n    const element = event.currentTarget as HTMLInputElement;\n    // Prevents clearing items when user selects cancel in the dialog. Cancel event can emit empty file list.\n    if (element.files?.length) {\n      this.emitFile(element.files || new FileList());\n    }\n  }\n\n  //Emit drop file\n  emitFile(files: FileList) {\n    const [file] = Array.from(files);\n    this.file = file;\n    this.errors = null;\n    this.onTouch();\n    this.isMissedMinSize =\n      !file?.size && !this.minFileSizeMB ? true : this.fileSizeToMB(file?.size ?? 0) <= this.minFileSizeMB;\n    if (!this.isMissedMinSize) {\n      this.onChange(this.file);\n      this.OnDrop.emit(file);\n    }\n  }\n\n  //Show progress-bar\n  showProgress(): boolean {\n    this.browse = false;\n    return Boolean(this.file && !this.errors && !this.isMissedMinSize);\n  }\n\n  //Show success elements\n  showSuccess(): boolean {\n    return Boolean(this.file && this.uploadProgress === 100 && !this.errors && !this.isMissedMinSize);\n  }\n\n  //Show browse when there are error\n  showBrowse(): boolean {\n    return Boolean(this.errors) || this.isMissedMinSize;\n  }\n\n  ngOnChanges(changes: SimpleChanges) {\n    if (!this.isCanceled) {\n      if (changes['uploadProgress'] || changes['file']) {\n        this.progress = this.showProgress();\n        this.success = this.showSuccess();\n        this.browse = this.showBrowse();\n      }\n      if (changes['errors']) {\n        this.progress = this.showProgress();\n        this.success = this.showSuccess();\n        this.browse = this.showBrowse();\n      }\n      if (changes['applicationTheme']) {\n        this.compColor = this.getCompanyColor();\n      }\n    }\n  }\n\n  private readonly cdr = inject(ChangeDetectorRef);\n\n  writeValue(value?: File): void {\n    if (value) {\n      this.file = value || null;\n    } else {\n      this.file = null;\n    }\n    // The forms API calls this from outside the component's own change\n    // detection — under OnPush the view must be marked explicitly.\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: (value: File | null) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  private getCompanyColor(): string {\n    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor falls back to the theme colour\n    return this.companyColor || (this.applicationTheme === 'classic' ? '#46A997' : '#D410AA');\n  }\n\n  private fileSizeToMB(fileSize: number): number {\n    return fileSize / 1024 / 1024;\n  }\n\n  onKeydown(ev: KeyboardEvent) {\n    if (ev.key === 'Enter' || ev.key === ' ') {\n      this.fileDrop?.nativeElement?.click();\n    } else if (ev.key === 'Escape') {\n      this.file = null;\n      this.success = false;\n      this.progress = false;\n      this.errors = null;\n      this.isMissedMinSize = false;\n      this.browse = true;\n      this.isCanceled = true;\n    }\n  }\n}\n","<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            data-testid=\"file-upload-input\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"'drag-and-drop'\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          data-testid=\"file-upload-success-input\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponentModule } from '@testgorilla/tgo-ui/components/progress-bar';\n\nimport { DragDropDirective } from './drag-drop.directive';\nimport { FileUploadComponent } from './file-upload.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatFormFieldModule,\n    MatInputModule,\n    IconComponentModule,\n    ProgressBarComponentModule,\n    UiTranslatePipe,\n    FileUploadComponent,\n    DragDropDirective,\n  ],\n  exports: [FileUploadComponent],\n})\nexport class FileUploadComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testgorilla-tgo-ui-components-file-upload.mjs","sources":["../../../components/file-upload/drag-drop.directive.ts","../../../components/file-upload/file-upload.component.ts","../../../components/file-upload/file-upload.component.html","../../../components/file-upload/file-upload.component.module.ts","../../../components/file-upload/testgorilla-tgo-ui-components-file-upload.ts"],"sourcesContent":["import { Directive, EventEmitter, HostBinding, HostListener, Output } from '@angular/core';\n\n@Directive({ selector: '[uiDragDrop]' })\nexport class DragDropDirective {\n  constructor() {}\n\n  @HostBinding('class.file-over') file: boolean;\n  @Output() fileDropped = new EventEmitter<FileList>();\n\n  // Dragover listener\n  @HostListener('dragover', ['$event']) onDragOver(event: Event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = true;\n  }\n\n  // Dragleave listener\n  @HostListener('dragleave', ['$event']) public onDragLeave(event: Event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = false;\n  }\n\n  // Drop listener\n  @HostListener('drop', ['$event']) public ondrop(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.file = false;\n    let files: FileList;\n    if (event.dataTransfer) {\n      files = event.dataTransfer.files;\n      if (files.length > 0) {\n        this.fileDropped.emit(files);\n      }\n    }\n  }\n}\n","import { animate, style, transition, trigger } from '@angular/animations';\nimport { NgClass, NgTemplateOutlet, AsyncPipe, LowerCasePipe } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  forwardRef,\n  HostBinding,\n  Inject,\n  inject,\n  Input,\n  OnChanges,\n  OnInit,\n  Optional,\n  Output,\n  SimpleChanges,\n  ViewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport { ApplicationTheme, Color, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponent } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponent } from '@testgorilla/tgo-ui/components/progress-bar';\n\nimport { DragDropDirective } from './drag-drop.directive';\n\n@Component({\n  selector: 'ui-file-upload',\n  templateUrl: './file-upload.component.html',\n  styleUrls: ['./file-upload.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => FileUploadComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  /* eslint-disable @typescript-eslint/no-deprecated -- the @angular/animations trigger/state/style/animate/transition DSL is deprecated in 20.2 in favor of template-level animate.enter/animate.leave; migrating every Material/component animation is out of scope for this lint pass */\n  animations: [\n    trigger('inOutAnimation', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n    trigger('inOutAnimationProgress', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n    trigger('inOutAnimationChange', [\n      transition(':enter', [\n        style({ opacity: 0, height: 0 }),\n        animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),\n      ]),\n      transition(':leave', [\n        style({ opacity: 1, height: '196px' }),\n        animate('0.2s ease-in', style({ opacity: 0, height: 0 })),\n      ]),\n    ]),\n  ],\n  imports: [\n    DragDropDirective,\n    NgClass,\n    NgTemplateOutlet,\n    IconComponent,\n    ProgressBarComponent,\n    AsyncPipe,\n    LowerCasePipe,\n    UiTranslatePipe,\n  ],\n})\nexport class FileUploadComponent implements OnInit, OnChanges, ControlValueAccessor {\n  @HostBinding() class = 'ui-file-upload';\n\n  /**\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() maxFileSizeMB: number;\n\n  /**\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() minFileSizeMB: number;\n\n  /**\n   * Supported files for input field\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() supportedFileTypes?: string;\n\n  /**\n   * Upload progress\n   *\n   * @type {number}\n   * @memberof FileUploadComponent\n   */\n  @Input() uploadProgress: number;\n\n  /**\n   * Show Upload progress percentage or not\n   *\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() showUploadProgress = true;\n\n  /**\n   * Custom progress message\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() fileProcessingMessage: string | undefined;\n\n  /**\n   * File upload errors\n   *\n   * @type {string[]}\n   * @memberof FileUploadComponent\n   */\n  @Input() errors?: string[] | null;\n\n  /**\n   * File upload disabled\n   *\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() disabled = false;\n\n  @Input() testId: string | null = null;\n\n  get successInputTestId(): string {\n    return this.testId ? `${this.testId}-success` : 'file-upload-success-input';\n  }\n\n  /**\n   * Existing file information\n   *\n   * @type {(File | null)}\n   * @memberof FileUploadComponent\n   */\n  @Input() file: File | null = null;\n\n  /**\n   * Color of the file upload.\n   * Defaults to Test Gorilla primary color.\n   *\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() companyColor: string | null = '';\n\n  @HostBinding('style.--color')\n  compColor: string;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof FileUploadComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof FileUploadComponent\n   */\n  @Input() ariaLabel: string;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * Whether to show the file size information.\n   * @type {boolean}\n   * @memberof FileUploadComponent\n   */\n  @Input() showFileSize = true;\n\n  @Output() OnDrop: EventEmitter<File> = new EventEmitter<File>();\n\n  @ViewChild('fileDrop') fileDrop: ElementRef<HTMLInputElement>;\n\n  protected readonly translationContext = 'FILE_UPLOAD.';\n\n  /**\n   * @ignore\n   */\n  onChange = (_value: File | null) => {};\n\n  /**\n   * @ignore\n   */\n  onTouch = () => {};\n\n  get fileSizeInMB(): string | null {\n    return this.file ? (this.file.size / (1024 * 1024)).toFixed(2) : null;\n  }\n\n  isMissedMinSize = false;\n  progress = false;\n  success = false;\n  browse: boolean;\n  isCanceled = false;\n  colorUploadSuccess = Color.SUCCESS_50;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = defaultAppTheme;\n    }\n  }\n\n  ngOnInit(): void {\n    this.browse = true;\n  }\n\n  //When file is dropped\n  onFileDropped(files: FileList) {\n    this.emitFile(files);\n  }\n\n  //When input changes\n  onChangeUpload(event: Event) {\n    this.isCanceled = false;\n    const element = event.currentTarget as HTMLInputElement;\n    // Prevents clearing items when user selects cancel in the dialog. Cancel event can emit empty file list.\n    if (element.files?.length) {\n      this.emitFile(element.files || new FileList());\n    }\n  }\n\n  //Emit drop file\n  emitFile(files: FileList) {\n    const [file] = Array.from(files);\n    this.file = file;\n    this.errors = null;\n    this.onTouch();\n    this.isMissedMinSize =\n      !file?.size && !this.minFileSizeMB ? true : this.fileSizeToMB(file?.size ?? 0) <= this.minFileSizeMB;\n    if (!this.isMissedMinSize) {\n      this.onChange(this.file);\n      this.OnDrop.emit(file);\n    }\n  }\n\n  //Show progress-bar\n  showProgress(): boolean {\n    this.browse = false;\n    return Boolean(this.file && !this.errors && !this.isMissedMinSize);\n  }\n\n  //Show success elements\n  showSuccess(): boolean {\n    return Boolean(this.file && this.uploadProgress === 100 && !this.errors && !this.isMissedMinSize);\n  }\n\n  //Show browse when there are error\n  showBrowse(): boolean {\n    return Boolean(this.errors) || this.isMissedMinSize;\n  }\n\n  ngOnChanges(changes: SimpleChanges) {\n    if (!this.isCanceled) {\n      if (changes['uploadProgress'] || changes['file']) {\n        this.progress = this.showProgress();\n        this.success = this.showSuccess();\n        this.browse = this.showBrowse();\n      }\n      if (changes['errors']) {\n        this.progress = this.showProgress();\n        this.success = this.showSuccess();\n        this.browse = this.showBrowse();\n      }\n      if (changes['applicationTheme']) {\n        this.compColor = this.getCompanyColor();\n      }\n    }\n  }\n\n  private readonly cdr = inject(ChangeDetectorRef);\n\n  writeValue(value?: File): void {\n    if (value) {\n      this.file = value || null;\n    } else {\n      this.file = null;\n    }\n    // The forms API calls this from outside the component's own change\n    // detection — under OnPush the view must be marked explicitly.\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: (value: File | null) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouch = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  private getCompanyColor(): string {\n    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor falls back to the theme colour\n    return this.companyColor || (this.applicationTheme === 'classic' ? '#46A997' : '#D410AA');\n  }\n\n  private fileSizeToMB(fileSize: number): number {\n    return fileSize / 1024 / 1024;\n  }\n\n  onKeydown(ev: KeyboardEvent) {\n    if (ev.key === 'Enter' || ev.key === ' ') {\n      this.fileDrop?.nativeElement?.click();\n    } else if (ev.key === 'Escape') {\n      this.file = null;\n      this.success = false;\n      this.progress = false;\n      this.errors = null;\n      this.isMissedMinSize = false;\n      this.browse = true;\n      this.isCanceled = true;\n    }\n  }\n}\n","<ng-container>\n  <div\n    class=\"upload-file-container\"\n    uiDragDrop\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    [attr.theme]=\"applicationTheme\"\n    [ngClass]=\"{ 'upload-errors': !!errors || isMissedMinSize, 'upload-file-container-disabled': disabled }\"\n    (fileDropped)=\"onFileDropped($event)\"\n    tabindex=\"0\"\n    [tabIndex]=\"0\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"fileDrop?.nativeElement?.click()\"\n  >\n    @if (browse && !(success && !!file && progress)) {\n      <div [@inOutAnimation] class=\"upload-files\">\n        <div class=\"upload-browse\">\n          <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n          @if (!!errors || isMissedMinSize) {\n            <div class=\"errors\" role=\"alert\">\n              @if (!!errors) {\n                @for (error of errors; track error) {\n                  <span><ui-icon name=\"Error\" class=\"error-icon\"></ui-icon> {{ error }}</span>\n                }\n              }\n              @if (isMissedMinSize) {\n                <span>\n                  <ui-icon name=\"Error\" class=\"error-icon\"></ui-icon>\n                  {{ translationContext + 'MIN_SIZE_ERROR' | uiTranslate: { min: minFileSizeMB } | async }}\n                </span>\n              }\n            </div>\n          }\n          <input\n            [attr.data-testid]=\"testId ?? 'file-upload-input'\"\n            [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n            [attr.aria-describedby]=\"'upload-supported-files'\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDrop\n            type=\"file\"\n            id=\"file\"\n            [accept]=\"supportedFileTypes\"\n            [disabled]=\"disabled\"\n            (change)=\"onChangeUpload($event)\"\n          />\n          @if (applicationTheme === 'classic') {\n            <p>\n              {{ translationContext + 'DRAG_AND_DROP_OR' | uiTranslate | async }}\n              <span class=\"semibold\"> {{ translationContext + 'BROWSE' | uiTranslate | async | lowercase }}</span>\n              {{ translationContext + 'YOUR_FILES' | uiTranslate | async }}\n            </p>\n          } @else {\n            <p id=\"drag-and-drop\">{{ translationContext + 'DRAG_AND_DROP' | uiTranslate | async }}</p>\n          }\n          <span class=\"upload-text\"\n            >{{ maxFileSizeMB }}{{ translationContext + 'MAX_SIZE' | uiTranslate | async }}</span\n          >\n          @if (minFileSizeMB) {\n            <span class=\"upload-text\"\n              >{{ minFileSizeMB }}{{ translationContext + 'MIN_SIZE' | uiTranslate | async }}</span\n            >\n          }\n        </div>\n      </div>\n    }\n    @if (success) {\n      <div class=\"upload-success\">\n        <ng-container [ngTemplateOutlet]=\"iconTpl\"></ng-container>\n        <span class=\"upload-success-text\"\n          ><ui-icon name=\"Check-round-in-line\" [color]=\"colorUploadSuccess\"></ui-icon\n          >{{ translationContext + 'FILE_UPLOADING_SUCCESS' | uiTranslate | async }}</span\n        >\n        <input\n          [attr.data-testid]=\"successInputTestId\"\n          [tabIndex]=\"-1\"\n          [attr.aria-labelledby]=\"success || progress ? '' : 'drag-and-drop'\"\n          [attr.aria-describedby]=\"success || progress ? '' : 'supported-file-types'\"\n          class=\"form-control\"\n          #fileDrop\n          type=\"file\"\n          id=\"fileTest\"\n          [accept]=\"supportedFileTypes\"\n          (change)=\"onChangeUpload($event)\"\n          [disabled]=\"disabled\"\n        />\n        <span class=\"upload-text\">{{ file?.name }}</span>\n        @if (showFileSize) {\n          <span class=\"upload-text\">{{\n            translationContext + 'FILE_SIZE' | uiTranslate: { fileSize: fileSizeInMB } | async\n          }}</span>\n        }\n      </div>\n    }\n    @if (!!progress && !!file && !success) {\n      <div class=\"upload-progress\" [@inOutAnimationProgress]>\n        <p>{{ file.name }}</p>\n        <ui-progress-bar\n          [progress]=\"uploadProgress\"\n          [companyColor]=\"compColor\"\n          [applicationTheme]=\"applicationTheme\"\n        ></ui-progress-bar>\n        <p class=\"upload-text\">\n          {{ fileProcessingMessage ?? (translationContext + 'UPLOADING' | uiTranslate | async) }}\n          @if (showUploadProgress) {\n            <span>{{ uploadProgress }}</span\n            >%\n          }\n        </p>\n      </div>\n    }\n\n    <ng-template #iconTpl>\n      @if (applicationTheme === 'classic') {\n        <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      } @else {\n        <ui-icon class=\"upload-icon\" name=\"Upload\" [size]=\"'24'\" [applicationTheme]=\"applicationTheme\"></ui-icon>\n      }\n    </ng-template>\n\n    @if (!!supportedFileTypes) {\n      <div [attr.theme]=\"applicationTheme\" class=\"upload-supported-files\" id=\"upload-supported-files\">\n        <span>{{ translationContext + 'SUPPORTED_FILE_TYPES' | uiTranslate | async }}</span\n        >{{ supportedFileTypes }}\n      </div>\n    }\n  </div>\n</ng-container>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponentModule } from '@testgorilla/tgo-ui/components/progress-bar';\n\nimport { DragDropDirective } from './drag-drop.directive';\nimport { FileUploadComponent } from './file-upload.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatFormFieldModule,\n    MatInputModule,\n    IconComponentModule,\n    ProgressBarComponentModule,\n    UiTranslatePipe,\n    FileUploadComponent,\n    DragDropDirective,\n  ],\n  exports: [FileUploadComponent],\n})\nexport class FileUploadComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}