@ascentgl/ads-ui 21.114.1 → 21.114.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2813,6 +2813,8 @@ class AbstractBaseComponent {
2813
2813
  return false;
2814
2814
  if (this.skipValidationWhenEmpty && this.isEmptyValue(this.valueControl.value))
2815
2815
  return false;
2816
+ if (this.hasOnlyStaleRequiredError(this.valueControl))
2817
+ return false;
2816
2818
  return !!this.valueControl.errors && (this.valueControl.touched || this.immediateValidation);
2817
2819
  }
2818
2820
  /** @ignore */
@@ -2821,24 +2823,38 @@ class AbstractBaseComponent {
2821
2823
  }
2822
2824
  /**
2823
2825
  * @ignore
2824
- * Robustly checks whether a control has a required validator.
2825
- * Angular's `hasValidator(Validators.required)` uses reference equality, which fails
2826
- * when validators are provided as an array (e.g., `[Validators.required]`) because
2827
- * Angular composes them into a wrapper function with a different reference.
2828
- * This method also checks by running the validator against an empty value.
2826
+ * Detects stale 'required' errors produced by Angular's RequiredValidator directive
2827
+ * that is still enabled in the current change detection cycle but will be disabled
2828
+ * once the `[required]` binding is re-evaluated on the child `<input>` element.
2829
+ *
2830
+ * This happens because `[ngClass]` on `mat-form-field` (parent) is evaluated BEFORE
2831
+ * `[required]` on `<input>` (child), so `canShowError()` sees errors from the
2832
+ * still-enabled directive even though `Validators.required` was already removed
2833
+ * programmatically via `removeValidators`.
2829
2834
  */
2830
- hasRequiredValidatorCheck(control) {
2831
- // Fast path: direct reference check
2832
- if (control.hasValidator(Validators.required)) {
2833
- return true;
2834
- }
2835
- // Fallback: run the current validator against an empty value to detect 'required' error
2836
- const validator = control.validator;
2837
- if (!validator) {
2835
+ hasOnlyStaleRequiredError(control) {
2836
+ const errors = control.errors;
2837
+ if (!errors || !('required' in errors))
2838
2838
  return false;
2839
- }
2840
- const result = validator(new FormControl(null));
2841
- return result !== null && 'required' in result;
2839
+ return Object.keys(errors).length === 1 && !control.hasValidator(Validators.required);
2840
+ }
2841
+ /**
2842
+ * @ignore
2843
+ * Checks whether a control has a required validator.
2844
+ *
2845
+ * Uses Angular's `hasValidator(Validators.required)` which checks `_rawValidators`
2846
+ * by reference. In Angular 21 this handles all standard usage patterns:
2847
+ * - `new FormControl(null, Validators.required)`
2848
+ * - `new FormControl(null, [Validators.required, ...])`
2849
+ * - `control.addValidators(Validators.required)`
2850
+ *
2851
+ * NOTE: We intentionally do NOT fall back to running the composed validator against
2852
+ * an empty value. That approach creates a circular dependency with Angular's
2853
+ * `RequiredValidator` directive (which is auto-instantiated by `[required][formControl]`
2854
+ * in the template and merged into the control's validators by `setUpValidators`).
2855
+ */
2856
+ hasRequiredValidatorCheck(control) {
2857
+ return control.hasValidator(Validators.required);
2842
2858
  }
2843
2859
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AbstractBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2844
2860
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: AbstractBaseComponent, isStandalone: true, inputs: { skipValidationWhenEmpty: "skipValidationWhenEmpty", showValidationError: "showValidationError", control: "control", immediateValidation: "immediateValidation", errorMessages: "errorMessages", hint: "hint", successMessage: "successMessage", id: "id", label: "label", showFooter: "showFooter", width: "width", shrink: "shrink" }, usesOnChanges: true, ngImport: i0 }); }
@@ -3466,11 +3482,11 @@ class AdsDropdownComponent extends AbstractDropdownComponent {
3466
3482
  return option && typeof option === 'object' && 'disableDropdownOption' in option && option.disableDropdownOption === true;
3467
3483
  }
3468
3484
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3469
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDropdownComponent, isStandalone: false, selector: "ads-dropdown", inputs: { displayValueFormatter: "displayValueFormatter", mode: "mode", hasEmptyValue: "hasEmptyValue", checkSelected: "checkSelected", options: "options", optionTemplate: "optionTemplate", triggerTemplate: "triggerTemplate", panelClass: "panelClass", closeOnOutOfView: "closeOnOutOfView", outOfViewRootMargin: "outOfViewRootMargin" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option)\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsTagComponent, selector: "ads-tag", inputs: ["color", "borderColor", "borderWidth", "width", "id", "removable", "clickable", "tag"], outputs: ["remove", "selected"] }, { kind: "component", type: AdsCheckboxComponent, selector: "ads-checkbox", inputs: ["indeterminate", "width", "tooltip", "tooltipHref", "size"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
3485
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDropdownComponent, isStandalone: false, selector: "ads-dropdown", inputs: { displayValueFormatter: "displayValueFormatter", mode: "mode", hasEmptyValue: "hasEmptyValue", checkSelected: "checkSelected", options: "options", optionTemplate: "optionTemplate", triggerTemplate: "triggerTemplate", panelClass: "panelClass", closeOnOutOfView: "closeOnOutOfView", outOfViewRootMargin: "outOfViewRootMargin" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option)\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsTagComponent, selector: "ads-tag", inputs: ["color", "borderColor", "borderWidth", "width", "id", "removable", "clickable", "tag"], outputs: ["remove", "selected"] }, { kind: "component", type: AdsCheckboxComponent, selector: "ads-checkbox", inputs: ["indeterminate", "width", "tooltip", "tooltipHref", "size"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
3470
3486
  }
3471
3487
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDropdownComponent, decorators: [{
3472
3488
  type: Component,
3473
- args: [{ selector: 'ads-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option)\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3489
+ args: [{ selector: 'ads-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option)\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"displayValueFormatter ? displayValueFormatter(option) : displayedOptions.get(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3474
3490
  }], ctorParameters: () => [], propDecorators: { displayValueFormatter: [{
3475
3491
  type: Input
3476
3492
  }], mode: [{
@@ -3693,11 +3709,11 @@ class AdsMultiSelectDropdownComponent extends AdsDropdownComponent {
3693
3709
  return super.chipName(option);
3694
3710
  }
3695
3711
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsMultiSelectDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
3696
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsMultiSelectDropdownComponent, isStandalone: false, selector: "ads-multi-select-dropdown", inputs: { showChips: "showChips", showSelectAll: "showSelectAll", disableEmptyValue: "disableEmptyValue" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showSelectAll && isAllSelected) {\n <mat-select-trigger>Select All</mat-select-trigger>\n } @else if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @if (showSelectAll) {\n <mat-option\n class=\"select-all-option checkbox\"\n [value]=\"'__SELECT_ALL__'\"\n (click)=\"onSelectAllClick($event)\"\n >\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"selectAllCheckboxControl\"\n label=\"Select All\"\n />\n </mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"getOptionDisplayLabel(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option) || (disableEmptyValue && isEmptyOption(option))\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"getOptionDisplayLabel(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"getOptionDisplayLabel(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field.chips ::ng-deep .mdc-text-field{height:auto;min-height:var(--mat-form-field-container-height)}mat-form-field.x-small ::ng-deep{--mat-form-field-container-height: 32px}mat-option:not(.mdc-list-item--disabled):hover ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):focus ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):active ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled).mat-mdc-option-active ::ng-deep .checkbox-label{color:var(--color-white)}.tag-container{display:flex;gap:4px;flex-wrap:wrap;margin:4px 0}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsTagComponent, selector: "ads-tag", inputs: ["color", "borderColor", "borderWidth", "width", "id", "removable", "clickable", "tag"], outputs: ["remove", "selected"] }, { kind: "component", type: AdsCheckboxComponent, selector: "ads-checkbox", inputs: ["indeterminate", "width", "tooltip", "tooltipHref", "size"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
3712
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsMultiSelectDropdownComponent, isStandalone: false, selector: "ads-multi-select-dropdown", inputs: { showChips: "showChips", showSelectAll: "showSelectAll", disableEmptyValue: "disableEmptyValue" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showSelectAll && isAllSelected) {\n <mat-select-trigger>Select All</mat-select-trigger>\n } @else if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @if (showSelectAll) {\n <mat-option\n class=\"select-all-option checkbox\"\n [value]=\"'__SELECT_ALL__'\"\n (click)=\"onSelectAllClick($event)\"\n >\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"selectAllCheckboxControl\"\n label=\"Select All\"\n />\n </mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"getOptionDisplayLabel(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option) || (disableEmptyValue && isEmptyOption(option))\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"getOptionDisplayLabel(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"getOptionDisplayLabel(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field.chips ::ng-deep .mdc-text-field{height:auto;min-height:var(--mat-form-field-container-height)}mat-form-field.x-small ::ng-deep{--mat-form-field-container-height: 32px}mat-option:not(.mdc-list-item--disabled):hover ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):focus ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):active ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled).mat-mdc-option-active ::ng-deep .checkbox-label{color:var(--color-white)}.tag-container{display:flex;gap:4px;flex-wrap:wrap;margin:4px 0}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsTagComponent, selector: "ads-tag", inputs: ["color", "borderColor", "borderWidth", "width", "id", "removable", "clickable", "tag"], outputs: ["remove", "selected"] }, { kind: "component", type: AdsCheckboxComponent, selector: "ads-checkbox", inputs: ["indeterminate", "width", "tooltip", "tooltipHref", "size"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
3697
3713
  }
3698
3714
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsMultiSelectDropdownComponent, decorators: [{
3699
3715
  type: Component,
3700
- args: [{ selector: 'ads-multi-select-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showSelectAll && isAllSelected) {\n <mat-select-trigger>Select All</mat-select-trigger>\n } @else if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @if (showSelectAll) {\n <mat-option\n class=\"select-all-option checkbox\"\n [value]=\"'__SELECT_ALL__'\"\n (click)=\"onSelectAllClick($event)\"\n >\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"selectAllCheckboxControl\"\n label=\"Select All\"\n />\n </mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"getOptionDisplayLabel(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option) || (disableEmptyValue && isEmptyOption(option))\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"getOptionDisplayLabel(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"getOptionDisplayLabel(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field.chips ::ng-deep .mdc-text-field{height:auto;min-height:var(--mat-form-field-container-height)}mat-form-field.x-small ::ng-deep{--mat-form-field-container-height: 32px}mat-option:not(.mdc-list-item--disabled):hover ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):focus ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):active ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled).mat-mdc-option-active ::ng-deep .checkbox-label{color:var(--color-white)}.tag-container{display:flex;gap:4px;flex-wrap:wrap;margin:4px 0}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3716
+ args: [{ selector: 'ads-multi-select-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\" [class.shrink]=\"shrink\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (click)=\"onOpened()\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n pill: mode === 'pill',\n chips: showChips && isMultiselect,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((!showChips || valueControl.value.length === 0) && (label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <!--&nbsp; is required in placeholder for smoother animation -->\n <mat-select\n #panel\n [disableRipple]=\"true\"\n [id]=\"id\"\n [placeholder]=\"placeholder || '&nbsp;'\"\n [panelClass]=\"panelClassList\"\n [disableOptionCentering]=\"true\"\n [required]=\"required\"\n [formControl]=\"valueControl\"\n [multiple]=\"isMultiselect\"\n >\n @if (showSelectAll && isAllSelected) {\n <mat-select-trigger>Select All</mat-select-trigger>\n } @else if (showChips && isMultiselect) {\n <mat-select-trigger>\n <div class=\"tag-container\">\n @for (option of valueControl.value; track $index) {\n <ads-tag\n [tag]=\"chipName(option)\"\n [color]=\"Colors.Medium\"\n [id]=\"'' + $index\"\n (remove)=\"onOptionRemoved(option)\"\n (click)=\"$event.stopPropagation()\"\n />\n }\n </div>\n </mat-select-trigger>\n } @else if (triggerTemplate) {\n <mat-select-trigger>\n <ng-container *ngTemplateOutlet=\"triggerTemplate; context: { option: valueControl.value }\" />\n </mat-select-trigger>\n }\n\n @if (hasEmptyValue) {\n <mat-option [value]=\"undefined\"></mat-option>\n }\n\n @if (showSelectAll) {\n <mat-option\n class=\"select-all-option checkbox\"\n [value]=\"'__SELECT_ALL__'\"\n (click)=\"onSelectAllClick($event)\"\n >\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"selectAllCheckboxControl\"\n label=\"Select All\"\n />\n </mat-option>\n }\n\n @for (option of displayedOptionsArray; track $index) {\n <mat-option\n [id]=\"id + '-option-' + ($index + 1)\"\n [value]=\"option\"\n [ngClass]=\"{\n checkbox: isMultiselect && checkSelected,\n 'wrap-text': wrapOptionText,\n }\"\n [matTooltip]=\"getOptionDisplayLabel(option)\"\n [matTooltipDisabled]=\"!showTooltip\"\n [disabled]=\"isDropdownOptionObject(option) || (disableEmptyValue && isEmptyOption(option))\"\n >\n @if (optionTemplate) {\n <ng-container *ngTemplateOutlet=\"optionTemplate; context: { option }\" />\n } @else if (isMultiselect && checkSelected) {\n <ads-checkbox\n [showFooter]=\"false\"\n width=\"100%\"\n [control]=\"createCheckboxControl(option)\"\n (change)=\"onCheckboxChange(option)\"\n [label]=\"getOptionDisplayLabel(option)\"\n />\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHTML]=\"getOptionDisplayLabel(option)\"\n ></span>\n }\n </mat-option>\n }\n </mat-select>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n <button matTextSuffix type=\"button\" mat-icon-button class=\"action-icon\">\n <ads-icon\n matTextSuffix\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field.chips ::ng-deep .mdc-text-field{height:auto;min-height:var(--mat-form-field-container-height)}mat-form-field.x-small ::ng-deep{--mat-form-field-container-height: 32px}mat-option:not(.mdc-list-item--disabled):hover ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):focus ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled):active ::ng-deep .checkbox-label,mat-option:not(.mdc-list-item--disabled).mat-mdc-option-active ::ng-deep .checkbox-label{color:var(--color-white)}.tag-container{display:flex;gap:4px;flex-wrap:wrap;margin:4px 0}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3701
3717
  }], propDecorators: { showChips: [{
3702
3718
  type: Input
3703
3719
  }], showSelectAll: [{
@@ -3851,11 +3867,11 @@ class AdsInputComponent extends AbstractInputComponent {
3851
3867
  }
3852
3868
  }
3853
3869
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
3854
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsInputComponent, isStandalone: false, selector: "ads-input", inputs: { maxlength: "maxlength", type: "type", pattern: "pattern", defaultValue: "defaultValue", isPasswordField: "isPasswordField", showClockIcon: "showClockIcon", mask: "mask", suffix: "suffix", prefix: "prefix", dropSpecialCharacters: "dropSpecialCharacters", thousandSeparator: "thousandSeparator", decimalMarker: "decimalMarker", outputTransformFn: "outputTransformFn", matAutocomplete: "matAutocomplete", readOnly: "readOnly", showSearchIcon: "showSearchIcon", onFocus: "onFocus", onBlur: "onBlur", rightHint: "rightHint" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [floatLabel]=\"valueControl.value ? 'always' : 'auto'\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'read-only': readOnly,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n #input\n matInput\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [mask]=\"mask\"\n [maxlength]=\"maxlength\"\n [dropSpecialCharacters]=\"dropSpecialCharacters\"\n [thousandSeparator]=\"thousandSeparator\"\n [decimalMarker]=\"decimalMarker\"\n [outputTransformFn]=\"outputTransformFn\"\n [id]=\"id\"\n [type]=\"isPasswordField ? (hidePassword ? 'password' : 'text') : type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readOnly\"\n [tabIndex]=\"readOnly ? -1 : 0\"\n (blur)=\"onBlur($event)\"\n (focus)=\"handleFocusInternal($event)\"\n (keydown)=\"restrictInput($event)\"\n (wheel)=\"preventScroll($event)\"\n (paste)=\"readOnly ? $event.preventDefault() : null\"\n (cut)=\"readOnly ? $event.preventDefault() : null\"\n [attr.matAutocomplete]=\"matAutocomplete ? matAutocomplete : null\"\n [attr.pattern]=\"pattern\"\n />\n @if (rightHint) {\n <span class=\"ads-input-right-hint\">{{ rightHint }}</span>\n }\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (isPasswordField) {\n <button type=\"button\" mat-icon-button matTextSuffix (click)=\"showHidePassword()\" class=\"action-icon\">\n <ads-icon\n class=\"visibility-eye\"\n [name]=\"hidePassword ? 'visibility_eye_none' : 'visibility_eye'\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n stroke=\"iconPrimary\"\n color=\"--color-medium\"\n />\n </button>\n }\n\n @if (showClockIcon) {\n <button\n type=\"button\"\n [disableRipple]=\"true\"\n mat-icon-button\n matTextSuffix\n class=\"action-icon time-picker-button\"\n >\n <ads-icon\n class=\"status_processing\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n theme=\"iconPrimary\"\n />\n </button>\n }\n\n @if (showSearchIcon) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disableRipple]=\"true\"\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "directive", type: i11.NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }] }); }
3870
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsInputComponent, isStandalone: false, selector: "ads-input", inputs: { maxlength: "maxlength", type: "type", pattern: "pattern", defaultValue: "defaultValue", isPasswordField: "isPasswordField", showClockIcon: "showClockIcon", mask: "mask", suffix: "suffix", prefix: "prefix", dropSpecialCharacters: "dropSpecialCharacters", thousandSeparator: "thousandSeparator", decimalMarker: "decimalMarker", outputTransformFn: "outputTransformFn", matAutocomplete: "matAutocomplete", readOnly: "readOnly", showSearchIcon: "showSearchIcon", onFocus: "onFocus", onBlur: "onBlur", rightHint: "rightHint" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [floatLabel]=\"valueControl.value ? 'always' : 'auto'\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'read-only': readOnly,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n #input\n matInput\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [mask]=\"mask\"\n [maxlength]=\"maxlength\"\n [dropSpecialCharacters]=\"dropSpecialCharacters\"\n [thousandSeparator]=\"thousandSeparator\"\n [decimalMarker]=\"decimalMarker\"\n [outputTransformFn]=\"outputTransformFn\"\n [id]=\"id\"\n [type]=\"isPasswordField ? (hidePassword ? 'password' : 'text') : type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readOnly\"\n [tabIndex]=\"readOnly ? -1 : 0\"\n (blur)=\"onBlur($event)\"\n (focus)=\"handleFocusInternal($event)\"\n (keydown)=\"restrictInput($event)\"\n (wheel)=\"preventScroll($event)\"\n (paste)=\"readOnly ? $event.preventDefault() : null\"\n (cut)=\"readOnly ? $event.preventDefault() : null\"\n [attr.matAutocomplete]=\"matAutocomplete ? matAutocomplete : null\"\n [attr.pattern]=\"pattern\"\n />\n @if (rightHint) {\n <span class=\"ads-input-right-hint\">{{ rightHint }}</span>\n }\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (isPasswordField) {\n <button type=\"button\" mat-icon-button matTextSuffix (click)=\"showHidePassword()\" class=\"action-icon\">\n <ads-icon\n class=\"visibility-eye\"\n [name]=\"hidePassword ? 'visibility_eye_none' : 'visibility_eye'\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n stroke=\"iconPrimary\"\n color=\"--color-medium\"\n />\n </button>\n }\n\n @if (showClockIcon) {\n <button\n type=\"button\"\n [disableRipple]=\"true\"\n mat-icon-button\n matTextSuffix\n class=\"action-icon time-picker-button\"\n >\n <ads-icon\n class=\"status_processing\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n theme=\"iconPrimary\"\n />\n </button>\n }\n\n @if (showSearchIcon) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disableRipple]=\"true\"\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "directive", type: i11.NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }] }); }
3855
3871
  }
3856
3872
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsInputComponent, decorators: [{
3857
3873
  type: Component,
3858
- args: [{ selector: 'ads-input', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [floatLabel]=\"valueControl.value ? 'always' : 'auto'\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'read-only': readOnly,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n #input\n matInput\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [mask]=\"mask\"\n [maxlength]=\"maxlength\"\n [dropSpecialCharacters]=\"dropSpecialCharacters\"\n [thousandSeparator]=\"thousandSeparator\"\n [decimalMarker]=\"decimalMarker\"\n [outputTransformFn]=\"outputTransformFn\"\n [id]=\"id\"\n [type]=\"isPasswordField ? (hidePassword ? 'password' : 'text') : type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readOnly\"\n [tabIndex]=\"readOnly ? -1 : 0\"\n (blur)=\"onBlur($event)\"\n (focus)=\"handleFocusInternal($event)\"\n (keydown)=\"restrictInput($event)\"\n (wheel)=\"preventScroll($event)\"\n (paste)=\"readOnly ? $event.preventDefault() : null\"\n (cut)=\"readOnly ? $event.preventDefault() : null\"\n [attr.matAutocomplete]=\"matAutocomplete ? matAutocomplete : null\"\n [attr.pattern]=\"pattern\"\n />\n @if (rightHint) {\n <span class=\"ads-input-right-hint\">{{ rightHint }}</span>\n }\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (isPasswordField) {\n <button type=\"button\" mat-icon-button matTextSuffix (click)=\"showHidePassword()\" class=\"action-icon\">\n <ads-icon\n class=\"visibility-eye\"\n [name]=\"hidePassword ? 'visibility_eye_none' : 'visibility_eye'\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n stroke=\"iconPrimary\"\n color=\"--color-medium\"\n />\n </button>\n }\n\n @if (showClockIcon) {\n <button\n type=\"button\"\n [disableRipple]=\"true\"\n mat-icon-button\n matTextSuffix\n class=\"action-icon time-picker-button\"\n >\n <ads-icon\n class=\"status_processing\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n theme=\"iconPrimary\"\n />\n </button>\n }\n\n @if (showSearchIcon) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disableRipple]=\"true\"\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3874
+ args: [{ selector: 'ads-input', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [floatLabel]=\"valueControl.value ? 'always' : 'auto'\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'read-only': readOnly,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n #input\n matInput\n [suffix]=\"suffix\"\n [prefix]=\"prefix\"\n [mask]=\"mask\"\n [maxlength]=\"maxlength\"\n [dropSpecialCharacters]=\"dropSpecialCharacters\"\n [thousandSeparator]=\"thousandSeparator\"\n [decimalMarker]=\"decimalMarker\"\n [outputTransformFn]=\"outputTransformFn\"\n [id]=\"id\"\n [type]=\"isPasswordField ? (hidePassword ? 'password' : 'text') : type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [readonly]=\"readOnly\"\n [tabIndex]=\"readOnly ? -1 : 0\"\n (blur)=\"onBlur($event)\"\n (focus)=\"handleFocusInternal($event)\"\n (keydown)=\"restrictInput($event)\"\n (wheel)=\"preventScroll($event)\"\n (paste)=\"readOnly ? $event.preventDefault() : null\"\n (cut)=\"readOnly ? $event.preventDefault() : null\"\n [attr.matAutocomplete]=\"matAutocomplete ? matAutocomplete : null\"\n [attr.pattern]=\"pattern\"\n />\n @if (rightHint) {\n <span class=\"ads-input-right-hint\">{{ rightHint }}</span>\n }\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (isPasswordField) {\n <button type=\"button\" mat-icon-button matTextSuffix (click)=\"showHidePassword()\" class=\"action-icon\">\n <ads-icon\n class=\"visibility-eye\"\n [name]=\"hidePassword ? 'visibility_eye_none' : 'visibility_eye'\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n stroke=\"iconPrimary\"\n color=\"--color-medium\"\n />\n </button>\n }\n\n @if (showClockIcon) {\n <button\n type=\"button\"\n [disableRipple]=\"true\"\n mat-icon-button\n matTextSuffix\n class=\"action-icon time-picker-button\"\n >\n <ads-icon\n class=\"status_processing\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n theme=\"iconPrimary\"\n />\n </button>\n }\n\n @if (showSearchIcon) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disableRipple]=\"true\"\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
3859
3875
  }], propDecorators: { maxlength: [{
3860
3876
  type: Input
3861
3877
  }], type: [{
@@ -4039,11 +4055,11 @@ class AdsTextareaComponent extends AbstractInputComponent {
4039
4055
  this.canResize = true;
4040
4056
  }
4041
4057
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsTextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
4042
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsTextareaComponent, isStandalone: false, selector: "ads-textarea", inputs: { maxlength: "maxlength", rows: "rows", canResize: "canResize" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear && !showExclamation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if(label || required) {\n <mat-label>{{ label }}</mat-label>\n }\n <textarea\n matInput\n [rows]=\"rows\"\n [maxlength]=\"maxlength\"\n [id]=\"id\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [ngStyle]=\"{ resize: canResize ? null : 'none' }\"\n >\n </textarea>\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\">\n <ads-icon name=\"cross\" size=\"xxs\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n </mat-form-field>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ":host::ng-deep mat-form-field .mdc-text-field{height:auto}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label textarea{min-height:30px;margin-top:12px;margin-bottom:6px}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix textarea{line-height:24px;min-height:24px;margin-top:20px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea{line-height:24px;position:relative;bottom:1px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea::-webkit-resizer{background-size:contain;background-image:url(data:image/svg+xml;utf8;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjEgMTUtNiA2bTYtMTMtMTMgMTMiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-icon-suffix,:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{align-self:baseline;height:var(--mat-form-field-container-height);display:flex;align-items:center}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }] }); }
4058
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsTextareaComponent, isStandalone: false, selector: "ads-textarea", inputs: { maxlength: "maxlength", rows: "rows", canResize: "canResize" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear && !showExclamation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if(label || required) {\n <mat-label>{{ label }}</mat-label>\n }\n <textarea\n matInput\n [rows]=\"rows\"\n [maxlength]=\"maxlength\"\n [id]=\"id\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [ngStyle]=\"{ resize: canResize ? null : 'none' }\"\n >\n </textarea>\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\">\n <ads-icon name=\"cross\" size=\"xxs\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n </mat-form-field>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ":host::ng-deep mat-form-field .mdc-text-field{height:auto}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label textarea{min-height:30px;margin-top:12px;margin-bottom:6px}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix textarea{line-height:24px;min-height:24px;margin-top:20px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea{line-height:24px;position:relative;bottom:1px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea::-webkit-resizer{background-size:contain;background-image:url(data:image/svg+xml;utf8;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjEgMTUtNiA2bTYtMTMtMTMgMTMiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-icon-suffix,:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{align-self:baseline;height:var(--mat-form-field-container-height);display:flex;align-items:center}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }] }); }
4043
4059
  }
4044
4060
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsTextareaComponent, decorators: [{
4045
4061
  type: Component,
4046
- args: [{ selector: 'ads-textarea', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear && !showExclamation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if(label || required) {\n <mat-label>{{ label }}</mat-label>\n }\n <textarea\n matInput\n [rows]=\"rows\"\n [maxlength]=\"maxlength\"\n [id]=\"id\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [ngStyle]=\"{ resize: canResize ? null : 'none' }\"\n >\n </textarea>\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\">\n <ads-icon name=\"cross\" size=\"xxs\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n </mat-form-field>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ":host::ng-deep mat-form-field .mdc-text-field{height:auto}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label textarea{min-height:30px;margin-top:12px;margin-bottom:6px}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix textarea{line-height:24px;min-height:24px;margin-top:20px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea{line-height:24px;position:relative;bottom:1px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea::-webkit-resizer{background-size:contain;background-image:url(data:image/svg+xml;utf8;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjEgMTUtNiA2bTYtMTMtMTMgMTMiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-icon-suffix,:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{align-self:baseline;height:var(--mat-form-field-container-height);display:flex;align-items:center}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
4062
+ args: [{ selector: 'ads-textarea', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': canClear && !showExclamation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if(label || required) {\n <mat-label>{{ label }}</mat-label>\n }\n <textarea\n matInput\n [rows]=\"rows\"\n [maxlength]=\"maxlength\"\n [id]=\"id\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [ngStyle]=\"{ resize: canResize ? null : 'none' }\"\n >\n </textarea>\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\">\n <ads-icon name=\"cross\" size=\"xxs\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n </mat-form-field>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ":host::ng-deep mat-form-field .mdc-text-field{height:auto}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label textarea{min-height:30px;margin-top:12px;margin-bottom:6px}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix textarea{line-height:24px;min-height:24px;margin-top:20px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea{line-height:24px;position:relative;bottom:1px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-infix textarea::-webkit-resizer{background-size:contain;background-image:url(data:image/svg+xml;utf8;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMjEgMTUtNiA2bTYtMTMtMTMgMTMiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz48L3N2Zz4=)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-icon-suffix,:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{align-self:baseline;height:var(--mat-form-field-container-height);display:flex;align-items:center}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
4047
4063
  }], propDecorators: { maxlength: [{
4048
4064
  type: Input
4049
4065
  }], rows: [{
@@ -5206,11 +5222,11 @@ class AdsSearchDropdownComponent extends AbstractDropdownComponent {
5206
5222
  this.intersectionObserver.observe(this.hostEl.nativeElement);
5207
5223
  }
5208
5224
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsSearchDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
5209
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsSearchDropdownComponent, isStandalone: false, selector: "ads-search-dropdown", inputs: { externalButton: { classPropertyName: "externalButton", publicName: "externalButton", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: false, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, staticOptions: { classPropertyName: "staticOptions", publicName: "staticOptions", isSignal: false, isRequired: false, transformFunction: null }, filterOptions: { classPropertyName: "filterOptions", publicName: "filterOptions", isSignal: false, isRequired: false, transformFunction: null }, emitEmptyValues: { classPropertyName: "emitEmptyValues", publicName: "emitEmptyValues", isSignal: false, isRequired: false, transformFunction: null }, loadSuggestionOnInit: { classPropertyName: "loadSuggestionOnInit", publicName: "loadSuggestionOnInit", isSignal: false, isRequired: false, transformFunction: null }, noDataOption: { classPropertyName: "noDataOption", publicName: "noDataOption", isSignal: false, isRequired: false, transformFunction: null }, showNoDataOption: { classPropertyName: "showNoDataOption", publicName: "showNoDataOption", isSignal: false, isRequired: false, transformFunction: null }, moreDataOption: { classPropertyName: "moreDataOption", publicName: "moreDataOption", isSignal: false, isRequired: false, transformFunction: null }, staticDataOption: { classPropertyName: "staticDataOption", publicName: "staticDataOption", isSignal: false, isRequired: false, transformFunction: null }, prependOption: { classPropertyName: "prependOption", publicName: "prependOption", isSignal: false, isRequired: false, transformFunction: null }, showPrependOption: { classPropertyName: "showPrependOption", publicName: "showPrependOption", isSignal: false, isRequired: false, transformFunction: null }, onEnterKeyDown: { classPropertyName: "onEnterKeyDown", publicName: "onEnterKeyDown", isSignal: false, isRequired: false, transformFunction: null }, searchIconClickCallback: { classPropertyName: "searchIconClickCallback", publicName: "searchIconClickCallback", isSignal: false, isRequired: false, transformFunction: null }, showSearchIcon: { classPropertyName: "showSearchIcon", publicName: "showSearchIcon", isSignal: false, isRequired: false, transformFunction: null }, autoSelectSingleOption: { classPropertyName: "autoSelectSingleOption", publicName: "autoSelectSingleOption", isSignal: false, isRequired: false, transformFunction: null }, displayValueFormatter: { classPropertyName: "displayValueFormatter", publicName: "displayValueFormatter", isSignal: false, isRequired: false, transformFunction: null }, useOptionTemplate: { classPropertyName: "useOptionTemplate", publicName: "useOptionTemplate", isSignal: false, isRequired: false, transformFunction: null }, minValueLength: { classPropertyName: "minValueLength", publicName: "minValueLength", isSignal: false, isRequired: false, transformFunction: null }, preventClick: { classPropertyName: "preventClick", publicName: "preventClick", isSignal: false, isRequired: false, transformFunction: null }, closePanelEnabled: { classPropertyName: "closePanelEnabled", publicName: "closePanelEnabled", isSignal: false, isRequired: false, transformFunction: null }, trimValue: { classPropertyName: "trimValue", publicName: "trimValue", isSignal: false, isRequired: false, transformFunction: null }, closeOnOutOfView: { classPropertyName: "closeOnOutOfView", publicName: "closeOnOutOfView", isSignal: false, isRequired: false, transformFunction: null }, outOfViewRootMargin: { classPropertyName: "outOfViewRootMargin", publicName: "outOfViewRootMargin", isSignal: false, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: false, isRequired: false, transformFunction: null }, errorMessages: { classPropertyName: "errorMessages", publicName: "errorMessages", isSignal: false, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { externalButtonClick: "externalButtonClick", focusInput: "focusInput", blurInput: "blurInput", emitSearchValueInput: "emitSearchValueInput" }, queries: [{ propertyName: "optionRef", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "trigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "moreDataMatOption", first: true, predicate: ["moreDataMatOption"], descendants: true }, { propertyName: "noDataMatOption", first: true, predicate: ["noDataMatOption"], descendants: true }, { propertyName: "staticDataMatOption", first: true, predicate: ["staticDataMatOption"], descendants: true }, { propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (focusout)=\"onBlur($event)\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'is-open': trigger?.panelOpen,\n invalid: canShowError(),\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-invalid-when-empty': skipValidationWhenEmpty && !displayControl.value,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n @if (wrapOptionText) {\n <textarea\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n rows=\"1\"\n class=\"auto-resize-textarea\"\n ></textarea>\n } @else {\n <input\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n type=\"text\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n />\n }\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [displayWith]=\"displayFn\"\n [disableRipple]=\"true\"\n [class]=\"\n 'ads-dropdown-panel' +\n (fitContent ? ' fit-content' : '') +\n (loading() ? ' loading' : '') +\n (preventClick ? '' : ' clickable') +\n ' ' +\n panelClass\n \"\n >\n @if (canUsePrependOption) {\n <div class=\"prepend-option-container\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: prependOption }\"\n />\n </div>\n }\n\n @for (option of displayedOptions | keyvalue: applySorting; track $index) {\n <mat-option\n #opt\n [value]=\"option\"\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n (mousedown)=\"onOptionMouseDown($event, opt)\"\n [matTooltip]=\"tooltipLabel(option)\"\n [matTooltipDisabled]=\"useOptionTemplate || !showTooltip\"\n >\n @if (useOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"optionRef()\"\n [ngTemplateOutletContext]=\"{ $implicit: option.key, value: option.value }\"\n ></ng-template>\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHtml]=\"\n displayValueFormatter\n ? displayValueFormatter(\n option!.value! | adsSearchDropdownHighlighter: displayControl.value,\n option.key\n )\n : (option!.value! | adsSearchDropdownHighlighter: displayControl.value)\n \"\n ></span>\n }\n </mat-option>\n }\n\n @if (canUseMoreDataOption) {\n <hr class=\"no-results-hr\" />\n <mat-option #moreDataMatOption class=\"extra\" [disabled]=\"!moreDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: moreDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseNoDataOption) {\n <mat-option #noDataMatOption class=\"extra\" [disabled]=\"!noDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: noDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseStaticOption) {\n @if (displayedOptions.size) {\n <hr class=\"no-results-hr\" />\n }\n <mat-option #staticDataMatOption class=\"extra\" [disabled]=\"!staticDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: staticDataOption }\"\n />\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n @if (showDropdownIcon) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"togglePanel($event)\" class=\"action-icon\">\n <ads-icon\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n }\n @if (showSearchIcon) {\n @if (!staticOptions && loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n }\n @if (!staticOptions && !loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canSearch\"\n (click)=\"canSearch ? onSearchIconClick($event) : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n }\n @if(externalButton()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n tabindex=\"0\"\n (click)=\"onExternalButtonClick($event)\"\n class=\"action-icon external-button\">\n <ads-icon [name]=\"externalButton()!\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"external-icon\" />\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n\n <ng-template #extraOptionValue let-option>\n <span\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"onStaticOptionMouseDown($event, option!)\"\n [class]=\"option!.cssClass || ''\"\n >\n @if (isTemplateRef(option!.label)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(option!.label)\"\n [ngTemplateOutletContext]=\"{ $implicit: displayControl.value }\"\n />\n } @else {\n <span [innerHTML]=\"option!.label\"></span>\n }\n </span>\n </ng-template>\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field{width:100%}mat-form-field.invalid ::ng-deep{--mat-form-field-filled-label-text-color: var(--color-error);--mat-form-field-filled-hover-label-text-color: var(--color-error);--mat-form-field-filled-focus-label-text-color: var(--color-error)}mat-form-field.invalid ::ng-deep .mdc-text-field{outline:2px solid var(--color-error);outline-offset:-2px}mat-form-field.invalid ::ng-deep .mdc-text-field ads-icon{stroke:var(--mat-form-field-filled-error-label-text-color)!important;color:var(--mat-form-field-filled-error-label-text-color)!important}mat-form-field.wrap-trigger-text ::ng-deep .auto-resize-textarea{resize:none;overflow:hidden;min-height:24px;max-height:120px;line-height:1.4;padding-top:12px;padding-bottom:12px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{min-height:24px;padding-top:0;padding-bottom:0}mat-form-field.has-label.wrap-trigger-text ::ng-deep .auto-resize-textarea{padding-top:0;padding-bottom:0}mat-option.extra{opacity:1;font-size:.75rem;min-height:32px;display:flex}mat-option.extra ::ng-deep .mdc-list-item__primary-text{opacity:1}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option ::ng-deep .highlighted-text{font-weight:700}.prepend-option-container{font-size:.75rem;display:flex;align-items:center;min-height:32px;padding:0 12px;cursor:default;pointer-events:none;color:var(--color-medium);font-weight:600}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AdsSearchDropdownHighlighterPipe, name: "adsSearchDropdownHighlighter" }] }); }
5225
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsSearchDropdownComponent, isStandalone: false, selector: "ads-search-dropdown", inputs: { externalButton: { classPropertyName: "externalButton", publicName: "externalButton", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: false, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, staticOptions: { classPropertyName: "staticOptions", publicName: "staticOptions", isSignal: false, isRequired: false, transformFunction: null }, filterOptions: { classPropertyName: "filterOptions", publicName: "filterOptions", isSignal: false, isRequired: false, transformFunction: null }, emitEmptyValues: { classPropertyName: "emitEmptyValues", publicName: "emitEmptyValues", isSignal: false, isRequired: false, transformFunction: null }, loadSuggestionOnInit: { classPropertyName: "loadSuggestionOnInit", publicName: "loadSuggestionOnInit", isSignal: false, isRequired: false, transformFunction: null }, noDataOption: { classPropertyName: "noDataOption", publicName: "noDataOption", isSignal: false, isRequired: false, transformFunction: null }, showNoDataOption: { classPropertyName: "showNoDataOption", publicName: "showNoDataOption", isSignal: false, isRequired: false, transformFunction: null }, moreDataOption: { classPropertyName: "moreDataOption", publicName: "moreDataOption", isSignal: false, isRequired: false, transformFunction: null }, staticDataOption: { classPropertyName: "staticDataOption", publicName: "staticDataOption", isSignal: false, isRequired: false, transformFunction: null }, prependOption: { classPropertyName: "prependOption", publicName: "prependOption", isSignal: false, isRequired: false, transformFunction: null }, showPrependOption: { classPropertyName: "showPrependOption", publicName: "showPrependOption", isSignal: false, isRequired: false, transformFunction: null }, onEnterKeyDown: { classPropertyName: "onEnterKeyDown", publicName: "onEnterKeyDown", isSignal: false, isRequired: false, transformFunction: null }, searchIconClickCallback: { classPropertyName: "searchIconClickCallback", publicName: "searchIconClickCallback", isSignal: false, isRequired: false, transformFunction: null }, showSearchIcon: { classPropertyName: "showSearchIcon", publicName: "showSearchIcon", isSignal: false, isRequired: false, transformFunction: null }, autoSelectSingleOption: { classPropertyName: "autoSelectSingleOption", publicName: "autoSelectSingleOption", isSignal: false, isRequired: false, transformFunction: null }, displayValueFormatter: { classPropertyName: "displayValueFormatter", publicName: "displayValueFormatter", isSignal: false, isRequired: false, transformFunction: null }, useOptionTemplate: { classPropertyName: "useOptionTemplate", publicName: "useOptionTemplate", isSignal: false, isRequired: false, transformFunction: null }, minValueLength: { classPropertyName: "minValueLength", publicName: "minValueLength", isSignal: false, isRequired: false, transformFunction: null }, preventClick: { classPropertyName: "preventClick", publicName: "preventClick", isSignal: false, isRequired: false, transformFunction: null }, closePanelEnabled: { classPropertyName: "closePanelEnabled", publicName: "closePanelEnabled", isSignal: false, isRequired: false, transformFunction: null }, trimValue: { classPropertyName: "trimValue", publicName: "trimValue", isSignal: false, isRequired: false, transformFunction: null }, closeOnOutOfView: { classPropertyName: "closeOnOutOfView", publicName: "closeOnOutOfView", isSignal: false, isRequired: false, transformFunction: null }, outOfViewRootMargin: { classPropertyName: "outOfViewRootMargin", publicName: "outOfViewRootMargin", isSignal: false, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: false, isRequired: false, transformFunction: null }, errorMessages: { classPropertyName: "errorMessages", publicName: "errorMessages", isSignal: false, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { externalButtonClick: "externalButtonClick", focusInput: "focusInput", blurInput: "blurInput", emitSearchValueInput: "emitSearchValueInput" }, queries: [{ propertyName: "optionRef", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "trigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "moreDataMatOption", first: true, predicate: ["moreDataMatOption"], descendants: true }, { propertyName: "noDataMatOption", first: true, predicate: ["noDataMatOption"], descendants: true }, { propertyName: "staticDataMatOption", first: true, predicate: ["staticDataMatOption"], descendants: true }, { propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (focusout)=\"onBlur($event)\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'is-open': trigger?.panelOpen,\n invalid: canShowError(),\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-invalid-when-empty': skipValidationWhenEmpty && !displayControl.value,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n @if (wrapOptionText) {\n <textarea\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n rows=\"1\"\n class=\"auto-resize-textarea\"\n ></textarea>\n } @else {\n <input\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n type=\"text\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n />\n }\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [displayWith]=\"displayFn\"\n [disableRipple]=\"true\"\n [class]=\"\n 'ads-dropdown-panel' +\n (fitContent ? ' fit-content' : '') +\n (loading() ? ' loading' : '') +\n (preventClick ? '' : ' clickable') +\n ' ' +\n panelClass\n \"\n >\n @if (canUsePrependOption) {\n <div class=\"prepend-option-container\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: prependOption }\"\n />\n </div>\n }\n\n @for (option of displayedOptions | keyvalue: applySorting; track $index) {\n <mat-option\n #opt\n [value]=\"option\"\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n (mousedown)=\"onOptionMouseDown($event, opt)\"\n [matTooltip]=\"tooltipLabel(option)\"\n [matTooltipDisabled]=\"useOptionTemplate || !showTooltip\"\n >\n @if (useOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"optionRef()\"\n [ngTemplateOutletContext]=\"{ $implicit: option.key, value: option.value }\"\n ></ng-template>\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHtml]=\"\n displayValueFormatter\n ? displayValueFormatter(\n option!.value! | adsSearchDropdownHighlighter: displayControl.value,\n option.key\n )\n : (option!.value! | adsSearchDropdownHighlighter: displayControl.value)\n \"\n ></span>\n }\n </mat-option>\n }\n\n @if (canUseMoreDataOption) {\n <hr class=\"no-results-hr\" />\n <mat-option #moreDataMatOption class=\"extra\" [disabled]=\"!moreDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: moreDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseNoDataOption) {\n <mat-option #noDataMatOption class=\"extra\" [disabled]=\"!noDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: noDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseStaticOption) {\n @if (displayedOptions.size) {\n <hr class=\"no-results-hr\" />\n }\n <mat-option #staticDataMatOption class=\"extra\" [disabled]=\"!staticDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: staticDataOption }\"\n />\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n @if (showDropdownIcon) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"togglePanel($event)\" class=\"action-icon\">\n <ads-icon\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n }\n @if (showSearchIcon) {\n @if (!staticOptions && loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n }\n @if (!staticOptions && !loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canSearch\"\n (click)=\"canSearch ? onSearchIconClick($event) : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n }\n @if(externalButton()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n tabindex=\"0\"\n (click)=\"onExternalButtonClick($event)\"\n class=\"action-icon external-button\">\n <ads-icon [name]=\"externalButton()!\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"external-icon\" />\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n\n <ng-template #extraOptionValue let-option>\n <span\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"onStaticOptionMouseDown($event, option!)\"\n [class]=\"option!.cssClass || ''\"\n >\n @if (isTemplateRef(option!.label)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(option!.label)\"\n [ngTemplateOutletContext]=\"{ $implicit: displayControl.value }\"\n />\n } @else {\n <span [innerHTML]=\"option!.label\"></span>\n }\n </span>\n </ng-template>\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field{width:100%}mat-form-field.invalid ::ng-deep{--mat-form-field-filled-label-text-color: var(--color-error);--mat-form-field-filled-hover-label-text-color: var(--color-error);--mat-form-field-filled-focus-label-text-color: var(--color-error)}mat-form-field.invalid ::ng-deep .mdc-text-field{outline:2px solid var(--color-error);outline-offset:-2px}mat-form-field.invalid ::ng-deep .mdc-text-field ads-icon{stroke:var(--mat-form-field-filled-error-label-text-color)!important;color:var(--mat-form-field-filled-error-label-text-color)!important}mat-form-field.wrap-trigger-text ::ng-deep .auto-resize-textarea{resize:none;overflow:hidden;min-height:24px;max-height:120px;line-height:1.4;padding-top:12px;padding-bottom:12px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{min-height:24px;padding-top:0;padding-bottom:0}mat-form-field.has-label.wrap-trigger-text ::ng-deep .auto-resize-textarea{padding-top:0;padding-bottom:0}mat-option.extra{opacity:1;font-size:.75rem;min-height:32px;display:flex}mat-option.extra ::ng-deep .mdc-list-item__primary-text{opacity:1}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option ::ng-deep .highlighted-text{font-weight:700}.prepend-option-container{font-size:.75rem;display:flex;align-items:center;min-height:32px;padding:0 12px;cursor:default;pointer-events:none;color:var(--color-medium);font-weight:600}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }, { kind: "directive", type: i13.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AdsSearchDropdownHighlighterPipe, name: "adsSearchDropdownHighlighter" }] }); }
5210
5226
  }
5211
5227
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsSearchDropdownComponent, decorators: [{
5212
5228
  type: Component,
5213
- args: [{ selector: 'ads-search-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (focusout)=\"onBlur($event)\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'is-open': trigger?.panelOpen,\n invalid: canShowError(),\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-invalid-when-empty': skipValidationWhenEmpty && !displayControl.value,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n @if (wrapOptionText) {\n <textarea\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n rows=\"1\"\n class=\"auto-resize-textarea\"\n ></textarea>\n } @else {\n <input\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n type=\"text\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n />\n }\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [displayWith]=\"displayFn\"\n [disableRipple]=\"true\"\n [class]=\"\n 'ads-dropdown-panel' +\n (fitContent ? ' fit-content' : '') +\n (loading() ? ' loading' : '') +\n (preventClick ? '' : ' clickable') +\n ' ' +\n panelClass\n \"\n >\n @if (canUsePrependOption) {\n <div class=\"prepend-option-container\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: prependOption }\"\n />\n </div>\n }\n\n @for (option of displayedOptions | keyvalue: applySorting; track $index) {\n <mat-option\n #opt\n [value]=\"option\"\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n (mousedown)=\"onOptionMouseDown($event, opt)\"\n [matTooltip]=\"tooltipLabel(option)\"\n [matTooltipDisabled]=\"useOptionTemplate || !showTooltip\"\n >\n @if (useOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"optionRef()\"\n [ngTemplateOutletContext]=\"{ $implicit: option.key, value: option.value }\"\n ></ng-template>\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHtml]=\"\n displayValueFormatter\n ? displayValueFormatter(\n option!.value! | adsSearchDropdownHighlighter: displayControl.value,\n option.key\n )\n : (option!.value! | adsSearchDropdownHighlighter: displayControl.value)\n \"\n ></span>\n }\n </mat-option>\n }\n\n @if (canUseMoreDataOption) {\n <hr class=\"no-results-hr\" />\n <mat-option #moreDataMatOption class=\"extra\" [disabled]=\"!moreDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: moreDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseNoDataOption) {\n <mat-option #noDataMatOption class=\"extra\" [disabled]=\"!noDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: noDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseStaticOption) {\n @if (displayedOptions.size) {\n <hr class=\"no-results-hr\" />\n }\n <mat-option #staticDataMatOption class=\"extra\" [disabled]=\"!staticDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: staticDataOption }\"\n />\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n @if (showDropdownIcon) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"togglePanel($event)\" class=\"action-icon\">\n <ads-icon\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n }\n @if (showSearchIcon) {\n @if (!staticOptions && loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n }\n @if (!staticOptions && !loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canSearch\"\n (click)=\"canSearch ? onSearchIconClick($event) : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n }\n @if(externalButton()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n tabindex=\"0\"\n (click)=\"onExternalButtonClick($event)\"\n class=\"action-icon external-button\">\n <ads-icon [name]=\"externalButton()!\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"external-icon\" />\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n\n <ng-template #extraOptionValue let-option>\n <span\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"onStaticOptionMouseDown($event, option!)\"\n [class]=\"option!.cssClass || ''\"\n >\n @if (isTemplateRef(option!.label)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(option!.label)\"\n [ngTemplateOutletContext]=\"{ $implicit: displayControl.value }\"\n />\n } @else {\n <span [innerHTML]=\"option!.label\"></span>\n }\n </span>\n </ng-template>\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field{width:100%}mat-form-field.invalid ::ng-deep{--mat-form-field-filled-label-text-color: var(--color-error);--mat-form-field-filled-hover-label-text-color: var(--color-error);--mat-form-field-filled-focus-label-text-color: var(--color-error)}mat-form-field.invalid ::ng-deep .mdc-text-field{outline:2px solid var(--color-error);outline-offset:-2px}mat-form-field.invalid ::ng-deep .mdc-text-field ads-icon{stroke:var(--mat-form-field-filled-error-label-text-color)!important;color:var(--mat-form-field-filled-error-label-text-color)!important}mat-form-field.wrap-trigger-text ::ng-deep .auto-resize-textarea{resize:none;overflow:hidden;min-height:24px;max-height:120px;line-height:1.4;padding-top:12px;padding-bottom:12px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{min-height:24px;padding-top:0;padding-bottom:0}mat-form-field.has-label.wrap-trigger-text ::ng-deep .auto-resize-textarea{padding-top:0;padding-bottom:0}mat-option.extra{opacity:1;font-size:.75rem;min-height:32px;display:flex}mat-option.extra ::ng-deep .mdc-list-item__primary-text{opacity:1}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option ::ng-deep .highlighted-text{font-weight:700}.prepend-option-container{font-size:.75rem;display:flex;align-items:center;min-height:32px;padding:0 12px;cursor:default;pointer-events:none;color:var(--color-medium);font-weight:600}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
5229
+ args: [{ selector: 'ads-search-dropdown', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n (focusout)=\"onBlur($event)\"\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'is-open': trigger?.panelOpen,\n invalid: canShowError(),\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'wrap-trigger-text': wrapOptionText,\n 'has-label': !!label,\n 'suppress-invalid-when-empty': skipValidationWhenEmpty && !displayControl.value,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n @if (wrapOptionText) {\n <textarea\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n rows=\"1\"\n class=\"auto-resize-textarea\"\n ></textarea>\n } @else {\n <input\n #input\n [disabled]=\"displayControl.disabled\"\n (keydown.enter)=\"onKeyDown($event.target)\"\n (input)=\"onInput($event.target)\"\n (focus)=\"onFocus()\"\n type=\"text\"\n [autocomplete]=\"'none'\"\n [id]=\"id\"\n matInput\n [value]=\"getDisplayedValueAsString()\"\n [attr.maxlength]=\"maxlength\"\n [matAutocomplete]=\"auto\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n />\n }\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n [displayWith]=\"displayFn\"\n [disableRipple]=\"true\"\n [class]=\"\n 'ads-dropdown-panel' +\n (fitContent ? ' fit-content' : '') +\n (loading() ? ' loading' : '') +\n (preventClick ? '' : ' clickable') +\n ' ' +\n panelClass\n \"\n >\n @if (canUsePrependOption) {\n <div class=\"prepend-option-container\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: prependOption }\"\n />\n </div>\n }\n\n @for (option of displayedOptions | keyvalue: applySorting; track $index) {\n <mat-option\n #opt\n [value]=\"option\"\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n (mousedown)=\"onOptionMouseDown($event, opt)\"\n [matTooltip]=\"tooltipLabel(option)\"\n [matTooltipDisabled]=\"useOptionTemplate || !showTooltip\"\n >\n @if (useOptionTemplate) {\n <ng-template\n [ngTemplateOutlet]=\"optionRef()\"\n [ngTemplateOutletContext]=\"{ $implicit: option.key, value: option.value }\"\n ></ng-template>\n } @else {\n <span\n [ngClass]=\"{ 'wrap-text': wrapOptionText }\"\n [innerHtml]=\"\n displayValueFormatter\n ? displayValueFormatter(\n option!.value! | adsSearchDropdownHighlighter: displayControl.value,\n option.key\n )\n : (option!.value! | adsSearchDropdownHighlighter: displayControl.value)\n \"\n ></span>\n }\n </mat-option>\n }\n\n @if (canUseMoreDataOption) {\n <hr class=\"no-results-hr\" />\n <mat-option #moreDataMatOption class=\"extra\" [disabled]=\"!moreDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: moreDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseNoDataOption) {\n <mat-option #noDataMatOption class=\"extra\" [disabled]=\"!noDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: noDataOption }\"\n />\n </mat-option>\n }\n\n @if (canUseStaticOption) {\n @if (displayedOptions.size) {\n <hr class=\"no-results-hr\" />\n }\n <mat-option #staticDataMatOption class=\"extra\" [disabled]=\"!staticDataOption!.onClick\">\n <ng-container\n [ngTemplateOutlet]=\"extraOptionValue\"\n [ngTemplateOutletContext]=\"{ $implicit: staticDataOption }\"\n />\n </mat-option>\n }\n </mat-autocomplete>\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n @if (showDropdownIcon) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"togglePanel($event)\" class=\"action-icon\">\n <ads-icon\n name=\"chevron_down\"\n [size]=\"smallSize ? 'xxs' : 'xs'\"\n [theme]=\"'iconPrimary'\"\n class=\"chevron-down\"\n />\n </button>\n }\n @if (showSearchIcon) {\n @if (!staticOptions && loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n }\n @if (!staticOptions && !loading()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canSearch\"\n (click)=\"canSearch ? onSearchIconClick($event) : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n }\n @if(externalButton()) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n tabindex=\"0\"\n (click)=\"onExternalButtonClick($event)\"\n class=\"action-icon external-button\">\n <ads-icon [name]=\"externalButton()!\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"external-icon\" />\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n\n <ng-template #extraOptionValue let-option>\n <span\n (click)=\"$event.stopPropagation()\"\n (mousedown)=\"onStaticOptionMouseDown($event, option!)\"\n [class]=\"option!.cssClass || ''\"\n >\n @if (isTemplateRef(option!.label)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(option!.label)\"\n [ngTemplateOutletContext]=\"{ $implicit: displayControl.value }\"\n />\n } @else {\n <span [innerHTML]=\"option!.label\"></span>\n }\n </span>\n </ng-template>\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "mat-select{--mat-select-trigger-text-line-height: 24px;--mat-select-enabled-trigger-text-color: var(--color-medium);--mat-select-disabled-trigger-text-color: var(--color-medium);--mat-select-placeholder-text-color: var(--color-medium)}mat-option{--mat-option-selected-state-layer-color: var(--color-secondary);--mat-option-selected-state-label-text-color: var(--color-white);--mat-option-hover-state-layer-color: var(--color-secondary-hover);padding:0 12px}mat-option.checkbox{padding:0 12px 0 6px}mat-option:active{background-color:var(--color-secondary-pressed)!important}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-form-field.pill ::ng-deep .mdc-text-field{border-radius:24px;padding-left:16px;background-color:var(--color-light-30)}mat-form-field.pill ::ng-deep .mdc-text-field:not(.mdc-text-field--invalid){border-color:transparent}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;min-height:24px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-select-value-text{white-space:normal!important;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;line-height:1.4;height:auto;min-height:24px;padding-top:12px;padding-bottom:12px}mat-form-field.has-label.wrap-trigger-text ::ng-deep .mdc-text-field__input,mat-form-field.has-label.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{padding-top:20px;padding-bottom:4px}mat-form-field ::ng-deep .mdc-text-field .mat-mdc-select-arrow-wrapper{display:none}mat-form-field.x-small mat-select{font-size:12px;line-height:16px}mat-form-field.x-small ::ng-deep .mat-mdc-select-placeholder{font-size:12px;line-height:16px}mat-option:hover:not(.mdc-list-item--disabled){color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled).mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option:hover:not(.mdc-list-item--disabled) ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mat-mdc-option-active{color:var(--color-white);background-color:var(--mat-option-hover-state-layer-color)!important}mat-option.mat-mdc-option-active.mdc-list-item--selected{background-color:var(--mat-option-selected-state-layer-color)!important}mat-option.mat-mdc-option-active ::ng-deep .mdc-list-item__primary-text{color:var(--color-white)!important}mat-option.mat-mdc-option-active ::ng-deep .flag-option span{color:var(--color-white)!important}mat-option.mdc-list-item--disabled{opacity:.5}mat-option ::ng-deep .mat-pseudo-checkbox{display:none}mat-option ::ng-deep .mdc-list-item__primary-text{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n", "mat-form-field{width:100%}mat-form-field.invalid ::ng-deep{--mat-form-field-filled-label-text-color: var(--color-error);--mat-form-field-filled-hover-label-text-color: var(--color-error);--mat-form-field-filled-focus-label-text-color: var(--color-error)}mat-form-field.invalid ::ng-deep .mdc-text-field{outline:2px solid var(--color-error);outline-offset:-2px}mat-form-field.invalid ::ng-deep .mdc-text-field ads-icon{stroke:var(--mat-form-field-filled-error-label-text-color)!important;color:var(--mat-form-field-filled-error-label-text-color)!important}mat-form-field.wrap-trigger-text ::ng-deep .auto-resize-textarea{resize:none;overflow:hidden;min-height:24px;max-height:120px;line-height:1.4;padding-top:12px;padding-bottom:12px;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word}mat-form-field.wrap-trigger-text ::ng-deep .mdc-text-field{min-height:48px;height:auto}mat-form-field.wrap-trigger-text ::ng-deep .mat-mdc-form-field-infix{min-height:24px;padding-top:0;padding-bottom:0}mat-form-field.has-label.wrap-trigger-text ::ng-deep .auto-resize-textarea{padding-top:0;padding-bottom:0}mat-option.extra{opacity:1;font-size:.75rem;min-height:32px;display:flex}mat-option.extra ::ng-deep .mdc-list-item__primary-text{opacity:1}mat-option.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;min-height:48px;height:auto;line-height:1.4}mat-option.wrap-text span{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option span.wrap-text{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.4}mat-option ::ng-deep .highlighted-text{font-weight:700}.prepend-option-container{font-size:.75rem;display:flex;align-items:center;min-height:32px;padding:0 12px;cursor:default;pointer-events:none;color:var(--color-medium);font-weight:600}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
5214
5230
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { optionRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], externalButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "externalButton", required: false }] }], externalButtonClick: [{ type: i0.Output, args: ["externalButtonClick"] }], maxlength: [{
5215
5231
  type: Input
5216
5232
  }], panelClass: [{
@@ -5382,11 +5398,11 @@ class AdsSearchInputComponent extends AdsInputComponent {
5382
5398
  return this.valueControl.value || this.searchEmptyValue;
5383
5399
  }
5384
5400
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsSearchInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5385
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsSearchInputComponent, isStandalone: false, selector: "ads-search-input", inputs: { searchCallback: "searchCallback", isIconClickable: "isIconClickable", searchEmptyValue: "searchEmptyValue", loading: "loading" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n matInput\n (keydown.enter)=\"onSearch()\"\n [maxlength]=\"maxlength\"\n [attr.pattern]=\"pattern\"\n [id]=\"id\"\n [type]=\"type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n\n @if (loading) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n } @else {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canClick\"\n (click)=\"canClick ? onSearch() : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
5401
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsSearchInputComponent, isStandalone: false, selector: "ads-search-input", inputs: { searchCallback: "searchCallback", isIconClickable: "isIconClickable", searchEmptyValue: "searchEmptyValue", loading: "loading" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n matInput\n (keydown.enter)=\"onSearch()\"\n [maxlength]=\"maxlength\"\n [attr.pattern]=\"pattern\"\n [id]=\"id\"\n [type]=\"type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n\n @if (loading) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n } @else {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canClick\"\n (click)=\"canClick ? onSearch() : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
5386
5402
  }
5387
5403
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsSearchInputComponent, decorators: [{
5388
5404
  type: Component,
5389
- args: [{ selector: 'ads-search-input', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n matInput\n (keydown.enter)=\"onSearch()\"\n [maxlength]=\"maxlength\"\n [attr.pattern]=\"pattern\"\n [id]=\"id\"\n [type]=\"type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n\n @if (loading) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n } @else {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canClick\"\n (click)=\"canClick ? onSearch() : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
5405
+ args: [{ selector: 'ads-search-input', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'success-label': canShowSuccess(),\n 'error-label': canShowError(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <input\n matInput\n (keydown.enter)=\"onSearch()\"\n [maxlength]=\"maxlength\"\n [attr.pattern]=\"pattern\"\n [id]=\"id\"\n [type]=\"type\"\n [formControl]=\"valueControl\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" class=\"cross-icon\" />\n </button>\n }\n\n @if (loading) {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"true\"\n class=\"action-icon\"\n >\n <ads-icon name=\"loading\" [stroke]=\"'iconPrimary'\" [size]=\"smallSize ? 'xxs' : 'xs'\" />\n </button>\n } @else {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n [disabled]=\"!canClick\"\n (click)=\"canClick ? onSearch() : null\"\n class=\"action-icon\"\n >\n <ads-icon name=\"search\" size=\"xs\" [theme]=\"'iconPrimary'\" class=\"search-icon\" />\n </button>\n }\n </mat-form-field>\n\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
5390
5406
  }], ctorParameters: () => [], propDecorators: { searchCallback: [{
5391
5407
  type: Input
5392
5408
  }], isIconClickable: [{
@@ -6124,11 +6140,11 @@ class AdsDatetimepickerComponent extends AbstractInputComponent {
6124
6140
  return this.removeOffset(value, this.getRequiredOffset(value));
6125
6141
  }
6126
6142
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDatetimepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6127
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDatetimepickerComponent, isStandalone: false, selector: "ads-datetimepicker", inputs: { twelveHour: "twelveHour", offset: "offset", allowPastValues: "allowPastValues", allowManualInput: "allowManualInput", useShortcuts: "useShortcuts", overrideDisplayFormat: "overrideDisplayFormat", showTimePicker: "showTimePicker", customDisplayFormat: "customDisplayFormat", timeInterval: "timeInterval", overlayCdkClass: "overlayCdkClass" }, viewQueries: [{ propertyName: "picker", first: true, predicate: MatDatetimepickerComponent, descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6143
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDatetimepickerComponent, isStandalone: false, selector: "ads-datetimepicker", inputs: { twelveHour: "twelveHour", offset: "offset", allowPastValues: "allowPastValues", allowManualInput: "allowManualInput", useShortcuts: "useShortcuts", overrideDisplayFormat: "overrideDisplayFormat", showTimePicker: "showTimePicker", customDisplayFormat: "customDisplayFormat", timeInterval: "timeInterval", overlayCdkClass: "overlayCdkClass" }, viewQueries: [{ propertyName: "picker", first: true, predicate: MatDatetimepickerComponent, descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6128
6144
  }
6129
6145
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDatetimepickerComponent, decorators: [{
6130
6146
  type: Component,
6131
- args: [{ selector: 'ads-datetimepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6147
+ args: [{ selector: 'ads-datetimepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6132
6148
  }], ctorParameters: () => [], propDecorators: { picker: [{
6133
6149
  type: ViewChild,
6134
6150
  args: [MatDatetimepickerComponent]
@@ -6658,11 +6674,11 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
6658
6674
  date.getDate() === day;
6659
6675
  }
6660
6676
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
6661
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDatepickerComponent, isStandalone: false, selector: "ads-datepicker", inputs: { customDisplayFormat: "customDisplayFormat", closeOnOutOfView: "closeOnOutOfView", outOfViewRootMargin: "outOfViewRootMargin" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6677
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsDatepickerComponent, isStandalone: false, selector: "ads-datepicker", inputs: { customDisplayFormat: "customDisplayFormat", closeOnOutOfView: "closeOnOutOfView", outOfViewRootMargin: "outOfViewRootMargin" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6662
6678
  }
6663
6679
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsDatepickerComponent, decorators: [{
6664
6680
  type: Component,
6665
- args: [{ selector: 'ads-datepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6681
+ args: [{ selector: 'ads-datepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6666
6682
  }], propDecorators: { customDisplayFormat: [{
6667
6683
  type: Input
6668
6684
  }], closeOnOutOfView: [{
@@ -6792,11 +6808,11 @@ class AdsTimepickerComponent extends AdsDatetimepickerComponent {
6792
6808
  super.onSyncDisplayedValue(valueToApply);
6793
6809
  }
6794
6810
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsTimepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6795
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsTimepickerComponent, isStandalone: false, selector: "ads-timepicker", inputs: { customDisplayFormat: "customDisplayFormat" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6811
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsTimepickerComponent, isStandalone: false, selector: "ads-timepicker", inputs: { customDisplayFormat: "customDisplayFormat" }, usesInheritance: true, ngImport: i0, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: DateTimePickerFormatDirective, selector: "[dateTimePickerFormat]", inputs: ["customDisplayFormat", "overrideDisplayFormat"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
6796
6812
  }
6797
6813
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsTimepickerComponent, decorators: [{
6798
6814
  type: Component,
6799
- args: [{ selector: 'ads-timepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field.suppress-validation.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-medium);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6815
+ args: [{ selector: 'ads-timepicker', standalone: false, template: "<div [ngStyle]=\"{ minWidth: containerMinWidth }\" class=\"ads-field-container\">\n <div [ngStyle]=\"{ width: width }\">\n <mat-form-field\n [ngClass]=\"{\n 'immediate-validation': immediateValidation,\n 'no-left-padding': !showExclamation,\n invalid: canShowError(),\n manual: allowManualInput,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n 'suppress-validation': !showValidationError,\n }\"\n [ngStyle]=\"{ width: width }\"\n >\n @if ((label || required) && !smallSize) {\n <mat-label>{{ label }}</mat-label>\n }\n <mat-datetimepicker\n #datetimePicker\n (viewChanged)=\"onViewChanged($event)\"\n (opened)=\"onOpened()\"\n (closed)=\"onClosed()\"\n [type]=\"type === 'datetime' ? (showTimePicker ? 'datetime' : 'date') : type\"\n [openOnFocus]=\"!allowManualInput\"\n [twelvehour]=\"twelveHour\"\n [timeInterval]=\"timeInterval\"\n [mode]=\"'portrait'\"\n />\n <input\n (dateChange)=\"onChanged($event)\"\n dateTimePickerFormat\n [overrideDisplayFormat]=\"overrideDisplayFormat || (type === 'datetime' ? !showTimePicker : false)\"\n [customDisplayFormat]=\"customDisplayFormatOverride\"\n #input\n matInput\n (keydown)=\"allowManualInput ? onKeyDown($event) : null\"\n (blur)=\"touchControls()\"\n [tabIndex]=\"allowManualInput ? 0 : -1\"\n [min]=\"minDate || null\"\n [readonly]=\"!allowManualInput\"\n [formControl]=\"displayControl\"\n [matDatetimepicker]=\"datetimePicker\"\n autocomplete=\"false\"\n [id]=\"id\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n />\n\n @if (canClear) {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"clear($event)\" class=\"action-icon\">\n <ads-icon class=\"cross-icon\" name=\"cross\" [size]=\"smallSize ? 'xxs' : 'xs'\" [theme]=\"'iconPrimary'\" />\n </button>\n }\n\n @if (type === 'time') {\n <button\n matTextSuffix\n type=\"button\"\n mat-icon-button\n (click)=\"toggle($event)\"\n [disabled]=\"!showTimePicker\"\n class=\"action-icon\"\n >\n <ads-icon class=\"picker\" name=\"timepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n </button>\n } @else {\n <button matTextSuffix type=\"button\" mat-icon-button (click)=\"toggle($event)\" class=\"action-icon\">\n <ads-icon class=\"picker\" name=\"datepicker\" [size]=\"smallSize ? 'xxs' : 'xs'\" [stroke]=\"'iconPrimary'\" />\n @if (type === 'datetime') {\n <ads-icon\n class=\"sub-timepicker mat-mdc-button-persistent-ripple picker\"\n name=\"status_processing\"\n [size]=\"smallSize ? 'xxxxs' : 'xxxs'\"\n [stroke]=\"'iconPrimary'\"\n />\n }\n </button>\n }\n </mat-form-field>\n @if (showFooter) {\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n }\n </div>\n @if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [href]=\"tooltipHref\" />\n }\n</div>\n", styles: [".ads-field-container{display:flex;gap:12px;align-items:flex-start}.ads-field-container.shrink{min-width:0}.ads-field-container.shrink>div{min-width:0;width:100%}.ads-field-container.shrink mat-form-field{min-width:0;width:100%}.ads-field-container.shrink .mdc-text-field,.ads-field-container.shrink .mat-mdc-form-field-flex{min-width:0}.ads-field-container.shrink .mat-mdc-form-field-infix{min-width:0;width:0;flex:1 1 0}.ads-field-container.shrink .mat-mdc-select,.ads-field-container.shrink .mat-mdc-select-trigger{min-width:0}.ads-field-container.shrink .mat-mdc-select-value{min-width:0;max-width:100%}.ads-field-container.shrink .mat-mdc-select-value-text,.ads-field-container.shrink .mat-mdc-select-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ads-input-right-hint{position:absolute;right:40px;top:50%;transform:translateY(-50%);color:var(--color-light);font-size:.95em;pointer-events:none;z-index:2;background:transparent;white-space:nowrap}:host::ng-deep mat-form-field{--mat-form-field-filled-container-color: var(--color-white);--mat-form-field-filled-input-text-color: var(--color-medium);--mat-form-field-filled-error-label-text-color: var(--color-error);--mat-form-field-filled-error-hover-label-text-color: var(--color-error);--mat-form-field-filled-label-text-color: var(--color-medium);--mat-form-field-filled-focus-label-text-color: var(--color-medium);--mat-form-field-filled-hover-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-label-text-color: var(--color-medium);--mat-form-field-filled-disabled-container-color: var(--color-muted) !important;--mat-form-field-filled-disabled-input-text-color: var(--color-medium) !important;--mat-form-field-filled-error-focus-label-text-color: var(--color-error);--mat-form-field-filled-label-text-size: 16px}:host::ng-deep mat-form-field .mdc-floating-label--float-above{--mat-form-field-filled-label-text-size: 12px}:host::ng-deep mat-form-field .mdc-icon-button:focus-visible,:host::ng-deep mat-form-field .mat-mdc-icon-button:focus-visible{background-color:var(--color-light-30)}:host::ng-deep mat-form-field .mdc-text-field{box-sizing:border-box;border-radius:5px;outline:1px solid var(--color-light);outline-offset:-1px;align-items:center;padding:0 12px;cursor:text;height:48px}:host::ng-deep mat-form-field .mdc-text-field .cross-icon{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex{height:100%}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--no-label .mat-mdc-form-field-flex .mat-mdc-form-field-infix{align-items:center}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-outer-spin-button,:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input[type=number]{-moz-appearance:textfield}:host::ng-deep mat-form-field .mdc-text-field:not(.mdc-text-field--no-label) .mat-mdc-form-field-infix input{height:24px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-error)!important}:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-error)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid{outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .cross-icon,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .visibility-eye,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .picker{stroke:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .chevron-down,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .status_processing,:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .search-icon{color:var(--color-medium)!important}:host::ng-deep mat-form-field.suppress-validation .mdc-text-field.mdc-text-field--invalid .mdc-floating-label{color:var(--mat-form-field-filled-label-text-color)!important}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex{align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{display:flex;align-items:flex-end;width:120px}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label{width:100%}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix label .mat-mdc-form-field-required-marker{color:var(--mat-form-field-filled-error-label-text-color)}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix{display:flex;align-items:center}:host::ng-deep mat-form-field .mdc-text-field .mat-mdc-form-field-text-suffix .mat-mdc-icon-button{display:flex;align-items:center;justify-content:center}:host::ng-deep mat-form-field .action-icon{padding:0;--mat-icon-button-state-layer-size: 35px}:host::ng-deep mat-form-field .action-icon .mat-mdc-button-touch-target{height:unset;width:unset}:host::ng-deep mat-form-field .time-picker-button{cursor:default}:host::ng-deep mat-form-field .time-picker-button .mdc-icon-button__ripple{display:none!important}:host::ng-deep mat-form-field.x-small .mdc-text-field{height:24px;padding:0 8px}:host::ng-deep mat-form-field.x-small .mdc-text-field .mat-mdc-form-field-input-control{font-size:12px;line-height:16px}:host::ng-deep mat-form-field.x-small .action-icon{--mat-icon-button-state-layer-size: 18px}:host::ng-deep mat-form-field.mat-form-field-disabled .mdc-text-field{background-color:var(--mat-form-field-filled-disabled-container-color);border:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled) .mdc-text-field:hover .visibility-eye{fill:var(--color-light-30)!important}:host::ng-deep mat-form-field.read-only{pointer-events:none}:host::ng-deep mat-form-field.read-only .mdc-text-field{background-color:var(--mat-form-field-filled-container-color);cursor:default;outline:1px solid var(--color-light);outline-offset:-1px}:host::ng-deep mat-form-field.read-only .mdc-text-field input{pointer-events:none;-webkit-user-select:none;user-select:none}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only) .mdc-text-field:hover{background-color:var(--color-light-30);outline:2px solid var(--color-secondary-hover);outline-offset:-2px}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-muted)}:host::ng-deep mat-form-field:not(.mat-form-field-disabled):not(.read-only).mat-focused .mdc-text-field .visibility-eye{fill:var(--color-muted)!important}:host::ng-deep mat-form-field.immediate-validation .mdc-text-field.mdc-text-field--invalid{outline:2px solid var(--color-error);outline-offset:-2px}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper{color:var(--mat-form-field-filled-label-text-color)}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper:before{content:none}:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-error-wrapper,:host::ng-deep mat-form-field .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}:host::ng-deep mat-form-field .mdc-line-ripple{display:none}:host::ng-deep mat-form-field.success-label .mat-mdc-form-field-required-marker,:host::ng-deep mat-form-field.success-label mat-label{color:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .mdc-text-field{outline:2px solid var(--color-success);outline-offset:-2px}:host::ng-deep mat-form-field.success-label .cross-icon,:host::ng-deep mat-form-field.success-label .visibility-eye,:host::ng-deep mat-form-field.success-label .picker{stroke:var(--color-success)!important}:host::ng-deep mat-form-field.success-label .chevron-down,:host::ng-deep mat-form-field.success-label .status_processing,:host::ng-deep mat-form-field.success-label .search-icon{color:var(--color-success)!important}:host::ng-deep mat-form-field.error-label mat-label{color:var(--color-error)}:host::ng-deep mat-hint{display:inline-block}:host::ng-deep .mat-mdc-form-field-hint-spacer{display:none}.info-tooltip{position:relative;top:12px}mat-error{display:flex;padding-top:2px}mat-error .error{display:flex;align-items:flex-start;gap:2px}mat-error .error ads-icon{position:relative;top:2px}:host ::ng-deep .mdc-text-field{position:relative}:host ::ng-deep input[type=number]::-webkit-outer-spin-button,:host ::ng-deep input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:host ::ng-deep input[type=number]{-moz-appearance:textfield}\n", "button .sub-timepicker{position:absolute;top:0;left:5%;background-color:var(--color-white);border-radius:50%}mat-form-field:not(.manual) ::ng-deep .mdc-text-field{cursor:pointer}mat-form-field:not(.manual) ::ng-deep .mdc-text-field input{cursor:pointer}::ng-deep .mdc-text-field:hover button .sub-timepicker{background-color:var(--color-light-30)}\n", ".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
6800
6816
  }], ctorParameters: () => [], propDecorators: { customDisplayFormat: [{
6801
6817
  type: Input
6802
6818
  }] } });
@@ -12026,14 +12042,35 @@ class AdsInternationalPhoneFieldComponent extends AbstractInputComponent {
12026
12042
  this.dropdownControl.enable({ emitEvent: false });
12027
12043
  this.inputControl.enable({ emitEvent: false });
12028
12044
  }
12045
+ this.syncRequiredValidator();
12029
12046
  });
12030
12047
  const value = this.valueControl.value;
12031
12048
  if (value && !value.startsWith('+') && /^\d+$/.test(value)) {
12032
12049
  this.valueControl.setValue(`+${value}`);
12033
12050
  }
12034
- if (this.valueControl.hasValidator(Validators.required)) {
12035
- this.inputControl.addValidators([Validators.required]);
12036
- }
12051
+ this.syncRequiredValidator();
12052
+ // Monkey-patch validator mutation methods so required state is always synced to inputControl.
12053
+ // This mirrors the existing monkey-patches for setValue / reset above.
12054
+ const origAddValidators = this.valueControl.addValidators.bind(this.valueControl);
12055
+ this.valueControl.addValidators = ((validators) => {
12056
+ origAddValidators(validators);
12057
+ this.syncRequiredValidator();
12058
+ });
12059
+ const origRemoveValidators = this.valueControl.removeValidators.bind(this.valueControl);
12060
+ this.valueControl.removeValidators = ((validators) => {
12061
+ origRemoveValidators(validators);
12062
+ this.syncRequiredValidator();
12063
+ });
12064
+ const origSetValidators = this.valueControl.setValidators.bind(this.valueControl);
12065
+ this.valueControl.setValidators = ((validators) => {
12066
+ origSetValidators(validators);
12067
+ this.syncRequiredValidator();
12068
+ });
12069
+ const origClearValidators = this.valueControl.clearValidators.bind(this.valueControl);
12070
+ this.valueControl.clearValidators = (() => {
12071
+ origClearValidators();
12072
+ this.syncRequiredValidator();
12073
+ });
12037
12074
  if (value) {
12038
12075
  this.parsePhoneNumber(value);
12039
12076
  }
@@ -12098,6 +12135,10 @@ class AdsInternationalPhoneFieldComponent extends AbstractInputComponent {
12098
12135
  }
12099
12136
  }
12100
12137
  /** @ignore */
12138
+ ngDoCheck() {
12139
+ this.syncRequiredValidator();
12140
+ }
12141
+ /** @ignore */
12101
12142
  ngAfterViewInit() {
12102
12143
  super.ngAfterViewInit();
12103
12144
  const width = this.wrapperRef?.nativeElement.offsetWidth;
@@ -12119,6 +12160,10 @@ class AdsInternationalPhoneFieldComponent extends AbstractInputComponent {
12119
12160
  }
12120
12161
  /** @ignore */
12121
12162
  canShowError() {
12163
+ if (!this.showValidationError)
12164
+ return false;
12165
+ if (this.hasOnlyStaleRequiredError(this.inputControl))
12166
+ return false;
12122
12167
  return !!this.inputControl.errors && (this.inputControl.touched || this.immediateValidation);
12123
12168
  }
12124
12169
  /** @ignore */
@@ -12151,12 +12196,25 @@ class AdsInternationalPhoneFieldComponent extends AbstractInputComponent {
12151
12196
  return `${this.genericError} (${firstErrorKey})`;
12152
12197
  }
12153
12198
  }
12199
+ /** @ignore */
12200
+ syncRequiredValidator() {
12201
+ const isRequired = this.hasRequiredValidatorCheck(this.valueControl);
12202
+ const inputHasRequired = this.inputControl.hasValidator(Validators.required);
12203
+ if (isRequired && !inputHasRequired) {
12204
+ this.inputControl.addValidators(Validators.required);
12205
+ this.inputControl.updateValueAndValidity({ emitEvent: false });
12206
+ }
12207
+ else if (!isRequired && inputHasRequired) {
12208
+ this.inputControl.removeValidators(Validators.required);
12209
+ this.inputControl.updateValueAndValidity({ emitEvent: false });
12210
+ }
12211
+ }
12154
12212
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsInternationalPhoneFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
12155
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsInternationalPhoneFieldComponent, isStandalone: false, selector: "ads-international-phone-field", inputs: { dropdownId: { classPropertyName: "dropdownId", publicName: "dropdownId", isSignal: false, isRequired: false, transformFunction: null }, selectedCountry: { classPropertyName: "selectedCountry", publicName: "selectedCountry", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutOfView: { classPropertyName: "closeOnOutOfView", publicName: "closeOnOutOfView", isSignal: false, isRequired: false, transformFunction: null }, outOfViewRootMargin: { classPropertyName: "outOfViewRootMargin", publicName: "outOfViewRootMargin", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "wrapperRef", first: true, predicate: ["wrapperRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-field-wrapper\" [ngStyle]=\"{ width: width }\" #wrapperRef>\n <div class=\"form-controls-wrapper\">\n <div\n class=\"select-box\"\n [ngClass]=\"{ invalid: showValidationError && valueControl.invalid && valueControl.touched }\"\n [ngStyle]=\"{ width: '87px' }\"\n >\n <ads-dropdown\n [control]=\"dropdownControl\"\n [id]=\"dropdownId\"\n [options]=\"countryOptions\"\n [immediateValidation]=\"immediateValidation\"\n [showValidationError]=\"showValidationError\"\n [optionTemplate]=\"optionTemplate\"\n [fitContent]=\"true\"\n [showFooter]=\"false\"\n [checkSelected]=\"false\"\n [size]=\"size\"\n [successMessage]=\"successMessage\"\n [triggerTemplate]=\"triggerTemplate\"\n [panelClass]=\"'full-width-panel'\"\n [closeOnOutOfView]=\"closeOnOutOfView\"\n [outOfViewRootMargin]=\"outOfViewRootMargin\"\n />\n </div>\n <div\n class=\"text-box\"\n [ngClass]=\"{\n invalid: showValidationError && dropdownControl.invalid && dropdownControl.touched,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n }\"\n [ngStyle]=\"{ width: '100%' }\"\n >\n <ads-input\n [control]=\"inputControl\"\n [mask]=\"phoneMask\"\n [id]=\"id\"\n [width]=\"'100%'\"\n [placeholder]=\"placeholder\"\n [label]=\"label\"\n [showClearButton]=\"showClearButton\"\n [showExclamationOnError]=\"showExclamationOnError\"\n [showValidationError]=\"showValidationError\"\n [skipValidationWhenEmpty]=\"skipValidationWhenEmpty\"\n [immediateValidation]=\"immediateValidation\"\n [dropSpecialCharacters]=\"true\"\n [showFooter]=\"false\"\n [size]=\"size\"\n [onBlur]=\"onInputBlur\"\n />\n </div>\n\n </div>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n</div>\n@if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n}\n\n<ng-template #optionTemplate let-option=\"option\">\n <div class=\"flag-option\">\n <div>\n <img [src]=\"getFlag(option)\" alt=\"flag\"/>\n <span>{{option.name}}</span>\n </div>\n <span class=\"code\">{{option.code}}</span>\n </div>\n</ng-template>\n\n<ng-template #triggerTemplate let-option=\"option\">\n <span>{{ option.code }}</span>\n</ng-template>\n", styles: [".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n", ":host{display:flex;gap:12px;align-items:flex-start}.form-field-wrapper{display:flex;flex-direction:column}.form-field-wrapper .form-controls-wrapper{display:flex;width:100%}.form-field-wrapper .invalid ::ng-deep .mdc-text-field{border-color:var(--mdc-filled-text-field-error-label-text-color)}.form-field-wrapper .invalid.text-box ::ng-deep .mdc-text-field{border-right-width:1px}.form-field-wrapper .invalid.select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent}.form-field-wrapper .select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}.form-field-wrapper .text-box{z-index:1}.form-field-wrapper .text-box ::ng-deep .mdc-text-field{border-top-left-radius:0;border-bottom-left-radius:0}.flag-option{display:flex;justify-content:space-between;align-items:center;width:100%}.flag-option div{display:flex;gap:8px;align-items:center}.flag-option div img{width:29px;height:19px}.flag-option span{font-size:16px;color:var(--color-medium);line-height:21px}.flag-option .code{color:var(--color-dark)}::ng-deep .full-width-panel{width:var(--full-width-panel)!important;min-width:var(--full-width-panel)!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: AdsInputComponent, selector: "ads-input", inputs: ["maxlength", "type", "pattern", "defaultValue", "isPasswordField", "showClockIcon", "mask", "suffix", "prefix", "dropSpecialCharacters", "thousandSeparator", "decimalMarker", "outputTransformFn", "matAutocomplete", "readOnly", "showSearchIcon", "onFocus", "onBlur", "rightHint"] }, { kind: "component", type: AdsDropdownComponent, selector: "ads-dropdown", inputs: ["displayValueFormatter", "mode", "hasEmptyValue", "checkSelected", "options", "optionTemplate", "triggerTemplate", "panelClass", "closeOnOutOfView", "outOfViewRootMargin"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
12213
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsInternationalPhoneFieldComponent, isStandalone: false, selector: "ads-international-phone-field", inputs: { dropdownId: { classPropertyName: "dropdownId", publicName: "dropdownId", isSignal: false, isRequired: false, transformFunction: null }, selectedCountry: { classPropertyName: "selectedCountry", publicName: "selectedCountry", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutOfView: { classPropertyName: "closeOnOutOfView", publicName: "closeOnOutOfView", isSignal: false, isRequired: false, transformFunction: null }, outOfViewRootMargin: { classPropertyName: "outOfViewRootMargin", publicName: "outOfViewRootMargin", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "wrapperRef", first: true, predicate: ["wrapperRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-field-wrapper\" [ngStyle]=\"{ width: width }\" #wrapperRef>\n <div class=\"form-controls-wrapper\">\n <div\n class=\"select-box\"\n [ngClass]=\"{ invalid: showValidationError && valueControl.invalid && valueControl.touched }\"\n [ngStyle]=\"{ width: '87px' }\"\n >\n <ads-dropdown\n [control]=\"dropdownControl\"\n [id]=\"dropdownId\"\n [options]=\"countryOptions\"\n [immediateValidation]=\"immediateValidation\"\n [showValidationError]=\"showValidationError\"\n [optionTemplate]=\"optionTemplate\"\n [fitContent]=\"true\"\n [showFooter]=\"false\"\n [checkSelected]=\"false\"\n [size]=\"size\"\n [successMessage]=\"successMessage\"\n [triggerTemplate]=\"triggerTemplate\"\n [panelClass]=\"'full-width-panel'\"\n [closeOnOutOfView]=\"closeOnOutOfView\"\n [outOfViewRootMargin]=\"outOfViewRootMargin\"\n />\n </div>\n <div\n class=\"text-box\"\n [ngClass]=\"{\n invalid: showValidationError && valueControl.invalid && valueControl.touched,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n }\"\n [ngStyle]=\"{ width: '100%' }\"\n >\n <ads-input\n [control]=\"inputControl\"\n [mask]=\"phoneMask\"\n [id]=\"id\"\n [width]=\"'100%'\"\n [placeholder]=\"placeholder\"\n [label]=\"label\"\n [showClearButton]=\"showClearButton\"\n [showExclamationOnError]=\"showExclamationOnError\"\n [showValidationError]=\"showValidationError\"\n [skipValidationWhenEmpty]=\"skipValidationWhenEmpty\"\n [immediateValidation]=\"immediateValidation\"\n [dropSpecialCharacters]=\"true\"\n [showFooter]=\"false\"\n [size]=\"size\"\n [onBlur]=\"onInputBlur\"\n />\n </div>\n\n </div>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n</div>\n@if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n}\n\n<ng-template #optionTemplate let-option=\"option\">\n <div class=\"flag-option\">\n <div>\n <img [src]=\"getFlag(option)\" alt=\"flag\"/>\n <span>{{option.name}}</span>\n </div>\n <span class=\"code\">{{option.code}}</span>\n </div>\n</ng-template>\n\n<ng-template #triggerTemplate let-option=\"option\">\n <span>{{ option.code }}</span>\n</ng-template>\n", styles: [".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n", ":host{display:flex;gap:12px;align-items:flex-start}.form-field-wrapper{display:flex;flex-direction:column}.form-field-wrapper .form-controls-wrapper{display:flex;width:100%}.form-field-wrapper .invalid ::ng-deep .mdc-text-field{border-color:var(--mdc-filled-text-field-error-label-text-color)}.form-field-wrapper .invalid.text-box ::ng-deep .mdc-text-field{border-right-width:1px}.form-field-wrapper .invalid.select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent}.form-field-wrapper .select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}.form-field-wrapper .text-box{z-index:1}.form-field-wrapper .text-box ::ng-deep .mdc-text-field{border-top-left-radius:0;border-bottom-left-radius:0}.flag-option{display:flex;justify-content:space-between;align-items:center;width:100%}.flag-option div{display:flex;gap:8px;align-items:center}.flag-option div img{width:29px;height:19px}.flag-option span{font-size:16px;color:var(--color-medium);line-height:21px}.flag-option .code{color:var(--color-dark)}::ng-deep .full-width-panel{width:var(--full-width-panel)!important;min-width:var(--full-width-panel)!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: AdsInputComponent, selector: "ads-input", inputs: ["maxlength", "type", "pattern", "defaultValue", "isPasswordField", "showClockIcon", "mask", "suffix", "prefix", "dropSpecialCharacters", "thousandSeparator", "decimalMarker", "outputTransformFn", "matAutocomplete", "readOnly", "showSearchIcon", "onFocus", "onBlur", "rightHint"] }, { kind: "component", type: AdsDropdownComponent, selector: "ads-dropdown", inputs: ["displayValueFormatter", "mode", "hasEmptyValue", "checkSelected", "options", "optionTemplate", "triggerTemplate", "panelClass", "closeOnOutOfView", "outOfViewRootMargin"] }, { kind: "component", type: AdsErrorComponent, selector: "ads-error", inputs: ["error"] }, { kind: "component", type: AdsHintComponent, selector: "ads-hint", inputs: ["control", "hint"] }, { kind: "component", type: AdsInputTooltipComponent, selector: "ads-input-tooltip", inputs: ["tooltip", "smallSize", "href"] }, { kind: "component", type: AdsSuccessComponent, selector: "ads-success", inputs: ["success"] }] }); }
12156
12214
  }
12157
12215
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsInternationalPhoneFieldComponent, decorators: [{
12158
12216
  type: Component,
12159
- args: [{ selector: 'ads-international-phone-field', standalone: false, template: "<div class=\"form-field-wrapper\" [ngStyle]=\"{ width: width }\" #wrapperRef>\n <div class=\"form-controls-wrapper\">\n <div\n class=\"select-box\"\n [ngClass]=\"{ invalid: showValidationError && valueControl.invalid && valueControl.touched }\"\n [ngStyle]=\"{ width: '87px' }\"\n >\n <ads-dropdown\n [control]=\"dropdownControl\"\n [id]=\"dropdownId\"\n [options]=\"countryOptions\"\n [immediateValidation]=\"immediateValidation\"\n [showValidationError]=\"showValidationError\"\n [optionTemplate]=\"optionTemplate\"\n [fitContent]=\"true\"\n [showFooter]=\"false\"\n [checkSelected]=\"false\"\n [size]=\"size\"\n [successMessage]=\"successMessage\"\n [triggerTemplate]=\"triggerTemplate\"\n [panelClass]=\"'full-width-panel'\"\n [closeOnOutOfView]=\"closeOnOutOfView\"\n [outOfViewRootMargin]=\"outOfViewRootMargin\"\n />\n </div>\n <div\n class=\"text-box\"\n [ngClass]=\"{\n invalid: showValidationError && dropdownControl.invalid && dropdownControl.touched,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n }\"\n [ngStyle]=\"{ width: '100%' }\"\n >\n <ads-input\n [control]=\"inputControl\"\n [mask]=\"phoneMask\"\n [id]=\"id\"\n [width]=\"'100%'\"\n [placeholder]=\"placeholder\"\n [label]=\"label\"\n [showClearButton]=\"showClearButton\"\n [showExclamationOnError]=\"showExclamationOnError\"\n [showValidationError]=\"showValidationError\"\n [skipValidationWhenEmpty]=\"skipValidationWhenEmpty\"\n [immediateValidation]=\"immediateValidation\"\n [dropSpecialCharacters]=\"true\"\n [showFooter]=\"false\"\n [size]=\"size\"\n [onBlur]=\"onInputBlur\"\n />\n </div>\n\n </div>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n</div>\n@if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n}\n\n<ng-template #optionTemplate let-option=\"option\">\n <div class=\"flag-option\">\n <div>\n <img [src]=\"getFlag(option)\" alt=\"flag\"/>\n <span>{{option.name}}</span>\n </div>\n <span class=\"code\">{{option.code}}</span>\n </div>\n</ng-template>\n\n<ng-template #triggerTemplate let-option=\"option\">\n <span>{{ option.code }}</span>\n</ng-template>\n", styles: [".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n", ":host{display:flex;gap:12px;align-items:flex-start}.form-field-wrapper{display:flex;flex-direction:column}.form-field-wrapper .form-controls-wrapper{display:flex;width:100%}.form-field-wrapper .invalid ::ng-deep .mdc-text-field{border-color:var(--mdc-filled-text-field-error-label-text-color)}.form-field-wrapper .invalid.text-box ::ng-deep .mdc-text-field{border-right-width:1px}.form-field-wrapper .invalid.select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent}.form-field-wrapper .select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}.form-field-wrapper .text-box{z-index:1}.form-field-wrapper .text-box ::ng-deep .mdc-text-field{border-top-left-radius:0;border-bottom-left-radius:0}.flag-option{display:flex;justify-content:space-between;align-items:center;width:100%}.flag-option div{display:flex;gap:8px;align-items:center}.flag-option div img{width:29px;height:19px}.flag-option span{font-size:16px;color:var(--color-medium);line-height:21px}.flag-option .code{color:var(--color-dark)}::ng-deep .full-width-panel{width:var(--full-width-panel)!important;min-width:var(--full-width-panel)!important}\n"] }]
12217
+ args: [{ selector: 'ads-international-phone-field', standalone: false, template: "<div class=\"form-field-wrapper\" [ngStyle]=\"{ width: width }\" #wrapperRef>\n <div class=\"form-controls-wrapper\">\n <div\n class=\"select-box\"\n [ngClass]=\"{ invalid: showValidationError && valueControl.invalid && valueControl.touched }\"\n [ngStyle]=\"{ width: '87px' }\"\n >\n <ads-dropdown\n [control]=\"dropdownControl\"\n [id]=\"dropdownId\"\n [options]=\"countryOptions\"\n [immediateValidation]=\"immediateValidation\"\n [showValidationError]=\"showValidationError\"\n [optionTemplate]=\"optionTemplate\"\n [fitContent]=\"true\"\n [showFooter]=\"false\"\n [checkSelected]=\"false\"\n [size]=\"size\"\n [successMessage]=\"successMessage\"\n [triggerTemplate]=\"triggerTemplate\"\n [panelClass]=\"'full-width-panel'\"\n [closeOnOutOfView]=\"closeOnOutOfView\"\n [outOfViewRootMargin]=\"outOfViewRootMargin\"\n />\n </div>\n <div\n class=\"text-box\"\n [ngClass]=\"{\n invalid: showValidationError && valueControl.invalid && valueControl.touched,\n 'success-label': canShowSuccess(),\n 'x-small': smallSize,\n }\"\n [ngStyle]=\"{ width: '100%' }\"\n >\n <ads-input\n [control]=\"inputControl\"\n [mask]=\"phoneMask\"\n [id]=\"id\"\n [width]=\"'100%'\"\n [placeholder]=\"placeholder\"\n [label]=\"label\"\n [showClearButton]=\"showClearButton\"\n [showExclamationOnError]=\"showExclamationOnError\"\n [showValidationError]=\"showValidationError\"\n [skipValidationWhenEmpty]=\"skipValidationWhenEmpty\"\n [immediateValidation]=\"immediateValidation\"\n [dropSpecialCharacters]=\"true\"\n [showFooter]=\"false\"\n [size]=\"size\"\n [onBlur]=\"onInputBlur\"\n />\n </div>\n\n </div>\n <div class=\"footer-container\"\n [class.dynamic]=\"!isStaticFooter\"\n [class.has-content]=\"hasFooterContent()\">\n @if (canShowError()) {\n <ads-error [error]=\"displayFirstError()\" [ngStyle]=\"{ width: width }\" />\n } @else if (canShowSuccess()) {\n <ads-success [success]=\"successMessage!\" [ngStyle]=\"{ width: width }\" />\n } @else if (hint) {\n <ads-hint [hint]=\"hint\" [control]=\"valueControl\" [ngStyle]=\"{ width: width }\" />\n }\n </div>\n</div>\n@if (tooltip) {\n <ads-input-tooltip [tooltip]=\"tooltip\" [smallSize]=\"smallSize\" [href]=\"tooltipHref\" />\n}\n\n<ng-template #optionTemplate let-option=\"option\">\n <div class=\"flag-option\">\n <div>\n <img [src]=\"getFlag(option)\" alt=\"flag\"/>\n <span>{{option.name}}</span>\n </div>\n <span class=\"code\">{{option.code}}</span>\n </div>\n</ng-template>\n\n<ng-template #triggerTemplate let-option=\"option\">\n <span>{{ option.code }}</span>\n</ng-template>\n", styles: [".footer-container{min-height:20px;overflow:hidden}.footer-container.dynamic{min-height:0;max-height:0;opacity:0;transition:max-height .3s ease-in-out,opacity .2s ease-in-out,min-height .3s ease-in-out}.footer-container.dynamic.has-content{min-height:20px;max-height:100px;opacity:1;transition:max-height .3s ease-in-out,opacity .3s ease-in-out .1s,min-height .3s ease-in-out}::ng-deep .mat-mdc-form-field{--mat-form-field-filled-input-text-placeholder-color: var(--color-medium) !important}::ng-deep .spinner{animation:spin 1s linear infinite;transform-origin:50% 50%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n", ":host{display:flex;gap:12px;align-items:flex-start}.form-field-wrapper{display:flex;flex-direction:column}.form-field-wrapper .form-controls-wrapper{display:flex;width:100%}.form-field-wrapper .invalid ::ng-deep .mdc-text-field{border-color:var(--mdc-filled-text-field-error-label-text-color)}.form-field-wrapper .invalid.text-box ::ng-deep .mdc-text-field{border-right-width:1px}.form-field-wrapper .invalid.select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent}.form-field-wrapper .select-box ::ng-deep .mdc-text-field{border-left-width:1px;border-left-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}.form-field-wrapper .text-box{z-index:1}.form-field-wrapper .text-box ::ng-deep .mdc-text-field{border-top-left-radius:0;border-bottom-left-radius:0}.flag-option{display:flex;justify-content:space-between;align-items:center;width:100%}.flag-option div{display:flex;gap:8px;align-items:center}.flag-option div img{width:29px;height:19px}.flag-option span{font-size:16px;color:var(--color-medium);line-height:21px}.flag-option .code{color:var(--color-dark)}::ng-deep .full-width-panel{width:var(--full-width-panel)!important;min-width:var(--full-width-panel)!important}\n"] }]
12160
12218
  }], ctorParameters: () => [], propDecorators: { dropdownId: [{
12161
12219
  type: Input
12162
12220
  }], selectedCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedCountry", required: false }] }], closeOnOutOfView: [{