@alauda-fe/dynamic-plugin-shared 0.0.3-alpha.3 → 0.0.4-alpha.10

package/fesm2022/alauda-fe-dynamic-plugin-shared.mjs

@@ -1,41 +1,36 @@
 import * as i1 from '@alauda/ui';
-import { rgbColor, ThemeService, coerceAttrBoolean, FormItemControlDirective, observeResizeOn, MessageService, NotificationService, DIALOG_DATA, DialogModule, ButtonModule, InputModule, IconModule, FormModule, handlePixel, isTemplateRef, ThemePickerPipe, TooltipModule, TooltipType, ButtonComponent, IconComponent, TagComponent, TooltipDirective, DateNavRange, InputGroupComponent, InputSuffixDirective, InputComponent, DateRangePickerPanelComponent, TagType, TagModule, TooltipComponent, BaseTooltip, TooltipTrigger, INPUT_GROUP_MODULE, SelectModule, FORM_MODULE, DropdownModule, CheckboxModule, CardComponent, TOOLTIP_MODULE, CheckboxComponent, BackTopComponent, SortDirective, SortHeaderComponent, PaginatorComponent, TABLE_MODULE, DROPDOWN_MODULE, DialogRef, DIALOG_MODULE, CARD_MODULE, CHECKBOX_MODULE } from '@alauda/ui';
-import { last, cloneDeep, has, unset, get, isBoolean, sortBy, set, trim, isFunction, range, debounce, uniq, identity, first, isString, isEmpty, isObjectLike, snakeCase } from 'lodash-es';
-import * as i2$1 from '@alauda-fe/dynamic-plugin-sdk';
-import { parseBase64Type, isBlank, publishRef, TOKEN_BASE_DOMAIN, stringify as stringify$1, isEqual, TimeService, TranslateService, isZhLang, FALLBACK_LANGUAGE, TranslatePipe, ObservableInput, FeatureGateService, FieldNotAvailablePipe, ValueHook, LoadingMaskComponent, PurePipe, StandardTimePipe, RelativeTimePipe, skipError, CURR_ESCAPE_DEACTIVATE_GUARD, ESCAPE_DEACTIVATE_GUARD, parseAll, FIELD_NOT_AVAILABLE_PLACEHOLDER, noop, SafePipe, WatchEvent, K8sUtilService, isFieldNotAvailable, K8S_UTIL_PIPES_MODULE, K8sApiService, TRANSLATE_MODULE } from '@alauda-fe/dynamic-plugin-sdk';
-import { Observable, finalize, map, startWith, catchError, of, isObservable, switchMap, animationFrameScheduler, fromEvent, auditTime, Subject, takeUntil, distinctUntilChanged, combineLatest, filter, debounceTime, take, merge, pairwise, tap, BehaviorSubject, from, timer, ReplaySubject, delay, withLatestFrom, scan, takeWhile, concat, exhaustMap, EMPTY as EMPTY$1, interval, NEVER, switchScan, mapTo } from 'rxjs';
-import * as i2$2 from '@angular/router';
+import { rgbColor, ThemeService, coerceAttrBoolean, FormItemControlDirective, observeResizeOn, MessageService, NotificationService, DIALOG_DATA, DialogModule, ButtonModule, InputModule, IconModule, FormModule, MultiSelectComponent, handlePixel, isTemplateRef, ThemePickerPipe, TooltipModule, TooltipType, ButtonComponent, IconComponent, TagComponent, TooltipDirective, DateNavRange, InputGroupComponent, InputSuffixDirective, InputComponent, DateRangePickerPanelComponent, TagType, TagModule, TooltipComponent, BaseTooltip, TooltipTrigger, DialogService, INPUT_GROUP_MODULE, SelectModule, FORM_MODULE, DropdownModule, CheckboxModule, CardComponent, TOOLTIP_MODULE, CheckboxComponent, BackTopComponent, SortDirective, SortHeaderComponent, PaginatorComponent, TABLE_MODULE, DROPDOWN_MODULE, DialogRef, DIALOG_MODULE, CARD_MODULE, CHECKBOX_MODULE, TabsModule } from '@alauda/ui';
+import { last, cloneDeep, has, unset, get, isBoolean, sortBy, set, trim, isFunction, range, debounce, uniq, identity, first, isString, isEmpty, isObjectLike } from 'lodash-es';
+import * as i3 from '@alauda-fe/dynamic-plugin-sdk';
+import { parseBase64Type, isBlank, publishRef, TOKEN_BASE_DOMAIN, stringify as stringify$1, isEqual, TimeService, TranslateService, isZhLang, FALLBACK_LANGUAGE, TranslatePipe, ObservableInput, FeatureGateService, FieldNotAvailablePipe, ValueHook, LoadingMaskComponent, PurePipe, StandardTimePipe, RelativeTimePipe, skipError, CURR_ESCAPE_DEACTIVATE_GUARD, ESCAPE_DEACTIVATE_GUARD, parseAll, FIELD_NOT_AVAILABLE_PLACEHOLDER, noop, SafePipe, WatchEvent, K8sUtilService, NAMESPACE as NAMESPACE$1, isFieldNotAvailable, K8S_UTIL_PIPES_MODULE, ResourceSelectorPopupService, ProjectService, ConfigurableField, API_GATEWAY as API_GATEWAY$1, ClusterListComponent, K8sApiService, TRANSLATE_MODULE, KubernetesSchemaService } from '@alauda-fe/dynamic-plugin-sdk';
+import { Observable, finalize, map, startWith, catchError, of, isObservable, switchMap, animationFrameScheduler, fromEvent, auditTime, Subject, takeUntil, distinctUntilChanged, combineLatest, filter, debounceTime, take, merge, pairwise, tap, BehaviorSubject, from, timer, ReplaySubject, delay, withLatestFrom, scan, takeWhile, concat, exhaustMap, EMPTY as EMPTY$1, interval, NEVER, switchScan, shareReplay, mapTo } from 'rxjs';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { dissocPath, converge, mergeAll, mergeDeepRight, path, assocPath, identity as identity$1, equals } from 'ramda';
 import { compare } from 'compare-versions';
 export { compareVersions as compareVersionToNum, satisfies as satisfiesVersion } from 'compare-versions';
 import * as i0 from '@angular/core';
-import { inject, Directive, NgZone, Injectable, IterableDiffers, isDevMode, Pipe, ChangeDetectorRef, Input, ViewContainerRef, TemplateRef, ɵstringify as _stringify, ElementRef, ComponentFactoryResolver, HostBinding, ChangeDetectionStrategy, Component, EventEmitter, Output, HostListener, Inject, Host, booleanAttribute, forwardRef, ContentChild, Optional, ViewEncapsulation, ViewChild, Injector, ApplicationRef, ViewChildren, ContentChildren, InjectionToken, input, computed } from '@angular/core';
+import { inject, Directive, NgZone, Injectable, IterableDiffers, isDevMode, Pipe, ChangeDetectorRef, Input, ViewContainerRef, TemplateRef, ɵstringify as _stringify, ElementRef, Injector, HostBinding, ChangeDetectionStrategy, Component, EventEmitter, Output, HostListener, booleanAttribute, forwardRef, ContentChild, Renderer2, ViewEncapsulation, ViewChild, ApplicationRef, ViewChildren, ContentChildren, InjectionToken, input, NgModule, computed } from '@angular/core';
 import parser from 'cron-parser';
 import dayjs from 'dayjs';
-import timezone from 'dayjs/plugin/timezone';
-import utc from 'dayjs/plugin/utc';
 import { marked } from 'marked';
 import cronstrue from 'cronstrue';
 import 'cronstrue/locales/zh_CN';
 import 'cronstrue/locales/en';
 import * as i1$1 from '@angular/common';
-import { DecimalPipe, NgTemplateOutlet, AsyncPipe, NgClass, NgStyle, CommonModule, Location } from '@angular/common';
-import duration from 'dayjs/plugin/duration';
+import { DecimalPipe, NgTemplateOutlet, AsyncPipe, NgClass, NgStyle, CommonModule, Location, KeyValuePipe } from '@angular/common';
 import { __decorate, __metadata } from 'tslib';
 import * as i2 from '@angular/forms';
 import { ControlContainer, NgControl, Validators, NG_VALIDATORS, DefaultValueAccessor, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, NG_ASYNC_VALIDATORS, MaxLengthValidator, MinLengthValidator, NgForm, FormGroupDirective, FormBuilder, FormGroup, FormArray } from '@angular/forms';
-import { CdkPortalOutlet, TemplatePortal, ComponentPortal, DomPortalOutlet } from '@angular/cdk/portal';
-import { CdkScrollable } from '@angular/cdk/scrolling';
-import * as i1$2 from '@angular/cdk/overlay';
-import { ScrollDispatcher } from '@angular/cdk/overlay';
+import * as i1$2 from '@angular/cdk/scrolling';
+import { CdkScrollable, ScrollingModule, CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { ScrollDispatcher, Overlay } from '@angular/cdk/overlay';
 import { decode, encode } from 'ab64';
+import { DomPortalOutlet, ComponentPortal } from '@angular/cdk/portal';
+import { yamlWriteOptions, createActions, MonacoEditorConfig, viewActions, readonlyOptions, CodeEditorComponent, yamlReadOptions, MonacoLanguageService, yamlWriteMinimapOptions, updateActions } from '@alauda/code-editor';
 import { DomSanitizer } from '@angular/platform-browser';
 import { takeUntilDestroyed, toObservable, toSignal } from '@angular/core/rxjs-interop';
 import { BaseResourceFormComponent } from 'ng-resource-form-util';
-import { MonacoEditorConfig } from 'ng-monaco-editor';
-import * as i2$3 from '@alauda/code-editor';
-import { CodeEditorModule } from '@alauda/code-editor';
+import { HttpClient } from '@angular/common/http';
 
 /**
  * @packageDocumentation
@@ -160,6 +155,7 @@ const AccessMode = {
     RWO: 'ReadWriteOnce',
     ROX: 'ReadOnlyMany',
     RWX: 'ReadWriteMany',
+    RWOP: 'ReadWriteOncePod',
 };
 const AccessModes = [AccessMode.RWO, AccessMode.ROX, AccessMode.RWX];
 var VolumeTypeEnum;
@@ -2912,8 +2908,6 @@ function fullStrategyCheck(keys, controls, _, mapFn, matchesFn, initData) {
     return toRemoveError;
 }
 
-dayjs.extend(utc);
-dayjs.extend(timezone);
 class CrontabNextPipe {
     constructor() {
         this.time = inject(TimeService);
@@ -3133,7 +3127,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 }]
         }] });
 
-dayjs.extend(duration);
 class DurationPipe {
     constructor() {
         this.translate = inject(TranslateService);
@@ -3364,8 +3357,8 @@ class ReadonlyFieldDirective {
         this.templateContext = {};
         this.destroy$ = new Subject();
         this.control = inject(NgControl);
-        this.cfr = inject(ComponentFactoryResolver);
         this.viewContainerRef = inject(ViewContainerRef);
+        this.injector = inject(Injector);
         // 仅考虑当前control，子control无法知晓父FormItemControl元素 ，包裹了多少个control，以及各自处于什么状态，该情况自行处理
         this.controlDirective = inject(FormItemControlDirective, {
             optional: true,
@@ -3381,9 +3374,10 @@ class ReadonlyFieldDirective {
                 $implicit: value,
                 ...this.context,
             });
+            this.templateViewRef?.detectChanges();
         }
         else {
-            this.spanComponentRef.instance.setData(value);
+            this.spanComponentRef?.instance.setData(value);
         }
     }
     ngOnInit() {
@@ -3391,29 +3385,20 @@ class ReadonlyFieldDirective {
         // formControl will compose multi validators to 1, no matter defined in template nor FormBuilder
         const { validator, asyncValidator } = controlEntity;
         this.isControlRequired = this.controlDirective?.required || false;
-        const portalOutlet = new CdkPortalOutlet(this.cfr, this.viewContainerRef);
-        const portal = this.template
-            ? new TemplatePortal(this.template, this.viewContainerRef, this.templateContext)
-            : new ComponentPortal(SpanComponent, this.viewContainerRef);
         const containerAttached$ = this.aclReadonlyField$.pipe(distinctUntilChanged(), map(isUpdate => {
             if (!isUpdate) {
                 // 重置
                 if (this.controlDirective) {
                     this.controlDirective.required = this.isControlRequired;
                 }
-                if (portalOutlet.hasAttached()) {
-                    portalOutlet.detach();
-                }
+                this.detachReadonlyView();
                 this.applyValidators(controlEntity, validator, asyncValidator);
                 return false;
             }
             if (this.controlDirective) {
                 this.controlDirective.required = false;
             }
-            const attachPoint = portalOutlet.attach(portal);
-            if (!this.template) {
-                this.spanComponentRef = attachPoint;
-            }
+            this.attachReadonlyView();
             this.clearValidators(controlEntity);
             return true;
         }));
@@ -3447,6 +3432,30 @@ class ReadonlyFieldDirective {
     ngOnDestroy() {
         this.destroy$.next();
     }
+    attachReadonlyView() {
+        if (this.template) {
+            if (!this.templateViewRef) {
+                this.templateViewRef = this.viewContainerRef.createEmbeddedView(this.template, this.templateContext);
+            }
+            return;
+        }
+        if (!this.spanComponentRef) {
+            this.spanComponentRef = this.viewContainerRef.createComponent(SpanComponent, {
+                injector: this.injector,
+            });
+        }
+    }
+    detachReadonlyView() {
+        if (this.templateViewRef) {
+            this.templateViewRef.destroy();
+            this.templateViewRef = undefined;
+        }
+        if (this.spanComponentRef) {
+            this.spanComponentRef.destroy();
+            this.spanComponentRef = undefined;
+        }
+        this.viewContainerRef.clear();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ReadonlyFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: ReadonlyFieldDirective, isStandalone: true, selector: "[aclReadonlyField]", inputs: { aclReadonlyField: "aclReadonlyField", hidden: "hidden", template: ["aclReadonlyFieldTemplate", "template"], context: ["aclReadonlyFieldTemplateContext", "context"] }, host: { properties: { "hidden": "this.isHidden" } }, ngImport: i0 }); }
 }
@@ -3821,6 +3830,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
  *
  */
 class ControlValueTraceDirective {
+    constructor() {
+        this.ngControl = inject(NgControl, { host: true });
+        this.aclValueTrackSkipFirst = false;
+        this.destroy$$ = new Subject();
+    }
     ngOnDestroy() {
         this.destroy$$.next();
         this.destroy$$.complete();
@@ -3833,12 +3847,7 @@ class ControlValueTraceDirective {
             .pipe(takeUntil(this.destroy$$))
             .subscribe(([value, changeFn]) => changeFn(value));
     }
-    constructor(ngControl) {
-        this.ngControl = ngControl;
-        this.aclValueTrackSkipFirst = false;
-        this.destroy$$ = new Subject();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ControlValueTraceDirective, deps: [{ token: NgControl, host: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ControlValueTraceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: ControlValueTraceDirective, isStandalone: true, selector: "[aclValueTrack]", inputs: { aclValueTrackSkipFirst: "aclValueTrackSkipFirst", aclValueTrack: "aclValueTrack" }, ngImport: i0 }); }
 }
 __decorate([
@@ -3851,12 +3860,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                     selector: '[aclValueTrack]',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i2.NgControl, decorators: [{
-                    type: Inject,
-                    args: [NgControl]
-                }, {
-                    type: Host
-                }] }], propDecorators: { aclValueTrackSkipFirst: [{
+        }], propDecorators: { aclValueTrackSkipFirst: [{
                 type: Input
             }], aclValueTrack: [{
                 type: Input
@@ -4401,7 +4405,7 @@ class ConfirmDeleteComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmDeleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ConfirmDeleteComponent, isStandalone: true, selector: "acl-confirm-delete", inputs: { context: "context", type: "type", title: "title", resourceName: "resourceName", deleteTips: "deleteTips", confirmTips: "confirmTips", extraConfirmTips: "extraConfirmTips", confirmText: "confirmText", deleteResourceApi: "deleteResourceApi", deleteResourceParams: "deleteResourceParams", deleteSuccessMsg: "deleteSuccessMsg", deleteFailMsg: "deleteFailMsg" }, outputs: { close: "close" }, queries: [{ propertyName: "deleteTipTemplate", first: true, predicate: ConfirmDeleteTipDirective, descendants: true, read: TemplateRef }, { propertyName: "contentTemplate", first: true, predicate: ConfirmDeleteContentDirective, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: ConfirmDeleteLabelDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<form (ngSubmit)=\"onConfirm()\">\n  <aui-dialog-header>\n    <aui-icon\n      icon=\"exclamation_triangle_s\"\n      background=\"triangle\"\n      size=\"22\"\n    ></aui-icon>\n    {{ title }}\n  </aui-dialog-header>\n  <aui-dialog-content>\n    <p class=\"tw-mt-0 tw-mb-12 tw-text-main-text\">\n      @if (deleteTips) {\n        {{ deleteTips }}\n      }\n      @if (deleteTipTemplate) {\n        <ng-container *ngTemplateOutlet=\"deleteTipTemplate\"></ng-container>\n      }\n    </p>\n    @if (contentTemplate) {\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    }\n    <div class=\"tw-mb-4 tw-text-main-text\">\n      @if (labelTemplate) {\n        <ng-container *ngTemplateOutlet=\"labelTemplate\"></ng-container>\n      }\n      @if (!labelTemplate) {\n        @if (confirmTips) {\n          {{ confirmTips }}\n        }\n        @if (!confirmTips) {\n          {{ 'please_enter_extra' | translate }}\n          <span class=\"tw-text-red\">{{ resourceName }}</span>\n          {{ 'extra_determine_' + type | translate\n          }}{{ extraConfirmTips ? ('period_symbol' | translate) : null\n          }}{{ extraConfirmTips }}\n        }\n      }\n    </div>\n    <input\n      auiFormItemControl\n      aui-input\n      name=\"resource-name\"\n      [(ngModel)]=\"inputValue\"\n      (ngModelChange)=\"inputValue$$.next($event)\"\n    />\n  </aui-dialog-content>\n  <aui-dialog-footer>\n    <button\n      aui-button=\"danger\"\n      [loading]=\"deleting$$ | async\"\n      [disabled]=\"disabled$ | async\"\n    >\n      {{ confirmText || type | translate }}\n    </button>\n    <button\n      aui-button\n      type=\"button\"\n      (click)=\"closeDialog()\"\n    >\n      {{ 'cancel' | translate }}\n    </button>\n  </aui-dialog-footer>\n</form>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormModule }, { kind: "directive", type: i1.FormItemControlDirective, selector: "[auiFormItemControl]", inputs: ["required"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ConfirmDeleteComponent, isStandalone: true, selector: "acl-confirm-delete", inputs: { context: "context", type: "type", title: "title", resourceName: "resourceName", deleteTips: "deleteTips", confirmTips: "confirmTips", extraConfirmTips: "extraConfirmTips", confirmText: "confirmText", deleteResourceApi: "deleteResourceApi", deleteResourceParams: "deleteResourceParams", deleteSuccessMsg: "deleteSuccessMsg", deleteFailMsg: "deleteFailMsg" }, outputs: { close: "close" }, queries: [{ propertyName: "deleteTipTemplate", first: true, predicate: ConfirmDeleteTipDirective, descendants: true, read: TemplateRef }, { propertyName: "contentTemplate", first: true, predicate: ConfirmDeleteContentDirective, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: ConfirmDeleteLabelDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<form (ngSubmit)=\"onConfirm()\">\n  <aui-dialog-header>\n    <aui-icon\n      icon=\"exclamation_triangle_s\"\n      background=\"triangle\"\n      size=\"22\"\n    ></aui-icon>\n    {{ title }}\n  </aui-dialog-header>\n  <aui-dialog-content>\n    <p class=\"delete-tip\">\n      @if (deleteTips) {\n        {{ deleteTips }}\n      }\n      @if (deleteTipTemplate) {\n        <ng-container *ngTemplateOutlet=\"deleteTipTemplate\"></ng-container>\n      }\n    </p>\n    @if (contentTemplate) {\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    }\n    <div class=\"confirm-tip\">\n      @if (labelTemplate) {\n        <ng-container *ngTemplateOutlet=\"labelTemplate\"></ng-container>\n      }\n      @if (!labelTemplate) {\n        @if (confirmTips) {\n          {{ confirmTips }}\n        }\n        @if (!confirmTips) {\n          {{ 'please_enter_extra' | translate }}\n          <span class=\"resource-name\">{{ resourceName }}</span>\n          {{ 'extra_determine_' + type | translate\n          }}{{ extraConfirmTips ? ('period_symbol' | translate) : null\n          }}{{ extraConfirmTips }}\n        }\n      }\n    </div>\n    <input\n      auiFormItemControl\n      aui-input\n      name=\"resource-name\"\n      [(ngModel)]=\"inputValue\"\n      (ngModelChange)=\"inputValue$$.next($event)\"\n    />\n  </aui-dialog-content>\n  <aui-dialog-footer>\n    <button\n      aui-button=\"danger\"\n      [loading]=\"deleting$$ | async\"\n      [disabled]=\"disabled$ | async\"\n    >\n      {{ confirmText || type | translate }}\n    </button>\n    <button\n      aui-button\n      type=\"button\"\n      (click)=\"closeDialog()\"\n    >\n      {{ 'cancel' | translate }}\n    </button>\n  </aui-dialog-footer>\n</form>\n", styles: [".delete-tip{margin:0 0 12px;color:rgb(var(--aui-color-n-1))}.confirm-tip{margin-bottom:4px;color:rgb(var(--aui-color-n-1))}.resource-name{color:rgb(var(--aui-color-red))}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormModule }, { kind: "directive", type: i1.FormItemControlDirective, selector: "[auiFormItemControl]", inputs: ["required"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ConfirmDeleteComponent, decorators: [{
             type: Component,
@@ -4416,7 +4420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         FormModule,
                         AsyncPipe,
                         EFFECT_DIRECTIVE_MODULE,
-                    ], standalone: true, template: "<form (ngSubmit)=\"onConfirm()\">\n  <aui-dialog-header>\n    <aui-icon\n      icon=\"exclamation_triangle_s\"\n      background=\"triangle\"\n      size=\"22\"\n    ></aui-icon>\n    {{ title }}\n  </aui-dialog-header>\n  <aui-dialog-content>\n    <p class=\"tw-mt-0 tw-mb-12 tw-text-main-text\">\n      @if (deleteTips) {\n        {{ deleteTips }}\n      }\n      @if (deleteTipTemplate) {\n        <ng-container *ngTemplateOutlet=\"deleteTipTemplate\"></ng-container>\n      }\n    </p>\n    @if (contentTemplate) {\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    }\n    <div class=\"tw-mb-4 tw-text-main-text\">\n      @if (labelTemplate) {\n        <ng-container *ngTemplateOutlet=\"labelTemplate\"></ng-container>\n      }\n      @if (!labelTemplate) {\n        @if (confirmTips) {\n          {{ confirmTips }}\n        }\n        @if (!confirmTips) {\n          {{ 'please_enter_extra' | translate }}\n          <span class=\"tw-text-red\">{{ resourceName }}</span>\n          {{ 'extra_determine_' + type | translate\n          }}{{ extraConfirmTips ? ('period_symbol' | translate) : null\n          }}{{ extraConfirmTips }}\n        }\n      }\n    </div>\n    <input\n      auiFormItemControl\n      aui-input\n      name=\"resource-name\"\n      [(ngModel)]=\"inputValue\"\n      (ngModelChange)=\"inputValue$$.next($event)\"\n    />\n  </aui-dialog-content>\n  <aui-dialog-footer>\n    <button\n      aui-button=\"danger\"\n      [loading]=\"deleting$$ | async\"\n      [disabled]=\"disabled$ | async\"\n    >\n      {{ confirmText || type | translate }}\n    </button>\n    <button\n      aui-button\n      type=\"button\"\n      (click)=\"closeDialog()\"\n    >\n      {{ 'cancel' | translate }}\n    </button>\n  </aui-dialog-footer>\n</form>\n" }]
+                    ], standalone: true, template: "<form (ngSubmit)=\"onConfirm()\">\n  <aui-dialog-header>\n    <aui-icon\n      icon=\"exclamation_triangle_s\"\n      background=\"triangle\"\n      size=\"22\"\n    ></aui-icon>\n    {{ title }}\n  </aui-dialog-header>\n  <aui-dialog-content>\n    <p class=\"delete-tip\">\n      @if (deleteTips) {\n        {{ deleteTips }}\n      }\n      @if (deleteTipTemplate) {\n        <ng-container *ngTemplateOutlet=\"deleteTipTemplate\"></ng-container>\n      }\n    </p>\n    @if (contentTemplate) {\n      <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n    }\n    <div class=\"confirm-tip\">\n      @if (labelTemplate) {\n        <ng-container *ngTemplateOutlet=\"labelTemplate\"></ng-container>\n      }\n      @if (!labelTemplate) {\n        @if (confirmTips) {\n          {{ confirmTips }}\n        }\n        @if (!confirmTips) {\n          {{ 'please_enter_extra' | translate }}\n          <span class=\"resource-name\">{{ resourceName }}</span>\n          {{ 'extra_determine_' + type | translate\n          }}{{ extraConfirmTips ? ('period_symbol' | translate) : null\n          }}{{ extraConfirmTips }}\n        }\n      }\n    </div>\n    <input\n      auiFormItemControl\n      aui-input\n      name=\"resource-name\"\n      [(ngModel)]=\"inputValue\"\n      (ngModelChange)=\"inputValue$$.next($event)\"\n    />\n  </aui-dialog-content>\n  <aui-dialog-footer>\n    <button\n      aui-button=\"danger\"\n      [loading]=\"deleting$$ | async\"\n      [disabled]=\"disabled$ | async\"\n    >\n      {{ confirmText || type | translate }}\n    </button>\n    <button\n      aui-button\n      type=\"button\"\n      (click)=\"closeDialog()\"\n    >\n      {{ 'cancel' | translate }}\n    </button>\n  </aui-dialog-footer>\n</form>\n", styles: [".delete-tip{margin:0 0 12px;color:rgb(var(--aui-color-n-1))}.confirm-tip{margin-bottom:4px;color:rgb(var(--aui-color-n-1))}.resource-name{color:rgb(var(--aui-color-red))}\n"] }]
         }], ctorParameters: () => [], propDecorators: { context: [{
                 type: Input
             }], type: [{
@@ -4553,6 +4557,14 @@ const AUI_MULTI_SELECT_PLACEHOLDER_CLASS = 'aui-multi-select__placeholder';
 // NOTE: 提供此指令，是由于个人不支持此组件行为，不建议直接引入aui，希望作为业务上的尝试，因此提供指令以供删改
 // 纯css无法提供本问题的完整解决方案,若有更优方案，请删除此部分代码，以及 acl-select-prefix mixin
 class SelectPrefixLabelDirective {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+        this.renderer = inject(Renderer2);
+        this.viewContainerRef = inject(ViewContainerRef);
+        this.multiSelectComponent = inject(MultiSelectComponent, {
+            optional: true,
+        });
+    }
     queryElementByClassName(className) {
         return this.elementRef.nativeElement?.querySelector(`.${className}`);
     }
@@ -4582,13 +4594,7 @@ class SelectPrefixLabelDirective {
             placeholder.style.paddingLeft = `${inlineLabel.offsetWidth + PREFIX_LABEL_PLACEHOLDER_PADDING_LEFT_FIX}px`;
         }
     }
-    constructor(elementRef, renderer, viewContainerRef, multiSelectComponent) {
-        this.elementRef = elementRef;
-        this.renderer = renderer;
-        this.viewContainerRef = viewContainerRef;
-        this.multiSelectComponent = multiSelectComponent;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SelectPrefixLabelDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i1.MultiSelectComponent, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SelectPrefixLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: SelectPrefixLabelDirective, isStandalone: true, selector: "aui-select[aclPrefixLabel],aui-multi-select[aclPrefixLabel]", inputs: { aclPrefixLabel: "aclPrefixLabel" }, ngImport: i0 }); }
 }
 __decorate([
@@ -4619,9 +4625,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                     selector: 'aui-select[aclPrefixLabel],aui-multi-select[aclPrefixLabel]',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i1.MultiSelectComponent, decorators: [{
-                    type: Optional
-                }] }], propDecorators: { aclPrefixLabel: [{
+        }], propDecorators: { aclPrefixLabel: [{
                 type: Input
             }] } });
 
@@ -4631,8 +4635,8 @@ class ZeroStateComponent {
         this.fetching = false;
         this.context = 'form';
         this.image = [
-            'assets/images/light/no-data-for-list-or-card.svg',
-            'assets/images/dark/no-data-for-list-or-card.svg',
+            '/console-assets/images/light/no-data-for-list-or-card.svg',
+            '/console-assets/images/dark/no-data-for-list-or-card.svg',
         ];
         this.handlePixel = handlePixel;
         this.isTemplateRef = isTemplateRef;
@@ -4674,9 +4678,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
             }] } });
 
 class RelativeTimeComponent {
-    constructor(cdr, translate) {
-        this.cdr = cdr;
-        this.translate = translate;
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        this.translate = inject(TranslateService);
         this.destroy$ = new Subject();
     }
     ngOnInit() {
@@ -4689,7 +4693,7 @@ class RelativeTimeComponent {
     ngOnDestroy() {
         this.destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RelativeTimeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: RelativeTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: RelativeTimeComponent, isStandalone: true, selector: "acl-relative-time", inputs: { time: "time" }, ngImport: i0, template: `
     <span
       [auiTooltip]="time | aclStandardTime"
@@ -4718,7 +4722,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                     standalone: true,
                     imports: [TooltipModule, StandardTimePipe, RelativeTimePipe],
                 }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2$1.TranslateService }], propDecorators: { time: [{
+        }], propDecorators: { time: [{
                 type: Input
             }] } });
 
@@ -5006,7 +5010,7 @@ const CLONE_ELEMENT_BASE_STYLES = {
  * 效果：
  * 发生截取的文案会显示完整内容的 tooltip。未发生截取的文案不显示 tooltip。
  * @example:
- * <span class="tw-text-overflow" aclTextTooltip>TEXT...</span>
+ * <span aclTextTooltip>TEXT...</span>
  *
  * tooltip 的一些设置（位置、类型）可以使用 aui 相同设置。未传 tooltip content 则取元素 text content
  */
@@ -5276,7 +5280,7 @@ class DateRangePickerComponent {
                 useExisting: forwardRef(() => DateRangePickerComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "tip", first: true, predicate: ["tip"], descendants: true }], ngImport: i0, template: "@if (mode === 'input' || mode === 'dropdown') {\n  <aui-input-group\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    auiTooltipPosition=\"bottom start\"\n    auiTooltipAnimType=\"none\"\n    [style.width]=\"inputWidth\"\n    #tip=\"auiTooltip\"\n  >\n    <input\n      aui-input\n      [class]=\"{\n        'tw-text-center': mode === 'dropdown',\n        '!tw-text-s': mode === 'dropdown',\n        'date-range-picker': true,\n      }\"\n      [title]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      [value]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      readonly\n    />\n    <aui-icon\n      auiInputSuffix\n      class=\"tw-text-n-2\"\n      [icon]=\"mode === 'dropdown' ? 'calendar' : 'caret_down_s'\"\n    ></aui-icon>\n  </aui-input-group>\n}\n\n@if (mode === 'tag') {\n  <aui-tag\n    size=\"mini\"\n    class=\"tag\"\n    [type]=\"tagActive ? 'primary' : 'info'\"\n    [solid]=\"tagActive\"\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    #tip=\"auiTooltip\"\n    auiTooltipPosition=\"bottom start\"\n  >\n    <aui-icon icon=\"clock\"></aui-icon>\n    {{\n      !value\n        ? ('more' | translate)\n        : (value | pure: formatValue : (translate.locale$ | async))\n    }}\n    <aui-icon\n      class=\"tw-ml-[-4px]\"\n      icon=\"angle_down\"\n      margin=\"left\"\n    ></aui-icon>\n  </aui-tag>\n}\n\n<ng-template #tooltip>\n  <div class=\"range-picker-panel\">\n    <div class=\"control\">\n      @for (range of ranges; track range) {\n        <span\n          class=\"control-row\"\n          [class.active]=\"range.label === selectedRange?.label\"\n          (click)=\"selectRange(range)\"\n        >\n          {{\n            range.display\n              ? (range.display | translate: range.displayCtx)\n              : (range.label | translate)\n          }}\n        </span>\n      }\n    </div>\n    @if (isCustom) {\n      <div class=\"range-picker-wrapper\">\n        <aui-date-range-picker-panel\n          [disabledDate]=\"options | pure: getDisabledDate\"\n          [(ngModel)]=\"rangeValue\"\n          (confirm)=\"submitRange(CUSTOM_RANGE, rangeValue)\"\n          (clear)=\"rangeValue = []\"\n          (click)=\"$event.stopImmediatePropagation()\"\n          [showTime]=\"finalOptions.timePicker\"\n          [disabledTime]=\"enableDisableTime && disabledTime()\"\n        ></aui-date-range-picker-panel>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".range-picker-panel{display:inline-flex}.range-picker-footer{padding:9px;display:flex;justify-content:flex-end;box-sizing:content-box;border-top:1px solid use-rgb(divider)}.range-picker-footer .range-date-tip{display:flex;font-size:14px;align-items:center;margin-right:6px;color:use-text-color(main)}.date-range-picker[readonly]{background-color:use-rgb(n-9);border-color:use-rgb(n-7)}aui-input-group{width:100%;display:inline-block}:host::ng-deep{display:flex}:host::ng-deep .aui-input{cursor:pointer!important}::ng-deep .acl-date-range-picker__panel{max-width:unset!important;padding:0!important;overflow:hidden}::ng-deep .acl-date-range-picker__panel .control{display:flex;min-width:120px;flex-direction:column;max-height:337px;overflow:auto}::ng-deep .acl-date-range-picker__panel .range-picker-wrapper{padding:8px;display:flex;flex-direction:column;border-left:1px solid use-rgb(divider)}::ng-deep .acl-date-range-picker__panel .control-row{padding:8px 12px;font-size:12px;color:use-text-color(main)}::ng-deep .acl-date-range-picker__panel .control-row:hover{background-color:use-rgb(p-6);color:use-rgb(primary);cursor:pointer}::ng-deep .acl-date-range-picker__panel .control-row.active{background-color:use-rgb(p-6);color:use-rgb(primary)}.tag{position:relative}.tag ::ng-deep .aui-tag__content{overflow:inherit}.tag ::ng-deep .aui-tag{max-width:unset!important}\n"], dependencies: [{ kind: "component", type: InputGroupComponent, selector: "aui-input-group" }, { kind: "directive", type: TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "directive", type: InputSuffixDirective, selector: "[auiInputSuffix]" }, { kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: TagComponent, selector: "aui-tag", inputs: ["type", "size", "closeable", "border", "solid", "invalid", "round", "color", "allowClick"], outputs: ["close"] }, { kind: "component", type: DateRangePickerPanelComponent, selector: "aui-date-range-picker-panel", inputs: ["clearable", "clearText", "showTime", "showFooter", "disabledDate", "disabledTime", "weekStartDay", "minDate", "maxDate"], outputs: ["clear", "confirm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "tip", first: true, predicate: ["tip"], descendants: true }], ngImport: i0, template: "@if (mode === 'input' || mode === 'dropdown') {\n  <aui-input-group\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    auiTooltipPosition=\"bottom start\"\n    auiTooltipAnimType=\"none\"\n    [style.width]=\"inputWidth\"\n    #tip=\"auiTooltip\"\n  >\n    <input\n      aui-input\n      [class]=\"{\n        'text-center': mode === 'dropdown',\n        'text-small': mode === 'dropdown',\n        'date-range-picker': true,\n      }\"\n      [title]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      [value]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      readonly\n    />\n    <aui-icon\n      auiInputSuffix\n      class=\"text-n-2\"\n      [icon]=\"mode === 'dropdown' ? 'calendar' : 'caret_down_s'\"\n    ></aui-icon>\n  </aui-input-group>\n}\n\n@if (mode === 'tag') {\n  <aui-tag\n    size=\"mini\"\n    class=\"tag\"\n    [type]=\"tagActive ? 'primary' : 'info'\"\n    [solid]=\"tagActive\"\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    #tip=\"auiTooltip\"\n    auiTooltipPosition=\"bottom start\"\n  >\n    <aui-icon icon=\"clock\"></aui-icon>\n    {{\n      !value\n        ? ('more' | translate)\n        : (value | pure: formatValue : (translate.locale$ | async))\n    }}\n    <aui-icon\n      class=\"icon-spacer\"\n      icon=\"angle_down\"\n      margin=\"left\"\n    ></aui-icon>\n  </aui-tag>\n}\n\n<ng-template #tooltip>\n  <div class=\"range-picker-panel\">\n    <div class=\"control\">\n      @for (range of ranges; track range) {\n        <span\n          class=\"control-row\"\n          [class.active]=\"range.label === selectedRange?.label\"\n          (click)=\"selectRange(range)\"\n        >\n          {{\n            range.display\n              ? (range.display | translate: range.displayCtx)\n              : (range.label | translate)\n          }}\n        </span>\n      }\n    </div>\n    @if (isCustom) {\n      <div class=\"range-picker-wrapper\">\n        <aui-date-range-picker-panel\n          [disabledDate]=\"options | pure: getDisabledDate\"\n          [(ngModel)]=\"rangeValue\"\n          (confirm)=\"submitRange(CUSTOM_RANGE, rangeValue)\"\n          (clear)=\"rangeValue = []\"\n          (click)=\"$event.stopImmediatePropagation()\"\n          [showTime]=\"finalOptions.timePicker\"\n          [disabledTime]=\"enableDisableTime && disabledTime()\"\n        ></aui-date-range-picker-panel>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".range-picker-panel{display:inline-flex}.range-picker-footer{padding:9px;display:flex;justify-content:flex-end;box-sizing:content-box;border-top:1px solid use-rgb(divider)}.range-picker-footer .range-date-tip{display:flex;font-size:14px;align-items:center;margin-right:6px;color:use-text-color(main)}.date-range-picker[readonly]{background-color:use-rgb(n-9);border-color:use-rgb(n-7)}aui-input-group{width:100%;display:inline-block}:host::ng-deep{display:flex}:host::ng-deep .aui-input{cursor:pointer!important}::ng-deep .acl-date-range-picker__panel{max-width:unset!important;padding:0!important;overflow:hidden}::ng-deep .acl-date-range-picker__panel .control{display:flex;min-width:120px;flex-direction:column;max-height:337px;overflow:auto}::ng-deep .acl-date-range-picker__panel .range-picker-wrapper{padding:8px;display:flex;flex-direction:column;border-left:1px solid use-rgb(divider)}::ng-deep .acl-date-range-picker__panel .control-row{padding:8px 12px;font-size:12px;color:use-text-color(main)}::ng-deep .acl-date-range-picker__panel .control-row:hover{background-color:use-rgb(p-6);color:use-rgb(primary);cursor:pointer}::ng-deep .acl-date-range-picker__panel .control-row.active{background-color:use-rgb(p-6);color:use-rgb(primary)}.tag{position:relative}.tag ::ng-deep .aui-tag__content{overflow:inherit}.text-center{text-align:center}.text-small{font-size:12px!important}.text-n-2{color:use-rgb(n-2)}.icon-spacer{margin-left:-4px}\n"], dependencies: [{ kind: "component", type: InputGroupComponent, selector: "aui-input-group" }, { kind: "directive", type: TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "directive", type: InputSuffixDirective, selector: "[auiInputSuffix]" }, { kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: TagComponent, selector: "aui-tag", inputs: ["type", "size", "closeable", "border", "solid", "invalid", "round", "color", "allowClick"], outputs: ["close"] }, { kind: "component", type: DateRangePickerPanelComponent, selector: "aui-date-range-picker-panel", inputs: ["clearable", "clearText", "showTime", "showFooter", "disabledDate", "disabledTime", "weekStartDay", "minDate", "maxDate"], outputs: ["clear", "confirm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: DateRangePickerComponent, decorators: [{
             type: Component,
@@ -5299,7 +5303,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         PurePipe,
                         AsyncPipe,
                         EFFECT_DIRECTIVE_MODULE,
-                    ], standalone: true, template: "@if (mode === 'input' || mode === 'dropdown') {\n  <aui-input-group\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    auiTooltipPosition=\"bottom start\"\n    auiTooltipAnimType=\"none\"\n    [style.width]=\"inputWidth\"\n    #tip=\"auiTooltip\"\n  >\n    <input\n      aui-input\n      [class]=\"{\n        'tw-text-center': mode === 'dropdown',\n        '!tw-text-s': mode === 'dropdown',\n        'date-range-picker': true,\n      }\"\n      [title]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      [value]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      readonly\n    />\n    <aui-icon\n      auiInputSuffix\n      class=\"tw-text-n-2\"\n      [icon]=\"mode === 'dropdown' ? 'calendar' : 'caret_down_s'\"\n    ></aui-icon>\n  </aui-input-group>\n}\n\n@if (mode === 'tag') {\n  <aui-tag\n    size=\"mini\"\n    class=\"tag\"\n    [type]=\"tagActive ? 'primary' : 'info'\"\n    [solid]=\"tagActive\"\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    #tip=\"auiTooltip\"\n    auiTooltipPosition=\"bottom start\"\n  >\n    <aui-icon icon=\"clock\"></aui-icon>\n    {{\n      !value\n        ? ('more' | translate)\n        : (value | pure: formatValue : (translate.locale$ | async))\n    }}\n    <aui-icon\n      class=\"tw-ml-[-4px]\"\n      icon=\"angle_down\"\n      margin=\"left\"\n    ></aui-icon>\n  </aui-tag>\n}\n\n<ng-template #tooltip>\n  <div class=\"range-picker-panel\">\n    <div class=\"control\">\n      @for (range of ranges; track range) {\n        <span\n          class=\"control-row\"\n          [class.active]=\"range.label === selectedRange?.label\"\n          (click)=\"selectRange(range)\"\n        >\n          {{\n            range.display\n              ? (range.display | translate: range.displayCtx)\n              : (range.label | translate)\n          }}\n        </span>\n      }\n    </div>\n    @if (isCustom) {\n      <div class=\"range-picker-wrapper\">\n        <aui-date-range-picker-panel\n          [disabledDate]=\"options | pure: getDisabledDate\"\n          [(ngModel)]=\"rangeValue\"\n          (confirm)=\"submitRange(CUSTOM_RANGE, rangeValue)\"\n          (clear)=\"rangeValue = []\"\n          (click)=\"$event.stopImmediatePropagation()\"\n          [showTime]=\"finalOptions.timePicker\"\n          [disabledTime]=\"enableDisableTime && disabledTime()\"\n        ></aui-date-range-picker-panel>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".range-picker-panel{display:inline-flex}.range-picker-footer{padding:9px;display:flex;justify-content:flex-end;box-sizing:content-box;border-top:1px solid use-rgb(divider)}.range-picker-footer .range-date-tip{display:flex;font-size:14px;align-items:center;margin-right:6px;color:use-text-color(main)}.date-range-picker[readonly]{background-color:use-rgb(n-9);border-color:use-rgb(n-7)}aui-input-group{width:100%;display:inline-block}:host::ng-deep{display:flex}:host::ng-deep .aui-input{cursor:pointer!important}::ng-deep .acl-date-range-picker__panel{max-width:unset!important;padding:0!important;overflow:hidden}::ng-deep .acl-date-range-picker__panel .control{display:flex;min-width:120px;flex-direction:column;max-height:337px;overflow:auto}::ng-deep .acl-date-range-picker__panel .range-picker-wrapper{padding:8px;display:flex;flex-direction:column;border-left:1px solid use-rgb(divider)}::ng-deep .acl-date-range-picker__panel .control-row{padding:8px 12px;font-size:12px;color:use-text-color(main)}::ng-deep .acl-date-range-picker__panel .control-row:hover{background-color:use-rgb(p-6);color:use-rgb(primary);cursor:pointer}::ng-deep .acl-date-range-picker__panel .control-row.active{background-color:use-rgb(p-6);color:use-rgb(primary)}.tag{position:relative}.tag ::ng-deep .aui-tag__content{overflow:inherit}.tag ::ng-deep .aui-tag{max-width:unset!important}\n"] }]
+                    ], standalone: true, template: "@if (mode === 'input' || mode === 'dropdown') {\n  <aui-input-group\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    auiTooltipPosition=\"bottom start\"\n    auiTooltipAnimType=\"none\"\n    [style.width]=\"inputWidth\"\n    #tip=\"auiTooltip\"\n  >\n    <input\n      aui-input\n      [class]=\"{\n        'text-center': mode === 'dropdown',\n        'text-small': mode === 'dropdown',\n        'date-range-picker': true,\n      }\"\n      [title]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      [value]=\"value | pure: formatValue : (translate.locale$ | async)\"\n      readonly\n    />\n    <aui-icon\n      auiInputSuffix\n      class=\"text-n-2\"\n      [icon]=\"mode === 'dropdown' ? 'calendar' : 'caret_down_s'\"\n    ></aui-icon>\n  </aui-input-group>\n}\n\n@if (mode === 'tag') {\n  <aui-tag\n    size=\"mini\"\n    class=\"tag\"\n    [type]=\"tagActive ? 'primary' : 'info'\"\n    [solid]=\"tagActive\"\n    [auiTooltip]=\"tooltip\"\n    auiTooltipClass=\"acl-date-range-picker__panel\"\n    auiTooltipTrigger=\"click\"\n    auiTooltipType=\"info\"\n    #tip=\"auiTooltip\"\n    auiTooltipPosition=\"bottom start\"\n  >\n    <aui-icon icon=\"clock\"></aui-icon>\n    {{\n      !value\n        ? ('more' | translate)\n        : (value | pure: formatValue : (translate.locale$ | async))\n    }}\n    <aui-icon\n      class=\"icon-spacer\"\n      icon=\"angle_down\"\n      margin=\"left\"\n    ></aui-icon>\n  </aui-tag>\n}\n\n<ng-template #tooltip>\n  <div class=\"range-picker-panel\">\n    <div class=\"control\">\n      @for (range of ranges; track range) {\n        <span\n          class=\"control-row\"\n          [class.active]=\"range.label === selectedRange?.label\"\n          (click)=\"selectRange(range)\"\n        >\n          {{\n            range.display\n              ? (range.display | translate: range.displayCtx)\n              : (range.label | translate)\n          }}\n        </span>\n      }\n    </div>\n    @if (isCustom) {\n      <div class=\"range-picker-wrapper\">\n        <aui-date-range-picker-panel\n          [disabledDate]=\"options | pure: getDisabledDate\"\n          [(ngModel)]=\"rangeValue\"\n          (confirm)=\"submitRange(CUSTOM_RANGE, rangeValue)\"\n          (clear)=\"rangeValue = []\"\n          (click)=\"$event.stopImmediatePropagation()\"\n          [showTime]=\"finalOptions.timePicker\"\n          [disabledTime]=\"enableDisableTime && disabledTime()\"\n        ></aui-date-range-picker-panel>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [".range-picker-panel{display:inline-flex}.range-picker-footer{padding:9px;display:flex;justify-content:flex-end;box-sizing:content-box;border-top:1px solid use-rgb(divider)}.range-picker-footer .range-date-tip{display:flex;font-size:14px;align-items:center;margin-right:6px;color:use-text-color(main)}.date-range-picker[readonly]{background-color:use-rgb(n-9);border-color:use-rgb(n-7)}aui-input-group{width:100%;display:inline-block}:host::ng-deep{display:flex}:host::ng-deep .aui-input{cursor:pointer!important}::ng-deep .acl-date-range-picker__panel{max-width:unset!important;padding:0!important;overflow:hidden}::ng-deep .acl-date-range-picker__panel .control{display:flex;min-width:120px;flex-direction:column;max-height:337px;overflow:auto}::ng-deep .acl-date-range-picker__panel .range-picker-wrapper{padding:8px;display:flex;flex-direction:column;border-left:1px solid use-rgb(divider)}::ng-deep .acl-date-range-picker__panel .control-row{padding:8px 12px;font-size:12px;color:use-text-color(main)}::ng-deep .acl-date-range-picker__panel .control-row:hover{background-color:use-rgb(p-6);color:use-rgb(primary);cursor:pointer}::ng-deep .acl-date-range-picker__panel .control-row.active{background-color:use-rgb(p-6);color:use-rgb(primary)}.tag{position:relative}.tag ::ng-deep .aui-tag__content{overflow:inherit}.text-center{text-align:center}.text-small{font-size:12px!important}.text-n-2{color:use-rgb(n-2)}.icon-spacer{margin-left:-4px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { options: [{
                 type: Input
             }], format: [{
@@ -5903,7 +5907,13 @@ class StrongPasswordDirective extends BaseTooltip {
     ngOnChanges() {
         this.onValidatorChange?.();
     }
-    constructor(overlay, viewContainerRef, elRef, renderer, cdr, ngZone) {
+    constructor() {
+        const overlay = inject(Overlay);
+        const viewContainerRef = inject(ViewContainerRef);
+        const elRef = inject(ElementRef);
+        const renderer = inject(Renderer2);
+        const cdr = inject(ChangeDetectorRef);
+        const ngZone = inject(NgZone);
         super(overlay, viewContainerRef, elRef, renderer, cdr, ngZone);
         this.specialChars = STRONG_PASSWORD_SPECIAL_CHARS;
         this.minlength = 8;
@@ -6011,7 +6021,7 @@ class StrongPasswordDirective extends BaseTooltip {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StrongPasswordDirective, deps: [{ token: i1$2.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: StrongPasswordDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: StrongPasswordDirective, isStandalone: true, selector: "input[aclStrongPassword][ngModel],input[aclStrongPassword][formControl],input[aclStrongPassword][formControlName]", inputs: { aclStrongPassword: "aclStrongPassword", required: "required", specialChars: "specialChars", minlength: "minlength", maxlength: "maxlength", notStartsWith: "notStartsWith" }, providers: [
             {
                 provide: NG_VALIDATORS,
@@ -6032,7 +6042,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         },
                     ],
                 }]
-        }], ctorParameters: () => [{ type: i1$2.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { aclStrongPassword: [{
+        }], ctorParameters: () => [], propDecorators: { aclStrongPassword: [{
                 type: Input
             }], required: [{
                 type: Input
@@ -6606,78 +6616,12 @@ function genControlDepsMap(context, rules, destroy$) {
     });
 }
 
-/**
- * @packageDocumentation
- * @module code
- */
-const commonActions = {
-    copy: true,
-    find: true,
-    export: true,
-};
-const createActions = {
-    diffMode: false,
-    clear: true,
-    recover: false,
-    import: true,
-    ...commonActions,
-};
-const viewActions = {
-    diffMode: false,
-    clear: false,
-    recover: false,
-    import: false,
-    ...commonActions,
-};
-const updateActions = {
-    diffMode: true, // if true, you should also set 'originalValue' attribute, eg: <aui-code-editor [originalValue]="originalFile"></aui-code-editor>
-    clear: true,
-    recover: true,
-    import: true,
-    ...commonActions,
-};
-const logsActions = {
-    ...viewActions,
-    theme: true,
-};
-const commonOptions = {
-    folding: true,
-    minimap: { enabled: false },
-    wordWrap: 'on',
-    tabSize: 2,
-    scrollbar: {
-        alwaysConsumeMouseWheel: false,
-    },
-};
-const readonlyOptions = {
-    ...commonOptions,
-    readOnly: true,
-};
-const yamlReadOptions = {
-    language: 'yaml',
-    ...readonlyOptions,
-};
-const yamlWriteOptions = {
-    language: 'yaml',
-    ...commonOptions,
-};
-const textWriteOptions = {
-    language: 'text',
-    ...commonOptions,
-};
-// for logs
-const logsReadOptions = {
-    wordWrap: 'on',
-    readOnly: true,
-    renderLineHighlight: 'none',
-};
-
 class InterceptDeactivateService {
-    constructor(location, router, dialog, translate) {
-        this.location = location;
-        this.router = router;
-        this.dialog = dialog;
-        this.translate = translate;
+    constructor() {
+        this.location = inject(Location);
+        this.router = inject(Router);
+        this.dialog = inject(DialogService);
+        this.translate = inject(TranslateService);
         this.destroy$$ = new Subject();
     }
     ngOnDestroy() {
@@ -6720,13 +6664,13 @@ class InterceptDeactivateService {
             queryParams: this.searchParamsToQueryParams(url.searchParams),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateService, deps: [{ token: i1$1.Location }, { token: i2$2.Router }, { token: i1.DialogService }, { token: i2$1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$1.Location }, { type: i2$2.Router }, { type: i1.DialogService }, { type: i2$1.TranslateService }] });
+        }] });
 
 class InterceptDeactivateGuard {
     constructor() {
@@ -6764,9 +6708,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
         }] });
 
 class InterceptDeactivateDirective {
-    constructor(elRef, interceptDeactivate) {
-        this.elRef = elRef;
-        this.interceptDeactivate = interceptDeactivate;
+    constructor() {
+        this.elRef = inject(ElementRef);
+        this.interceptDeactivate = inject(InterceptDeactivateService);
         this.enabled$ = this.enabled$$.pipe(map(coerceAttrBoolean));
         this.destroy$$ = new Subject();
     }
@@ -6784,7 +6728,7 @@ class InterceptDeactivateDirective {
     onBeforeUnload() {
         return isDevMode() || !this.enabled;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateDirective, deps: [{ token: i0.ElementRef }, { token: InterceptDeactivateService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InterceptDeactivateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: InterceptDeactivateDirective, isStandalone: true, selector: "[aclInterceptDeactivate]", inputs: { enabled: ["aclInterceptDeactivate", "enabled"] }, host: { listeners: { "window:beforeunload": "onBeforeUnload()" } }, ngImport: i0 }); }
 }
 __decorate([
@@ -6797,7 +6741,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                     selector: '[aclInterceptDeactivate]',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: InterceptDeactivateService }], propDecorators: { enabled: [{
+        }], propDecorators: { enabled: [{
                 type: Input,
                 args: ['aclInterceptDeactivate']
             }], enabled$$: [], onBeforeUnload: [{
@@ -7169,7 +7113,7 @@ class PasswordInputComponent extends BaseNestedFormControlPure {
                 useExisting: forwardRef(() => PasswordInputComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<aui-form-item [width]=\"width\">\n  <label auiFormItemLabel>{{ label || ('password' | translate) }}</label>\n  @if (showInput) {\n    <aui-input-group\n      class=\"tw-flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"password\"\n        #password=\"ngModel\"\n        [ngModel]=\"model\"\n        (ngModelChange)=\"emitModel($event)\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclStrongPassword]=\"strongPassword\"\n        [specialChars]=\"specialChars\"\n        [pattern]=\"strongPassword ? null : pattern\"\n        [placeholder]=\"placeholder\"\n        [aclErrorsMapperOutlet]=\"passwordError\"\n        [aclErrorsMapper]=\"{\n          pattern: strongPassword\n            ? ('strong_password_pattern_tip'\n              | translate\n                : {\n                    chars: specialChars.split('').join(', '),\n                  })\n            : ('invalid_pattern' | translate),\n        }\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"tw-icon-m tw-cursor-pointer hover:tw-text-primary\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n  }\n  @if (hint) {\n    <div auiFormItemHint>\n      @if (isTemplateRef(hint)) {\n        <ng-container *ngTemplateOutlet=\"hint\"></ng-container>\n      } @else {\n        {{ hint }}\n      }\n    </div>\n  }\n  <div\n    #passwordError\n    auiFormItemError\n  ></div>\n  @if (!showInput) {\n    <span>******</span>\n    @if (!readonly) {\n      <button\n        aui-button=\"text\"\n        (click)=\"updatePasswd()\"\n      >\n        <aui-icon icon=\"pencil\"></aui-icon>\n      </button>\n    }\n  }\n</aui-form-item>\n@if (showInput && enableConfirm) {\n  <aui-form-item [width]=\"width\">\n    <label auiFormItemLabel>{{ 'confirm_password' | translate }}</label>\n    <aui-input-group\n      class=\"tw-flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"confirmPassword\"\n        #confirm=\"ngModel\"\n        [(ngModel)]=\"confirmPassword\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclValidateFn]=\"model | pure: validateConfirmPassword\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"tw-icon-m tw-cursor-pointer hover:tw-text-primary\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n    <acl-errors-mapper\n      auiFormItemError\n      [errors]=\"confirm?.errors\"\n      [errorsMapper]=\"{\n        notMatch: 'confirm_password_not_match' | translate,\n      }\"\n    ></acl-errors-mapper>\n  </aui-form-item>\n}\n", dependencies: [{ kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemErrorDirective, selector: "[auiFormItemError]" }, { kind: "directive", type: i1.FormItemHintDirective, selector: "[auiFormItemHint]" }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "directive", type: i1.FormItemControlDirective, selector: "[auiFormItemControl]", inputs: ["required"] }, { kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "component", type: i1.InputGroupComponent, selector: "aui-input-group" }, { kind: "directive", type: i1.InputSuffixDirective, selector: "[auiInputSuffix]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: ErrorsMapperComponent, selector: "acl-errors-mapper", inputs: ["errors", "errorsMapper", "errorsMapperFn", "controlName", "ignoreUnknownError"] }, { kind: "directive", type: ErrorsMapperDirective, selector: "[aclErrorsMapper]", inputs: ["aclErrorsMapper", "aclErrorsMapperFn", "aclErrorsMapperDisabled", "aclErrorsMapperOutlet", "aclErrorsMapperControlName"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FunctionValidatorDirective, selector: "[aclValidateFn][ngModel],[aclValidateFn][formControl],[aclValidateFn][formControlName]", inputs: ["aclValidateFn"] }, { kind: "directive", type: StrongPasswordDirective, selector: "input[aclStrongPassword][ngModel],input[aclStrongPassword][formControl],input[aclStrongPassword][formControlName]", inputs: ["aclStrongPassword", "required", "specialChars", "minlength", "maxlength", "notStartsWith"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "<aui-form-item [width]=\"width\">\n  <label auiFormItemLabel>{{ label || ('password' | translate) }}</label>\n  @if (showInput) {\n    <aui-input-group\n      class=\"flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"password\"\n        #password=\"ngModel\"\n        [ngModel]=\"model\"\n        (ngModelChange)=\"emitModel($event)\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclStrongPassword]=\"strongPassword\"\n        [specialChars]=\"specialChars\"\n        [pattern]=\"strongPassword ? null : pattern\"\n        [placeholder]=\"placeholder\"\n        [aclErrorsMapperOutlet]=\"passwordError\"\n        [aclErrorsMapper]=\"{\n          pattern: strongPassword\n            ? ('strong_password_pattern_tip'\n              | translate\n                : {\n                    chars: specialChars.split('').join(', '),\n                  })\n            : ('invalid_pattern' | translate),\n        }\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"toggle-icon\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n  }\n  @if (hint) {\n    <div auiFormItemHint>\n      @if (isTemplateRef(hint)) {\n        <ng-container *ngTemplateOutlet=\"hint\"></ng-container>\n      } @else {\n        {{ hint }}\n      }\n    </div>\n  }\n  <div\n    #passwordError\n    auiFormItemError\n  ></div>\n  @if (!showInput) {\n    <span>******</span>\n    @if (!readonly) {\n      <button\n        aui-button=\"text\"\n        (click)=\"updatePasswd()\"\n      >\n        <aui-icon icon=\"pencil\"></aui-icon>\n      </button>\n    }\n  }\n</aui-form-item>\n@if (showInput && enableConfirm) {\n  <aui-form-item [width]=\"width\">\n    <label auiFormItemLabel>{{ 'confirm_password' | translate }}</label>\n    <aui-input-group\n      class=\"flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"confirmPassword\"\n        #confirm=\"ngModel\"\n        [(ngModel)]=\"confirmPassword\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclValidateFn]=\"model | pure: validateConfirmPassword\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"toggle-icon\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n    <acl-errors-mapper\n      auiFormItemError\n      [errors]=\"confirm?.errors\"\n      [errorsMapper]=\"{\n        notMatch: 'confirm_password_not_match' | translate,\n      }\"\n    ></acl-errors-mapper>\n  </aui-form-item>\n}\n", styles: [".flex-1{flex:1 1 0%}.toggle-icon{font-size:14px;cursor:pointer}.toggle-icon:hover{color:rgb(var(--aui-color-primary))}\n"], dependencies: [{ kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemErrorDirective, selector: "[auiFormItemError]" }, { kind: "directive", type: i1.FormItemHintDirective, selector: "[auiFormItemHint]" }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "directive", type: i1.FormItemControlDirective, selector: "[auiFormItemControl]", inputs: ["required"] }, { kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "component", type: i1.InputGroupComponent, selector: "aui-input-group" }, { kind: "directive", type: i1.InputSuffixDirective, selector: "[auiInputSuffix]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: ErrorsMapperComponent, selector: "acl-errors-mapper", inputs: ["errors", "errorsMapper", "errorsMapperFn", "controlName", "ignoreUnknownError"] }, { kind: "directive", type: ErrorsMapperDirective, selector: "[aclErrorsMapper]", inputs: ["aclErrorsMapper", "aclErrorsMapperFn", "aclErrorsMapperDisabled", "aclErrorsMapperOutlet", "aclErrorsMapperControlName"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FunctionValidatorDirective, selector: "[aclValidateFn][ngModel],[aclValidateFn][formControl],[aclValidateFn][formControlName]", inputs: ["aclValidateFn"] }, { kind: "directive", type: StrongPasswordDirective, selector: "input[aclStrongPassword][ngModel],input[aclStrongPassword][formControl],input[aclStrongPassword][formControlName]", inputs: ["aclStrongPassword", "required", "specialChars", "minlength", "maxlength", "notStartsWith"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PasswordInputComponent, decorators: [{
             type: Component,
@@ -7196,7 +7140,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                             useExisting: forwardRef(() => PasswordInputComponent),
                             multi: true,
                         },
-                    ], template: "<aui-form-item [width]=\"width\">\n  <label auiFormItemLabel>{{ label || ('password' | translate) }}</label>\n  @if (showInput) {\n    <aui-input-group\n      class=\"tw-flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"password\"\n        #password=\"ngModel\"\n        [ngModel]=\"model\"\n        (ngModelChange)=\"emitModel($event)\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclStrongPassword]=\"strongPassword\"\n        [specialChars]=\"specialChars\"\n        [pattern]=\"strongPassword ? null : pattern\"\n        [placeholder]=\"placeholder\"\n        [aclErrorsMapperOutlet]=\"passwordError\"\n        [aclErrorsMapper]=\"{\n          pattern: strongPassword\n            ? ('strong_password_pattern_tip'\n              | translate\n                : {\n                    chars: specialChars.split('').join(', '),\n                  })\n            : ('invalid_pattern' | translate),\n        }\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"tw-icon-m tw-cursor-pointer hover:tw-text-primary\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n  }\n  @if (hint) {\n    <div auiFormItemHint>\n      @if (isTemplateRef(hint)) {\n        <ng-container *ngTemplateOutlet=\"hint\"></ng-container>\n      } @else {\n        {{ hint }}\n      }\n    </div>\n  }\n  <div\n    #passwordError\n    auiFormItemError\n  ></div>\n  @if (!showInput) {\n    <span>******</span>\n    @if (!readonly) {\n      <button\n        aui-button=\"text\"\n        (click)=\"updatePasswd()\"\n      >\n        <aui-icon icon=\"pencil\"></aui-icon>\n      </button>\n    }\n  }\n</aui-form-item>\n@if (showInput && enableConfirm) {\n  <aui-form-item [width]=\"width\">\n    <label auiFormItemLabel>{{ 'confirm_password' | translate }}</label>\n    <aui-input-group\n      class=\"tw-flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"confirmPassword\"\n        #confirm=\"ngModel\"\n        [(ngModel)]=\"confirmPassword\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclValidateFn]=\"model | pure: validateConfirmPassword\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"tw-icon-m tw-cursor-pointer hover:tw-text-primary\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n    <acl-errors-mapper\n      auiFormItemError\n      [errors]=\"confirm?.errors\"\n      [errorsMapper]=\"{\n        notMatch: 'confirm_password_not_match' | translate,\n      }\"\n    ></acl-errors-mapper>\n  </aui-form-item>\n}\n" }]
+                    ], template: "<aui-form-item [width]=\"width\">\n  <label auiFormItemLabel>{{ label || ('password' | translate) }}</label>\n  @if (showInput) {\n    <aui-input-group\n      class=\"flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"password\"\n        #password=\"ngModel\"\n        [ngModel]=\"model\"\n        (ngModelChange)=\"emitModel($event)\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclStrongPassword]=\"strongPassword\"\n        [specialChars]=\"specialChars\"\n        [pattern]=\"strongPassword ? null : pattern\"\n        [placeholder]=\"placeholder\"\n        [aclErrorsMapperOutlet]=\"passwordError\"\n        [aclErrorsMapper]=\"{\n          pattern: strongPassword\n            ? ('strong_password_pattern_tip'\n              | translate\n                : {\n                    chars: specialChars.split('').join(', '),\n                  })\n            : ('invalid_pattern' | translate),\n        }\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"toggle-icon\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n  }\n  @if (hint) {\n    <div auiFormItemHint>\n      @if (isTemplateRef(hint)) {\n        <ng-container *ngTemplateOutlet=\"hint\"></ng-container>\n      } @else {\n        {{ hint }}\n      }\n    </div>\n  }\n  <div\n    #passwordError\n    auiFormItemError\n  ></div>\n  @if (!showInput) {\n    <span>******</span>\n    @if (!readonly) {\n      <button\n        aui-button=\"text\"\n        (click)=\"updatePasswd()\"\n      >\n        <aui-icon icon=\"pencil\"></aui-icon>\n      </button>\n    }\n  }\n</aui-form-item>\n@if (showInput && enableConfirm) {\n  <aui-form-item [width]=\"width\">\n    <label auiFormItemLabel>{{ 'confirm_password' | translate }}</label>\n    <aui-input-group\n      class=\"flex-1\"\n      auiFormItemControl\n      [required]=\"required\"\n    >\n      <input\n        aui-input\n        [type]=\"showPassword ? 'text' : 'password'\"\n        name=\"confirmPassword\"\n        #confirm=\"ngModel\"\n        [(ngModel)]=\"confirmPassword\"\n        autocomplete=\"new-password\"\n        [required]=\"required\"\n        [aclValidateFn]=\"model | pure: validateConfirmPassword\"\n      />\n      @if (toggleable) {\n        <aui-icon\n          auiInputSuffix\n          class=\"toggle-icon\"\n          [icon]=\"showPassword ? 'eye_s' : 'eye_slash_s'\"\n          (click)=\"showPassword = !showPassword\"\n        ></aui-icon>\n      }\n    </aui-input-group>\n    <acl-errors-mapper\n      auiFormItemError\n      [errors]=\"confirm?.errors\"\n      [errorsMapper]=\"{\n        notMatch: 'confirm_password_not_match' | translate,\n      }\"\n    ></acl-errors-mapper>\n  </aui-form-item>\n}\n", styles: [".flex-1{flex:1 1 0%}.toggle-icon{font-size:14px;cursor:pointer}.toggle-icon:hover{color:rgb(var(--aui-color-primary))}\n"] }]
         }], propDecorators: { initPassword: [{
                 type: Input
             }], label: [{
@@ -7521,11 +7465,11 @@ class SearchPanelComponent {
         return panels?.length % 3 === 0;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: SearchPanelComponent, isStandalone: true, selector: "acl-search-panel", inputs: { enableEnterHandler: "enableEnterHandler" }, outputs: { searchEvent: "searchEvent", resetSearch: "resetSearch" }, host: { listeners: { "document:keydown.enter": "enter()" } }, queries: [{ propertyName: "items", predicate: SearchItemComponent, descendants: true }], ngImport: i0, template: "<div class=\"search-panel\">\n  <ng-content></ng-content>\n  <acl-search-item [style.width]=\"(isFulWidth$$ | async) ? '100%' : ''\">\n    <div class=\"tw-justify-end tw-w-full search\">\n      <button\n        type=\"button\"\n        aui-button=\"primary\"\n        (click)=\"searchEvent.emit()\"\n      >\n        {{ 'search' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        aui-button\n        (click)=\"resetSearch.emit()\"\n      >\n        {{ 'reset' | translate }}\n      </button>\n\n      <ng-content select=\"[additional]\"></ng-content>\n    </div>\n  </acl-search-item>\n</div>\n", styles: [":host::ng-deep aui-select{width:100%}:host::ng-deep .search-panel{display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:-16px}:host::ng-deep .search-panel acl-search-item{width:33.33%}:host::ng-deep .search-panel acl-search-item .search-panel__item{width:100%;margin-bottom:16px;display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>*{display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>label{padding-right:8px;justify-content:flex-end;text-align:right;line-height:var(--aui-line-height-s);align-items:center;min-width:70px;margin-left:20px}html:not([lang|=zh]) :host::ng-deep .search-panel acl-search-item .search-panel__item>label{min-width:110px}:host::ng-deep .search-panel acl-search-item .search-panel__item>label:after{content:\":\";margin-left:2px}:host::ng-deep .search-panel acl-search-item .search-panel__item>aui-select{flex:1}:host::ng-deep .search-panel acl-search-item:nth-of-type(3n+1) .search-panel__item label{margin-left:0}\n"], dependencies: [{ kind: "component", type: SearchItemComponent, selector: "acl-search-item" }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: SearchPanelComponent, isStandalone: true, selector: "acl-search-panel", inputs: { enableEnterHandler: "enableEnterHandler" }, outputs: { searchEvent: "searchEvent", resetSearch: "resetSearch" }, host: { listeners: { "document:keydown.enter": "enter()" } }, queries: [{ propertyName: "items", predicate: SearchItemComponent, descendants: true }], ngImport: i0, template: "<div class=\"search-panel\">\n  <ng-content></ng-content>\n  <acl-search-item [style.width]=\"(isFulWidth$$ | async) ? '100%' : ''\">\n    <div class=\"search-actions search\">\n      <button\n        type=\"button\"\n        aui-button=\"primary\"\n        (click)=\"searchEvent.emit()\"\n      >\n        {{ 'search' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        aui-button\n        (click)=\"resetSearch.emit()\"\n      >\n        {{ 'reset' | translate }}\n      </button>\n\n      <ng-content select=\"[additional]\"></ng-content>\n    </div>\n  </acl-search-item>\n</div>\n", styles: [":host::ng-deep aui-select{width:100%}:host::ng-deep .search-panel{display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:-16px}:host::ng-deep .search-panel acl-search-item{width:33.33%}:host::ng-deep .search-panel acl-search-item .search-panel__item{width:100%;margin-bottom:16px;display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>*{display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>label{padding-right:8px;justify-content:flex-end;text-align:right;line-height:var(--aui-line-height-s);align-items:center;min-width:70px;margin-left:20px}html:not([lang|=zh]) :host::ng-deep .search-panel acl-search-item .search-panel__item>label{min-width:110px}:host::ng-deep .search-panel acl-search-item .search-panel__item>label:after{content:\":\";margin-left:2px}:host::ng-deep .search-panel acl-search-item .search-panel__item>aui-select{flex:1}:host::ng-deep .search-panel acl-search-item:nth-of-type(3n+1) .search-panel__item label{margin-left:0}.search-actions{display:flex;justify-content:flex-end;width:100%}\n"], dependencies: [{ kind: "component", type: SearchItemComponent, selector: "acl-search-item" }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SearchPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'acl-search-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SearchItemComponent, ButtonComponent, TranslatePipe, AsyncPipe], standalone: true, template: "<div class=\"search-panel\">\n  <ng-content></ng-content>\n  <acl-search-item [style.width]=\"(isFulWidth$$ | async) ? '100%' : ''\">\n    <div class=\"tw-justify-end tw-w-full search\">\n      <button\n        type=\"button\"\n        aui-button=\"primary\"\n        (click)=\"searchEvent.emit()\"\n      >\n        {{ 'search' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        aui-button\n        (click)=\"resetSearch.emit()\"\n      >\n        {{ 'reset' | translate }}\n      </button>\n\n      <ng-content select=\"[additional]\"></ng-content>\n    </div>\n  </acl-search-item>\n</div>\n", styles: [":host::ng-deep aui-select{width:100%}:host::ng-deep .search-panel{display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:-16px}:host::ng-deep .search-panel acl-search-item{width:33.33%}:host::ng-deep .search-panel acl-search-item .search-panel__item{width:100%;margin-bottom:16px;display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>*{display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>label{padding-right:8px;justify-content:flex-end;text-align:right;line-height:var(--aui-line-height-s);align-items:center;min-width:70px;margin-left:20px}html:not([lang|=zh]) :host::ng-deep .search-panel acl-search-item .search-panel__item>label{min-width:110px}:host::ng-deep .search-panel acl-search-item .search-panel__item>label:after{content:\":\";margin-left:2px}:host::ng-deep .search-panel acl-search-item .search-panel__item>aui-select{flex:1}:host::ng-deep .search-panel acl-search-item:nth-of-type(3n+1) .search-panel__item label{margin-left:0}\n"] }]
+            args: [{ selector: 'acl-search-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SearchItemComponent, ButtonComponent, TranslatePipe, AsyncPipe], standalone: true, template: "<div class=\"search-panel\">\n  <ng-content></ng-content>\n  <acl-search-item [style.width]=\"(isFulWidth$$ | async) ? '100%' : ''\">\n    <div class=\"search-actions search\">\n      <button\n        type=\"button\"\n        aui-button=\"primary\"\n        (click)=\"searchEvent.emit()\"\n      >\n        {{ 'search' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        aui-button\n        (click)=\"resetSearch.emit()\"\n      >\n        {{ 'reset' | translate }}\n      </button>\n\n      <ng-content select=\"[additional]\"></ng-content>\n    </div>\n  </acl-search-item>\n</div>\n", styles: [":host::ng-deep aui-select{width:100%}:host::ng-deep .search-panel{display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:-16px}:host::ng-deep .search-panel acl-search-item{width:33.33%}:host::ng-deep .search-panel acl-search-item .search-panel__item{width:100%;margin-bottom:16px;display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>*{display:inline-flex}:host::ng-deep .search-panel acl-search-item .search-panel__item>label{padding-right:8px;justify-content:flex-end;text-align:right;line-height:var(--aui-line-height-s);align-items:center;min-width:70px;margin-left:20px}html:not([lang|=zh]) :host::ng-deep .search-panel acl-search-item .search-panel__item>label{min-width:110px}:host::ng-deep .search-panel acl-search-item .search-panel__item>label:after{content:\":\";margin-left:2px}:host::ng-deep .search-panel acl-search-item .search-panel__item>aui-select{flex:1}:host::ng-deep .search-panel acl-search-item:nth-of-type(3n+1) .search-panel__item label{margin-left:0}.search-actions{display:flex;justify-content:flex-end;width:100%}\n"] }]
         }], propDecorators: { enableEnterHandler: [{
                 type: Input
             }], searchEvent: [{
@@ -7726,7 +7670,7 @@ class PodStatusComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PodStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: PodStatusComponent, isStandalone: true, selector: "acl-pod-status", inputs: { pod: "pod", disableMessageOverview: "disableMessageOverview" }, ngImport: i0, template: "@if (pod | pure: getPodStatus; as status) {\n  <div class=\"status-wrapper\">\n    <acl-status-icon\n      [status]=\"status | pure: getPodAggregatedStatus\"\n      [colorMapper]=\"PodStatusColorMapper\"\n      [iconMapper]=\"PodStatusIconMapper\"\n      [withText]=\"false\"\n      [ngStyle]=\"{ 'margin-right': 0 }\"\n    ></acl-status-icon>\n    <div class=\"tw-flex\">\n      {{ status }}\n      <ng-container\n        [ngTemplateOutlet]=\"readyContainerTmpl\"\n        [ngTemplateOutletContext]=\"{\n          $implicit: pod | pure: getReadyContainer,\n        }\"\n      ></ng-container>\n      <ng-template\n        #readyContainerTmpl\n        let-data\n      >\n        ({{ data.ready }}/{{ data.all }})\n      </ng-template>\n      @if (pod | pure: getPodErrorMessages; as messages) {\n        @if (messages?.length && !disableMessageOverview) {\n          <aui-icon\n            icon=\"file_magnifier\"\n            class=\"message-tip-icon\"\n            [auiTooltip]=\"\n              messages.length === 1 ? onlyOnePodMessage : podMessages\n            \"\n            [auiTooltipContext]=\"{ messages: messages }\"\n            size=\"14\"\n            auiTooltipClass=\"condition-message-tip\"\n          ></aui-icon>\n        }\n      }\n    </div>\n  </div>\n} @else {\n  -\n}\n<ng-template\n  #podMessages\n  let-messages=\"messages\"\n>\n  <ul class=\"pod-messages\">\n    @for (msg of messages; track msg) {\n      <li><em>&bull;</em>{{ msg }}</li>\n    }\n  </ul>\n</ng-template>\n<ng-template\n  #onlyOnePodMessage\n  let-messages=\"messages\"\n>\n  {{ messages[0] }}\n</ng-template>\n", styles: [":host ::ng-deep .condition-message-tip{white-space:pre-line}:host{display:flex}:host .message-tip-icon{margin-left:6px}:host .status-wrapper{display:flex;overflow:hidden;text-overflow:ellipsis}.pod-messages li{padding-left:8px}.pod-messages li em{color:rgb(var(--aui-color-n-4));margin-right:4px;margin-left:-8px;font-size:14px}\n"], dependencies: [{ kind: "component", type: StatusIconComponent, selector: "acl-status-icon", inputs: ["status", "withText", "colorMapper", "iconMapper", "disabled", "iconSize"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: PodStatusComponent, isStandalone: true, selector: "acl-pod-status", inputs: { pod: "pod", disableMessageOverview: "disableMessageOverview" }, ngImport: i0, template: "@if (pod | pure: getPodStatus; as status) {\n  <div class=\"status-wrapper\">\n    <acl-status-icon\n      [status]=\"status | pure: getPodAggregatedStatus\"\n      [colorMapper]=\"PodStatusColorMapper\"\n      [iconMapper]=\"PodStatusIconMapper\"\n      [withText]=\"false\"\n      [ngStyle]=\"{ 'margin-right': 0 }\"\n    ></acl-status-icon>\n    <div class=\"status-flex\">\n      {{ status }}\n      <ng-container\n        [ngTemplateOutlet]=\"readyContainerTmpl\"\n        [ngTemplateOutletContext]=\"{\n          $implicit: pod | pure: getReadyContainer,\n        }\"\n      ></ng-container>\n      <ng-template\n        #readyContainerTmpl\n        let-data\n      >\n        ({{ data.ready }}/{{ data.all }})\n      </ng-template>\n      @if (pod | pure: getPodErrorMessages; as messages) {\n        @if (messages?.length && !disableMessageOverview) {\n          <aui-icon\n            icon=\"file_magnifier\"\n            class=\"message-tip-icon\"\n            [auiTooltip]=\"\n              messages.length === 1 ? onlyOnePodMessage : podMessages\n            \"\n            [auiTooltipContext]=\"{ messages: messages }\"\n            size=\"14\"\n            auiTooltipClass=\"condition-message-tip\"\n          ></aui-icon>\n        }\n      }\n    </div>\n  </div>\n} @else {\n  -\n}\n<ng-template\n  #podMessages\n  let-messages=\"messages\"\n>\n  <ul class=\"pod-messages\">\n    @for (msg of messages; track msg) {\n      <li><em>&bull;</em>{{ msg }}</li>\n    }\n  </ul>\n</ng-template>\n<ng-template\n  #onlyOnePodMessage\n  let-messages=\"messages\"\n>\n  {{ messages[0] }}\n</ng-template>\n", styles: [":host ::ng-deep .condition-message-tip{white-space:pre-line}:host{display:flex}:host .message-tip-icon{margin-left:6px}:host .status-wrapper{display:flex;overflow:hidden;text-overflow:ellipsis}.pod-messages li{padding-left:8px}.pod-messages li em{color:rgb(var(--aui-color-n-4));margin-right:4px;margin-left:-8px;font-size:14px}.status-flex{display:flex}\n"], dependencies: [{ kind: "component", type: StatusIconComponent, selector: "acl-status-icon", inputs: ["status", "withText", "colorMapper", "iconMapper", "disabled", "iconSize"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PodStatusComponent, decorators: [{
             type: Component,
@@ -7737,7 +7681,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         NgStyle,
                         NgTemplateOutlet,
                         PurePipe,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (pod | pure: getPodStatus; as status) {\n  <div class=\"status-wrapper\">\n    <acl-status-icon\n      [status]=\"status | pure: getPodAggregatedStatus\"\n      [colorMapper]=\"PodStatusColorMapper\"\n      [iconMapper]=\"PodStatusIconMapper\"\n      [withText]=\"false\"\n      [ngStyle]=\"{ 'margin-right': 0 }\"\n    ></acl-status-icon>\n    <div class=\"tw-flex\">\n      {{ status }}\n      <ng-container\n        [ngTemplateOutlet]=\"readyContainerTmpl\"\n        [ngTemplateOutletContext]=\"{\n          $implicit: pod | pure: getReadyContainer,\n        }\"\n      ></ng-container>\n      <ng-template\n        #readyContainerTmpl\n        let-data\n      >\n        ({{ data.ready }}/{{ data.all }})\n      </ng-template>\n      @if (pod | pure: getPodErrorMessages; as messages) {\n        @if (messages?.length && !disableMessageOverview) {\n          <aui-icon\n            icon=\"file_magnifier\"\n            class=\"message-tip-icon\"\n            [auiTooltip]=\"\n              messages.length === 1 ? onlyOnePodMessage : podMessages\n            \"\n            [auiTooltipContext]=\"{ messages: messages }\"\n            size=\"14\"\n            auiTooltipClass=\"condition-message-tip\"\n          ></aui-icon>\n        }\n      }\n    </div>\n  </div>\n} @else {\n  -\n}\n<ng-template\n  #podMessages\n  let-messages=\"messages\"\n>\n  <ul class=\"pod-messages\">\n    @for (msg of messages; track msg) {\n      <li><em>&bull;</em>{{ msg }}</li>\n    }\n  </ul>\n</ng-template>\n<ng-template\n  #onlyOnePodMessage\n  let-messages=\"messages\"\n>\n  {{ messages[0] }}\n</ng-template>\n", styles: [":host ::ng-deep .condition-message-tip{white-space:pre-line}:host{display:flex}:host .message-tip-icon{margin-left:6px}:host .status-wrapper{display:flex;overflow:hidden;text-overflow:ellipsis}.pod-messages li{padding-left:8px}.pod-messages li em{color:rgb(var(--aui-color-n-4));margin-right:4px;margin-left:-8px;font-size:14px}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (pod | pure: getPodStatus; as status) {\n  <div class=\"status-wrapper\">\n    <acl-status-icon\n      [status]=\"status | pure: getPodAggregatedStatus\"\n      [colorMapper]=\"PodStatusColorMapper\"\n      [iconMapper]=\"PodStatusIconMapper\"\n      [withText]=\"false\"\n      [ngStyle]=\"{ 'margin-right': 0 }\"\n    ></acl-status-icon>\n    <div class=\"status-flex\">\n      {{ status }}\n      <ng-container\n        [ngTemplateOutlet]=\"readyContainerTmpl\"\n        [ngTemplateOutletContext]=\"{\n          $implicit: pod | pure: getReadyContainer,\n        }\"\n      ></ng-container>\n      <ng-template\n        #readyContainerTmpl\n        let-data\n      >\n        ({{ data.ready }}/{{ data.all }})\n      </ng-template>\n      @if (pod | pure: getPodErrorMessages; as messages) {\n        @if (messages?.length && !disableMessageOverview) {\n          <aui-icon\n            icon=\"file_magnifier\"\n            class=\"message-tip-icon\"\n            [auiTooltip]=\"\n              messages.length === 1 ? onlyOnePodMessage : podMessages\n            \"\n            [auiTooltipContext]=\"{ messages: messages }\"\n            size=\"14\"\n            auiTooltipClass=\"condition-message-tip\"\n          ></aui-icon>\n        }\n      }\n    </div>\n  </div>\n} @else {\n  -\n}\n<ng-template\n  #podMessages\n  let-messages=\"messages\"\n>\n  <ul class=\"pod-messages\">\n    @for (msg of messages; track msg) {\n      <li><em>&bull;</em>{{ msg }}</li>\n    }\n  </ul>\n</ng-template>\n<ng-template\n  #onlyOnePodMessage\n  let-messages=\"messages\"\n>\n  {{ messages[0] }}\n</ng-template>\n", styles: [":host ::ng-deep .condition-message-tip{white-space:pre-line}:host{display:flex}:host .message-tip-icon{margin-left:6px}:host .status-wrapper{display:flex;overflow:hidden;text-overflow:ellipsis}.pod-messages li{padding-left:8px}.pod-messages li em{color:rgb(var(--aui-color-n-4));margin-right:4px;margin-left:-8px;font-size:14px}.status-flex{display:flex}\n"] }]
         }], propDecorators: { pod: [{
                 type: Input
             }], disableMessageOverview: [{
@@ -7778,9 +7722,9 @@ const FileResultType = {
     TEXT: 'Text',
 };
 class UploadFileComponent {
-    constructor(notification, translate) {
-        this.notification = notification;
-        this.translate = translate;
+    constructor() {
+        this.notification = inject(NotificationService);
+        this.translate = inject(TranslateService);
         this.resultType = FileResultType.TEXT;
     }
     onClick() {
@@ -7823,7 +7767,7 @@ class UploadFileComponent {
     registerOnTouched() {
         //
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UploadFileComponent, deps: [{ token: i1.NotificationService }, { token: i2$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UploadFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: UploadFileComponent, isStandalone: true, selector: "acl-upload-file", inputs: { disabled: "disabled", accept: "accept", multiple: "multiple", resultType: "resultType" }, host: { listeners: { "click": "onClick()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -7841,7 +7785,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                             multi: true,
                         },
                     ], standalone: true, imports: [EFFECT_DIRECTIVE_MODULE], template: "<ng-content></ng-content>\n<input\n  #fileInput\n  class=\"file-input\"\n  type=\"file\"\n  [attr.accept]=\"accept\"\n  [multiple]=\"multiple\"\n  (change)=\"onChange($event)\"\n/>\n", styles: [":host{position:relative;display:inline-flex;overflow:hidden}.file-input{position:absolute;inset:0;opacity:0;z-index:-1}\n"] }]
-        }], ctorParameters: () => [{ type: i1.NotificationService }, { type: i2$1.TranslateService }], propDecorators: { disabled: [{
+        }], propDecorators: { disabled: [{
                 type: Input
             }], accept: [{
                 type: Input
@@ -8156,7 +8100,7 @@ class PageGuardComponent {
         this.reasonSrc$ = combineLatest([
             this.theme.currentTheme$,
             this.reasonModel$,
-        ]).pipe(map(([theme, reasonModel]) => `assets/images/${theme}/${reasonModel.src}`), publishRef());
+        ]).pipe(map(([theme, reasonModel]) => `/console-assets/images/${theme}/${reasonModel.src}`), publishRef());
     }
     get allowed() {
         return this.status === GuardStatus.Available;
@@ -8253,11 +8197,11 @@ class ListDisplayComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ListDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ListDisplayComponent, isStandalone: true, selector: "acl-list-display", inputs: { data: "data", threshold: "threshold", mode: "mode", direction: "direction", template: "template" }, queries: [{ propertyName: "childTemplate", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<div\n  class=\"tw-flex\"\n  [class]=\"{ 'tw-flex-col': direction === 'column' }\"\n>\n  <ul>\n    @for (item of threshold ? data.slice(0, threshold) : data; track item) {\n      <li>\n        <ng-container\n          *ngTemplateOutlet=\"\n            childTemplate || template;\n            context: item | pure: templateContext\n          \"\n        ></ng-container>\n      </li>\n    }\n  </ul>\n  @if (threshold && data.length > threshold) {\n    <div [class]=\"{ 'tw-ml-8': direction === 'row' }\">\n      @if (mode === 'total') {\n        {{ 'in_total' | translate }}\n        <a\n          [auiTooltip]=\"total\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.length }}\n        </a>\n        {{ 'ge' | translate }}\n      }\n      @if (mode === 'more') {\n        {{ 'more' | translate }}\n        <a\n          [auiTooltip]=\"more\"\n          [auiTooltipContext]=\"{ data: data.slice(threshold) }\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.slice(threshold).length }}\n        </a>\n        {{ 'tiao' | translate }}\n      }\n    </div>\n  }\n</div>\n\n<ng-template #total>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n\n<ng-template\n  #more\n  let-data=\"data\"\n>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n", styles: ["li{line-height:20px}\n"], dependencies: [{ kind: "component", type: ListDisplayComponent, selector: "acl-list-display", inputs: ["data", "threshold", "mode", "direction", "template"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ListDisplayComponent, isStandalone: true, selector: "acl-list-display", inputs: { data: "data", threshold: "threshold", mode: "mode", direction: "direction", template: "template" }, queries: [{ propertyName: "childTemplate", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<div\n  class=\"list-display-container\"\n  [class.flex-col]=\"direction === 'column'\"\n>\n  <ul>\n    @for (item of threshold ? data.slice(0, threshold) : data; track item) {\n      <li>\n        <ng-container\n          *ngTemplateOutlet=\"\n            childTemplate || template;\n            context: item | pure: templateContext\n          \"\n        ></ng-container>\n      </li>\n    }\n  </ul>\n  @if (threshold && data.length > threshold) {\n    <div [class.ml-8]=\"direction === 'row'\">\n      @if (mode === 'total') {\n        {{ 'in_total' | translate }}\n        <a\n          [auiTooltip]=\"total\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.length }}\n        </a>\n        {{ 'ge' | translate }}\n      }\n      @if (mode === 'more') {\n        {{ 'more' | translate }}\n        <a\n          [auiTooltip]=\"more\"\n          [auiTooltipContext]=\"{ data: data.slice(threshold) }\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.slice(threshold).length }}\n        </a>\n        {{ 'tiao' | translate }}\n      }\n    </div>\n  }\n</div>\n\n<ng-template #total>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n\n<ng-template\n  #more\n  let-data=\"data\"\n>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n", styles: ["li{line-height:20px}.list-display-container{display:flex}.flex-col{flex-direction:column}.ml-8{margin-left:8px}\n"], dependencies: [{ kind: "component", type: ListDisplayComponent, selector: "acl-list-display", inputs: ["data", "threshold", "mode", "direction", "template"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ListDisplayComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'acl-list-display', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, PurePipe, TranslatePipe, TOOLTIP_MODULE], template: "<div\n  class=\"tw-flex\"\n  [class]=\"{ 'tw-flex-col': direction === 'column' }\"\n>\n  <ul>\n    @for (item of threshold ? data.slice(0, threshold) : data; track item) {\n      <li>\n        <ng-container\n          *ngTemplateOutlet=\"\n            childTemplate || template;\n            context: item | pure: templateContext\n          \"\n        ></ng-container>\n      </li>\n    }\n  </ul>\n  @if (threshold && data.length > threshold) {\n    <div [class]=\"{ 'tw-ml-8': direction === 'row' }\">\n      @if (mode === 'total') {\n        {{ 'in_total' | translate }}\n        <a\n          [auiTooltip]=\"total\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.length }}\n        </a>\n        {{ 'ge' | translate }}\n      }\n      @if (mode === 'more') {\n        {{ 'more' | translate }}\n        <a\n          [auiTooltip]=\"more\"\n          [auiTooltipContext]=\"{ data: data.slice(threshold) }\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.slice(threshold).length }}\n        </a>\n        {{ 'tiao' | translate }}\n      }\n    </div>\n  }\n</div>\n\n<ng-template #total>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n\n<ng-template\n  #more\n  let-data=\"data\"\n>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n", styles: ["li{line-height:20px}\n"] }]
+            args: [{ standalone: true, selector: 'acl-list-display', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, PurePipe, TranslatePipe, TOOLTIP_MODULE], template: "<div\n  class=\"list-display-container\"\n  [class.flex-col]=\"direction === 'column'\"\n>\n  <ul>\n    @for (item of threshold ? data.slice(0, threshold) : data; track item) {\n      <li>\n        <ng-container\n          *ngTemplateOutlet=\"\n            childTemplate || template;\n            context: item | pure: templateContext\n          \"\n        ></ng-container>\n      </li>\n    }\n  </ul>\n  @if (threshold && data.length > threshold) {\n    <div [class.ml-8]=\"direction === 'row'\">\n      @if (mode === 'total') {\n        {{ 'in_total' | translate }}\n        <a\n          [auiTooltip]=\"total\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.length }}\n        </a>\n        {{ 'ge' | translate }}\n      }\n      @if (mode === 'more') {\n        {{ 'more' | translate }}\n        <a\n          [auiTooltip]=\"more\"\n          [auiTooltipContext]=\"{ data: data.slice(threshold) }\"\n          auiTooltipType=\"info\"\n          auiTooltipPosition=\"bottom center\"\n        >\n          {{ data.slice(threshold).length }}\n        </a>\n        {{ 'tiao' | translate }}\n      }\n    </div>\n  }\n</div>\n\n<ng-template #total>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n\n<ng-template\n  #more\n  let-data=\"data\"\n>\n  <acl-list-display\n    [data]=\"data\"\n    [template]=\"childTemplate || template\"\n  ></acl-list-display>\n</ng-template>\n", styles: ["li{line-height:20px}.list-display-container{display:flex}.flex-col{flex-direction:column}.ml-8{margin-left:8px}\n"] }]
         }], propDecorators: { data: [{
                 type: Input
             }], threshold: [{
@@ -8278,11 +8222,11 @@ class OverviewBannerComponent {
         this.option = {};
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: OverviewBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: OverviewBannerComponent, isStandalone: true, selector: "acl-overview-banner", inputs: { option: "option" }, ngImport: i0, template: "<div class=\"overview-banner--wrapper\">\n  <div class=\"overview-banner\">\n    <div class=\"overview-banner__icon\">\n      <aui-icon\n        class=\"acl-colorful-icon highlight\"\n        [icon]=\"'bicolor:' + option?.icon\"\n      ></aui-icon>\n    </div>\n    <div class=\"overview-banner__content\">\n      <div class=\"overview-banner__title\">\n        {{ option?.title }}\n      </div>\n      <div class=\"overview-banner__description\">\n        {{ option?.description }}\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".overview-banner--wrapper{border-radius:use-var(border-radius-l);margin-bottom:use-var(spacing-xl);background-color:use-rgb(primary);background-image:url(/assets/images/overview-banner.svg);background-size:cover;background-position:center}.overview-banner{display:flex;align-items:center;padding:24px}.overview-banner__icon{margin-right:20px}.overview-banner__icon aui-icon{display:flex;font-size:56px;width:1em;height:1em}.overview-banner__content{color:#fff}.overview-banner__title{font-size:24px;line-height:36px;font-weight:use-var(font-weight-bolder)}.overview-banner__description{margin-top:4px;font-size:use-var(font-size-m)}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: OverviewBannerComponent, isStandalone: true, selector: "acl-overview-banner", inputs: { option: "option" }, ngImport: i0, template: "<div class=\"overview-banner--wrapper\">\n  <div class=\"overview-banner\">\n    <div class=\"overview-banner__icon\">\n      <aui-icon\n        class=\"acl-colorful-icon highlight\"\n        [icon]=\"'bicolor:' + option?.icon\"\n      ></aui-icon>\n    </div>\n    <div class=\"overview-banner__content\">\n      <div class=\"overview-banner__title\">\n        {{ option?.title }}\n      </div>\n      <div class=\"overview-banner__description\">\n        {{ option?.description }}\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".overview-banner--wrapper{border-radius:use-var(border-radius-l);margin-bottom:use-var(spacing-xl);background-color:use-rgb(primary);background-image:url(/console-assets/images/overview-banner.svg);background-size:cover;background-position:center}.overview-banner{display:flex;align-items:center;padding:24px}.overview-banner__icon{margin-right:20px}.overview-banner__icon aui-icon{display:flex;font-size:56px;width:1em;height:1em}.overview-banner__content{color:#fff}.overview-banner__title{font-size:24px;line-height:36px;font-weight:use-var(font-weight-bolder)}.overview-banner__description{margin-top:4px;font-size:use-var(font-size-m)}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: OverviewBannerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'acl-overview-banner', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div class=\"overview-banner--wrapper\">\n  <div class=\"overview-banner\">\n    <div class=\"overview-banner__icon\">\n      <aui-icon\n        class=\"acl-colorful-icon highlight\"\n        [icon]=\"'bicolor:' + option?.icon\"\n      ></aui-icon>\n    </div>\n    <div class=\"overview-banner__content\">\n      <div class=\"overview-banner__title\">\n        {{ option?.title }}\n      </div>\n      <div class=\"overview-banner__description\">\n        {{ option?.description }}\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".overview-banner--wrapper{border-radius:use-var(border-radius-l);margin-bottom:use-var(spacing-xl);background-color:use-rgb(primary);background-image:url(/assets/images/overview-banner.svg);background-size:cover;background-position:center}.overview-banner{display:flex;align-items:center;padding:24px}.overview-banner__icon{margin-right:20px}.overview-banner__icon aui-icon{display:flex;font-size:56px;width:1em;height:1em}.overview-banner__content{color:#fff}.overview-banner__title{font-size:24px;line-height:36px;font-weight:use-var(font-weight-bolder)}.overview-banner__description{margin-top:4px;font-size:use-var(font-size-m)}\n"] }]
+            args: [{ selector: 'acl-overview-banner', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div class=\"overview-banner--wrapper\">\n  <div class=\"overview-banner\">\n    <div class=\"overview-banner__icon\">\n      <aui-icon\n        class=\"acl-colorful-icon highlight\"\n        [icon]=\"'bicolor:' + option?.icon\"\n      ></aui-icon>\n    </div>\n    <div class=\"overview-banner__content\">\n      <div class=\"overview-banner__title\">\n        {{ option?.title }}\n      </div>\n      <div class=\"overview-banner__description\">\n        {{ option?.description }}\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".overview-banner--wrapper{border-radius:use-var(border-radius-l);margin-bottom:use-var(spacing-xl);background-color:use-rgb(primary);background-image:url(/console-assets/images/overview-banner.svg);background-size:cover;background-position:center}.overview-banner{display:flex;align-items:center;padding:24px}.overview-banner__icon{margin-right:20px}.overview-banner__icon aui-icon{display:flex;font-size:56px;width:1em;height:1em}.overview-banner__content{color:#fff}.overview-banner__title{font-size:24px;line-height:36px;font-weight:use-var(font-weight-bolder)}.overview-banner__description{margin-top:4px;font-size:use-var(font-size-m)}\n"] }]
         }], propDecorators: { option: [{
                 type: Input
             }] } });
@@ -8419,7 +8363,7 @@ class MultiSearchActionInputComponent extends BaseResourceFormComponent {
         // 键盘delete事件。
         this.delete = new EventEmitter();
         // 键盘enter事件
-        this.searchEvent = new EventEmitter();
+        this.search = new EventEmitter();
         this._conditionsModel = '';
         this.conditionsModel$$ = new BehaviorSubject('');
         this.hasFilteredConditions$ = combineLatest([
@@ -8621,7 +8565,7 @@ class MultiSearchActionInputComponent extends BaseResourceFormComponent {
             this.conditionsModel = currentLabel;
             // 如果是单选，则需要在选中时抛出complete事件，并抛出search事件
             this.ifComplete(false, true);
-            this.searchEvent.emit();
+            this.search.emit();
         }
     }
     // 多选
@@ -8812,7 +8756,7 @@ class MultiSearchActionInputComponent extends BaseResourceFormComponent {
         else {
             // 当前操作内容已完成，，则会抛出enter事件
             if (this.ifComplete(false, true)) {
-                this.searchEvent.emit();
+                this.search.emit();
             }
             else if (this.conditionCreatable && this.isConditionSelecting) {
                 this.setConditionByModel();
@@ -8930,7 +8874,7 @@ class MultiSearchActionInputComponent extends BaseResourceFormComponent {
         return conditionsModel === current;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MultiSearchActionInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchActionInputComponent, isStandalone: true, selector: "acl-multi-search-action-input", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", isEditing: "isEditing", hidden: "hidden", autoScroll: "autoScroll", conditionConfig: "conditionConfig", showFootAction: "showFootAction", existingConditions: "existingConditions" }, outputs: { completed: "completed", editing: "editing", delete: "delete", searchEvent: "searchEvent" }, host: { properties: { "hidden": "this.hiddenState" } }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true }, { propertyName: "toolTipRef", first: true, predicate: ["toolTipRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"tw-flex tw-items-center tw-text-m\">\n  @if (form.value; as activeCondition) {\n    <span\n      class=\"tw-ml-6 tw-max-w-[45%] tw-flex-shrink-0 tw-text-ellipsis tw-overflow-hidden\"\n      (click)=\"activeConditionClick(); $event.stopPropagation()\"\n    >\n      {{ activeCondition | pure: getConditionLabel }}\n    </span>\n    @if (activeCondition.operator) {\n      <span\n        class=\"tw-ml-6\"\n        (click)=\"activeOperatorClick(); $event.stopPropagation()\"\n      >\n        {{ activeCondition.operator }}\n      </span>\n    }\n    @if (!isEditing) {\n      <span\n        class=\"tw-ml-6 tw-max-w-[45%] tw-flex-shrink-0 tw-text-ellipsis tw-overflow-hidden\"\n        (click)=\"activeValueClick(); $event.stopPropagation()\"\n      >\n        {{ getValueContent(activeCondition) }}\n      </span>\n    }\n  }\n  <input\n    class=\"search-input\"\n    [ngClass]=\"{\n      'mock-input':\n        (!isEditing && !isConditionSelecting) || isOperatorSelecting,\n    }\"\n    [maxlength]=\"isOperatorSelecting ? 0 : MAX_SAFE_INTEGER\"\n    aui-input\n    #inputRef\n    #toolTipRef=\"auiTooltip\"\n    [placeholder]=\"isConditionSelecting ? placeholder : ''\"\n    [(ngModel)]=\"conditionsModel\"\n    (ngModelChange)=\"conditionsModel$$.next($event)\"\n    (keydown)=\"inputKeydown($event)\"\n    (focus)=\"inputFocus()\"\n    [auiTooltip]=\"templateRef\"\n    auiTooltipAnimType=\"none\"\n    auiTooltipTrigger=\"manual\"\n    auiTooltipType=\"info\"\n    auiTooltipClass=\"multi-search-dropdown\"\n    auiTooltipPosition=\"bottom start\"\n  />\n</div>\n\n<ng-template #templateRef>\n  <div\n    (mousedown)=\"$event.preventDefault()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <!-- \u7C7B\u76EE\u9009\u62E9 -->\n    @if (isConditionSelecting && (conditionsShouldShow$ | async)) {\n      @if (hasFilteredConditions$ | async) {\n        <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: (normalConditions$ | async),\n              groups: groupConditions$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      } @else {\n        <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n          <div class=\"no-match-categories-tip\">\n            {{ 'no_match_categories_tip' | translate }}\n          </div>\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: normalConditionsResource$ | async,\n              groups: groupConditionsResource$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      }\n      <ng-template\n        #categoriesTemp\n        let-normal=\"normal\"\n        let-groups=\"groups\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"liConditionTemp\"\n          [ngTemplateOutletContext]=\"{ conditions: normal }\"\n        ></ng-container>\n        @for (group of groups; track group) {\n          @if (group.member?.length) {\n            <div\n              [title]=\"group.group\"\n              class=\"dropdown-group-label dropdown-content\"\n            >\n              {{ group.group }}\n            </div>\n            <ng-container\n              [ngTemplateOutlet]=\"liConditionTemp\"\n              [ngTemplateOutletContext]=\"{ conditions: group.member }\"\n            ></ng-container>\n          }\n        }\n      </ng-template>\n    }\n\n    @if (form.value; as activeCondition) {\n      <!-- operator\u9009\u62E9 -->\n      @if (isOperatorSelecting) {\n        <ul class=\"tw-min-w-[160px]\">\n          @for (\n            operator of activeCondition.operators || [DEFAULT_OPERATOR];\n            track operator\n          ) {\n            <li (click)=\"selectActiveOperator($any(operator))\">\n              <ng-container\n                [ngTemplateOutlet]=\"basicLiContentTemp\"\n                [ngTemplateOutletContext]=\"{\n                  isSelect: operator === conditionsModel,\n                  label: operator,\n                }\"\n              >\n              </ng-container>\n            </li>\n          }\n        </ul>\n      }\n      <!-- \u5177\u4F53\u6761\u4EF6\u9009\u62E9 -->\n      @if (isValueSelecting) {\n        @if (\n          activeCondition\n            | pure\n              : hasFilteredValues\n              : conditionsModel\n              : activeCondition.isMulti\n        ) {\n          <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n            @if (activeCondition.allowSelectAll && activeCondition.isMulti) {\n              <li class=\"dropdown-content select-all\">\n                <div\n                  class=\"search-dropdown-item\"\n                  [ngClass]=\"{\n                    'tw-text-p-2': isSelectAll,\n                    'tw-bg-p-6': isSelectAll,\n                  }\"\n                  (click)=\"selectAllClick()\"\n                >\n                  <div class=\"multi-item\">\n                    <aui-checkbox\n                      [value]=\"isSelectAll\"\n                      [indeterminate]=\"isIndeterminate\"\n                    ></aui-checkbox>\n                    <div class=\"search-dropdown-item-label\">\n                      {{ 'all' | translate }}\n                    </div>\n                  </div>\n                </div>\n              </li>\n            }\n            <ng-container\n              [ngTemplateOutlet]=\"liValueTemp\"\n              [ngTemplateOutletContext]=\"{\n                values:\n                  activeCondition\n                  | pure\n                    : getNormalValues\n                    : conditionsModel\n                    : activeCondition.isMulti,\n                activeCondition: activeCondition,\n              }\"\n            >\n            </ng-container>\n            @for (\n              group of activeCondition\n                | pure\n                  : getValuesGroup\n                  : conditionsModel\n                  : activeCondition.isMulti;\n              track group\n            ) {\n              @if (group.member?.length) {\n                <div\n                  [title]=\"group.group\"\n                  class=\"dropdown-group-label dropdown-content\"\n                >\n                  {{ group.group }}\n                </div>\n                <ng-container\n                  [ngTemplateOutlet]=\"liValueTemp\"\n                  [ngTemplateOutletContext]=\"{\n                    values: group.member,\n                    activeCondition: activeCondition,\n                  }\"\n                ></ng-container>\n              }\n            }\n          </ul>\n        }\n      }\n    }\n    @if (showFootAction && form?.value?.isMulti) {\n      <div class=\"footer\">\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          (click)=\"confirmSelection()\"\n        >\n          {{ 'confirm' | translate }}\n        </button>\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          class=\"cancel\"\n          (click)=\"toolTipHide()\"\n        >\n          {{ 'cancel' | translate }}\n        </button>\n      </div>\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  #liConditionTemp\n  let-conditions=\"conditions\"\n>\n  @for (condition of conditions; track condition) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"selectActiveCondition(condition)\"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            condition\n            | pure: getConditionLabel\n            | pure: isConditionSelected : conditionsModel,\n          label: condition | pure: getConditionLabel,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #liValueTemp\n  let-values=\"values\"\n  let-activeCondition=\"activeCondition\"\n>\n  @for (value of values; track value) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"\n        selectValue(value, activeCondition.isMulti);\n        $event.stopPropagation();\n        $event.preventDefault()\n      \"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            value\n            | pure: getValueLabel\n            | pure\n              : isValueSelected\n              : conditionsModel || (form.value | pure: getValueContent)\n              : activeCondition,\n          label: value | pure: getValueLabel,\n          isMulti: activeCondition.isMulti,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #basicLiContentTemp\n  let-isSelect=\"isSelect\"\n  let-label=\"label\"\n  let-isMulti=\"isMulti\"\n>\n  <div\n    [class]=\"DROPDOWN_ITEM_CLASS\"\n    [ngClass]=\"{\n      'is-multi-value-select': isSelect,\n    }\"\n  >\n    @if (isMulti) {\n      <div class=\"multi-item\">\n        <aui-checkbox [value]=\"isSelect\"></aui-checkbox>\n        <div\n          [title]=\"label\"\n          class=\"search-dropdown-item-label\"\n        >\n          {{ label }}\n        </div>\n      </div>\n    }\n    @if (!isMulti) {\n      <div\n        [title]=\"label\"\n        class=\"search-dropdown-item-label\"\n      >\n        {{ label }}\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host{display:block;padding-top:5px}.search-input{border:none;box-shadow:none!important;height:22px}.mock-input{width:1px!important;flex-shrink:0;padding:0;margin-left:7px}::ng-deep .multi-search-dropdown{padding:0!important;margin-top:8px!important;cursor:pointer;max-height:284px;overflow-y:auto}::ng-deep .multi-search-dropdown ul .dropdown-content:first-child{border:none;padding-top:0;margin-top:0}::ng-deep .multi-search-dropdown .cursor-light{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .is-multi-value-select{background-color:rgb(var(--aui-color-p-6));color:rgb(var(--aui-color-p-2))}::ng-deep .multi-search-dropdown .search-dropdown-item{padding:0 8px}::ng-deep .multi-search-dropdown .search-dropdown-item:hover{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item{display:flex;height:28px;align-items:center}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item aui-checkbox{width:24px}::ng-deep .multi-search-dropdown .search-dropdown-item-label{height:28px;line-height:28px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;font-size:var(--aui-font-size-m)}::ng-deep .multi-search-dropdown .dropdown-group-label{font-size:12px;color:rgb(var(--aui-color-n-4));padding-bottom:8px;padding-top:12px;margin-top:12px;margin-left:8px;margin-right:8px;border-top:1px solid rgb(var(--aui-color-n-8));white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis}::ng-deep .multi-search-dropdown .no-match-categories-tip{text-align:center;font-size:12px;color:rgb(var(--aui-color-n-4));border-bottom:1px solid rgb(var(--aui-color-n-8));margin-left:8px;margin-right:8px;margin-bottom:8px;padding-top:4px;padding-bottom:12px}::ng-deep .multi-search-dropdown .select-all{border-bottom:1px solid rgb(var(--aui-color-n-8))!important;margin-bottom:8px}::ng-deep .multi-search-dropdown .footer{display:flex;background:rgb(var(--aui-color-n-10));justify-content:flex-end;border-top:1px solid rgb(var(--aui-color-n-8));position:sticky;bottom:0;height:30px;padding:0 8px;align-items:center}::ng-deep .multi-search-dropdown .footer .cancel{color:rgb(var(--aui-color-n-1))!important}\n"], dependencies: [{ kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: CheckboxComponent, selector: "aui-checkbox", inputs: ["name", "type", "label", "indeterminate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchActionInputComponent, isStandalone: true, selector: "acl-multi-search-action-input", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", isEditing: "isEditing", hidden: "hidden", autoScroll: "autoScroll", conditionConfig: "conditionConfig", showFootAction: "showFootAction", existingConditions: "existingConditions" }, outputs: { completed: "completed", editing: "editing", delete: "delete", search: "search" }, host: { properties: { "hidden": "this.hiddenState" } }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true }, { propertyName: "toolTipRef", first: true, predicate: ["toolTipRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"action-input-container\">\n  @if (form.value; as activeCondition) {\n    <span\n      class=\"condition-label\"\n      (click)=\"activeConditionClick(); $event.stopPropagation()\"\n    >\n      {{ activeCondition | pure: getConditionLabel }}\n    </span>\n    @if (activeCondition.operator) {\n      <span\n        class=\"operator-label\"\n        (click)=\"activeOperatorClick(); $event.stopPropagation()\"\n      >\n        {{ activeCondition.operator }}\n      </span>\n    }\n    @if (!isEditing) {\n      <span\n        class=\"value-label\"\n        (click)=\"activeValueClick(); $event.stopPropagation()\"\n      >\n        {{ getValueContent(activeCondition) }}\n      </span>\n    }\n  }\n  <input\n    class=\"search-input\"\n    [ngClass]=\"{\n      'mock-input':\n        (!isEditing && !isConditionSelecting) || isOperatorSelecting,\n    }\"\n    [maxlength]=\"isOperatorSelecting ? 0 : MAX_SAFE_INTEGER\"\n    aui-input\n    #inputRef\n    #toolTipRef=\"auiTooltip\"\n    [placeholder]=\"isConditionSelecting ? placeholder : ''\"\n    [(ngModel)]=\"conditionsModel\"\n    (ngModelChange)=\"conditionsModel$$.next($event)\"\n    (keydown)=\"inputKeydown($event)\"\n    (focus)=\"inputFocus()\"\n    [auiTooltip]=\"templateRef\"\n    auiTooltipAnimType=\"none\"\n    auiTooltipTrigger=\"manual\"\n    auiTooltipType=\"info\"\n    auiTooltipClass=\"multi-search-dropdown\"\n    auiTooltipPosition=\"bottom start\"\n  />\n</div>\n\n<ng-template #templateRef>\n  <div\n    (mousedown)=\"$event.preventDefault()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <!-- \u7C7B\u76EE\u9009\u62E9 -->\n    @if (isConditionSelecting && (conditionsShouldShow$ | async)) {\n      @if (hasFilteredConditions$ | async) {\n        <ul class=\"dropdown-list\">\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: (normalConditions$ | async),\n              groups: groupConditions$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      } @else {\n        <ul class=\"dropdown-list\">\n          <div class=\"no-match-categories-tip\">\n            {{ 'no_match_categories_tip' | translate }}\n          </div>\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: normalConditionsResource$ | async,\n              groups: groupConditionsResource$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      }\n      <ng-template\n        #categoriesTemp\n        let-normal=\"normal\"\n        let-groups=\"groups\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"liConditionTemp\"\n          [ngTemplateOutletContext]=\"{ conditions: normal }\"\n        ></ng-container>\n        @for (group of groups; track group) {\n          @if (group.member?.length) {\n            <div\n              [title]=\"group.group\"\n              class=\"dropdown-group-label dropdown-content\"\n            >\n              {{ group.group }}\n            </div>\n            <ng-container\n              [ngTemplateOutlet]=\"liConditionTemp\"\n              [ngTemplateOutletContext]=\"{ conditions: group.member }\"\n            ></ng-container>\n          }\n        }\n      </ng-template>\n    }\n\n    @if (form.value; as activeCondition) {\n      <!-- operator\u9009\u62E9 -->\n      @if (isOperatorSelecting) {\n        <ul class=\"operator-list\">\n          @for (\n            operator of activeCondition.operators || [DEFAULT_OPERATOR];\n            track operator\n          ) {\n            <li (click)=\"selectActiveOperator($any(operator))\">\n              <ng-container\n                [ngTemplateOutlet]=\"basicLiContentTemp\"\n                [ngTemplateOutletContext]=\"{\n                  isSelect: operator === conditionsModel,\n                  label: operator,\n                }\"\n              >\n              </ng-container>\n            </li>\n          }\n        </ul>\n      }\n      <!-- \u5177\u4F53\u6761\u4EF6\u9009\u62E9 -->\n      @if (isValueSelecting) {\n        @if (\n          activeCondition\n            | pure\n              : hasFilteredValues\n              : conditionsModel\n              : activeCondition.isMulti\n        ) {\n          <ul class=\"dropdown-list\">\n            @if (activeCondition.allowSelectAll && activeCondition.isMulti) {\n              <li class=\"dropdown-content select-all\">\n                <div\n                  class=\"search-dropdown-item\"\n                  [ngClass]=\"{\n                    'active-item': isSelectAll,\n                  }\"\n                  (click)=\"selectAllClick()\"\n                >\n                  <div class=\"multi-item\">\n                    <aui-checkbox\n                      [value]=\"isSelectAll\"\n                      [indeterminate]=\"isIndeterminate\"\n                    ></aui-checkbox>\n                    <div class=\"search-dropdown-item-label\">\n                      {{ 'all' | translate }}\n                    </div>\n                  </div>\n                </div>\n              </li>\n            }\n            <ng-container\n              [ngTemplateOutlet]=\"liValueTemp\"\n              [ngTemplateOutletContext]=\"{\n                values:\n                  activeCondition\n                  | pure\n                    : getNormalValues\n                    : conditionsModel\n                    : activeCondition.isMulti,\n                activeCondition: activeCondition,\n              }\"\n            >\n            </ng-container>\n            @for (\n              group of activeCondition\n                | pure\n                  : getValuesGroup\n                  : conditionsModel\n                  : activeCondition.isMulti;\n              track group\n            ) {\n              @if (group.member?.length) {\n                <div\n                  [title]=\"group.group\"\n                  class=\"dropdown-group-label dropdown-content\"\n                >\n                  {{ group.group }}\n                </div>\n                <ng-container\n                  [ngTemplateOutlet]=\"liValueTemp\"\n                  [ngTemplateOutletContext]=\"{\n                    values: group.member,\n                    activeCondition: activeCondition,\n                  }\"\n                ></ng-container>\n              }\n            }\n          </ul>\n        }\n      }\n    }\n    @if (showFootAction && form?.value?.isMulti) {\n      <div class=\"footer\">\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          (click)=\"confirmSelection()\"\n        >\n          {{ 'confirm' | translate }}\n        </button>\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          class=\"cancel\"\n          (click)=\"toolTipHide()\"\n        >\n          {{ 'cancel' | translate }}\n        </button>\n      </div>\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  #liConditionTemp\n  let-conditions=\"conditions\"\n>\n  @for (condition of conditions; track condition) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"selectActiveCondition(condition)\"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            condition\n            | pure: getConditionLabel\n            | pure: isConditionSelected : conditionsModel,\n          label: condition | pure: getConditionLabel,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #liValueTemp\n  let-values=\"values\"\n  let-activeCondition=\"activeCondition\"\n>\n  @for (value of values; track value) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"\n        selectValue(value, activeCondition.isMulti);\n        $event.stopPropagation();\n        $event.preventDefault()\n      \"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            value\n            | pure: getValueLabel\n            | pure\n              : isValueSelected\n              : conditionsModel || (form.value | pure: getValueContent)\n              : activeCondition,\n          label: value | pure: getValueLabel,\n          isMulti: activeCondition.isMulti,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #basicLiContentTemp\n  let-isSelect=\"isSelect\"\n  let-label=\"label\"\n  let-isMulti=\"isMulti\"\n>\n  <div\n    [class]=\"DROPDOWN_ITEM_CLASS\"\n    [ngClass]=\"{\n      'is-multi-value-select': isSelect,\n    }\"\n  >\n    @if (isMulti) {\n      <div class=\"multi-item\">\n        <aui-checkbox [value]=\"isSelect\"></aui-checkbox>\n        <div\n          [title]=\"label\"\n          class=\"search-dropdown-item-label\"\n        >\n          {{ label }}\n        </div>\n      </div>\n    }\n    @if (!isMulti) {\n      <div\n        [title]=\"label\"\n        class=\"search-dropdown-item-label\"\n      >\n        {{ label }}\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host{display:block;padding-top:5px}.search-input{border:none;box-shadow:none!important;height:22px}.mock-input{width:1px!important;flex-shrink:0;padding:0;margin-left:7px}::ng-deep .multi-search-dropdown{padding:0!important;margin-top:8px!important;cursor:pointer;max-height:284px;overflow-y:auto}::ng-deep .multi-search-dropdown ul .dropdown-content:first-child{border:none;padding-top:0;margin-top:0}::ng-deep .multi-search-dropdown .cursor-light{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .is-multi-value-select{background-color:rgb(var(--aui-color-p-6));color:rgb(var(--aui-color-p-2))}::ng-deep .multi-search-dropdown .search-dropdown-item{padding:0 8px}::ng-deep .multi-search-dropdown .search-dropdown-item:hover{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item{display:flex;height:28px;align-items:center}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item aui-checkbox{width:24px}::ng-deep .multi-search-dropdown .search-dropdown-item-label{height:28px;line-height:28px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;font-size:var(--aui-font-size-m)}::ng-deep .multi-search-dropdown .dropdown-group-label{font-size:12px;color:rgb(var(--aui-color-n-4));padding-bottom:8px;padding-top:12px;margin-top:12px;margin-left:8px;margin-right:8px;border-top:1px solid rgb(var(--aui-color-n-8));white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis}::ng-deep .multi-search-dropdown .no-match-categories-tip{text-align:center;font-size:12px;color:rgb(var(--aui-color-n-4));border-bottom:1px solid rgb(var(--aui-color-n-8));margin-left:8px;margin-right:8px;margin-bottom:8px;padding-top:4px;padding-bottom:12px}::ng-deep .multi-search-dropdown .select-all{border-bottom:1px solid rgb(var(--aui-color-n-8))!important;margin-bottom:8px}::ng-deep .multi-search-dropdown .footer{display:flex;background:rgb(var(--aui-color-n-10));justify-content:flex-end;border-top:1px solid rgb(var(--aui-color-n-8));position:sticky;bottom:0;height:30px;padding:0 8px;align-items:center}::ng-deep .multi-search-dropdown .footer .cancel{color:rgb(var(--aui-color-n-1))!important}.action-input-container{display:flex;align-items:center;font-size:14px}.condition-label,.value-label{margin-left:6px;max-width:45%;flex-shrink:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.operator-label{margin-left:6px}.dropdown-list{min-width:260px;max-width:400px}.operator-list{min-width:160px}.active-item{color:rgb(var(--aui-color-p-2));background-color:rgb(var(--aui-color-p-6))}\n"], dependencies: [{ kind: "component", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: CheckboxComponent, selector: "aui-checkbox", inputs: ["name", "type", "label", "indeterminate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     ObservableInput(),
@@ -8957,7 +8901,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         NgTemplateOutlet,
                         FormsModule,
                         ButtonComponent,
-                    ], template: "<div class=\"tw-flex tw-items-center tw-text-m\">\n  @if (form.value; as activeCondition) {\n    <span\n      class=\"tw-ml-6 tw-max-w-[45%] tw-flex-shrink-0 tw-text-ellipsis tw-overflow-hidden\"\n      (click)=\"activeConditionClick(); $event.stopPropagation()\"\n    >\n      {{ activeCondition | pure: getConditionLabel }}\n    </span>\n    @if (activeCondition.operator) {\n      <span\n        class=\"tw-ml-6\"\n        (click)=\"activeOperatorClick(); $event.stopPropagation()\"\n      >\n        {{ activeCondition.operator }}\n      </span>\n    }\n    @if (!isEditing) {\n      <span\n        class=\"tw-ml-6 tw-max-w-[45%] tw-flex-shrink-0 tw-text-ellipsis tw-overflow-hidden\"\n        (click)=\"activeValueClick(); $event.stopPropagation()\"\n      >\n        {{ getValueContent(activeCondition) }}\n      </span>\n    }\n  }\n  <input\n    class=\"search-input\"\n    [ngClass]=\"{\n      'mock-input':\n        (!isEditing && !isConditionSelecting) || isOperatorSelecting,\n    }\"\n    [maxlength]=\"isOperatorSelecting ? 0 : MAX_SAFE_INTEGER\"\n    aui-input\n    #inputRef\n    #toolTipRef=\"auiTooltip\"\n    [placeholder]=\"isConditionSelecting ? placeholder : ''\"\n    [(ngModel)]=\"conditionsModel\"\n    (ngModelChange)=\"conditionsModel$$.next($event)\"\n    (keydown)=\"inputKeydown($event)\"\n    (focus)=\"inputFocus()\"\n    [auiTooltip]=\"templateRef\"\n    auiTooltipAnimType=\"none\"\n    auiTooltipTrigger=\"manual\"\n    auiTooltipType=\"info\"\n    auiTooltipClass=\"multi-search-dropdown\"\n    auiTooltipPosition=\"bottom start\"\n  />\n</div>\n\n<ng-template #templateRef>\n  <div\n    (mousedown)=\"$event.preventDefault()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <!-- \u7C7B\u76EE\u9009\u62E9 -->\n    @if (isConditionSelecting && (conditionsShouldShow$ | async)) {\n      @if (hasFilteredConditions$ | async) {\n        <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: (normalConditions$ | async),\n              groups: groupConditions$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      } @else {\n        <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n          <div class=\"no-match-categories-tip\">\n            {{ 'no_match_categories_tip' | translate }}\n          </div>\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: normalConditionsResource$ | async,\n              groups: groupConditionsResource$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      }\n      <ng-template\n        #categoriesTemp\n        let-normal=\"normal\"\n        let-groups=\"groups\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"liConditionTemp\"\n          [ngTemplateOutletContext]=\"{ conditions: normal }\"\n        ></ng-container>\n        @for (group of groups; track group) {\n          @if (group.member?.length) {\n            <div\n              [title]=\"group.group\"\n              class=\"dropdown-group-label dropdown-content\"\n            >\n              {{ group.group }}\n            </div>\n            <ng-container\n              [ngTemplateOutlet]=\"liConditionTemp\"\n              [ngTemplateOutletContext]=\"{ conditions: group.member }\"\n            ></ng-container>\n          }\n        }\n      </ng-template>\n    }\n\n    @if (form.value; as activeCondition) {\n      <!-- operator\u9009\u62E9 -->\n      @if (isOperatorSelecting) {\n        <ul class=\"tw-min-w-[160px]\">\n          @for (\n            operator of activeCondition.operators || [DEFAULT_OPERATOR];\n            track operator\n          ) {\n            <li (click)=\"selectActiveOperator($any(operator))\">\n              <ng-container\n                [ngTemplateOutlet]=\"basicLiContentTemp\"\n                [ngTemplateOutletContext]=\"{\n                  isSelect: operator === conditionsModel,\n                  label: operator,\n                }\"\n              >\n              </ng-container>\n            </li>\n          }\n        </ul>\n      }\n      <!-- \u5177\u4F53\u6761\u4EF6\u9009\u62E9 -->\n      @if (isValueSelecting) {\n        @if (\n          activeCondition\n            | pure\n              : hasFilteredValues\n              : conditionsModel\n              : activeCondition.isMulti\n        ) {\n          <ul class=\"tw-min-w-[260px] tw-max-w-[400px]\">\n            @if (activeCondition.allowSelectAll && activeCondition.isMulti) {\n              <li class=\"dropdown-content select-all\">\n                <div\n                  class=\"search-dropdown-item\"\n                  [ngClass]=\"{\n                    'tw-text-p-2': isSelectAll,\n                    'tw-bg-p-6': isSelectAll,\n                  }\"\n                  (click)=\"selectAllClick()\"\n                >\n                  <div class=\"multi-item\">\n                    <aui-checkbox\n                      [value]=\"isSelectAll\"\n                      [indeterminate]=\"isIndeterminate\"\n                    ></aui-checkbox>\n                    <div class=\"search-dropdown-item-label\">\n                      {{ 'all' | translate }}\n                    </div>\n                  </div>\n                </div>\n              </li>\n            }\n            <ng-container\n              [ngTemplateOutlet]=\"liValueTemp\"\n              [ngTemplateOutletContext]=\"{\n                values:\n                  activeCondition\n                  | pure\n                    : getNormalValues\n                    : conditionsModel\n                    : activeCondition.isMulti,\n                activeCondition: activeCondition,\n              }\"\n            >\n            </ng-container>\n            @for (\n              group of activeCondition\n                | pure\n                  : getValuesGroup\n                  : conditionsModel\n                  : activeCondition.isMulti;\n              track group\n            ) {\n              @if (group.member?.length) {\n                <div\n                  [title]=\"group.group\"\n                  class=\"dropdown-group-label dropdown-content\"\n                >\n                  {{ group.group }}\n                </div>\n                <ng-container\n                  [ngTemplateOutlet]=\"liValueTemp\"\n                  [ngTemplateOutletContext]=\"{\n                    values: group.member,\n                    activeCondition: activeCondition,\n                  }\"\n                ></ng-container>\n              }\n            }\n          </ul>\n        }\n      }\n    }\n    @if (showFootAction && form?.value?.isMulti) {\n      <div class=\"footer\">\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          (click)=\"confirmSelection()\"\n        >\n          {{ 'confirm' | translate }}\n        </button>\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          class=\"cancel\"\n          (click)=\"toolTipHide()\"\n        >\n          {{ 'cancel' | translate }}\n        </button>\n      </div>\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  #liConditionTemp\n  let-conditions=\"conditions\"\n>\n  @for (condition of conditions; track condition) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"selectActiveCondition(condition)\"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            condition\n            | pure: getConditionLabel\n            | pure: isConditionSelected : conditionsModel,\n          label: condition | pure: getConditionLabel,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #liValueTemp\n  let-values=\"values\"\n  let-activeCondition=\"activeCondition\"\n>\n  @for (value of values; track value) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"\n        selectValue(value, activeCondition.isMulti);\n        $event.stopPropagation();\n        $event.preventDefault()\n      \"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            value\n            | pure: getValueLabel\n            | pure\n              : isValueSelected\n              : conditionsModel || (form.value | pure: getValueContent)\n              : activeCondition,\n          label: value | pure: getValueLabel,\n          isMulti: activeCondition.isMulti,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #basicLiContentTemp\n  let-isSelect=\"isSelect\"\n  let-label=\"label\"\n  let-isMulti=\"isMulti\"\n>\n  <div\n    [class]=\"DROPDOWN_ITEM_CLASS\"\n    [ngClass]=\"{\n      'is-multi-value-select': isSelect,\n    }\"\n  >\n    @if (isMulti) {\n      <div class=\"multi-item\">\n        <aui-checkbox [value]=\"isSelect\"></aui-checkbox>\n        <div\n          [title]=\"label\"\n          class=\"search-dropdown-item-label\"\n        >\n          {{ label }}\n        </div>\n      </div>\n    }\n    @if (!isMulti) {\n      <div\n        [title]=\"label\"\n        class=\"search-dropdown-item-label\"\n      >\n        {{ label }}\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host{display:block;padding-top:5px}.search-input{border:none;box-shadow:none!important;height:22px}.mock-input{width:1px!important;flex-shrink:0;padding:0;margin-left:7px}::ng-deep .multi-search-dropdown{padding:0!important;margin-top:8px!important;cursor:pointer;max-height:284px;overflow-y:auto}::ng-deep .multi-search-dropdown ul .dropdown-content:first-child{border:none;padding-top:0;margin-top:0}::ng-deep .multi-search-dropdown .cursor-light{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .is-multi-value-select{background-color:rgb(var(--aui-color-p-6));color:rgb(var(--aui-color-p-2))}::ng-deep .multi-search-dropdown .search-dropdown-item{padding:0 8px}::ng-deep .multi-search-dropdown .search-dropdown-item:hover{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item{display:flex;height:28px;align-items:center}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item aui-checkbox{width:24px}::ng-deep .multi-search-dropdown .search-dropdown-item-label{height:28px;line-height:28px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;font-size:var(--aui-font-size-m)}::ng-deep .multi-search-dropdown .dropdown-group-label{font-size:12px;color:rgb(var(--aui-color-n-4));padding-bottom:8px;padding-top:12px;margin-top:12px;margin-left:8px;margin-right:8px;border-top:1px solid rgb(var(--aui-color-n-8));white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis}::ng-deep .multi-search-dropdown .no-match-categories-tip{text-align:center;font-size:12px;color:rgb(var(--aui-color-n-4));border-bottom:1px solid rgb(var(--aui-color-n-8));margin-left:8px;margin-right:8px;margin-bottom:8px;padding-top:4px;padding-bottom:12px}::ng-deep .multi-search-dropdown .select-all{border-bottom:1px solid rgb(var(--aui-color-n-8))!important;margin-bottom:8px}::ng-deep .multi-search-dropdown .footer{display:flex;background:rgb(var(--aui-color-n-10));justify-content:flex-end;border-top:1px solid rgb(var(--aui-color-n-8));position:sticky;bottom:0;height:30px;padding:0 8px;align-items:center}::ng-deep .multi-search-dropdown .footer .cancel{color:rgb(var(--aui-color-n-1))!important}\n"] }]
+                    ], template: "<div class=\"action-input-container\">\n  @if (form.value; as activeCondition) {\n    <span\n      class=\"condition-label\"\n      (click)=\"activeConditionClick(); $event.stopPropagation()\"\n    >\n      {{ activeCondition | pure: getConditionLabel }}\n    </span>\n    @if (activeCondition.operator) {\n      <span\n        class=\"operator-label\"\n        (click)=\"activeOperatorClick(); $event.stopPropagation()\"\n      >\n        {{ activeCondition.operator }}\n      </span>\n    }\n    @if (!isEditing) {\n      <span\n        class=\"value-label\"\n        (click)=\"activeValueClick(); $event.stopPropagation()\"\n      >\n        {{ getValueContent(activeCondition) }}\n      </span>\n    }\n  }\n  <input\n    class=\"search-input\"\n    [ngClass]=\"{\n      'mock-input':\n        (!isEditing && !isConditionSelecting) || isOperatorSelecting,\n    }\"\n    [maxlength]=\"isOperatorSelecting ? 0 : MAX_SAFE_INTEGER\"\n    aui-input\n    #inputRef\n    #toolTipRef=\"auiTooltip\"\n    [placeholder]=\"isConditionSelecting ? placeholder : ''\"\n    [(ngModel)]=\"conditionsModel\"\n    (ngModelChange)=\"conditionsModel$$.next($event)\"\n    (keydown)=\"inputKeydown($event)\"\n    (focus)=\"inputFocus()\"\n    [auiTooltip]=\"templateRef\"\n    auiTooltipAnimType=\"none\"\n    auiTooltipTrigger=\"manual\"\n    auiTooltipType=\"info\"\n    auiTooltipClass=\"multi-search-dropdown\"\n    auiTooltipPosition=\"bottom start\"\n  />\n</div>\n\n<ng-template #templateRef>\n  <div\n    (mousedown)=\"$event.preventDefault()\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <!-- \u7C7B\u76EE\u9009\u62E9 -->\n    @if (isConditionSelecting && (conditionsShouldShow$ | async)) {\n      @if (hasFilteredConditions$ | async) {\n        <ul class=\"dropdown-list\">\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: (normalConditions$ | async),\n              groups: groupConditions$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      } @else {\n        <ul class=\"dropdown-list\">\n          <div class=\"no-match-categories-tip\">\n            {{ 'no_match_categories_tip' | translate }}\n          </div>\n          <ng-container\n            [ngTemplateOutlet]=\"categoriesTemp\"\n            [ngTemplateOutletContext]=\"{\n              normal: normalConditionsResource$ | async,\n              groups: groupConditionsResource$ | async,\n            }\"\n          ></ng-container>\n        </ul>\n      }\n      <ng-template\n        #categoriesTemp\n        let-normal=\"normal\"\n        let-groups=\"groups\"\n      >\n        <ng-container\n          [ngTemplateOutlet]=\"liConditionTemp\"\n          [ngTemplateOutletContext]=\"{ conditions: normal }\"\n        ></ng-container>\n        @for (group of groups; track group) {\n          @if (group.member?.length) {\n            <div\n              [title]=\"group.group\"\n              class=\"dropdown-group-label dropdown-content\"\n            >\n              {{ group.group }}\n            </div>\n            <ng-container\n              [ngTemplateOutlet]=\"liConditionTemp\"\n              [ngTemplateOutletContext]=\"{ conditions: group.member }\"\n            ></ng-container>\n          }\n        }\n      </ng-template>\n    }\n\n    @if (form.value; as activeCondition) {\n      <!-- operator\u9009\u62E9 -->\n      @if (isOperatorSelecting) {\n        <ul class=\"operator-list\">\n          @for (\n            operator of activeCondition.operators || [DEFAULT_OPERATOR];\n            track operator\n          ) {\n            <li (click)=\"selectActiveOperator($any(operator))\">\n              <ng-container\n                [ngTemplateOutlet]=\"basicLiContentTemp\"\n                [ngTemplateOutletContext]=\"{\n                  isSelect: operator === conditionsModel,\n                  label: operator,\n                }\"\n              >\n              </ng-container>\n            </li>\n          }\n        </ul>\n      }\n      <!-- \u5177\u4F53\u6761\u4EF6\u9009\u62E9 -->\n      @if (isValueSelecting) {\n        @if (\n          activeCondition\n            | pure\n              : hasFilteredValues\n              : conditionsModel\n              : activeCondition.isMulti\n        ) {\n          <ul class=\"dropdown-list\">\n            @if (activeCondition.allowSelectAll && activeCondition.isMulti) {\n              <li class=\"dropdown-content select-all\">\n                <div\n                  class=\"search-dropdown-item\"\n                  [ngClass]=\"{\n                    'active-item': isSelectAll,\n                  }\"\n                  (click)=\"selectAllClick()\"\n                >\n                  <div class=\"multi-item\">\n                    <aui-checkbox\n                      [value]=\"isSelectAll\"\n                      [indeterminate]=\"isIndeterminate\"\n                    ></aui-checkbox>\n                    <div class=\"search-dropdown-item-label\">\n                      {{ 'all' | translate }}\n                    </div>\n                  </div>\n                </div>\n              </li>\n            }\n            <ng-container\n              [ngTemplateOutlet]=\"liValueTemp\"\n              [ngTemplateOutletContext]=\"{\n                values:\n                  activeCondition\n                  | pure\n                    : getNormalValues\n                    : conditionsModel\n                    : activeCondition.isMulti,\n                activeCondition: activeCondition,\n              }\"\n            >\n            </ng-container>\n            @for (\n              group of activeCondition\n                | pure\n                  : getValuesGroup\n                  : conditionsModel\n                  : activeCondition.isMulti;\n              track group\n            ) {\n              @if (group.member?.length) {\n                <div\n                  [title]=\"group.group\"\n                  class=\"dropdown-group-label dropdown-content\"\n                >\n                  {{ group.group }}\n                </div>\n                <ng-container\n                  [ngTemplateOutlet]=\"liValueTemp\"\n                  [ngTemplateOutletContext]=\"{\n                    values: group.member,\n                    activeCondition: activeCondition,\n                  }\"\n                ></ng-container>\n              }\n            }\n          </ul>\n        }\n      }\n    }\n    @if (showFootAction && form?.value?.isMulti) {\n      <div class=\"footer\">\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          (click)=\"confirmSelection()\"\n        >\n          {{ 'confirm' | translate }}\n        </button>\n        <button\n          aui-button=\"text\"\n          size=\"mini\"\n          class=\"cancel\"\n          (click)=\"toolTipHide()\"\n        >\n          {{ 'cancel' | translate }}\n        </button>\n      </div>\n    }\n  </div>\n</ng-template>\n\n<ng-template\n  #liConditionTemp\n  let-conditions=\"conditions\"\n>\n  @for (condition of conditions; track condition) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"selectActiveCondition(condition)\"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            condition\n            | pure: getConditionLabel\n            | pure: isConditionSelected : conditionsModel,\n          label: condition | pure: getConditionLabel,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #liValueTemp\n  let-values=\"values\"\n  let-activeCondition=\"activeCondition\"\n>\n  @for (value of values; track value) {\n    <li\n      class=\"dropdown-content\"\n      (click)=\"\n        selectValue(value, activeCondition.isMulti);\n        $event.stopPropagation();\n        $event.preventDefault()\n      \"\n    >\n      <ng-container\n        [ngTemplateOutlet]=\"basicLiContentTemp\"\n        [ngTemplateOutletContext]=\"{\n          isSelect:\n            value\n            | pure: getValueLabel\n            | pure\n              : isValueSelected\n              : conditionsModel || (form.value | pure: getValueContent)\n              : activeCondition,\n          label: value | pure: getValueLabel,\n          isMulti: activeCondition.isMulti,\n        }\"\n      >\n      </ng-container>\n    </li>\n  }\n</ng-template>\n\n<ng-template\n  #basicLiContentTemp\n  let-isSelect=\"isSelect\"\n  let-label=\"label\"\n  let-isMulti=\"isMulti\"\n>\n  <div\n    [class]=\"DROPDOWN_ITEM_CLASS\"\n    [ngClass]=\"{\n      'is-multi-value-select': isSelect,\n    }\"\n  >\n    @if (isMulti) {\n      <div class=\"multi-item\">\n        <aui-checkbox [value]=\"isSelect\"></aui-checkbox>\n        <div\n          [title]=\"label\"\n          class=\"search-dropdown-item-label\"\n        >\n          {{ label }}\n        </div>\n      </div>\n    }\n    @if (!isMulti) {\n      <div\n        [title]=\"label\"\n        class=\"search-dropdown-item-label\"\n      >\n        {{ label }}\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host{display:block;padding-top:5px}.search-input{border:none;box-shadow:none!important;height:22px}.mock-input{width:1px!important;flex-shrink:0;padding:0;margin-left:7px}::ng-deep .multi-search-dropdown{padding:0!important;margin-top:8px!important;cursor:pointer;max-height:284px;overflow-y:auto}::ng-deep .multi-search-dropdown ul .dropdown-content:first-child{border:none;padding-top:0;margin-top:0}::ng-deep .multi-search-dropdown .cursor-light{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .is-multi-value-select{background-color:rgb(var(--aui-color-p-6));color:rgb(var(--aui-color-p-2))}::ng-deep .multi-search-dropdown .search-dropdown-item{padding:0 8px}::ng-deep .multi-search-dropdown .search-dropdown-item:hover{background-color:rgb(var(--aui-color-p-6))}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item{display:flex;height:28px;align-items:center}::ng-deep .multi-search-dropdown .search-dropdown-item .multi-item aui-checkbox{width:24px}::ng-deep .multi-search-dropdown .search-dropdown-item-label{height:28px;line-height:28px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;font-size:var(--aui-font-size-m)}::ng-deep .multi-search-dropdown .dropdown-group-label{font-size:12px;color:rgb(var(--aui-color-n-4));padding-bottom:8px;padding-top:12px;margin-top:12px;margin-left:8px;margin-right:8px;border-top:1px solid rgb(var(--aui-color-n-8));white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis}::ng-deep .multi-search-dropdown .no-match-categories-tip{text-align:center;font-size:12px;color:rgb(var(--aui-color-n-4));border-bottom:1px solid rgb(var(--aui-color-n-8));margin-left:8px;margin-right:8px;margin-bottom:8px;padding-top:4px;padding-bottom:12px}::ng-deep .multi-search-dropdown .select-all{border-bottom:1px solid rgb(var(--aui-color-n-8))!important;margin-bottom:8px}::ng-deep .multi-search-dropdown .footer{display:flex;background:rgb(var(--aui-color-n-10));justify-content:flex-end;border-top:1px solid rgb(var(--aui-color-n-8));position:sticky;bottom:0;height:30px;padding:0 8px;align-items:center}::ng-deep .multi-search-dropdown .footer .cancel{color:rgb(var(--aui-color-n-1))!important}.action-input-container{display:flex;align-items:center;font-size:14px}.condition-label,.value-label{margin-left:6px;max-width:45%;flex-shrink:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.operator-label{margin-left:6px}.dropdown-list{min-width:260px;max-width:400px}.operator-list{min-width:160px}.active-item{color:rgb(var(--aui-color-p-2));background-color:rgb(var(--aui-color-p-6))}\n"] }]
         }], ctorParameters: () => [], propDecorators: { placeholder: [{
                 type: Input
             }], conditionCreatable: [{
@@ -8980,7 +8924,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 type: Output
             }], delete: [{
                 type: Output
-            }], searchEvent: [{
+            }], search: [{
                 type: Output
             }], inputRef: [{
                 type: ViewChild,
@@ -8998,7 +8942,7 @@ class MultiSearchTagsComponent {
         this.removeCondition = new EventEmitter();
         this.setConditionEditing = new EventEmitter();
         this.setConditionDeleting = new EventEmitter();
-        this.searchEvent = new EventEmitter();
+        this.search = new EventEmitter();
         this.completed = new EventEmitter();
     }
     conditionInAction(condition) {
@@ -9013,7 +8957,7 @@ class MultiSearchTagsComponent {
             ?.join(condition.separator ?? ' | ');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MultiSearchTagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchTagsComponent, isStandalone: true, selector: "acl-multi-search-tags", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", conditionConfig: "conditionConfig", existingConditions: "existingConditions", showFootAction: "showFootAction" }, outputs: { removeCondition: "removeCondition", setConditionEditing: "setConditionEditing", setConditionDeleting: "setConditionDeleting", searchEvent: "searchEvent", completed: "completed" }, viewQueries: [{ propertyName: "inputComponent", first: true, predicate: ["inputRef"], descendants: true }], ngImport: i0, template: "<div class=\"search-content\">\n  @for (condition of existingConditions; track condition; let index = $index) {\n    @if (!conditionInAction(condition)) {\n      <aui-tag\n        class=\"tw-ml-6 tw-h-[22px] tw-mb-4\"\n        [ngClass]=\"condition.tagClass\"\n        [type]=\"condition.tagType || 'info'\"\n        [border]=\"true\"\n        [closeable]=\"true\"\n        (close)=\"removeCondition.emit(condition); searchEvent.emit()\"\n        (click)=\"setConditionEditing.emit(condition)\"\n        size=\"mini\"\n      >\n        <span\n          [title]=\"\n            (condition | pure: getConditionLabel) +\n            ' ' +\n            condition.operator +\n            ' ' +\n            (condition | pure: getValueContent)\n          \"\n        >\n          {{ condition | pure: getConditionLabel }}\n          {{ condition.operator }}\n          {{ condition | pure: getValueContent }}\n        </span>\n      </aui-tag>\n    } @else {\n      <acl-multi-search-action-input\n        #inputRef\n        class=\"input-wrapper\"\n        [ngClass]=\"{ 'deleting-input': condition.isDeleting }\"\n        [isEditing]=\"condition.isEditing\"\n        [conditionCreatable]=\"conditionCreatable\"\n        [placeholder]=\"placeholder\"\n        [conditionConfig]=\"conditionConfig\"\n        [existingConditions]=\"existingConditions\"\n        [showFootAction]=\"showFootAction\"\n        [(ngModel)]=\"condition.actionModel\"\n        (completed)=\"\n          completed.emit({\n            activeCondition: $event.activeCondition,\n            toContinue: $event.toContinue,\n            manualFocus: $event.manualFocus,\n            index: index,\n          })\n        \"\n        (delete)=\"setConditionDeleting.emit(index - 1)\"\n        (editing)=\"setConditionEditing.emit(condition)\"\n        (search)=\"searchEvent.emit()\"\n      ></acl-multi-search-action-input>\n    }\n  }\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block}:host .search-content{width:100%;min-height:30px;max-height:160px;flex:1;display:flex;flex-wrap:wrap;align-items:center}:host .search-content ::ng-deep aui-tag{max-width:calc(100% - 8px)}:host .search-content ::ng-deep .aui-tag{margin-left:0;max-width:100%}:host .search-content ::ng-deep .input-wrapper{padding-bottom:4px;max-width:100%;width:max-content;min-width:180px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;flex-grow:1;flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: TagModule }, { kind: "component", type: i1.TagComponent, selector: "aui-tag", inputs: ["type", "size", "closeable", "border", "solid", "invalid", "round", "color", "allowClick"], outputs: ["close"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MultiSearchActionInputComponent, selector: "acl-multi-search-action-input", inputs: ["placeholder", "conditionCreatable", "isEditing", "hidden", "autoScroll", "conditionConfig", "showFootAction", "existingConditions"], outputs: ["completed", "editing", "delete", "searchEvent"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchTagsComponent, isStandalone: true, selector: "acl-multi-search-tags", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", conditionConfig: "conditionConfig", existingConditions: "existingConditions", showFootAction: "showFootAction" }, outputs: { removeCondition: "removeCondition", setConditionEditing: "setConditionEditing", setConditionDeleting: "setConditionDeleting", search: "search", completed: "completed" }, viewQueries: [{ propertyName: "inputComponent", first: true, predicate: ["inputRef"], descendants: true }], ngImport: i0, template: "<div class=\"search-content\">\n  @for (condition of existingConditions; track condition; let index = $index) {\n    @if (!conditionInAction(condition)) {\n      <aui-tag\n        class=\"tag-item\"\n        [ngClass]=\"condition.tagClass\"\n        [type]=\"condition.tagType || 'info'\"\n        [border]=\"true\"\n        [closeable]=\"true\"\n        (close)=\"removeCondition.emit(condition); search.emit()\"\n        (click)=\"setConditionEditing.emit(condition)\"\n        size=\"mini\"\n      >\n        <span\n          [title]=\"\n            (condition | pure: getConditionLabel) +\n            ' ' +\n            condition.operator +\n            ' ' +\n            (condition | pure: getValueContent)\n          \"\n        >\n          {{ condition | pure: getConditionLabel }}\n          {{ condition.operator }}\n          {{ condition | pure: getValueContent }}\n        </span>\n      </aui-tag>\n    } @else {\n      <acl-multi-search-action-input\n        #inputRef\n        class=\"input-wrapper\"\n        [ngClass]=\"{ 'deleting-input': condition.isDeleting }\"\n        [isEditing]=\"condition.isEditing\"\n        [conditionCreatable]=\"conditionCreatable\"\n        [placeholder]=\"placeholder\"\n        [conditionConfig]=\"conditionConfig\"\n        [existingConditions]=\"existingConditions\"\n        [showFootAction]=\"showFootAction\"\n        [(ngModel)]=\"condition.actionModel\"\n        (completed)=\"\n          completed.emit({\n            activeCondition: $event.activeCondition,\n            toContinue: $event.toContinue,\n            manualFocus: $event.manualFocus,\n            index: index,\n          })\n        \"\n        (delete)=\"setConditionDeleting.emit(index - 1)\"\n        (editing)=\"setConditionEditing.emit(condition)\"\n        (search)=\"search.emit()\"\n      ></acl-multi-search-action-input>\n    }\n  }\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block}:host .search-content{width:100%;min-height:30px;max-height:160px;flex:1;display:flex;flex-wrap:wrap;align-items:center}:host .search-content ::ng-deep aui-tag{max-width:calc(100% - 8px)}:host .search-content ::ng-deep .aui-tag{margin-left:0;max-width:100%}:host .search-content ::ng-deep .input-wrapper{padding-bottom:4px;max-width:100%;width:max-content;min-width:180px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;flex-grow:1;flex-shrink:0}:host .tag-item{margin-left:6px;height:22px;margin-bottom:4px}\n"], dependencies: [{ kind: "ngmodule", type: TagModule }, { kind: "component", type: i1.TagComponent, selector: "aui-tag", inputs: ["type", "size", "closeable", "border", "solid", "invalid", "round", "color", "allowClick"], outputs: ["close"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MultiSearchActionInputComponent, selector: "acl-multi-search-action-input", inputs: ["placeholder", "conditionCreatable", "isEditing", "hidden", "autoScroll", "conditionConfig", "showFootAction", "existingConditions"], outputs: ["completed", "editing", "delete", "search"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MultiSearchTagsComponent, decorators: [{
             type: Component,
@@ -9023,7 +8967,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         PurePipe,
                         MultiSearchActionInputComponent,
                         FormsModule,
-                    ], template: "<div class=\"search-content\">\n  @for (condition of existingConditions; track condition; let index = $index) {\n    @if (!conditionInAction(condition)) {\n      <aui-tag\n        class=\"tw-ml-6 tw-h-[22px] tw-mb-4\"\n        [ngClass]=\"condition.tagClass\"\n        [type]=\"condition.tagType || 'info'\"\n        [border]=\"true\"\n        [closeable]=\"true\"\n        (close)=\"removeCondition.emit(condition); searchEvent.emit()\"\n        (click)=\"setConditionEditing.emit(condition)\"\n        size=\"mini\"\n      >\n        <span\n          [title]=\"\n            (condition | pure: getConditionLabel) +\n            ' ' +\n            condition.operator +\n            ' ' +\n            (condition | pure: getValueContent)\n          \"\n        >\n          {{ condition | pure: getConditionLabel }}\n          {{ condition.operator }}\n          {{ condition | pure: getValueContent }}\n        </span>\n      </aui-tag>\n    } @else {\n      <acl-multi-search-action-input\n        #inputRef\n        class=\"input-wrapper\"\n        [ngClass]=\"{ 'deleting-input': condition.isDeleting }\"\n        [isEditing]=\"condition.isEditing\"\n        [conditionCreatable]=\"conditionCreatable\"\n        [placeholder]=\"placeholder\"\n        [conditionConfig]=\"conditionConfig\"\n        [existingConditions]=\"existingConditions\"\n        [showFootAction]=\"showFootAction\"\n        [(ngModel)]=\"condition.actionModel\"\n        (completed)=\"\n          completed.emit({\n            activeCondition: $event.activeCondition,\n            toContinue: $event.toContinue,\n            manualFocus: $event.manualFocus,\n            index: index,\n          })\n        \"\n        (delete)=\"setConditionDeleting.emit(index - 1)\"\n        (editing)=\"setConditionEditing.emit(condition)\"\n        (search)=\"searchEvent.emit()\"\n      ></acl-multi-search-action-input>\n    }\n  }\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block}:host .search-content{width:100%;min-height:30px;max-height:160px;flex:1;display:flex;flex-wrap:wrap;align-items:center}:host .search-content ::ng-deep aui-tag{max-width:calc(100% - 8px)}:host .search-content ::ng-deep .aui-tag{margin-left:0;max-width:100%}:host .search-content ::ng-deep .input-wrapper{padding-bottom:4px;max-width:100%;width:max-content;min-width:180px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;flex-grow:1;flex-shrink:0}\n"] }]
+                    ], template: "<div class=\"search-content\">\n  @for (condition of existingConditions; track condition; let index = $index) {\n    @if (!conditionInAction(condition)) {\n      <aui-tag\n        class=\"tag-item\"\n        [ngClass]=\"condition.tagClass\"\n        [type]=\"condition.tagType || 'info'\"\n        [border]=\"true\"\n        [closeable]=\"true\"\n        (close)=\"removeCondition.emit(condition); search.emit()\"\n        (click)=\"setConditionEditing.emit(condition)\"\n        size=\"mini\"\n      >\n        <span\n          [title]=\"\n            (condition | pure: getConditionLabel) +\n            ' ' +\n            condition.operator +\n            ' ' +\n            (condition | pure: getValueContent)\n          \"\n        >\n          {{ condition | pure: getConditionLabel }}\n          {{ condition.operator }}\n          {{ condition | pure: getValueContent }}\n        </span>\n      </aui-tag>\n    } @else {\n      <acl-multi-search-action-input\n        #inputRef\n        class=\"input-wrapper\"\n        [ngClass]=\"{ 'deleting-input': condition.isDeleting }\"\n        [isEditing]=\"condition.isEditing\"\n        [conditionCreatable]=\"conditionCreatable\"\n        [placeholder]=\"placeholder\"\n        [conditionConfig]=\"conditionConfig\"\n        [existingConditions]=\"existingConditions\"\n        [showFootAction]=\"showFootAction\"\n        [(ngModel)]=\"condition.actionModel\"\n        (completed)=\"\n          completed.emit({\n            activeCondition: $event.activeCondition,\n            toContinue: $event.toContinue,\n            manualFocus: $event.manualFocus,\n            index: index,\n          })\n        \"\n        (delete)=\"setConditionDeleting.emit(index - 1)\"\n        (editing)=\"setConditionEditing.emit(condition)\"\n        (search)=\"search.emit()\"\n      ></acl-multi-search-action-input>\n    }\n  }\n  <ng-content></ng-content>\n</div>\n", styles: [":host{display:block}:host .search-content{width:100%;min-height:30px;max-height:160px;flex:1;display:flex;flex-wrap:wrap;align-items:center}:host .search-content ::ng-deep aui-tag{max-width:calc(100% - 8px)}:host .search-content ::ng-deep .aui-tag{margin-left:0;max-width:100%}:host .search-content ::ng-deep .input-wrapper{padding-bottom:4px;max-width:100%;width:max-content;min-width:180px;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;flex-grow:1;flex-shrink:0}:host .tag-item{margin-left:6px;height:22px;margin-bottom:4px}\n"] }]
         }], propDecorators: { placeholder: [{
                 type: Input
             }], conditionCreatable: [{
@@ -9040,7 +8984,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 type: Output
             }], setConditionDeleting: [{
                 type: Output
-            }], searchEvent: [{
+            }], search: [{
                 type: Output
             }], completed: [{
                 type: Output
@@ -9062,7 +9006,7 @@ class MultiSearchComponent {
         this.autoScroll = true;
         this.searchSuffix = true;
         // 搜索操作
-        this.searchEvent = new EventEmitter();
+        this.search = new EventEmitter();
         // 条件变化
         this.conditionsChange = new EventEmitter();
         // 当前multi-search组件是否focus
@@ -9194,7 +9138,7 @@ class MultiSearchComponent {
         this.existingConditions$
             .pipe(take(1), takeUntil(this.destroy$$))
             .subscribe(exists => {
-            this.searchEvent.emit(this.getConditionModel(exists?.filter(exist => !this.conditionInAction(exist))));
+            this.search.emit(this.getConditionModel(exists?.filter(exist => !this.conditionInAction(exist))));
         });
     }
     // 清除所有已选条件
@@ -9309,7 +9253,7 @@ class MultiSearchComponent {
         this.destroy$$.next();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: MultiSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchComponent, isStandalone: true, selector: "acl-multi-search", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", conditions: "conditions", conditionConfig: "conditionConfig", autoScroll: "autoScroll", searchSuffix: "searchSuffix", showFootAction: "showFootAction" }, outputs: { searchEvent: "searchEvent", conditionsChange: "conditionsChange" }, viewQueries: [{ propertyName: "normalInputComponent", first: true, predicate: ["inputRef"], descendants: true }, { propertyName: "tagsComponent", first: true, predicate: ["tagsRef"], descendants: true }, { propertyName: "multiSearchRef", first: true, predicate: ["multiSearch"], descendants: true, static: true }], ngImport: i0, template: "<div\n  class=\"aui-input multi-search\"\n  #multiSearch\n  [ngClass]=\"{\n    'search-focus': focus$$ | async,\n  }\"\n>\n  <!-- \u5DF2\u9009\u62E9\u7C7B\u76EEtags -->\n  <acl-multi-search-tags\n    #tagsRef\n    [ngClass]=\"{\n      'tags-width-with-delete': $any(existingConditions$ | async)?.length,\n      'tags-width': !$any(existingConditions$ | async)?.length,\n    }\"\n    [placeholder]=\"placeholder\"\n    [conditionCreatable]=\"conditionCreatable\"\n    [existingConditions]=\"existingConditions\"\n    [conditionConfig]=\"conditionConfig\"\n    (removeCondition)=\"removeCondition($event)\"\n    (setConditionEditing)=\"setConditionEditing($event)\"\n    (setConditionDeleting)=\"setConditionDeleting($event)\"\n    [showFootAction]=\"showFootAction\"\n    (search)=\"doSearch()\"\n    (completed)=\"complete($event)\"\n  >\n    <!-- \u672B\u5C3E\u8F93\u5165\u6846 -->\n    <acl-multi-search-action-input\n      #inputRef\n      class=\"input-wrapper\"\n      [isEditing]=\"true\"\n      [hidden]=\"addedInputShouldHidden$ | async\"\n      [placeholder]=\"placeholder\"\n      [conditionCreatable]=\"conditionCreatable\"\n      [conditionConfig]=\"conditionConfig\"\n      [existingConditions]=\"existingConditions$ | async\"\n      [autoScroll]=\"autoScroll\"\n      [(ngModel)]=\"addedCondition\"\n      [showFootAction]=\"showFootAction\"\n      (completed)=\"complete($event)\"\n      (delete)=\"setConditionDeleting()\"\n      (search)=\"doSearch()\"\n    ></acl-multi-search-action-input>\n  </acl-multi-search-tags>\n\n  <div class=\"search-suffix\">\n    @if ($any(existingConditions$ | async)?.length) {\n      <div class=\"search-clear\">\n        <aui-icon\n          class=\"tw-text-n-4 tw-cursor-pointer\"\n          [ngClass]=\"CLEAR_ICON_CLASS\"\n          icon=\"xmark_small\"\n          size=\"14\"\n          (click)=\"clearConditions(); doSearch(); $event.stopPropagation()\"\n        ></aui-icon>\n      </div>\n    }\n    @if (searchSuffix) {\n      <div class=\"search-suffix\">\n        <div class=\"suffix-wrapper\">\n          <aui-icon\n            class=\"tw-text-n-4 tw-cursor-pointer\"\n            [ngClass]=\"SEARCH_ICON_CLASS\"\n            icon=\"magnifier\"\n            (click)=\"doSearch(); $event.stopPropagation()\"\n          ></aui-icon>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{min-width:0}.multi-search{min-width:240px;height:max-content;display:flex;align-items:stretch;padding:0;overflow-y:auto}.multi-search .tags-width{width:calc(100% - 30px)}.multi-search .tags-width-with-delete{width:calc(100% - 48px)}.multi-search .search-clear{width:18px;display:flex;align-items:center}.multi-search .search-clear-icon ::ng-deep .aui-icon{border-radius:50%}.multi-search .search-clear-icon ::ng-deep .aui-icon:hover{color:rgb(var(--aui-color-n-10));background-color:rgb(var(--aui-color-n-5))!important}.multi-search .search-suffix{display:flex;text-align:center}.multi-search .search-suffix .suffix-wrapper{margin-top:4px;margin-bottom:4px;height:calc(100% - 8px);border-left:solid 1px rgb(var(--aui-color-n-7));min-width:30px;display:flex;align-items:center;justify-content:center}.multi-search .search-suffix .suffix-wrapper aui-icon:hover{color:rgb(var(--aui-color-blue))}.search-focus{border-color:rgb(var(--aui-color-primary));box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MultiSearchActionInputComponent, selector: "acl-multi-search-action-input", inputs: ["placeholder", "conditionCreatable", "isEditing", "hidden", "autoScroll", "conditionConfig", "showFootAction", "existingConditions"], outputs: ["completed", "editing", "delete", "searchEvent"] }, { kind: "component", type: MultiSearchTagsComponent, selector: "acl-multi-search-tags", inputs: ["placeholder", "conditionCreatable", "conditionConfig", "existingConditions", "showFootAction"], outputs: ["removeCondition", "setConditionEditing", "setConditionDeleting", "searchEvent", "completed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: MultiSearchComponent, isStandalone: true, selector: "acl-multi-search", inputs: { placeholder: "placeholder", conditionCreatable: "conditionCreatable", conditions: "conditions", conditionConfig: "conditionConfig", autoScroll: "autoScroll", searchSuffix: "searchSuffix", showFootAction: "showFootAction" }, outputs: { search: "search", conditionsChange: "conditionsChange" }, viewQueries: [{ propertyName: "normalInputComponent", first: true, predicate: ["inputRef"], descendants: true }, { propertyName: "tagsComponent", first: true, predicate: ["tagsRef"], descendants: true }, { propertyName: "multiSearchRef", first: true, predicate: ["multiSearch"], descendants: true, static: true }], ngImport: i0, template: "<div\n  class=\"aui-input multi-search\"\n  #multiSearch\n  [ngClass]=\"{\n    'search-focus': focus$$ | async,\n  }\"\n>\n  <!-- \u5DF2\u9009\u62E9\u7C7B\u76EEtags -->\n  <acl-multi-search-tags\n    #tagsRef\n    [ngClass]=\"{\n      'tags-width-with-delete': $any(existingConditions$ | async)?.length,\n      'tags-width': !$any(existingConditions$ | async)?.length,\n    }\"\n    [placeholder]=\"placeholder\"\n    [conditionCreatable]=\"conditionCreatable\"\n    [existingConditions]=\"existingConditions\"\n    [conditionConfig]=\"conditionConfig\"\n    (removeCondition)=\"removeCondition($event)\"\n    (setConditionEditing)=\"setConditionEditing($event)\"\n    (setConditionDeleting)=\"setConditionDeleting($event)\"\n    [showFootAction]=\"showFootAction\"\n    (search)=\"doSearch()\"\n    (completed)=\"complete($event)\"\n  >\n    <!-- \u672B\u5C3E\u8F93\u5165\u6846 -->\n    <acl-multi-search-action-input\n      #inputRef\n      class=\"input-wrapper\"\n      [isEditing]=\"true\"\n      [hidden]=\"addedInputShouldHidden$ | async\"\n      [placeholder]=\"placeholder\"\n      [conditionCreatable]=\"conditionCreatable\"\n      [conditionConfig]=\"conditionConfig\"\n      [existingConditions]=\"existingConditions$ | async\"\n      [autoScroll]=\"autoScroll\"\n      [(ngModel)]=\"addedCondition\"\n      [showFootAction]=\"showFootAction\"\n      (completed)=\"complete($event)\"\n      (delete)=\"setConditionDeleting()\"\n      (search)=\"doSearch()\"\n    ></acl-multi-search-action-input>\n  </acl-multi-search-tags>\n\n  <div class=\"search-suffix\">\n    @if ($any(existingConditions$ | async)?.length) {\n      <div class=\"search-clear\">\n        <aui-icon\n          class=\"clear-icon\"\n          [ngClass]=\"CLEAR_ICON_CLASS\"\n          icon=\"xmark_small\"\n          size=\"14\"\n          (click)=\"clearConditions(); doSearch(); $event.stopPropagation()\"\n        ></aui-icon>\n      </div>\n    }\n    @if (searchSuffix) {\n      <div class=\"search-suffix\">\n        <div class=\"suffix-wrapper\">\n          <aui-icon\n            class=\"search-icon\"\n            [ngClass]=\"SEARCH_ICON_CLASS\"\n            icon=\"magnifier\"\n            (click)=\"doSearch(); $event.stopPropagation()\"\n          ></aui-icon>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{min-width:0}.multi-search{min-width:240px;height:max-content;display:flex;align-items:stretch;padding:0;overflow-y:auto}.multi-search .tags-width{width:calc(100% - 30px)}.multi-search .tags-width-with-delete{width:calc(100% - 48px)}.multi-search .search-clear{width:18px;display:flex;align-items:center}.multi-search .search-clear-icon ::ng-deep .aui-icon{border-radius:50%}.multi-search .search-clear-icon ::ng-deep .aui-icon:hover{color:rgb(var(--aui-color-n-10));background-color:rgb(var(--aui-color-n-5))!important}.multi-search .search-suffix{display:flex;text-align:center}.multi-search .search-suffix .suffix-wrapper{margin-top:4px;margin-bottom:4px;height:calc(100% - 8px);border-left:solid 1px rgb(var(--aui-color-n-7));min-width:30px;display:flex;align-items:center;justify-content:center}.multi-search .search-suffix .suffix-wrapper aui-icon:hover{color:rgb(var(--aui-color-blue))}.clear-icon,.search-icon{color:rgb(var(--aui-color-n-4));cursor:pointer}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MultiSearchActionInputComponent, selector: "acl-multi-search-action-input", inputs: ["placeholder", "conditionCreatable", "isEditing", "hidden", "autoScroll", "conditionConfig", "showFootAction", "existingConditions"], outputs: ["completed", "editing", "delete", "search"] }, { kind: "component", type: MultiSearchTagsComponent, selector: "acl-multi-search-tags", inputs: ["placeholder", "conditionCreatable", "conditionConfig", "existingConditions", "showFootAction"], outputs: ["removeCondition", "setConditionEditing", "setConditionDeleting", "search", "completed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     ObservableInput(),
@@ -9328,7 +9272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         MultiSearchTagsComponent,
                         FormsModule,
                         IconComponent,
-                    ], template: "<div\n  class=\"aui-input multi-search\"\n  #multiSearch\n  [ngClass]=\"{\n    'search-focus': focus$$ | async,\n  }\"\n>\n  <!-- \u5DF2\u9009\u62E9\u7C7B\u76EEtags -->\n  <acl-multi-search-tags\n    #tagsRef\n    [ngClass]=\"{\n      'tags-width-with-delete': $any(existingConditions$ | async)?.length,\n      'tags-width': !$any(existingConditions$ | async)?.length,\n    }\"\n    [placeholder]=\"placeholder\"\n    [conditionCreatable]=\"conditionCreatable\"\n    [existingConditions]=\"existingConditions\"\n    [conditionConfig]=\"conditionConfig\"\n    (removeCondition)=\"removeCondition($event)\"\n    (setConditionEditing)=\"setConditionEditing($event)\"\n    (setConditionDeleting)=\"setConditionDeleting($event)\"\n    [showFootAction]=\"showFootAction\"\n    (search)=\"doSearch()\"\n    (completed)=\"complete($event)\"\n  >\n    <!-- \u672B\u5C3E\u8F93\u5165\u6846 -->\n    <acl-multi-search-action-input\n      #inputRef\n      class=\"input-wrapper\"\n      [isEditing]=\"true\"\n      [hidden]=\"addedInputShouldHidden$ | async\"\n      [placeholder]=\"placeholder\"\n      [conditionCreatable]=\"conditionCreatable\"\n      [conditionConfig]=\"conditionConfig\"\n      [existingConditions]=\"existingConditions$ | async\"\n      [autoScroll]=\"autoScroll\"\n      [(ngModel)]=\"addedCondition\"\n      [showFootAction]=\"showFootAction\"\n      (completed)=\"complete($event)\"\n      (delete)=\"setConditionDeleting()\"\n      (search)=\"doSearch()\"\n    ></acl-multi-search-action-input>\n  </acl-multi-search-tags>\n\n  <div class=\"search-suffix\">\n    @if ($any(existingConditions$ | async)?.length) {\n      <div class=\"search-clear\">\n        <aui-icon\n          class=\"tw-text-n-4 tw-cursor-pointer\"\n          [ngClass]=\"CLEAR_ICON_CLASS\"\n          icon=\"xmark_small\"\n          size=\"14\"\n          (click)=\"clearConditions(); doSearch(); $event.stopPropagation()\"\n        ></aui-icon>\n      </div>\n    }\n    @if (searchSuffix) {\n      <div class=\"search-suffix\">\n        <div class=\"suffix-wrapper\">\n          <aui-icon\n            class=\"tw-text-n-4 tw-cursor-pointer\"\n            [ngClass]=\"SEARCH_ICON_CLASS\"\n            icon=\"magnifier\"\n            (click)=\"doSearch(); $event.stopPropagation()\"\n          ></aui-icon>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{min-width:0}.multi-search{min-width:240px;height:max-content;display:flex;align-items:stretch;padding:0;overflow-y:auto}.multi-search .tags-width{width:calc(100% - 30px)}.multi-search .tags-width-with-delete{width:calc(100% - 48px)}.multi-search .search-clear{width:18px;display:flex;align-items:center}.multi-search .search-clear-icon ::ng-deep .aui-icon{border-radius:50%}.multi-search .search-clear-icon ::ng-deep .aui-icon:hover{color:rgb(var(--aui-color-n-10));background-color:rgb(var(--aui-color-n-5))!important}.multi-search .search-suffix{display:flex;text-align:center}.multi-search .search-suffix .suffix-wrapper{margin-top:4px;margin-bottom:4px;height:calc(100% - 8px);border-left:solid 1px rgb(var(--aui-color-n-7));min-width:30px;display:flex;align-items:center;justify-content:center}.multi-search .search-suffix .suffix-wrapper aui-icon:hover{color:rgb(var(--aui-color-blue))}.search-focus{border-color:rgb(var(--aui-color-primary));box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}\n"] }]
+                    ], template: "<div\n  class=\"aui-input multi-search\"\n  #multiSearch\n  [ngClass]=\"{\n    'search-focus': focus$$ | async,\n  }\"\n>\n  <!-- \u5DF2\u9009\u62E9\u7C7B\u76EEtags -->\n  <acl-multi-search-tags\n    #tagsRef\n    [ngClass]=\"{\n      'tags-width-with-delete': $any(existingConditions$ | async)?.length,\n      'tags-width': !$any(existingConditions$ | async)?.length,\n    }\"\n    [placeholder]=\"placeholder\"\n    [conditionCreatable]=\"conditionCreatable\"\n    [existingConditions]=\"existingConditions\"\n    [conditionConfig]=\"conditionConfig\"\n    (removeCondition)=\"removeCondition($event)\"\n    (setConditionEditing)=\"setConditionEditing($event)\"\n    (setConditionDeleting)=\"setConditionDeleting($event)\"\n    [showFootAction]=\"showFootAction\"\n    (search)=\"doSearch()\"\n    (completed)=\"complete($event)\"\n  >\n    <!-- \u672B\u5C3E\u8F93\u5165\u6846 -->\n    <acl-multi-search-action-input\n      #inputRef\n      class=\"input-wrapper\"\n      [isEditing]=\"true\"\n      [hidden]=\"addedInputShouldHidden$ | async\"\n      [placeholder]=\"placeholder\"\n      [conditionCreatable]=\"conditionCreatable\"\n      [conditionConfig]=\"conditionConfig\"\n      [existingConditions]=\"existingConditions$ | async\"\n      [autoScroll]=\"autoScroll\"\n      [(ngModel)]=\"addedCondition\"\n      [showFootAction]=\"showFootAction\"\n      (completed)=\"complete($event)\"\n      (delete)=\"setConditionDeleting()\"\n      (search)=\"doSearch()\"\n    ></acl-multi-search-action-input>\n  </acl-multi-search-tags>\n\n  <div class=\"search-suffix\">\n    @if ($any(existingConditions$ | async)?.length) {\n      <div class=\"search-clear\">\n        <aui-icon\n          class=\"clear-icon\"\n          [ngClass]=\"CLEAR_ICON_CLASS\"\n          icon=\"xmark_small\"\n          size=\"14\"\n          (click)=\"clearConditions(); doSearch(); $event.stopPropagation()\"\n        ></aui-icon>\n      </div>\n    }\n    @if (searchSuffix) {\n      <div class=\"search-suffix\">\n        <div class=\"suffix-wrapper\">\n          <aui-icon\n            class=\"search-icon\"\n            [ngClass]=\"SEARCH_ICON_CLASS\"\n            icon=\"magnifier\"\n            (click)=\"doSearch(); $event.stopPropagation()\"\n          ></aui-icon>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [":host{min-width:0}.multi-search{min-width:240px;height:max-content;display:flex;align-items:stretch;padding:0;overflow-y:auto}.multi-search .tags-width{width:calc(100% - 30px)}.multi-search .tags-width-with-delete{width:calc(100% - 48px)}.multi-search .search-clear{width:18px;display:flex;align-items:center}.multi-search .search-clear-icon ::ng-deep .aui-icon{border-radius:50%}.multi-search .search-clear-icon ::ng-deep .aui-icon:hover{color:rgb(var(--aui-color-n-10));background-color:rgb(var(--aui-color-n-5))!important}.multi-search .search-suffix{display:flex;text-align:center}.multi-search .search-suffix .suffix-wrapper{margin-top:4px;margin-bottom:4px;height:calc(100% - 8px);border-left:solid 1px rgb(var(--aui-color-n-7));min-width:30px;display:flex;align-items:center;justify-content:center}.multi-search .search-suffix .suffix-wrapper aui-icon:hover{color:rgb(var(--aui-color-blue))}.clear-icon,.search-icon{color:rgb(var(--aui-color-n-4));cursor:pointer}\n"] }]
         }], ctorParameters: () => [], propDecorators: { placeholder: [{
                 type: Input
             }], conditionCreatable: [{
@@ -9341,7 +9285,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 type: Input
             }], searchSuffix: [{
                 type: Input
-            }], searchEvent: [{
+            }], search: [{
                 type: Output
             }], showFootAction: [{
                 type: Input
@@ -9358,22 +9302,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 args: ['multiSearch', { static: true }]
             }] } });
 
-const removeSuffix = (str) => str.replace('-resize', '');
-/** 如果cursor存在类似 n-resize、ne-resize，都代表是top 方向 */
-const isT = (cursor) => removeSuffix(cursor).includes('n');
-/** 是否是right */
-const isR = (cursor) => removeSuffix(cursor).includes('e');
-/** 是否是bottom */
-const isB = (cursor) => removeSuffix(cursor).includes('s');
-/** 是否是left */
-const isL = (cursor) => removeSuffix(cursor).includes('w');
-const toPx = (num) => num + 'px';
-const toPercent = (num, base = 1) => num * base + '%';
-const toNumber = (str) => {
-    const p = parseFloat(str);
-    return isNaN(p) ? 0 : p;
-};
-
 /**
  * To judge whether the parent element
  */
@@ -9396,6 +9324,22 @@ function coerceElement(elementOrRef) {
         : elementOrRef;
 }
 
+const removeSuffix = (str) => str.replace('-resize', '');
+/** 如果cursor存在类似 n-resize、ne-resize，都代表是top 方向 */
+const isT = (cursor) => removeSuffix(cursor).includes('n');
+/** 是否是right */
+const isR = (cursor) => removeSuffix(cursor).includes('e');
+/** 是否是bottom */
+const isB = (cursor) => removeSuffix(cursor).includes('s');
+/** 是否是left */
+const isL = (cursor) => removeSuffix(cursor).includes('w');
+const toPx = (num) => num + 'px';
+const toPercent = (num, base = 1) => num * base + '%';
+const toNumber = (str) => {
+    const p = parseFloat(str);
+    return isNaN(p) ? 0 : p;
+};
+
 const MUTABLE_BASIC_OPTIONS = {
     directions: [true, true, true, true],
     resizeThreshold: 5,
@@ -9890,8 +9834,8 @@ class K8SResourceListFooterComponent extends ScrollBorderObserverDirective {
         this.bottomDistance = 60;
         this.window = window;
         this.image = [
-            'assets/images/light/no-data-for-list-or-card.svg',
-            'assets/images/dark/no-data-for-list-or-card.svg',
+            '/console-assets/images/light/no-data-for-list-or-card.svg',
+            '/console-assets/images/dark/no-data-for-list-or-card.svg',
         ];
         this.translate = inject(TranslateService);
         this.option = this.autoLoad ? '' : false;
@@ -10482,11 +10426,26 @@ const DEFAULT_PAGE_SIZE = 10;
 const DEFAULT_PAGE_SIZE_OPTIONS = [10, 20, 50, 100];
 const DEFAULT_PAGINATION_LAYOUT = 'total,pager,sizes,jumper';
 
+class TableHeaderCellDefDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableHeaderCellDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TableHeaderCellDefDirective, isStandalone: true, selector: "[aclTableHeaderCellDef]", inputs: { aclTableHeaderCellDef: "aclTableHeaderCellDef" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableHeaderCellDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[aclTableHeaderCellDef]',
+                }]
+        }], propDecorators: { aclTableHeaderCellDef: [{
+                type: Input
+            }] } });
 class TableCellDefDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
+    constructor() {
+        this.templateRef = inject((TemplateRef));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableCellDefDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableCellDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TableCellDefDirective, isStandalone: true, selector: "[aclTableCellDef]", inputs: { aclTableCellDef: "aclTableCellDef" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableCellDefDirective, decorators: [{
@@ -10495,7 +10454,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                     selector: '[aclTableCellDef]',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { aclTableCellDef: [{
+        }], propDecorators: { aclTableCellDef: [{
                 type: Input
             }] } });
 
@@ -10516,8 +10475,8 @@ function defaultSorter(a, b) {
 
 const KNOWN_COLUMNS = new Set([NAME, CREATOR, CREATED_AT]);
 class TableUtilService {
-    constructor(k8sUtil) {
-        this.k8sUtil = k8sUtil;
+    constructor() {
+        this.k8sUtil = inject(K8sUtilService);
         this.getValueFromPath = this.getValueFromPath.bind(this);
         this.defaultFilterFn = this.defaultFilterFn.bind(this);
     }
@@ -10541,6 +10500,11 @@ class TableUtilService {
                     ? this.k8sUtil.getName(item)
                     : get(item, NAME);
             }
+            case NAMESPACE$1: {
+                return isK8s
+                    ? this.k8sUtil.getNamespace(item)
+                    : get(item, NAMESPACE$1);
+            }
             case CREATOR: {
                 return isK8s
                     ? this.k8sUtil.getCreator(item)
@@ -10553,7 +10517,6 @@ class TableUtilService {
             }
         }
     }
-    // eslint-disable-next-line sonarjs/cognitive-complexity
     defaultFilterFn(items, columnDefs, activeSort, filterParams, context) {
         context = context ?? this;
         if (items && filterParams) {
@@ -10575,7 +10538,7 @@ class TableUtilService {
         }
         return items;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableUtilService, deps: [{ token: K8sUtilService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableUtilService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableUtilService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableUtilService, decorators: [{
@@ -10583,10 +10546,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [K8sUtilService]
-                }] }] });
+        }], ctorParameters: () => [] });
 
 class TableComponent {
     get finalContext() {
@@ -10778,7 +10738,7 @@ class TableComponent {
             : functionOrValue;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: TableComponent, isStandalone: true, selector: "acl-table", inputs: { list: "list", dataSource: "dataSource", resourceName: "resourceName", resourceNameTranslated: "resourceNameTranslated", sticky: "sticky", permissions: "permissions", columns: "columns", filterParams: "filterParams", context: "context", filterFn: "filterFn", trackBy: "trackBy", noDataHint: "noDataHint", loadingErrorTemplate: "loadingErrorTemplate", enablePagination: "enablePagination", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", paginationLayout: "paginationLayout", firstScrollLoad: "firstScrollLoad" }, outputs: { update: "update", delete: "delete", sortChange: "sortChange" }, host: { properties: { "class.aui-table__scroll-wrapper": "this.scrollWrapper", "style.max-height": "this.scrollWrapperHeight" } }, queries: [{ propertyName: "tableCellDefs", predicate: TableCellDefDirective }], ngImport: i0, template: "<aui-table\n  auiSort\n  [active]=\"(activeSort$ | async)?.active\"\n  [direction]=\"(activeSort$ | async)?.direction\"\n  [dataSource]=\"pagedItems$\"\n  [trackBy]=\"trackBy\"\n  (sortChange)=\"onSortChange($event)\"\n  [auiTableScrollable]=\"!!sticky\"\n>\n  @for (\n    columnDef of columnDefs$ | async;\n    track trackByName($index, columnDef)\n  ) {\n    <ng-container\n      [auiTableColumnDef]=\"columnDef.name\"\n      [sticky]=\"columnDef.sticky\"\n      [stickyEnd]=\"columnDef.stickyEnd\"\n    >\n      <aui-table-header-cell\n        *auiTableHeaderCellDef\n        [style]=\"columnDef.style\"\n      >\n        @if (columnDef.name !== ACTION) {\n          @if (columnDef.sort) {\n            <span\n              aui-sort-header\n              [start]=\"columnDef.sort.direction\"\n              >{{ columnDef.label || columnDef.name | translate }}</span\n            >\n          }\n          @if (!columnDef.sort) {\n            <span>{{ columnDef.label || columnDef.name | translate }}</span>\n          }\n        }\n      </aui-table-header-cell>\n      <aui-table-cell\n        *auiTableCellDef=\"\n          let data;\n          let index = index;\n          let even = even;\n          let odd = odd;\n          let last = last\n        \"\n        [direction]=\"columnDef.direction\"\n        [ngClass]=\"columnDef.class\"\n        [style]=\"columnDef.style\"\n      >\n        @if (columnDef.name | pure: getColumnTemplate; as template) {\n          <ng-container\n            *ngTemplateOutlet=\"\n              template;\n              context: {\n                $implicit: data,\n                index: index,\n                even: even,\n                odd: odd,\n                last: last,\n              }\n            \"\n          ></ng-container>\n        } @else {\n          @if (\n            columnDef.path != null &&\n              (data | pure: getValueFromPath : columnDef.name : columnDef.path);\n            as value\n          ) {\n            <ng-container\n              *ngTemplateOutlet=\"\n                tableCellContent;\n                context: { columnDef: columnDef, value: value }\n              \"\n            ></ng-container>\n          } @else {\n            <ng-container\n              *ngTemplateOutlet=\"\n                defaultTableCell;\n                context: { data: data, columnDef: columnDef }\n              \"\n            ></ng-container>\n          }\n        }\n      </aui-table-cell>\n    </ng-container>\n  }\n\n  <aui-table-header-row\n    *auiTableHeaderRowDef=\"columnNames$ | async; sticky: !!sticky\"\n  ></aui-table-header-row>\n  <aui-table-row\n    *auiTableRowDef=\"let row; columns: columnNames$ | async\"\n  ></aui-table-row>\n\n  <ng-container *auiTablePlaceholderDef>\n    @if (list) {\n      <div\n        [hidden]=\"\n          (pagedItems$ | async)?.length || !(list.items$ | async)?.length\n        \"\n        class=\"empty-placeholder\"\n      >\n        @if (finalResourceName$ | async; as finalResourceName) {\n          {{\n            'no_named_data_hint'\n              | translate\n                : {\n                    name:\n                      resourceNameTranslated || (finalResourceName | translate),\n                  }\n          }}\n        } @else {\n          {{ 'no_data' | translate }}\n        }\n      </div>\n      <acl-k8s-resource-list-footer\n        [hidden]=\"\n          !(pagedItems$ | async)?.length && (list.items$ | async)?.length\n        \"\n        [list]=\"list\"\n        [resourceName]=\"finalResourceName$ | async\"\n        [resourceNameTranslated]=\"resourceNameTranslated\"\n        [firstScrollLoad]=\"firstScrollLoad\"\n      >\n        @if (loadingErrorTemplate) {\n          <ng-container\n            *aclK8sListFooterLoadingError\n            [ngTemplateOutlet]=\"loadingErrorTemplate\"\n          ></ng-container>\n        }\n      </acl-k8s-resource-list-footer>\n    }\n    @if (!list && !(pagedItems$ | async)?.length) {\n      <div class=\"empty-placeholder\">\n        @if (finalDataSource$ | async) {\n          {{\n            noDataHint ||\n              ('no_named_data_hint'\n                | translate\n                  : {\n                      name:\n                        resourceNameTranslated || (resourceName | translate),\n                    })\n          }}\n        } @else {\n          <aui-icon\n            class=\"acl-loading-mask__icon\"\n            size=\"16px\"\n            icon=\"spinner\"\n          ></aui-icon>\n          {{ 'loading_please_wait' | translate }}\n        }\n      </div>\n    }\n  </ng-container>\n</aui-table>\n\n@if (enablePagination) {\n  <aui-paginator\n    [layout]=\"paginationLayout\"\n    [currentPage]=\"currentPage$ | async\"\n    [pageSize]=\"pageSize$ | async\"\n    [total]=\"pagination.total\"\n    (currentPageChange)=\"currentPage$.next($event)\"\n    (pageSizeChange)=\"pageSize$.next($event)\"\n    [pageSizeOptions]=\"pageSizeOptions\"\n  ></aui-paginator>\n}\n\n<ng-template\n  #defaultTableCell\n  let-data=\"data\"\n  let-columnDef=\"columnDef\"\n>\n  @switch (columnDef.name) {\n    @case (NAME) {\n      @if (data | pure: getValueFromPath : columnDef.name; as name) {\n        <div class=\"aui-table__cell__name\">\n          @if (columnDef.extra?.link !== false && !(data | aclIsDeleting)) {\n            <a\n              [routerLink]=\"[\n                (isListPage$ | async) ? '..' : '.',\n                'detail',\n                name,\n              ]\"\n              [auiTooltip]=\"name\"\n            >\n              {{ name }}\n            </a>\n          } @else {\n            <span\n              [auiTooltip]=\"name\"\n              [class.deleting-text]=\"data | aclIsDeleting\"\n              >{{ name }}</span\n            >\n          }\n          @if (data | pure: isK8sResource) {\n            <acl-deleting-tag [resource]=\"data\"></acl-deleting-tag>\n          }\n        </div>\n      }\n      @if (\n        (data | pure: isK8sResource)\n          ? (data | aclDisplayName)\n          : data.displayName;\n        as displayName\n      ) {\n        <div\n          class=\"aui-table__cell__display-name\"\n          [class.deleting-text]=\"data | aclIsDeleting\"\n        >\n          {{ displayName }}\n        </div>\n      }\n    }\n    @case (CREATED_AT) {\n      <acl-relative-time\n        [time]=\"data | pure: getValueFromPath : columnDef.name\"\n      ></acl-relative-time>\n    }\n    @case (ACTION) {\n      <button\n        aui-button=\"text\"\n        [square]=\"true\"\n        size=\"small\"\n        [auiDropdown]=\"menu\"\n        [auiDropdownContext]=\"{ $implicit: data, columnDef: columnDef }\"\n      >\n        <aui-icon icon=\"ellipsis_v_s\"></aui-icon>\n      </button>\n    }\n    @default {\n      @if (data | pure: getValueFromPath : columnDef.name; as value) {\n        <ng-container\n          *ngTemplateOutlet=\"\n            tableCellContent;\n            context: { columnDef: columnDef, value: value }\n          \"\n        ></ng-container>\n      } @else {\n        {{ null | aclFieldNotAvailable }}\n      }\n    }\n  }\n</ng-template>\n\n<ng-template\n  #tableCellContent\n  let-columnDef=\"columnDef\"\n  let-value=\"value\"\n>\n  @if (\n    columnDef.translate == null\n      ? value\n      : columnDef.translate === true\n        ? (value | translate)\n        : (value | pure: columnDef.translate : finalContext | translate);\n    as text\n  ) {\n    @if (columnDef.ellipsis) {\n      <div\n        class=\"text-overflow\"\n        [auiTooltip]=\"text\"\n      >\n        {{ text }}\n      </div>\n    } @else {\n      {{ text }}\n    }\n  } @else {\n    {{ null | aclFieldNotAvailable }}\n  }\n</ng-template>\n\n<ng-template\n  #menu\n  let-data\n  let-columnDef=\"columnDef\"\n  ><aui-menu>\n    @if (columnDef.extra?.update !== false) {\n      <acl-disabled-container\n        [isAllowed]=\"!permissions || permissions.update\"\n        [isDisabled]=\"\n          (columnDef.extra?.update?.disabled.handler | pure: isFunction) &&\n          (data | pure: columnDef.extra.update.disabled.handler : finalContext)\n        \"\n        [tooltip]=\"\n          columnDef.extra?.update?.disabled.tooltip\n            | pure: getValue : data : finalContext\n            | translate\n        \"\n        (click)=\"onUpdate(data, columnDef)\"\n      >\n        <aui-menu-item>{{ 'update' | translate }}</aui-menu-item>\n      </acl-disabled-container>\n    }\n    @if (columnDef.extra?.delete !== false) {\n      <acl-disabled-container\n        [isAllowed]=\"!permissions || permissions.delete\"\n        [isDisabled]=\"\n          (columnDef.extra?.delete?.disabled.handler | pure: isFunction) &&\n          (data | pure: columnDef.extra.delete.disabled.handler : finalContext)\n        \"\n        [tooltip]=\"\n          columnDef.extra?.delete?.disabled.tooltip\n            | pure: getValue : data : finalContext\n            | translate\n        \"\n        (click)=\"delete.emit(data)\"\n      >\n        <aui-menu-item>{{ 'delete' | translate }}</aui-menu-item>\n      </acl-disabled-container>\n    }\n  </aui-menu></ng-template\n>\n", styles: [".deleting-text{color:rgb(var(--aui-color-disabled-text))}:host{display:block}:host.aui-table__scroll-wrapper{display:flex}:host ::ng-deep+acl-table{margin-top:12px}html:not([lang|=zh]) :host ::ng-deep .aui-table__column-created_at{flex:0 0 140px}\n"], dependencies: [{ kind: "component", type: i1.TableComponent, selector: "aui-table", inputs: ["enableScrollWrapper"], exportAs: ["auiTable"] }, { kind: "component", type: i1.TableRowComponent, selector: "aui-table-row", inputs: ["disabled"], exportAs: ["auiTableRow"] }, { kind: "component", type: i1.TableHeaderRowComponent, selector: "aui-table-header-row", exportAs: ["auiTableHeaderRow"] }, { kind: "directive", type: i1.TableCellDirective, selector: "aui-table-cell", inputs: ["direction"] }, { kind: "directive", type: i1.TableCellDefDirective, selector: "[auiTableCellDef]" }, { kind: "directive", type: i1.TableHeaderCellDirective, selector: "aui-table-header-cell" }, { kind: "directive", type: i1.TableRowDefDirective, selector: "[auiTableRowDef]", inputs: ["auiTableRowDefColumns", "auiTableRowDefWhen"] }, { kind: "directive", type: i1.TableHeaderRowDefDirective, selector: "[auiTableHeaderRowDef]", inputs: ["auiTableHeaderRowDef", "auiTableHeaderRowDefSticky"] }, { kind: "directive", type: i1.TableHeaderCellDefDirective, selector: "[auiTableHeaderCellDef]" }, { kind: "directive", type: i1.TableColumnDefDirective, selector: "[auiTableColumnDef]", inputs: ["sticky", "auiTableColumnDef"] }, { kind: "directive", type: i1.TablePlaceholderDefDirective, selector: "ng-template[auiTablePlaceholderDef]" }, { kind: "directive", type: i1.TableScrollableDirective, selector: "[auiTableScrollable]", inputs: ["auiTableScrollable"] }, { kind: "directive", type: SortDirective, selector: "[auiSort]", inputs: ["active", "start", "direction"], outputs: ["sortChange"], exportAs: ["auiSort"] }, { kind: "component", type: SortHeaderComponent, selector: "[aui-sort-header]", inputs: ["aui-sort-header", "start"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: K8SResourceListFooterComponent, selector: "acl-k8s-resource-list-footer", inputs: ["list", "autoLoad", "backTop", "bottomDistance", "resourceNameTranslated", "firstScrollLoad", "resourceName"] }, { kind: "component", type: PaginatorComponent, selector: "aui-paginator", inputs: ["pageIndex", "currentPage", "pageSize", "pageSizeOptions", "total", "layout", "disabled"], outputs: ["pageIndexChange", "currentPageChange", "pageSizeChange"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: DeletingTagComponent, selector: "acl-deleting-tag", inputs: ["resource"] }, { kind: "component", type: RelativeTimeComponent, selector: "acl-relative-time", inputs: ["time"] }, { kind: "directive", type: i1.DropdownDirective, selector: "[auiDropdown]", inputs: ["auiDropdownClass", "auiDropdownDisabled", "auiDropdownPosition", "auiDropdownTrigger", "auiDropdownContext", "auiDropdown", "auiDropdownHideOnClick"], outputs: ["auiDropdownVisibleChange"], exportAs: ["auiDropdown"] }, { kind: "component", type: i1.MenuComponent, selector: "aui-menu", inputs: ["size"] }, { kind: "component", type: i1.MenuItemComponent, selector: "aui-menu-item", inputs: ["disabled", "divide", "type", "actived"] }, { kind: "component", type: DisabledContainerComponent, selector: "acl-disabled-container", inputs: ["tooltip", "tooltipPosition", "tooltipType", "isAllowed", "isDisabled"] }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "directive", type: K8sListFooterLoadingErrorDirective, selector: "[aclK8sListFooterLoadingError]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: i2$1.K8sDisplayNamePipe, name: "aclDisplayName" }, { kind: "pipe", type: i2$1.K8sIsDeletingPipe, name: "aclIsDeleting" }, { kind: "pipe", type: FieldNotAvailablePipe, name: "aclFieldNotAvailable" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: TableComponent, isStandalone: true, selector: "acl-table", inputs: { list: "list", dataSource: "dataSource", resourceName: "resourceName", resourceNameTranslated: "resourceNameTranslated", sticky: "sticky", permissions: "permissions", columns: "columns", filterParams: "filterParams", context: "context", filterFn: "filterFn", trackBy: "trackBy", noDataHint: "noDataHint", loadingErrorTemplate: "loadingErrorTemplate", enablePagination: "enablePagination", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", paginationLayout: "paginationLayout", firstScrollLoad: "firstScrollLoad" }, outputs: { update: "update", delete: "delete", sortChange: "sortChange" }, host: { properties: { "class.aui-table__scroll-wrapper": "this.scrollWrapper", "style.max-height": "this.scrollWrapperHeight" } }, queries: [{ propertyName: "tableCellDefs", predicate: TableCellDefDirective }], ngImport: i0, template: "<aui-table\n  auiSort\n  [active]=\"(activeSort$ | async)?.active\"\n  [direction]=\"(activeSort$ | async)?.direction\"\n  [dataSource]=\"pagedItems$\"\n  [trackBy]=\"trackBy\"\n  (sortChange)=\"onSortChange($event)\"\n  [auiTableScrollable]=\"!!sticky\"\n>\n  @for (\n    columnDef of columnDefs$ | async;\n    track trackByName($index, columnDef)\n  ) {\n    <ng-container\n      [auiTableColumnDef]=\"columnDef.name\"\n      [sticky]=\"columnDef.sticky\"\n      [stickyEnd]=\"columnDef.stickyEnd\"\n    >\n      <aui-table-header-cell\n        *auiTableHeaderCellDef\n        [style]=\"columnDef.style\"\n      >\n        @if (columnDef.name !== ACTION) {\n          @if (columnDef.sort) {\n            <span\n              aui-sort-header\n              [start]=\"columnDef.sort.direction\"\n              >{{ columnDef.label || columnDef.name | translate }}</span\n            >\n          }\n          @if (!columnDef.sort) {\n            <span>{{ columnDef.label || columnDef.name | translate }}</span>\n          }\n        }\n      </aui-table-header-cell>\n      <aui-table-cell\n        *auiTableCellDef=\"\n          let data;\n          let index = index;\n          let even = even;\n          let odd = odd;\n          let last = last\n        \"\n        [direction]=\"columnDef.direction\"\n        [ngClass]=\"columnDef.class\"\n        [style]=\"columnDef.style\"\n      >\n        @if (columnDef.name | pure: getColumnTemplate; as template) {\n          <ng-container\n            *ngTemplateOutlet=\"\n              template;\n              context: {\n                $implicit: data,\n                index: index,\n                even: even,\n                odd: odd,\n                last: last,\n              }\n            \"\n          ></ng-container>\n        } @else {\n          @if (\n            columnDef.path != null &&\n              (data | pure: getValueFromPath : columnDef.name : columnDef.path);\n            as value\n          ) {\n            <ng-container\n              *ngTemplateOutlet=\"\n                tableCellContent;\n                context: { columnDef: columnDef, value: value }\n              \"\n            ></ng-container>\n          } @else {\n            <ng-container\n              *ngTemplateOutlet=\"\n                defaultTableCell;\n                context: { data: data, columnDef: columnDef }\n              \"\n            ></ng-container>\n          }\n        }\n      </aui-table-cell>\n    </ng-container>\n  }\n\n  <aui-table-header-row\n    *auiTableHeaderRowDef=\"columnNames$ | async; sticky: !!sticky\"\n  ></aui-table-header-row>\n  <aui-table-row\n    *auiTableRowDef=\"let row; columns: columnNames$ | async\"\n  ></aui-table-row>\n\n  <ng-container *auiTablePlaceholderDef>\n    @if (list) {\n      <div\n        [hidden]=\"\n          (pagedItems$ | async)?.length || !(list.items$ | async)?.length\n        \"\n        class=\"empty-placeholder\"\n      >\n        @if (finalResourceName$ | async; as finalResourceName) {\n          {{\n            'no_named_data_hint'\n              | translate\n                : {\n                    name:\n                      resourceNameTranslated || (finalResourceName | translate),\n                  }\n          }}\n        } @else {\n          {{ 'no_data' | translate }}\n        }\n      </div>\n      <acl-k8s-resource-list-footer\n        [hidden]=\"\n          !(pagedItems$ | async)?.length && (list.items$ | async)?.length\n        \"\n        [list]=\"list\"\n        [resourceName]=\"finalResourceName$ | async\"\n        [resourceNameTranslated]=\"resourceNameTranslated\"\n        [firstScrollLoad]=\"firstScrollLoad\"\n      >\n        @if (loadingErrorTemplate) {\n          <ng-container\n            *aclK8sListFooterLoadingError\n            [ngTemplateOutlet]=\"loadingErrorTemplate\"\n          ></ng-container>\n        }\n      </acl-k8s-resource-list-footer>\n    }\n    @if (!list && !(pagedItems$ | async)?.length) {\n      <div class=\"empty-placeholder\">\n        @if (finalDataSource$ | async) {\n          {{\n            noDataHint ||\n              ('no_named_data_hint'\n                | translate\n                  : {\n                      name:\n                        resourceNameTranslated || (resourceName | translate),\n                    })\n          }}\n        } @else {\n          <aui-icon\n            class=\"acl-loading-mask__icon\"\n            size=\"16px\"\n            icon=\"spinner\"\n          ></aui-icon>\n          {{ 'loading_please_wait' | translate }}\n        }\n      </div>\n    }\n  </ng-container>\n</aui-table>\n\n@if (enablePagination) {\n  <aui-paginator\n    [layout]=\"paginationLayout\"\n    [currentPage]=\"currentPage$ | async\"\n    [pageSize]=\"pageSize$ | async\"\n    [total]=\"pagination.total\"\n    (currentPageChange)=\"currentPage$.next($event)\"\n    (pageSizeChange)=\"pageSize$.next($event)\"\n    [pageSizeOptions]=\"pageSizeOptions\"\n  ></aui-paginator>\n}\n\n<ng-template\n  #defaultTableCell\n  let-data=\"data\"\n  let-columnDef=\"columnDef\"\n>\n  @switch (columnDef.name) {\n    @case (NAME) {\n      @if (data | pure: getValueFromPath : columnDef.name; as name) {\n        <div class=\"aui-table__cell__name\">\n          @if (columnDef.extra?.link !== false && !(data | aclIsDeleting)) {\n            <a\n              [routerLink]=\"[\n                (isListPage$ | async) ? '..' : '.',\n                'detail',\n                name,\n              ]\"\n              [auiTooltip]=\"name\"\n            >\n              {{ name }}\n            </a>\n          } @else {\n            <span\n              [auiTooltip]=\"name\"\n              [class.deleting-text]=\"data | aclIsDeleting\"\n              >{{ name }}</span\n            >\n          }\n          @if (data | pure: isK8sResource) {\n            <acl-deleting-tag [resource]=\"data\"></acl-deleting-tag>\n          }\n        </div>\n      }\n      @if (\n        (data | pure: isK8sResource)\n          ? (data | aclDisplayName)\n          : data.displayName;\n        as displayName\n      ) {\n        <div\n          class=\"aui-table__cell__display-name\"\n          [class.deleting-text]=\"data | aclIsDeleting\"\n        >\n          {{ displayName }}\n        </div>\n      }\n    }\n    @case (CREATED_AT) {\n      <acl-relative-time\n        [time]=\"data | pure: getValueFromPath : columnDef.name\"\n      ></acl-relative-time>\n    }\n    @case (ACTION) {\n      <button\n        aui-button=\"text\"\n        [square]=\"true\"\n        size=\"small\"\n        [auiDropdown]=\"menu\"\n        [auiDropdownContext]=\"{ $implicit: data, columnDef: columnDef }\"\n      >\n        <aui-icon icon=\"ellipsis_v_s\"></aui-icon>\n      </button>\n    }\n    @default {\n      @if (data | pure: getValueFromPath : columnDef.name; as value) {\n        <ng-container\n          *ngTemplateOutlet=\"\n            tableCellContent;\n            context: { columnDef: columnDef, value: value }\n          \"\n        ></ng-container>\n      } @else {\n        {{ null | aclFieldNotAvailable }}\n      }\n    }\n  }\n</ng-template>\n\n<ng-template\n  #tableCellContent\n  let-columnDef=\"columnDef\"\n  let-value=\"value\"\n>\n  @if (\n    columnDef.translate == null\n      ? value\n      : columnDef.translate === true\n        ? (value | translate)\n        : (value | pure: columnDef.translate : finalContext | translate);\n    as text\n  ) {\n    @if (columnDef.ellipsis) {\n      <div\n        class=\"text-overflow\"\n        [auiTooltip]=\"text\"\n      >\n        {{ text }}\n      </div>\n    } @else {\n      {{ text }}\n    }\n  } @else {\n    {{ null | aclFieldNotAvailable }}\n  }\n</ng-template>\n\n<ng-template\n  #menu\n  let-data\n  let-columnDef=\"columnDef\"\n  ><aui-menu>\n    @if (columnDef.extra?.update !== false) {\n      <acl-disabled-container\n        [isAllowed]=\"!permissions || permissions.update\"\n        [isDisabled]=\"\n          (columnDef.extra?.update?.disabled.handler | pure: isFunction) &&\n          (data | pure: columnDef.extra.update.disabled.handler : finalContext)\n        \"\n        [tooltip]=\"\n          columnDef.extra?.update?.disabled.tooltip\n            | pure: getValue : data : finalContext\n            | translate\n        \"\n        (click)=\"onUpdate(data, columnDef)\"\n      >\n        <aui-menu-item>{{ 'update' | translate }}</aui-menu-item>\n      </acl-disabled-container>\n    }\n    @if (columnDef.extra?.delete !== false) {\n      <acl-disabled-container\n        [isAllowed]=\"!permissions || permissions.delete\"\n        [isDisabled]=\"\n          (columnDef.extra?.delete?.disabled.handler | pure: isFunction) &&\n          (data | pure: columnDef.extra.delete.disabled.handler : finalContext)\n        \"\n        [tooltip]=\"\n          columnDef.extra?.delete?.disabled.tooltip\n            | pure: getValue : data : finalContext\n            | translate\n        \"\n        (click)=\"delete.emit(data)\"\n      >\n        <aui-menu-item>{{ 'delete' | translate }}</aui-menu-item>\n      </acl-disabled-container>\n    }\n  </aui-menu></ng-template\n>\n", styles: [".deleting-text{color:rgb(var(--aui-color-disabled-text))}:host{display:block}:host.aui-table__scroll-wrapper{display:flex}:host ::ng-deep+acl-table{margin-top:12px}html:not([lang|=zh]) :host ::ng-deep .aui-table__column-created_at{flex:0 0 140px}\n"], dependencies: [{ kind: "component", type: i1.TableComponent, selector: "aui-table", inputs: ["enableScrollWrapper"], exportAs: ["auiTable"] }, { kind: "component", type: i1.TableRowComponent, selector: "aui-table-row", inputs: ["disabled"], exportAs: ["auiTableRow"] }, { kind: "component", type: i1.TableHeaderRowComponent, selector: "aui-table-header-row", exportAs: ["auiTableHeaderRow"] }, { kind: "directive", type: i1.TableCellDirective, selector: "aui-table-cell", inputs: ["direction"] }, { kind: "directive", type: i1.TableCellDefDirective, selector: "[auiTableCellDef]" }, { kind: "directive", type: i1.TableHeaderCellDirective, selector: "aui-table-header-cell" }, { kind: "directive", type: i1.TableRowDefDirective, selector: "[auiTableRowDef]", inputs: ["auiTableRowDefColumns", "auiTableRowDefWhen"] }, { kind: "directive", type: i1.TableHeaderRowDefDirective, selector: "[auiTableHeaderRowDef]", inputs: ["auiTableHeaderRowDef", "auiTableHeaderRowDefSticky"] }, { kind: "directive", type: i1.TableHeaderCellDefDirective, selector: "[auiTableHeaderCellDef]" }, { kind: "directive", type: i1.TableColumnDefDirective, selector: "[auiTableColumnDef]", inputs: ["sticky", "auiTableColumnDef"] }, { kind: "directive", type: i1.TablePlaceholderDefDirective, selector: "ng-template[auiTablePlaceholderDef]" }, { kind: "directive", type: i1.TableScrollableDirective, selector: "[auiTableScrollable]", inputs: ["auiTableScrollable"] }, { kind: "directive", type: SortDirective, selector: "[auiSort]", inputs: ["active", "start", "direction"], outputs: ["sortChange"], exportAs: ["auiSort"] }, { kind: "component", type: SortHeaderComponent, selector: "[aui-sort-header]", inputs: ["aui-sort-header", "start"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "component", type: K8SResourceListFooterComponent, selector: "acl-k8s-resource-list-footer", inputs: ["list", "autoLoad", "backTop", "bottomDistance", "resourceNameTranslated", "firstScrollLoad", "resourceName"] }, { kind: "component", type: PaginatorComponent, selector: "aui-paginator", inputs: ["pageIndex", "currentPage", "pageSize", "pageSizeOptions", "total", "layout", "disabled"], outputs: ["pageIndexChange", "currentPageChange", "pageSizeChange"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: DeletingTagComponent, selector: "acl-deleting-tag", inputs: ["resource"] }, { kind: "component", type: RelativeTimeComponent, selector: "acl-relative-time", inputs: ["time"] }, { kind: "directive", type: i1.DropdownDirective, selector: "[auiDropdown]", inputs: ["auiDropdownClass", "auiDropdownDisabled", "auiDropdownPosition", "auiDropdownTrigger", "auiDropdownContext", "auiDropdown", "auiDropdownHideOnClick"], outputs: ["auiDropdownVisibleChange"], exportAs: ["auiDropdown"] }, { kind: "component", type: i1.MenuComponent, selector: "aui-menu", inputs: ["size"] }, { kind: "component", type: i1.MenuItemComponent, selector: "aui-menu-item", inputs: ["disabled", "divide", "type", "actived"] }, { kind: "component", type: DisabledContainerComponent, selector: "acl-disabled-container", inputs: ["tooltip", "tooltipPosition", "tooltipType", "isAllowed", "isDisabled"] }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "directive", type: K8sListFooterLoadingErrorDirective, selector: "[aclK8sListFooterLoadingError]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: i3.K8sDisplayNamePipe, name: "aclDisplayName" }, { kind: "pipe", type: i3.K8sIsDeletingPipe, name: "aclIsDeleting" }, { kind: "pipe", type: FieldNotAvailablePipe, name: "aclFieldNotAvailable" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     ObservableInput(),
@@ -10884,11 +10844,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
 
 class NamespaceBadgeComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NamespaceBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: NamespaceBadgeComponent, isStandalone: true, selector: "acl-namespace-badge", inputs: { name: "name" }, ngImport: i0, template: "<div>\n  <aui-icon\n    icon=\"prod:namespace\"\n    class=\"tw-mr-4\"\n  ></aui-icon>\n  <span\n    class=\"text-truncate\"\n    [attr.title]=\"name\"\n    >{{ name }}</span\n  >\n</div>\n", styles: [":host{display:flex;max-width:220px}.with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}.with-colon:after{content:\":\";margin-right:8px}.text-truncate{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: NamespaceBadgeComponent, isStandalone: true, selector: "acl-namespace-badge", inputs: { name: "name" }, ngImport: i0, template: "<div>\n  <aui-icon\n    icon=\"prod:namespace\"\n    class=\"icon\"\n  ></aui-icon>\n  <span\n    class=\"text-truncate\"\n    [attr.title]=\"name\"\n    >{{ name }}</span\n  >\n</div>\n", styles: [":host{display:flex;max-width:220px}.with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}.with-colon:after{content:\":\";margin-right:8px}.icon{margin-right:4px}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: NamespaceBadgeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'acl-namespace-badge', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div>\n  <aui-icon\n    icon=\"prod:namespace\"\n    class=\"tw-mr-4\"\n  ></aui-icon>\n  <span\n    class=\"text-truncate\"\n    [attr.title]=\"name\"\n    >{{ name }}</span\n  >\n</div>\n", styles: [":host{display:flex;max-width:220px}.with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}.with-colon:after{content:\":\";margin-right:8px}.text-truncate{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}\n"] }]
+            args: [{ selector: 'acl-namespace-badge', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconComponent], template: "<div>\n  <aui-icon\n    icon=\"prod:namespace\"\n    class=\"icon\"\n  ></aui-icon>\n  <span\n    class=\"text-truncate\"\n    [attr.title]=\"name\"\n    >{{ name }}</span\n  >\n</div>\n", styles: [":host{display:flex;max-width:220px}.with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}.with-colon:after{content:\":\";margin-right:8px}.icon{margin-right:4px}\n"] }]
         }], propDecorators: { name: [{
                 type: Input
             }] } });
@@ -10915,12 +10875,383 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 }]
         }] });
 
+class AclTableVirtualHeaderDefDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualHeaderDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: AclTableVirtualHeaderDefDirective, isStandalone: true, selector: "[aclTableVirtualHeader]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualHeaderDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[aclTableVirtualHeader]',
+                    standalone: true,
+                }]
+        }] });
+class AclTableVirtualRowDefDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualRowDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: AclTableVirtualRowDefDirective, isStandalone: true, selector: "[aclTableVirtualRow]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualRowDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[aclTableVirtualRow]',
+                    standalone: true,
+                }]
+        }] });
+class AclTableVirtualPlaceholderDefDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualPlaceholderDefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: AclTableVirtualPlaceholderDefDirective, isStandalone: true, selector: "[aclTableVirtualPlaceholder]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualPlaceholderDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[aclTableVirtualPlaceholder]',
+                    standalone: true,
+                }]
+        }] });
+
+class AclTableVirtualComponent {
+    constructor() {
+        this.dataSource = [];
+        this.itemSize = 48; // 默认行高，可在使用时传入与实际样式一致的值
+        this.minBufferPx = 100;
+        this.maxBufferPx = 200;
+        this.height = '400px';
+        this.trackBy = (index) => index;
+        this.placeholderActive = false;
+        this.destroy$ = new Subject();
+    }
+    ngAfterViewInit() {
+        // 如果有虚拟滚动视口，优先监听其滚动；否则退回到外层容器滚动。
+        const container = this.scrollContainerRef?.nativeElement;
+        const viewportEl = this.viewport?.elementRef?.nativeElement ?? null;
+        const viewportScrolled$ = this.viewport?.elementScrolled() ??
+            fromEvent(viewportEl ?? container, 'scroll');
+        const containerScrolled$ = fromEvent(container, 'scroll');
+        const resized$ = fromEvent(window, 'resize');
+        merge(viewportScrolled$, containerScrolled$, resized$)
+            .pipe(startWith(null), takeUntil(this.destroy$))
+            .subscribe(() => {
+            this.mutateVerticalScroll();
+            this.mutateHorizontalScroll();
+        });
+        // 初始化一次，以便首次渲染即得到正确的阴影状态。
+        this.mutateVerticalScroll();
+        this.mutateHorizontalScroll();
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    getScroller() {
+        // 在虚拟滚动场景下，真正的滚动容器是 viewport；否则使用外层容器。
+        const viewportEl = this.viewport?.elementRef?.nativeElement ?? null;
+        return viewportEl ?? this.scrollContainerRef.nativeElement;
+    }
+    placeClass(condition, className) {
+        const classList = this.scrollContainerRef.nativeElement.classList;
+        if (condition) {
+            classList.add(className);
+        }
+        else {
+            classList.remove(className);
+        }
+    }
+    mutateVerticalScroll() {
+        const el = this.getScroller();
+        const scrollDis = el.scrollHeight - el.clientHeight;
+        const scrollTop = el.scrollTop;
+        this.placeClass(scrollTop > 0, 'hasTableTopShadow');
+        this.placeClass(scrollTop < scrollDis && scrollDis > 0, 'hasTableBottomShadow');
+    }
+    mutateHorizontalScroll() {
+        const el = this.getScroller();
+        const scrollDisX = el.scrollWidth - el.clientWidth;
+        this.placeClass(scrollDisX > 0, 'aui-table__scroll-shadow--has-scroll');
+        const scrollLeft = el.scrollLeft;
+        this.placeClass(scrollLeft > 0, 'aui-table__scroll-shadow--scrolling');
+        this.placeClass(scrollLeft < scrollDisX && scrollDisX > 0, 'aui-table__scroll-shadow--before-end');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: AclTableVirtualComponent, isStandalone: true, selector: "acl-table-virtual", inputs: { dataSource: "dataSource", itemSize: "itemSize", minBufferPx: "minBufferPx", maxBufferPx: "maxBufferPx", height: "height", trackBy: "trackBy", placeholderActive: "placeholderActive" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: AclTableVirtualHeaderDefDirective, descendants: true, read: TemplateRef }, { propertyName: "rowTemplate", first: true, predicate: (AclTableVirtualRowDefDirective), descendants: true, read: TemplateRef }, { propertyName: "placeholderTemplate", first: true, predicate: AclTableVirtualPlaceholderDefDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "scrollContainerRef", first: true, predicate: ["scrollContainer"], descendants: true, static: true }], exportAs: ["aclTableVirtual"], ngImport: i0, template: `
+    <div
+      #scrollContainer
+      class="aui-table aui-table__scroll-shadow"
+    >
+      @if (headerTemplate) {
+        <div class="aui-table__header-row">
+          <ng-template [ngTemplateOutlet]="headerTemplate"></ng-template>
+        </div>
+      }
+      @if (placeholderTemplate) {
+        <ng-template [ngTemplateOutlet]="placeholderTemplate"></ng-template>
+      } @else if (!placeholderActive) {
+        <cdk-virtual-scroll-viewport
+          [itemSize]="itemSize"
+          [minBufferPx]="minBufferPx"
+          [maxBufferPx]="maxBufferPx"
+          class="aui-table__body-viewport"
+          [style.height]="height"
+        >
+          <div
+            class="aui-table__row"
+            *cdkVirtualFor="
+              let item of dataSource;
+              let index = index;
+              let odd = odd;
+              let even = even;
+              let last = last;
+              trackBy: trackBy
+            "
+          >
+            <ng-template
+              [ngTemplateOutlet]="rowTemplate"
+              [ngTemplateOutletContext]="{
+                $implicit: item,
+                index,
+                odd,
+                even,
+                last,
+              }"
+            ></ng-template>
+          </div>
+        </cdk-virtual-scroll-viewport>
+      }
+    </div>
+  `, isInline: true, styles: [":host{display:block}.aui-table__body-viewport{display:block}cdk-virtual-scroll-viewport::-webkit-scrollbar{width:8px;height:4px}cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}cdk-virtual-scroll-viewport::-webkit-scrollbar-corner{background-color:transparent}.aui-table{position:relative;display:block;padding:0 12px 12px}.aui-table{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);font-weight:var(--aui-font-weight-normal);color:rgb(var(--aui-color-main-text))}.aui-table{background-color:rgb(var(--aui-color-n-9));border-radius:var(--aui-border-radius-l)}.aui-table__row,.aui-table__header-row{display:flex;align-items:center}.aui-table__row.hasPanel,.aui-table__header-row.hasPanel{flex-wrap:wrap}.aui-table__header-row+.aui-table__row{border-top-left-radius:var(--aui-border-radius-l);border-top-right-radius:var(--aui-border-radius-l)}.aui-table__row{position:relative;border-width:1px;border-style:solid;border-color:rgb(var(--aui-color-n-8));border-bottom-width:0;background-color:rgb(var(--aui-color-n-10));padding:0 9px;min-height:58px;box-sizing:content-box}.aui-table__row:first-child{border-top-left-radius:var(--aui-border-radius-l);border-top-right-radius:var(--aui-border-radius-l)}.aui-table__row:last-of-type{border-bottom-width:1px;min-height:58px;border-bottom-left-radius:var(--aui-border-radius-l);border-bottom-right-radius:var(--aui-border-radius-l)}.aui-table__row.isDisabled:before{content:\"\";z-index:2;position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgb(var(--aui-color-n-10));opacity:.7;cursor:not-allowed}.aui-table__header-row{background-color:rgb(var(--aui-color-n-9));padding:0 10px}.aui-table__cell,.aui-table__header-cell{display:flex;align-items:center;flex:1;position:relative}.aui-table__cell{padding:15px 10px;background-color:rgb(var(--aui-color-n-10));overflow:hidden}.aui-table__cell--column{flex-direction:column;justify-content:center;align-items:flex-start}.aui-table__header-cell{padding:12px 10px;font-weight:var(--aui-font-weight-bold);background-color:rgb(var(--aui-color-n-9))}.aui-table__column-expand-button{display:flex;align-items:center;max-width:calc(10px * 2 + var(--aui-icon-size-m))}.aui-table__column-expand-button.aui-table__cell{height:58px}.aui-table__column-expand-button .aui-expand-button{display:inline-flex;justify-content:center;align-items:center;width:var(--aui-icon-size-m);height:var(--aui-icon-size-m);color:rgb(var(--aui-color-primary));background-color:rgb(var(--aui-color-p-6));border-radius:50%;border:none;cursor:pointer;transition:transform .1s ease-in-out}.aui-table__column-expand-button .aui-expand-button aui-icon{display:flex;justify-content:center;align-items:center;width:var(--aui-icon-size-s);height:var(--aui-icon-size-s);font-size:var(--aui-icon-size-s)}.aui-table__column-expand-button .aui-expand-button:hover{background-color:rgb(var(--aui-color-p-7))}.aui-table__column-expand-button .aui-expand-button:active{background-color:rgb(var(--aui-color-p-5))}.aui-table__column-expand-button .aui-expand-button.isExpanded{transform:rotate(90deg);color:#fff;background-color:rgb(var(--aui-color-primary))}.aui-table__column-expand-button .aui-expand-button.isExpanded:hover{background-color:rgb(var(--aui-color-p-1))}.aui-table__column-expand-button .aui-expand-button.isExpanded:active{background-color:rgb(var(--aui-color-p-0))}.aui-table__column-expand-button .aui-expand-button[disabled],.aui-table__column-expand-button .aui-expand-button.isExpanded[disabled]{background-color:rgb(var(--aui-color-n-8));color:rgb(var(--aui-color-n-6));cursor:not-allowed}.aui-table__column-expand-panel{margin-top:-6px}.aui-table__column-expand-panel.aui-table__header-cell{display:none}.aui-table__column-expand-panel.aui-table__cell{width:100%;flex-shrink:0;flex-basis:100%;padding:0 10px;overflow:hidden}.aui-table__column-expand-panel.aui-table__cell .aui-table__cell-expand-panel{width:100%;border-radius:var(--aui-border-radius-l);overflow:hidden}.aui-table__column-expand-panel.aui-table__cell .aui-table__cell-expand-panel-content.hasBackground{padding:16px;background-color:rgb(var(--aui-color-n-9))}.aui-table-column-resizable__handle{display:block;position:absolute;top:0;bottom:0;right:0;width:5px;color:rgb(var(--aui-color-n-7));cursor:col-resize}.aui-table-column-resizable__handle:after{content:\"\";display:block;margin:12px 0 12px auto;width:1px;height:calc(100% - 24px);background-color:currentcolor}.aui-table-column-resizable__handle:hover{color:rgb(var(--aui-color-primary))}.aui-table-column-resizable__mark-line{display:block;position:absolute;top:0;bottom:0;width:1px;background-color:rgb(var(--aui-color-primary));z-index:9999;cursor:col-resize}.aui-table-column-resizable__overlay{display:block;position:absolute;inset:0;z-index:9000;cursor:col-resize}.aui-table__scroll-wrapper{position:relative;display:flex;flex-direction:column;max-height:100%;overflow:hidden;background-color:rgb(var(--aui-color-n-9));padding:0 12px 12px;border-radius:var(--aui-border-radius-l)}.aui-table__scroll-wrapper::-webkit-scrollbar{width:8px;height:4px}.aui-table__scroll-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.aui-table__scroll-wrapper::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.aui-table__scroll-wrapper::-webkit-scrollbar-corner{background-color:transparent}.aui-table__scroll-wrapper .aui-table{padding:0;border-radius:0}.aui-table__scroll-wrapper .aui-table__scroll-shadow.hasTableTopShadow:before,.aui-table__scroll-wrapper .aui-table__scroll-shadow.hasTableBottomShadow:after{transform:none;width:100%;left:0}.aui-table__scroll-shadow.aui-table{overflow:auto}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar{width:8px;height:4px}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-corner{background-color:transparent}.aui-table__scroll-shadow.hasTableTopShadow:before{content:\"\";position:sticky;display:block;height:16px;margin:-16px -12px 0;z-index:99;top:28px}:root .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow.hasTableBottomShadow:after{content:\"\";position:sticky;display:block;height:16px;transform:translate3d(0,12px,0);z-index:99;bottom:0;margin:-16px -12px 0}:root .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-1),.16) inset}html[aui-theme-mode=light] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-1),.16) inset}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-9),.75) inset}}html[aui-theme-mode=dark] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-9),.75) inset}.aui-table__scroll-shadow .aui-table__header-row{margin:0;padding:0;align-items:stretch}.aui-table__scroll-shadow .aui-table__header-row .aui-table__header-cell:first-of-type{padding-left:20px}.aui-table__scroll-shadow .aui-table__header-row .aui-table__header-cell:last-of-type{padding-right:20px}.aui-table__scroll-shadow .aui-table__header-row+.aui-table__row .aui-table__cell:first-of-type{border-top-left-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__header-row+.aui-table__row .aui-table__cell:last-of-type{border-top-right-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row{border:none;padding:0;align-items:stretch;min-height:59px}.aui-table__scroll-shadow .aui-table__row .aui-table__cell{border-width:1px 0;border-style:solid;border-color:rgb(var(--aui-color-n-8))}.aui-table__scroll-shadow .aui-table__row .aui-table__cell:first-of-type{border-left-width:1px;padding-left:19px}.aui-table__scroll-shadow .aui-table__row .aui-table__cell:last-of-type{border-right-width:1px;padding-right:19px}.aui-table__scroll-shadow .aui-table__row:last-child{min-height:60px}.aui-table__scroll-shadow .aui-table__row:last-child .aui-table__cell:first-of-type{border-bottom-left-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row:last-child .aui-table__cell:last-of-type{border-bottom-right-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row:not(:last-child) .aui-table__cell{border-bottom-width:0}.aui-table__scroll-shadow--has-scroll aui-table-header-cell.aui-table-sticky-border-elem-left .aui-table-column-resizable__handle{transform:translate(-20px)}.aui-table__scroll-shadow--has-scroll .aui-table-column-resizable__mark-line.inStickyBorderElemLeft{transform:translate(-20px)}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:after,.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:after{position:absolute;top:0;bottom:-1px;width:20px;transition:box-shadow .3s;content:\"\";pointer-events:none}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:before,.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:before{position:absolute;top:0;bottom:-1px;content:\"\";background:linear-gradient(to bottom,rgb(var(--aui-color-n-7)),rgb(var(--aui-color-n-7)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left{padding-right:30px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:after{right:-10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:before{right:10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right{padding-left:30px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:after{left:-10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:before{left:10px}:root .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):before{background:linear-gradient(to bottom,rgb(var(--aui-color-primary)),rgb(var(--aui-color-primary)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}:root .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):before{background:linear-gradient(to bottom,rgb(var(--aui-color-primary)),rgb(var(--aui-color-primary)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1$2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1$2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1$2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'acl-table-virtual', exportAs: 'aclTableVirtual', standalone: true, template: `
+    <div
+      #scrollContainer
+      class="aui-table aui-table__scroll-shadow"
+    >
+      @if (headerTemplate) {
+        <div class="aui-table__header-row">
+          <ng-template [ngTemplateOutlet]="headerTemplate"></ng-template>
+        </div>
+      }
+      @if (placeholderTemplate) {
+        <ng-template [ngTemplateOutlet]="placeholderTemplate"></ng-template>
+      } @else if (!placeholderActive) {
+        <cdk-virtual-scroll-viewport
+          [itemSize]="itemSize"
+          [minBufferPx]="minBufferPx"
+          [maxBufferPx]="maxBufferPx"
+          class="aui-table__body-viewport"
+          [style.height]="height"
+        >
+          <div
+            class="aui-table__row"
+            *cdkVirtualFor="
+              let item of dataSource;
+              let index = index;
+              let odd = odd;
+              let even = even;
+              let last = last;
+              trackBy: trackBy
+            "
+          >
+            <ng-template
+              [ngTemplateOutlet]="rowTemplate"
+              [ngTemplateOutletContext]="{
+                $implicit: item,
+                index,
+                odd,
+                even,
+                last,
+              }"
+            ></ng-template>
+          </div>
+        </cdk-virtual-scroll-viewport>
+      }
+    </div>
+  `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [ScrollingModule, NgTemplateOutlet], styles: [":host{display:block}.aui-table__body-viewport{display:block}cdk-virtual-scroll-viewport::-webkit-scrollbar{width:8px;height:4px}cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}cdk-virtual-scroll-viewport::-webkit-scrollbar-corner{background-color:transparent}.aui-table{position:relative;display:block;padding:0 12px 12px}.aui-table{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);font-weight:var(--aui-font-weight-normal);color:rgb(var(--aui-color-main-text))}.aui-table{background-color:rgb(var(--aui-color-n-9));border-radius:var(--aui-border-radius-l)}.aui-table__row,.aui-table__header-row{display:flex;align-items:center}.aui-table__row.hasPanel,.aui-table__header-row.hasPanel{flex-wrap:wrap}.aui-table__header-row+.aui-table__row{border-top-left-radius:var(--aui-border-radius-l);border-top-right-radius:var(--aui-border-radius-l)}.aui-table__row{position:relative;border-width:1px;border-style:solid;border-color:rgb(var(--aui-color-n-8));border-bottom-width:0;background-color:rgb(var(--aui-color-n-10));padding:0 9px;min-height:58px;box-sizing:content-box}.aui-table__row:first-child{border-top-left-radius:var(--aui-border-radius-l);border-top-right-radius:var(--aui-border-radius-l)}.aui-table__row:last-of-type{border-bottom-width:1px;min-height:58px;border-bottom-left-radius:var(--aui-border-radius-l);border-bottom-right-radius:var(--aui-border-radius-l)}.aui-table__row.isDisabled:before{content:\"\";z-index:2;position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgb(var(--aui-color-n-10));opacity:.7;cursor:not-allowed}.aui-table__header-row{background-color:rgb(var(--aui-color-n-9));padding:0 10px}.aui-table__cell,.aui-table__header-cell{display:flex;align-items:center;flex:1;position:relative}.aui-table__cell{padding:15px 10px;background-color:rgb(var(--aui-color-n-10));overflow:hidden}.aui-table__cell--column{flex-direction:column;justify-content:center;align-items:flex-start}.aui-table__header-cell{padding:12px 10px;font-weight:var(--aui-font-weight-bold);background-color:rgb(var(--aui-color-n-9))}.aui-table__column-expand-button{display:flex;align-items:center;max-width:calc(10px * 2 + var(--aui-icon-size-m))}.aui-table__column-expand-button.aui-table__cell{height:58px}.aui-table__column-expand-button .aui-expand-button{display:inline-flex;justify-content:center;align-items:center;width:var(--aui-icon-size-m);height:var(--aui-icon-size-m);color:rgb(var(--aui-color-primary));background-color:rgb(var(--aui-color-p-6));border-radius:50%;border:none;cursor:pointer;transition:transform .1s ease-in-out}.aui-table__column-expand-button .aui-expand-button aui-icon{display:flex;justify-content:center;align-items:center;width:var(--aui-icon-size-s);height:var(--aui-icon-size-s);font-size:var(--aui-icon-size-s)}.aui-table__column-expand-button .aui-expand-button:hover{background-color:rgb(var(--aui-color-p-7))}.aui-table__column-expand-button .aui-expand-button:active{background-color:rgb(var(--aui-color-p-5))}.aui-table__column-expand-button .aui-expand-button.isExpanded{transform:rotate(90deg);color:#fff;background-color:rgb(var(--aui-color-primary))}.aui-table__column-expand-button .aui-expand-button.isExpanded:hover{background-color:rgb(var(--aui-color-p-1))}.aui-table__column-expand-button .aui-expand-button.isExpanded:active{background-color:rgb(var(--aui-color-p-0))}.aui-table__column-expand-button .aui-expand-button[disabled],.aui-table__column-expand-button .aui-expand-button.isExpanded[disabled]{background-color:rgb(var(--aui-color-n-8));color:rgb(var(--aui-color-n-6));cursor:not-allowed}.aui-table__column-expand-panel{margin-top:-6px}.aui-table__column-expand-panel.aui-table__header-cell{display:none}.aui-table__column-expand-panel.aui-table__cell{width:100%;flex-shrink:0;flex-basis:100%;padding:0 10px;overflow:hidden}.aui-table__column-expand-panel.aui-table__cell .aui-table__cell-expand-panel{width:100%;border-radius:var(--aui-border-radius-l);overflow:hidden}.aui-table__column-expand-panel.aui-table__cell .aui-table__cell-expand-panel-content.hasBackground{padding:16px;background-color:rgb(var(--aui-color-n-9))}.aui-table-column-resizable__handle{display:block;position:absolute;top:0;bottom:0;right:0;width:5px;color:rgb(var(--aui-color-n-7));cursor:col-resize}.aui-table-column-resizable__handle:after{content:\"\";display:block;margin:12px 0 12px auto;width:1px;height:calc(100% - 24px);background-color:currentcolor}.aui-table-column-resizable__handle:hover{color:rgb(var(--aui-color-primary))}.aui-table-column-resizable__mark-line{display:block;position:absolute;top:0;bottom:0;width:1px;background-color:rgb(var(--aui-color-primary));z-index:9999;cursor:col-resize}.aui-table-column-resizable__overlay{display:block;position:absolute;inset:0;z-index:9000;cursor:col-resize}.aui-table__scroll-wrapper{position:relative;display:flex;flex-direction:column;max-height:100%;overflow:hidden;background-color:rgb(var(--aui-color-n-9));padding:0 12px 12px;border-radius:var(--aui-border-radius-l)}.aui-table__scroll-wrapper::-webkit-scrollbar{width:8px;height:4px}.aui-table__scroll-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.aui-table__scroll-wrapper::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.aui-table__scroll-wrapper::-webkit-scrollbar-corner{background-color:transparent}.aui-table__scroll-wrapper .aui-table{padding:0;border-radius:0}.aui-table__scroll-wrapper .aui-table__scroll-shadow.hasTableTopShadow:before,.aui-table__scroll-wrapper .aui-table__scroll-shadow.hasTableBottomShadow:after{transform:none;width:100%;left:0}.aui-table__scroll-shadow.aui-table{overflow:auto}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar{width:8px;height:4px}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.aui-table__scroll-shadow.aui-table::-webkit-scrollbar-corner{background-color:transparent}.aui-table__scroll-shadow.hasTableTopShadow:before{content:\"\";position:sticky;display:block;height:16px;margin:-16px -12px 0;z-index:99;top:28px}:root .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow.hasTableTopShadow:before{box-shadow:0 10px 10px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow.hasTableBottomShadow:after{content:\"\";position:sticky;display:block;height:16px;transform:translate3d(0,12px,0);z-index:99;bottom:0;margin:-16px -12px 0}:root .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-1),.16) inset}html[aui-theme-mode=light] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-1),.16) inset}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-9),.75) inset}}html[aui-theme-mode=dark] .aui-table__scroll-shadow.hasTableBottomShadow:after{box-shadow:0 -10px 10px -4px rgba(var(--aui-color-n-9),.75) inset}.aui-table__scroll-shadow .aui-table__header-row{margin:0;padding:0;align-items:stretch}.aui-table__scroll-shadow .aui-table__header-row .aui-table__header-cell:first-of-type{padding-left:20px}.aui-table__scroll-shadow .aui-table__header-row .aui-table__header-cell:last-of-type{padding-right:20px}.aui-table__scroll-shadow .aui-table__header-row+.aui-table__row .aui-table__cell:first-of-type{border-top-left-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__header-row+.aui-table__row .aui-table__cell:last-of-type{border-top-right-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row{border:none;padding:0;align-items:stretch;min-height:59px}.aui-table__scroll-shadow .aui-table__row .aui-table__cell{border-width:1px 0;border-style:solid;border-color:rgb(var(--aui-color-n-8))}.aui-table__scroll-shadow .aui-table__row .aui-table__cell:first-of-type{border-left-width:1px;padding-left:19px}.aui-table__scroll-shadow .aui-table__row .aui-table__cell:last-of-type{border-right-width:1px;padding-right:19px}.aui-table__scroll-shadow .aui-table__row:last-child{min-height:60px}.aui-table__scroll-shadow .aui-table__row:last-child .aui-table__cell:first-of-type{border-bottom-left-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row:last-child .aui-table__cell:last-of-type{border-bottom-right-radius:var(--aui-border-radius-l)}.aui-table__scroll-shadow .aui-table__row:not(:last-child) .aui-table__cell{border-bottom-width:0}.aui-table__scroll-shadow--has-scroll aui-table-header-cell.aui-table-sticky-border-elem-left .aui-table-column-resizable__handle{transform:translate(-20px)}.aui-table__scroll-shadow--has-scroll .aui-table-column-resizable__mark-line.inStickyBorderElemLeft{transform:translate(-20px)}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:after,.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:after{position:absolute;top:0;bottom:-1px;width:20px;transition:box-shadow .3s;content:\"\";pointer-events:none}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:before,.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:before{position:absolute;top:0;bottom:-1px;content:\"\";background:linear-gradient(to bottom,rgb(var(--aui-color-n-7)),rgb(var(--aui-color-n-7)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left{padding-right:30px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:after{right:-10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-left:before{right:10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right{padding-left:30px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:after{left:-10px}.aui-table__scroll-shadow--has-scroll .aui-table-sticky-border-elem-right:before{left:10px}:root .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):after{box-shadow:inset 8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow--scrolling .aui-table-sticky-border-elem-left:not(.aui-table__header-row):before{background:linear-gradient(to bottom,rgb(var(--aui-color-primary)),rgb(var(--aui-color-primary)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}:root .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}html[aui-theme-mode=light] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-1),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}}html[aui-theme-mode=dark] .aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):after{box-shadow:inset -8px 0 4px -4px rgba(var(--aui-color-n-9),.75)}.aui-table__scroll-shadow--before-end .aui-table-sticky-border-elem-right:not(.aui-table__header-row):before{background:linear-gradient(to bottom,rgb(var(--aui-color-primary)),rgb(var(--aui-color-primary)) 8px,transparent 6px,transparent);width:1px;background-size:100% 14px;height:100%}\n"] }]
+        }], propDecorators: { dataSource: [{
+                type: Input
+            }], itemSize: [{
+                type: Input
+            }], minBufferPx: [{
+                type: Input
+            }], maxBufferPx: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], trackBy: [{
+                type: Input
+            }], placeholderActive: [{
+                type: Input
+            }], headerTemplate: [{
+                type: ContentChild,
+                args: [AclTableVirtualHeaderDefDirective, { read: TemplateRef }]
+            }], rowTemplate: [{
+                type: ContentChild,
+                args: [(AclTableVirtualRowDefDirective), { read: TemplateRef }]
+            }], placeholderTemplate: [{
+                type: ContentChild,
+                args: [AclTableVirtualPlaceholderDefDirective, { read: TemplateRef }]
+            }], viewport: [{
+                type: ViewChild,
+                args: [CdkVirtualScrollViewport]
+            }], scrollContainerRef: [{
+                type: ViewChild,
+                args: ['scrollContainer', { static: true }]
+            }] } });
+
+class AclTableVirtualModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualModule, imports: [AclTableVirtualComponent,
+            AclTableVirtualHeaderDefDirective,
+            AclTableVirtualRowDefDirective,
+            AclTableVirtualPlaceholderDefDirective], exports: [AclTableVirtualComponent,
+            AclTableVirtualHeaderDefDirective,
+            AclTableVirtualRowDefDirective,
+            AclTableVirtualPlaceholderDefDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualModule, imports: [AclTableVirtualComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: AclTableVirtualModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        AclTableVirtualComponent,
+                        AclTableVirtualHeaderDefDirective,
+                        AclTableVirtualRowDefDirective,
+                        AclTableVirtualPlaceholderDefDirective,
+                    ],
+                    exports: [
+                        AclTableVirtualComponent,
+                        AclTableVirtualHeaderDefDirective,
+                        AclTableVirtualRowDefDirective,
+                        AclTableVirtualPlaceholderDefDirective,
+                    ],
+                }]
+        }] });
+
+class TerminatingTagComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TerminatingTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: TerminatingTagComponent, isStandalone: true, selector: "acl-deleting-tag", inputs: { resource: "resource" }, ngImport: i0, template: "@if (resource?.metadata?.deletionTimestamp) {\n  <aui-tag\n    type=\"error\"\n    size=\"mini\"\n    [border]=\"true\"\n  >\n    {{ 'deleting' | translate }}\n  </aui-tag>\n}\n", styles: ["aui-tag{display:inline-block;margin-left:8px;vertical-align:2px}\n"], dependencies: [{ kind: "component", type: TagComponent, selector: "aui-tag", inputs: ["type", "size", "closeable", "border", "solid", "invalid", "round", "color", "allowClick"], outputs: ["close"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TerminatingTagComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'acl-deleting-tag', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [TagComponent, TranslatePipe], template: "@if (resource?.metadata?.deletionTimestamp) {\n  <aui-tag\n    type=\"error\"\n    size=\"mini\"\n    [border]=\"true\"\n  >\n    {{ 'deleting' | translate }}\n  </aui-tag>\n}\n", styles: ["aui-tag{display:inline-block;margin-left:8px;vertical-align:2px}\n"] }]
+        }], propDecorators: { resource: [{
+                type: Input
+            }] } });
+
+class PluginClusterSelectorComponent {
+    constructor() {
+        this.valueChange = new EventEmitter();
+        this.isActive = false;
+        this.popupService = inject(ResourceSelectorPopupService);
+        this.cdr = inject(ChangeDetectorRef);
+        this.elementRef = inject(ElementRef);
+        this.http = inject(HttpClient);
+        this.projectApi = inject(ProjectService);
+        this.displayFields = [
+            ConfigurableField.Status,
+            ConfigurableField.Time,
+        ];
+        this.filterClusters$ = this.disabled$.pipe(distinctUntilChanged(isEqual), switchMap(disabled => disabled
+            ? EMPTY$1
+            : this.projectApi
+                .getProjects()
+                .pipe(map(projects => projects
+                ?.find(p => p.metadata.name === this.projectName)
+                ?.spec?.clusters?.map(r => r.name)))), publishRef());
+    }
+    getFilterFn(filterClusters) {
+        return (clusters) => {
+            if (!filterClusters?.length) {
+                return clusters;
+            }
+            return clusters.filter(c => filterClusters.includes(c.name));
+        };
+    }
+    ngAfterViewInit() {
+        this.http
+            .get(`${API_GATEWAY$1}/auth/v1/clusters`)
+            .pipe(map(list => list.items), catchError(() => of([])))
+            .subscribe(clusters => {
+            this.onSelect({ name: clusters[0].metadata.name });
+        });
+    }
+    openPopup() {
+        if (this.disabled) {
+            return;
+        }
+        if (this.isActive) {
+            this.closePopup();
+        }
+        else {
+            this.isActive = true;
+            this.popupRef = this.popupService.open({
+                origin: this.elementRef,
+                content: this.popupTemplate,
+            });
+            this.popupRef.afterClosed().subscribe(() => {
+                this.isActive = false;
+                this.cdr.markForCheck();
+            });
+        }
+    }
+    closePopup() {
+        if (this.isActive) {
+            this.isActive = false;
+            this.popupRef.close();
+        }
+    }
+    onSelect(item) {
+        this.value = item.name;
+        this.valueChange.emit(item.name);
+        this.closePopup();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PluginClusterSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.1.1", type: PluginClusterSelectorComponent, isStandalone: true, selector: "acl-plugin-cluster-selector", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute], projectName: "projectName", fields: "fields" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "popupTemplate", first: true, predicate: ["popup"], descendants: true, static: true }], ngImport: i0, template: "<div\n  class=\"acl-resource-selector acl-resource-selector--bg\"\n  [ngClass]=\"{\n    'acl-resource-selector--active': isActive,\n    'acl-resource-selector--disabled': disabled,\n  }\"\n  (click)=\"openPopup()\"\n>\n  <div class=\"acl-resource-selector__item project\">\n    <span class=\"icon-wrapper\">\n      <aui-icon icon=\"bicolor:server\"></aui-icon>\n    </span>\n    <span class=\"with-colon\">\n      {{ 'cluster' | translate }}\n    </span>\n    <span class=\"selected-name text-truncate\">{{ value }}</span>\n  </div>\n  <div class=\"acl-resource-selector__arrow\">\n    <aui-icon icon=\"caret_down_s\"></aui-icon>\n  </div>\n</div>\n\n<ng-template #popup>\n  <acl-cluster-list\n    context=\"popup\"\n    [fields]=\"fields || displayFields\"\n    [filterFn]=\"getFilterFn(filterClusters$ | async)\"\n    [value]=\"value\"\n    (selectItem)=\"onSelect($event)\"\n  ></acl-cluster-list>\n</ng-template>\n", styles: [":host{display:flex}:host::ng-deep .icon-wrapper{position:relative;display:flex;justify-content:center;align-items:center;width:16px;height:16px;flex-shrink:0;font-size:var(--aui-icon-size-m)}:root :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}html[aui-theme-mode=light] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}}html[aui-theme-mode=dark] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}:host::ng-deep .with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}:host::ng-deep .with-colon:after{content:\":\";margin-right:8px}:host::ng-deep .text-truncate{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host::ng-deep .acl-resource-selector{-webkit-user-select:none;user-select:none;display:flex;color:var(--acl-page-header-title-color);cursor:pointer;padding:0 8px}:host::ng-deep .acl-resource-selector .selected-name{color:var(--acl-page-header-text-color)}:host::ng-deep .acl-resource-selector--active,:host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover{background-color:rgb(var(--aui-color-primary));color:#fff;border-radius:2px}:root :host::ng-deep .acl-resource-selector--active .icon-wrapper,:root :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: rgb(var(--aui-color-p-4))}html[aui-theme-mode=light] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=light] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: rgb(var(--aui-color-p-4))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=system] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: #b3d7fc}}html[aui-theme-mode=dark] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=dark] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: #b3d7fc}:host::ng-deep .acl-resource-selector--active .selected-name,:host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .selected-name{color:#fff}:host::ng-deep .acl-resource-selector--disabled{cursor:not-allowed}:host::ng-deep .acl-resource-selector--bg{background-color:rgb(var(--aui-color-p-6));flex:1}:host::ng-deep .acl-resource-selector__item{margin-right:20px;height:32px;display:inline-flex;align-items:center;font-size:12px;max-width:270px}@media screen and (width <= 1280px){:host::ng-deep .acl-resource-selector__item{max-width:178px;margin-right:8px}}:host::ng-deep .acl-resource-selector__item .icon-wrapper{margin-right:4px}:host::ng-deep .acl-resource-selector__arrow{margin-left:-16px;align-items:center;display:inline-flex;width:16px;justify-content:center}@media screen and (width <= 1280px){:host::ng-deep .acl-resource-selector__arrow{margin-left:-4px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ClusterListComponent, selector: "acl-cluster-list", inputs: ["value", "filterFn"] }, { kind: "component", type: IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+__decorate([
+    ObservableInput(),
+    __metadata("design:type", Observable)
+], PluginClusterSelectorComponent.prototype, "disabled$", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: PluginClusterSelectorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'acl-plugin-cluster-selector', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        CommonModule,
+                        ClusterListComponent,
+                        NgClass,
+                        IconComponent,
+                        TranslatePipe,
+                    ], template: "<div\n  class=\"acl-resource-selector acl-resource-selector--bg\"\n  [ngClass]=\"{\n    'acl-resource-selector--active': isActive,\n    'acl-resource-selector--disabled': disabled,\n  }\"\n  (click)=\"openPopup()\"\n>\n  <div class=\"acl-resource-selector__item project\">\n    <span class=\"icon-wrapper\">\n      <aui-icon icon=\"bicolor:server\"></aui-icon>\n    </span>\n    <span class=\"with-colon\">\n      {{ 'cluster' | translate }}\n    </span>\n    <span class=\"selected-name text-truncate\">{{ value }}</span>\n  </div>\n  <div class=\"acl-resource-selector__arrow\">\n    <aui-icon icon=\"caret_down_s\"></aui-icon>\n  </div>\n</div>\n\n<ng-template #popup>\n  <acl-cluster-list\n    context=\"popup\"\n    [fields]=\"fields || displayFields\"\n    [filterFn]=\"getFilterFn(filterClusters$ | async)\"\n    [value]=\"value\"\n    (selectItem)=\"onSelect($event)\"\n  ></acl-cluster-list>\n</ng-template>\n", styles: [":host{display:flex}:host::ng-deep .icon-wrapper{position:relative;display:flex;justify-content:center;align-items:center;width:16px;height:16px;flex-shrink:0;font-size:var(--aui-icon-size-m)}:root :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}html[aui-theme-mode=light] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}}html[aui-theme-mode=dark] :host::ng-deep .icon-wrapper{--bicolor-main: rgb(var(--aui-color-primary));--bicolor-secondary: rgb(var(--aui-color-p-3))}:host::ng-deep .with-colon{display:inline-flex;word-break:keep-all;flex-shrink:0;font-weight:500}:host::ng-deep .with-colon:after{content:\":\";margin-right:8px}:host::ng-deep .text-truncate{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host::ng-deep .acl-resource-selector{-webkit-user-select:none;user-select:none;display:flex;color:var(--acl-page-header-title-color);cursor:pointer;padding:0 8px}:host::ng-deep .acl-resource-selector .selected-name{color:var(--acl-page-header-text-color)}:host::ng-deep .acl-resource-selector--active,:host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover{background-color:rgb(var(--aui-color-primary));color:#fff;border-radius:2px}:root :host::ng-deep .acl-resource-selector--active .icon-wrapper,:root :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: rgb(var(--aui-color-p-4))}html[aui-theme-mode=light] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=light] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: rgb(var(--aui-color-p-4))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=system] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: #b3d7fc}}html[aui-theme-mode=dark] :host::ng-deep .acl-resource-selector--active .icon-wrapper,html[aui-theme-mode=dark] :host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .icon-wrapper{--bicolor-main: white;--bicolor-secondary: #b3d7fc}:host::ng-deep .acl-resource-selector--active .selected-name,:host::ng-deep .acl-resource-selector:not(.acl-resource-selector--disabled):hover .selected-name{color:#fff}:host::ng-deep .acl-resource-selector--disabled{cursor:not-allowed}:host::ng-deep .acl-resource-selector--bg{background-color:rgb(var(--aui-color-p-6));flex:1}:host::ng-deep .acl-resource-selector__item{margin-right:20px;height:32px;display:inline-flex;align-items:center;font-size:12px;max-width:270px}@media screen and (width <= 1280px){:host::ng-deep .acl-resource-selector__item{max-width:178px;margin-right:8px}}:host::ng-deep .acl-resource-selector__item .icon-wrapper{margin-right:4px}:host::ng-deep .acl-resource-selector__arrow{margin-left:-16px;align-items:center;display:inline-flex;width:16px;justify-content:center}@media screen and (width <= 1280px){:host::ng-deep .acl-resource-selector__arrow{margin-left:-4px}}\n"] }]
+        }], propDecorators: { value: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], disabled: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], disabled$: [], projectName: [{
+                type: Input
+            }], popupTemplate: [{
+                type: ViewChild,
+                args: ['popup', { static: true }]
+            }], fields: [{
+                type: Input
+            }] } });
+
 class UpdateDescriptionDialogComponent {
-    constructor(dialogRef, k8sApi, k8sUtil, data) {
-        this.dialogRef = dialogRef;
-        this.k8sApi = k8sApi;
-        this.k8sUtil = k8sUtil;
-        this.data = data;
+    constructor() {
+        this.dialogRef = inject(DialogRef);
+        this.k8sApi = inject(K8sApiService);
+        this.k8sUtil = inject(K8sUtilService);
+        this.data = inject(DIALOG_DATA);
         this.description = this.k8sUtil.getDescription(this.data.resource);
         this.confirming$$ = new BehaviorSubject(false);
     }
@@ -10928,14 +11259,7 @@ class UpdateDescriptionDialogComponent {
         this.confirming$$.next(true);
         this.k8sApi
             .patchResource({
-            ...(this.data.definition
-                ? {
-                    definition: this.data.definition,
-                }
-                : {
-                    type: this.data.type ||
-                        snakeCase(this.data.resource.kind).toUpperCase(),
-                }),
+            definition: this.data.definition,
             cluster: this.data.cluster,
             resource: this.data.resource,
             part: {
@@ -10949,8 +11273,8 @@ class UpdateDescriptionDialogComponent {
             .pipe(finalize(() => this.confirming$$.next(false)))
             .subscribe(resource => this.dialogRef.close(resource));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateDescriptionDialogComponent, deps: [{ token: i1.DialogRef }, { token: i2$1.K8sApiService }, { token: i2$1.K8sUtilService }, { token: DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: UpdateDescriptionDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header>\n  {{ 'update_description' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-form-item>\n    <label auiFormItemLabel>\n      {{ 'name' | translate }}\n    </label>\n    {{ data.resource | aclName }}\n  </aui-form-item>\n  <aui-form-item class=\"last-form-item-no-margin\">\n    <label auiFormItemLabel>\n      {{ 'description' | translate }}\n    </label>\n    <textarea\n      aui-input\n      name=\"description\"\n      [(ngModel)]=\"description\"\n    ></textarea>\n  </aui-form-item>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"confirming$$ | async\"\n    [disabled]=\"confirming$$ | async\"\n    (click)=\"confirm()\"\n  >\n    {{ 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "directive", type: i1.DialogCloseDirective, selector: "[auiDialogClose]", inputs: ["auiDialogClose"], exportAs: ["auiDialogClose"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: i2$1.K8sNamePipe, name: "aclName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateDescriptionDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: UpdateDescriptionDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header>\n  {{ 'update_description' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-form-item>\n    <label auiFormItemLabel>\n      {{ 'name' | translate }}\n    </label>\n    {{ data.resource | aclName }}\n  </aui-form-item>\n  <aui-form-item class=\"last-form-item-no-margin\">\n    <label auiFormItemLabel>\n      {{ 'description' | translate }}\n    </label>\n    <textarea\n      aui-input\n      name=\"description\"\n      [(ngModel)]=\"description\"\n    ></textarea>\n  </aui-form-item>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"confirming$$ | async\"\n    [disabled]=\"confirming$$ | async\"\n    (click)=\"confirm()\"\n  >\n    {{ 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "directive", type: i1.DialogCloseDirective, selector: "[auiDialogClose]", inputs: ["auiDialogClose"], exportAs: ["auiDialogClose"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: i3.K8sNamePipe, name: "aclName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateDescriptionDialogComponent, decorators: [{
             type: Component,
@@ -10964,10 +11288,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         TranslatePipe,
                         K8S_UTIL_PIPES_MODULE,
                     ], template: "<aui-dialog-header>\n  {{ 'update_description' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-form-item>\n    <label auiFormItemLabel>\n      {{ 'name' | translate }}\n    </label>\n    {{ data.resource | aclName }}\n  </aui-form-item>\n  <aui-form-item class=\"last-form-item-no-margin\">\n    <label auiFormItemLabel>\n      {{ 'description' | translate }}\n    </label>\n    <textarea\n      aui-input\n      name=\"description\"\n      [(ngModel)]=\"description\"\n    ></textarea>\n  </aui-form-item>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"confirming$$ | async\"\n    [disabled]=\"confirming$$ | async\"\n    (click)=\"confirm()\"\n  >\n    {{ 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n" }]
-        }], ctorParameters: () => [{ type: i1.DialogRef }, { type: i2$1.K8sApiService }, { type: i2$1.K8sUtilService }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DIALOG_DATA]
-                }] }] });
+        }] });
 
 class UpdateDisplayNameDialogComponent {
     constructor() {
@@ -10997,7 +11318,7 @@ class UpdateDisplayNameDialogComponent {
             .subscribe(resource => this.dialogRef.close(resource));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateDisplayNameDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: UpdateDisplayNameDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header>\n  {{ 'update_display_name' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-form-item>\n    <label auiFormItemLabel>\n      {{ 'name' | translate }}\n    </label>\n    {{ data.resource | aclName }}\n  </aui-form-item>\n  <aui-form-item class=\"last-form-item-no-margin\">\n    <label auiFormItemLabel>\n      {{ 'display_name' | translate }}\n    </label>\n    @if (!data.validateMaxLength) {\n      <input\n        aui-input\n        name=\"displayName\"\n        autocomplete=\"off\"\n        [(ngModel)]=\"displayName\"\n      />\n    } @else {\n      <input\n        aui-input\n        name=\"displayName\"\n        autocomplete=\"off\"\n        [(ngModel)]=\"displayName\"\n        [maxlength]=\"64\"\n      />\n    }\n  </aui-form-item>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"confirming$$ | async\"\n    [disabled]=\"confirming$$ | async\"\n    (click)=\"confirm()\"\n  >\n    {{ 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "directive", type: i1.DialogCloseDirective, selector: "[auiDialogClose]", inputs: ["auiDialogClose"], exportAs: ["auiDialogClose"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2$1.K8sNamePipe, name: "aclName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: UpdateDisplayNameDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header>\n  {{ 'update_display_name' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-form-item>\n    <label auiFormItemLabel>\n      {{ 'name' | translate }}\n    </label>\n    {{ data.resource | aclName }}\n  </aui-form-item>\n  <aui-form-item class=\"last-form-item-no-margin\">\n    <label auiFormItemLabel>\n      {{ 'display_name' | translate }}\n    </label>\n    @if (!data.validateMaxLength) {\n      <input\n        aui-input\n        name=\"displayName\"\n        autocomplete=\"off\"\n        [(ngModel)]=\"displayName\"\n      />\n    } @else {\n      <input\n        aui-input\n        name=\"displayName\"\n        autocomplete=\"off\"\n        [(ngModel)]=\"displayName\"\n        [maxlength]=\"64\"\n      />\n    }\n  </aui-form-item>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"confirming$$ | async\"\n    [disabled]=\"confirming$$ | async\"\n    (click)=\"confirm()\"\n  >\n    {{ 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "directive", type: i1.DialogCloseDirective, selector: "[auiDialogClose]", inputs: ["auiDialogClose"], exportAs: ["auiDialogClose"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i1.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i1.FormItemComponent, selector: "aui-form-item", inputs: ["labelWidth", "width", "labelPosition", "emptyAddon", "plain"] }, { kind: "directive", type: i1.FormItemLabelDirective, selector: "label[auiFormItemLabel]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i3.K8sNamePipe, name: "aclName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateDisplayNameDialogComponent, decorators: [{
             type: Component,
@@ -11263,7 +11584,7 @@ class ArrayFormTableComponent {
         this.destroy$$.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ArrayFormTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ArrayFormTableComponent, isStandalone: true, selector: "acl-array-form-table", inputs: { rowSeparator: "rowSeparator", rows: "rows", resourceName: "resourceName", resourceNameTranslated: "resourceNameTranslated", readonly: "readonly", addDisabled: "addDisabled", actionColumnDivider: "actionColumnDivider", showZeroState: "showZeroState", showRowError: "showRowError", rowBackgroundColorFn: "rowBackgroundColorFn", minRow: "minRow", minRowTooltip: "minRowTooltip", maxRow: "maxRow", maxRowTooltip: "maxRowTooltip" }, outputs: { add: "add", remove: "remove" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ArrayFormTableHeaderDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "rowErrorTemplate", first: true, predicate: ArrayFormTableRowErrorDirective, descendants: true, read: TemplateRef }, { propertyName: "rowControlTemplate", first: true, predicate: ArrayFormTableRowControlDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "footerTemplate", first: true, predicate: ArrayFormTableFooterDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "zeroStateTemplate", first: true, predicate: ArrayFormTableZeroStateDirective, descendants: true, read: TemplateRef }, { propertyName: "separatorTemplate", first: true, predicate: ArrayFormTableRowSeparatorDirective, descendants: true, read: TemplateRef }, { propertyName: "ngFormGroupDirective", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "rowTemplates", predicate: ArrayFormTableRowDirective, read: TemplateRef }], ngImport: i0, template: "<table\n  class=\"acl-array-form-table\"\n  [class.acl-array-form-table__readonly-mode]=\"readonly\"\n>\n  @if (headerTemplate) {\n    <thead>\n      <tr>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n        @if (!readonly && minRow !== maxRow) {\n          <th class=\"acl-array-form-table__action-col\"></th>\n        }\n      </tr>\n    </thead>\n  }\n  <tbody>\n    @for (row of rows; track row; let index = $index) {\n      @for (\n        rowTemplate of rowTemplates;\n        track rowTemplate;\n        let templateIndex = $index\n      ) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [attr.rowtemplateindex]=\"templateIndex\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n          @if (templateIndex === 0 && !readonly && minRow !== maxRow) {\n            <td\n              class=\"acl-array-form-table__action-col\"\n              [class.acl-array-form-table__action-col-divider]=\"\n                actionColumnDivider\n              \"\n            >\n              @if (rowControlTemplate) {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    rowControlTemplate;\n                    context: { $implicit: row, index: index }\n                  \"\n                ></ng-container>\n              }\n              <div\n                [auiTooltip]=\"minRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length > minRow || !minRowTooltip\"\n              >\n                @if (!rowControlTemplate) {\n                  <button\n                    aui-button=\"text\"\n                    type=\"button\"\n                    [disabled]=\"rows?.length <= minRow\"\n                    [square]=\"true\"\n                    [plain]=\"true\"\n                    (click)=\"remove.emit(index)\"\n                  >\n                    <aui-icon icon=\"minus_circle\"></aui-icon>\n                  </button>\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      }\n      @if (rowErrorTemplate && !readonly) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [hidden]=\"!(row | pure: shouldShowRowError | async)\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowErrorTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n        </tr>\n      }\n      @if (\n        (rowSeparator || separatorTemplate) &&\n        rows?.length > 1 &&\n        index !== rows?.length - 1\n      ) {\n        <tr class=\"acl-array-form-table__separator\">\n          <td colspan=\"100\">\n            @if (separatorTemplate) {\n              <ng-container\n                *ngTemplateOutlet=\"separatorTemplate\"\n              ></ng-container>\n            } @else {\n              <div class=\"tw-h-[8px]\"></div>\n            }\n          </td>\n        </tr>\n      }\n    }\n\n    @if ((!rows || rows.length === 0) && showZeroState) {\n      <tr>\n        <td\n          colspan=\"100\"\n          style=\"padding: unset\"\n        >\n          @if (!zeroStateTemplate) {\n            <acl-zero-state\n              [zeroState]=\"true\"\n              [resourceName]=\"resourceName\"\n              [resourceNameTranslated]=\"resourceNameTranslated\"\n              [minHeight]=\"48\"\n            ></acl-zero-state>\n          }\n          @if (zeroStateTemplate) {\n            <ng-container *ngTemplateOutlet=\"zeroStateTemplate\"></ng-container>\n          }\n        </td>\n      </tr>\n    }\n\n    @if (!readonly && minRow !== maxRow) {\n      <tr class=\"acl-array-form-table--row-action\">\n        <td colspan=\"100\">\n          <div class=\"acl-array-form-table__bottom-control-buttons\">\n            @if (footerTemplate) {\n              <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            }\n            @if (!footerTemplate) {\n              <div\n                class=\"tw-flex tw-w-full\"\n                [auiTooltip]=\"maxRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length < maxRow || !maxRowTooltip\"\n              >\n                <button\n                  aui-button=\"primary\"\n                  type=\"button\"\n                  [plain]=\"true\"\n                  size=\"mini\"\n                  (click)=\"add.emit()\"\n                  [disabled]=\"rows?.length >= maxRow || addDisabled\"\n                >\n                  <aui-icon icon=\"plus_circle\"></aui-icon>\n                  {{ 'add' | translate }}\n                </button>\n              </div>\n            }\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: ZeroStateComponent, selector: "acl-zero-state", inputs: ["resourceName", "resourceNameTranslated", "customPlaceholder", "zeroState", "fetching", "context", "minHeight"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ArrayFormTableComponent, isStandalone: true, selector: "acl-array-form-table", inputs: { rowSeparator: "rowSeparator", rows: "rows", resourceName: "resourceName", resourceNameTranslated: "resourceNameTranslated", readonly: "readonly", addDisabled: "addDisabled", actionColumnDivider: "actionColumnDivider", showZeroState: "showZeroState", showRowError: "showRowError", rowBackgroundColorFn: "rowBackgroundColorFn", minRow: "minRow", minRowTooltip: "minRowTooltip", maxRow: "maxRow", maxRowTooltip: "maxRowTooltip" }, outputs: { add: "add", remove: "remove" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ArrayFormTableHeaderDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "rowErrorTemplate", first: true, predicate: ArrayFormTableRowErrorDirective, descendants: true, read: TemplateRef }, { propertyName: "rowControlTemplate", first: true, predicate: ArrayFormTableRowControlDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "footerTemplate", first: true, predicate: ArrayFormTableFooterDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "zeroStateTemplate", first: true, predicate: ArrayFormTableZeroStateDirective, descendants: true, read: TemplateRef }, { propertyName: "separatorTemplate", first: true, predicate: ArrayFormTableRowSeparatorDirective, descendants: true, read: TemplateRef }, { propertyName: "ngFormGroupDirective", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "rowTemplates", predicate: ArrayFormTableRowDirective, read: TemplateRef }], ngImport: i0, template: "<table\n  class=\"acl-array-form-table\"\n  [class.acl-array-form-table__readonly-mode]=\"readonly\"\n>\n  @if (headerTemplate) {\n    <thead>\n      <tr>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n        @if (!readonly && minRow !== maxRow) {\n          <th class=\"acl-array-form-table__action-col\"></th>\n        }\n      </tr>\n    </thead>\n  }\n  <tbody>\n    @for (row of rows; track row; let index = $index) {\n      @for (\n        rowTemplate of rowTemplates;\n        track rowTemplate;\n        let templateIndex = $index\n      ) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [attr.rowtemplateindex]=\"templateIndex\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n          @if (templateIndex === 0 && !readonly && minRow !== maxRow) {\n            <td\n              class=\"acl-array-form-table__action-col\"\n              [class.acl-array-form-table__action-col-divider]=\"\n                actionColumnDivider\n              \"\n            >\n              @if (rowControlTemplate) {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    rowControlTemplate;\n                    context: { $implicit: row, index: index }\n                  \"\n                ></ng-container>\n              }\n              <div\n                [auiTooltip]=\"minRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length > minRow || !minRowTooltip\"\n              >\n                @if (!rowControlTemplate) {\n                  <button\n                    aui-button=\"text\"\n                    type=\"button\"\n                    [disabled]=\"rows?.length <= minRow\"\n                    [square]=\"true\"\n                    [plain]=\"true\"\n                    (click)=\"remove.emit(index)\"\n                  >\n                    <aui-icon icon=\"minus_circle\"></aui-icon>\n                  </button>\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      }\n      @if (rowErrorTemplate && !readonly) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [hidden]=\"!(row | pure: shouldShowRowError | async)\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowErrorTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n        </tr>\n      }\n      @if (\n        (rowSeparator || separatorTemplate) &&\n        rows?.length > 1 &&\n        index !== rows?.length - 1\n      ) {\n        <tr class=\"acl-array-form-table__separator\">\n          <td colspan=\"100\">\n            @if (separatorTemplate) {\n              <ng-container\n                *ngTemplateOutlet=\"separatorTemplate\"\n              ></ng-container>\n            } @else {\n              <div class=\"separator-spacer\"></div>\n            }\n          </td>\n        </tr>\n      }\n    }\n\n    @if ((!rows || rows.length === 0) && showZeroState) {\n      <tr>\n        <td\n          colspan=\"100\"\n          style=\"padding: unset\"\n        >\n          @if (!zeroStateTemplate) {\n            <acl-zero-state\n              [zeroState]=\"true\"\n              [resourceName]=\"resourceName\"\n              [resourceNameTranslated]=\"resourceNameTranslated\"\n              [minHeight]=\"48\"\n            ></acl-zero-state>\n          }\n          @if (zeroStateTemplate) {\n            <ng-container *ngTemplateOutlet=\"zeroStateTemplate\"></ng-container>\n          }\n        </td>\n      </tr>\n    }\n\n    @if (!readonly && minRow !== maxRow) {\n      <tr class=\"acl-array-form-table--row-action\">\n        <td colspan=\"100\">\n          <div class=\"acl-array-form-table__bottom-control-buttons\">\n            @if (footerTemplate) {\n              <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            }\n            @if (!footerTemplate) {\n              <div\n                class=\"add-button-wrapper\"\n                [auiTooltip]=\"maxRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length < maxRow || !maxRowTooltip\"\n              >\n                <button\n                  aui-button=\"primary\"\n                  type=\"button\"\n                  [plain]=\"true\"\n                  size=\"mini\"\n                  (click)=\"add.emit()\"\n                  [disabled]=\"rows?.length >= maxRow || addDisabled\"\n                >\n                  <aui-icon icon=\"plus_circle\"></aui-icon>\n                  {{ 'add' | translate }}\n                </button>\n              </div>\n            }\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n", styles: [":host::ng-deep .acl-array-form-table{flex:1;width:100%;border-spacing:0;border:12px solid rgb(var(--aui-color-n-9));border-radius:var(--aui-border-radius-l);border-collapse:unset}:host::ng-deep .acl-array-form-table thead{background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table thead th,:host::ng-deep .acl-array-form-table thead td{line-height:20px;color:rgb(var(--aui-color-n-1));text-align:left;font-weight:500;padding:0 0 12px 8px}:host::ng-deep .acl-array-form-table thead th[required]:before,:host::ng-deep .acl-array-form-table thead td[required]:before{content:\"*\";color:rgb(var(--aui-color-red));margin-right:4px}:host::ng-deep .acl-array-form-table tbody>tr{background-color:rgb(var(--aui-color-n-10));border-radius:2px}:host::ng-deep .acl-array-form-table tbody>tr:first-child>td{border-top:unset}:host::ng-deep .acl-array-form-table tbody td{padding:8px 0 8px 8px;vertical-align:middle}:host::ng-deep .acl-array-form-table tbody td:last-child{padding:8px}:host::ng-deep .acl-array-form-table tr.acl-array-form-table__row-error:not(:has(+.acl-array-form-table__row-error:empty)){background-color:rgb(var(--aui-color-r-6))}:host::ng-deep .acl-array-form-table tr.acl-array-form-table--row-action td{padding:unset;border-bottom:unset;padding-bottom:unset;border-top:8px solid rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table tr.acl-array-form-table__separator td{padding:0;background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table th.acl-array-form-table__action-col{min-width:48px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col{padding:8px;text-align:center;white-space:nowrap;vertical-align:middle;width:24px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .aui-button--text.isPlain{font-size:16px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .action-col__vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}:host::ng-deep .acl-array-form-table tbody td.acl-table-form-error-hint{margin-top:-4px;border-top:none;padding-top:0;color:rgb(var(--aui-color-red));font-size:12px}:host::ng-deep .acl-array-form-table tbody td.acl-table-form-error-hint acl-errors-mapper .acl-error-hint{margin-top:0}:host::ng-deep .acl-array-form-table__bottom-control-buttons{display:flex;width:100%;background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button{flex:1}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button--default{color:rgb(var(--aui-color-secondary-text))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]){background-color:rgb(var(--aui-color-n-10))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]):hover{background-color:rgb(var(--aui-color-p-6))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]):active{background-color:rgb(var(--aui-color-p-5))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button.aui-button--primary.isPlain[disabled]{background-color:rgb(var(--aui-color-n-8));color:rgb(var(--aui-color-n-6))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button{border-style:unset;font-size:14px;height:28px;border-radius:2px}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button aui-icon{font-size:16px}:host::ng-deep .acl-array-form-table__readonly-mode{border-radius:var(--aui-border-radius-l);border-collapse:separate}:host::ng-deep .acl-array-form-table__readonly-mode th .aui-checkbox,:host::ng-deep .acl-array-form-table__readonly-mode td .aui-checkbox{margin:unset}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td{padding:0 10px 12px;border-top:none}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th:first-child,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td:first-child{padding-left:20px}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th:last-child,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td:last-child{padding-right:20px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr{height:58px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td{padding:15px 10px;border:1px solid rgb(var(--aui-color-n-8));border-bottom-width:0}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:not(:last-child){border-right:none}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:not(:first-child){border-left:none}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:first-child{padding-left:19px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:last-child{padding:15px 19px 15px 10px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td{border-bottom-width:1px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td:first-child{border-bottom-left-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td:last-child{border-bottom-right-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td{border-top:1px solid rgb(var(--aui-color-n-8))}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td:first-child{border-top-left-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td:last-child{border-top-right-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__action-col-divider{border-left:1px solid rgb(var(--aui-color-n-8))}.separator-spacer{height:8px}.add-button-wrapper{display:flex;width:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "component", type: ZeroStateComponent, selector: "acl-zero-state", inputs: ["resourceName", "resourceNameTranslated", "customPlaceholder", "zeroState", "fetching", "context", "minHeight"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "directive", type: E2eAttributeBindingDirective, selector: "[click],[routerLink],a[href],[auiTooltip],[auiDropdown]" }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ArrayFormTableComponent, decorators: [{
             type: Component,
@@ -11277,7 +11598,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         AsyncPipe,
                         TranslatePipe,
                         EFFECT_DIRECTIVE_MODULE,
-                    ], standalone: true, template: "<table\n  class=\"acl-array-form-table\"\n  [class.acl-array-form-table__readonly-mode]=\"readonly\"\n>\n  @if (headerTemplate) {\n    <thead>\n      <tr>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n        @if (!readonly && minRow !== maxRow) {\n          <th class=\"acl-array-form-table__action-col\"></th>\n        }\n      </tr>\n    </thead>\n  }\n  <tbody>\n    @for (row of rows; track row; let index = $index) {\n      @for (\n        rowTemplate of rowTemplates;\n        track rowTemplate;\n        let templateIndex = $index\n      ) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [attr.rowtemplateindex]=\"templateIndex\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n          @if (templateIndex === 0 && !readonly && minRow !== maxRow) {\n            <td\n              class=\"acl-array-form-table__action-col\"\n              [class.acl-array-form-table__action-col-divider]=\"\n                actionColumnDivider\n              \"\n            >\n              @if (rowControlTemplate) {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    rowControlTemplate;\n                    context: { $implicit: row, index: index }\n                  \"\n                ></ng-container>\n              }\n              <div\n                [auiTooltip]=\"minRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length > minRow || !minRowTooltip\"\n              >\n                @if (!rowControlTemplate) {\n                  <button\n                    aui-button=\"text\"\n                    type=\"button\"\n                    [disabled]=\"rows?.length <= minRow\"\n                    [square]=\"true\"\n                    [plain]=\"true\"\n                    (click)=\"remove.emit(index)\"\n                  >\n                    <aui-icon icon=\"minus_circle\"></aui-icon>\n                  </button>\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      }\n      @if (rowErrorTemplate && !readonly) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [hidden]=\"!(row | pure: shouldShowRowError | async)\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowErrorTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n        </tr>\n      }\n      @if (\n        (rowSeparator || separatorTemplate) &&\n        rows?.length > 1 &&\n        index !== rows?.length - 1\n      ) {\n        <tr class=\"acl-array-form-table__separator\">\n          <td colspan=\"100\">\n            @if (separatorTemplate) {\n              <ng-container\n                *ngTemplateOutlet=\"separatorTemplate\"\n              ></ng-container>\n            } @else {\n              <div class=\"tw-h-[8px]\"></div>\n            }\n          </td>\n        </tr>\n      }\n    }\n\n    @if ((!rows || rows.length === 0) && showZeroState) {\n      <tr>\n        <td\n          colspan=\"100\"\n          style=\"padding: unset\"\n        >\n          @if (!zeroStateTemplate) {\n            <acl-zero-state\n              [zeroState]=\"true\"\n              [resourceName]=\"resourceName\"\n              [resourceNameTranslated]=\"resourceNameTranslated\"\n              [minHeight]=\"48\"\n            ></acl-zero-state>\n          }\n          @if (zeroStateTemplate) {\n            <ng-container *ngTemplateOutlet=\"zeroStateTemplate\"></ng-container>\n          }\n        </td>\n      </tr>\n    }\n\n    @if (!readonly && minRow !== maxRow) {\n      <tr class=\"acl-array-form-table--row-action\">\n        <td colspan=\"100\">\n          <div class=\"acl-array-form-table__bottom-control-buttons\">\n            @if (footerTemplate) {\n              <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            }\n            @if (!footerTemplate) {\n              <div\n                class=\"tw-flex tw-w-full\"\n                [auiTooltip]=\"maxRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length < maxRow || !maxRowTooltip\"\n              >\n                <button\n                  aui-button=\"primary\"\n                  type=\"button\"\n                  [plain]=\"true\"\n                  size=\"mini\"\n                  (click)=\"add.emit()\"\n                  [disabled]=\"rows?.length >= maxRow || addDisabled\"\n                >\n                  <aui-icon icon=\"plus_circle\"></aui-icon>\n                  {{ 'add' | translate }}\n                </button>\n              </div>\n            }\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n" }]
+                    ], standalone: true, template: "<table\n  class=\"acl-array-form-table\"\n  [class.acl-array-form-table__readonly-mode]=\"readonly\"\n>\n  @if (headerTemplate) {\n    <thead>\n      <tr>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n        @if (!readonly && minRow !== maxRow) {\n          <th class=\"acl-array-form-table__action-col\"></th>\n        }\n      </tr>\n    </thead>\n  }\n  <tbody>\n    @for (row of rows; track row; let index = $index) {\n      @for (\n        rowTemplate of rowTemplates;\n        track rowTemplate;\n        let templateIndex = $index\n      ) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [attr.rowtemplateindex]=\"templateIndex\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n          @if (templateIndex === 0 && !readonly && minRow !== maxRow) {\n            <td\n              class=\"acl-array-form-table__action-col\"\n              [class.acl-array-form-table__action-col-divider]=\"\n                actionColumnDivider\n              \"\n            >\n              @if (rowControlTemplate) {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    rowControlTemplate;\n                    context: { $implicit: row, index: index }\n                  \"\n                ></ng-container>\n              }\n              <div\n                [auiTooltip]=\"minRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length > minRow || !minRowTooltip\"\n              >\n                @if (!rowControlTemplate) {\n                  <button\n                    aui-button=\"text\"\n                    type=\"button\"\n                    [disabled]=\"rows?.length <= minRow\"\n                    [square]=\"true\"\n                    [plain]=\"true\"\n                    (click)=\"remove.emit(index)\"\n                  >\n                    <aui-icon icon=\"minus_circle\"></aui-icon>\n                  </button>\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      }\n      @if (rowErrorTemplate && !readonly) {\n        <tr\n          [class.acl-array-form-table__row-error]=\"\n            row | pure: shouldShowRowError | async\n          \"\n          [hidden]=\"!(row | pure: shouldShowRowError | async)\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowErrorTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n        </tr>\n      }\n      @if (\n        (rowSeparator || separatorTemplate) &&\n        rows?.length > 1 &&\n        index !== rows?.length - 1\n      ) {\n        <tr class=\"acl-array-form-table__separator\">\n          <td colspan=\"100\">\n            @if (separatorTemplate) {\n              <ng-container\n                *ngTemplateOutlet=\"separatorTemplate\"\n              ></ng-container>\n            } @else {\n              <div class=\"separator-spacer\"></div>\n            }\n          </td>\n        </tr>\n      }\n    }\n\n    @if ((!rows || rows.length === 0) && showZeroState) {\n      <tr>\n        <td\n          colspan=\"100\"\n          style=\"padding: unset\"\n        >\n          @if (!zeroStateTemplate) {\n            <acl-zero-state\n              [zeroState]=\"true\"\n              [resourceName]=\"resourceName\"\n              [resourceNameTranslated]=\"resourceNameTranslated\"\n              [minHeight]=\"48\"\n            ></acl-zero-state>\n          }\n          @if (zeroStateTemplate) {\n            <ng-container *ngTemplateOutlet=\"zeroStateTemplate\"></ng-container>\n          }\n        </td>\n      </tr>\n    }\n\n    @if (!readonly && minRow !== maxRow) {\n      <tr class=\"acl-array-form-table--row-action\">\n        <td colspan=\"100\">\n          <div class=\"acl-array-form-table__bottom-control-buttons\">\n            @if (footerTemplate) {\n              <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            }\n            @if (!footerTemplate) {\n              <div\n                class=\"add-button-wrapper\"\n                [auiTooltip]=\"maxRowTooltip\"\n                [auiTooltipDisabled]=\"rows?.length < maxRow || !maxRowTooltip\"\n              >\n                <button\n                  aui-button=\"primary\"\n                  type=\"button\"\n                  [plain]=\"true\"\n                  size=\"mini\"\n                  (click)=\"add.emit()\"\n                  [disabled]=\"rows?.length >= maxRow || addDisabled\"\n                >\n                  <aui-icon icon=\"plus_circle\"></aui-icon>\n                  {{ 'add' | translate }}\n                </button>\n              </div>\n            }\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n", styles: [":host::ng-deep .acl-array-form-table{flex:1;width:100%;border-spacing:0;border:12px solid rgb(var(--aui-color-n-9));border-radius:var(--aui-border-radius-l);border-collapse:unset}:host::ng-deep .acl-array-form-table thead{background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table thead th,:host::ng-deep .acl-array-form-table thead td{line-height:20px;color:rgb(var(--aui-color-n-1));text-align:left;font-weight:500;padding:0 0 12px 8px}:host::ng-deep .acl-array-form-table thead th[required]:before,:host::ng-deep .acl-array-form-table thead td[required]:before{content:\"*\";color:rgb(var(--aui-color-red));margin-right:4px}:host::ng-deep .acl-array-form-table tbody>tr{background-color:rgb(var(--aui-color-n-10));border-radius:2px}:host::ng-deep .acl-array-form-table tbody>tr:first-child>td{border-top:unset}:host::ng-deep .acl-array-form-table tbody td{padding:8px 0 8px 8px;vertical-align:middle}:host::ng-deep .acl-array-form-table tbody td:last-child{padding:8px}:host::ng-deep .acl-array-form-table tr.acl-array-form-table__row-error:not(:has(+.acl-array-form-table__row-error:empty)){background-color:rgb(var(--aui-color-r-6))}:host::ng-deep .acl-array-form-table tr.acl-array-form-table--row-action td{padding:unset;border-bottom:unset;padding-bottom:unset;border-top:8px solid rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table tr.acl-array-form-table__separator td{padding:0;background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table th.acl-array-form-table__action-col{min-width:48px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col{padding:8px;text-align:center;white-space:nowrap;vertical-align:middle;width:24px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .aui-button--text.isPlain{font-size:16px}:host::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .action-col__vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}:host::ng-deep .acl-array-form-table tbody td.acl-table-form-error-hint{margin-top:-4px;border-top:none;padding-top:0;color:rgb(var(--aui-color-red));font-size:12px}:host::ng-deep .acl-array-form-table tbody td.acl-table-form-error-hint acl-errors-mapper .acl-error-hint{margin-top:0}:host::ng-deep .acl-array-form-table__bottom-control-buttons{display:flex;width:100%;background-color:rgb(var(--aui-color-n-9))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button{flex:1}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button--default{color:rgb(var(--aui-color-secondary-text))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]){background-color:rgb(var(--aui-color-n-10))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]):hover{background-color:rgb(var(--aui-color-p-6))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button:not([disabled]):active{background-color:rgb(var(--aui-color-p-5))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button.aui-button--primary.isPlain[disabled]{background-color:rgb(var(--aui-color-n-8));color:rgb(var(--aui-color-n-6))}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button{border-style:unset;font-size:14px;height:28px;border-radius:2px}:host::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button aui-icon{font-size:16px}:host::ng-deep .acl-array-form-table__readonly-mode{border-radius:var(--aui-border-radius-l);border-collapse:separate}:host::ng-deep .acl-array-form-table__readonly-mode th .aui-checkbox,:host::ng-deep .acl-array-form-table__readonly-mode td .aui-checkbox{margin:unset}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td{padding:0 10px 12px;border-top:none}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th:first-child,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td:first-child{padding-left:20px}:host::ng-deep .acl-array-form-table__readonly-mode thead tr th:last-child,:host::ng-deep .acl-array-form-table__readonly-mode thead tr td:last-child{padding-right:20px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr{height:58px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td{padding:15px 10px;border:1px solid rgb(var(--aui-color-n-8));border-bottom-width:0}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:not(:last-child){border-right:none}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:not(:first-child){border-left:none}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:first-child{padding-left:19px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr td:last-child{padding:15px 19px 15px 10px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td{border-bottom-width:1px}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td:first-child{border-bottom-left-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:last-child td:last-child{border-bottom-right-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td{border-top:1px solid rgb(var(--aui-color-n-8))}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td:first-child{border-top-left-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__readonly-mode tbody tr:first-child td:last-child{border-top-right-radius:var(--aui-border-radius-l)}:host::ng-deep .acl-array-form-table__action-col-divider{border-left:1px solid rgb(var(--aui-color-n-8))}.separator-spacer{height:8px}.add-button-wrapper{display:flex;width:100%}\n"] }]
         }], propDecorators: { headerTemplate: [{
                 type: ContentChild,
                 args: [ArrayFormTableHeaderDirective, {
@@ -11477,11 +11798,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
             }] } });
 
 class UpdateKeyValueDialogComponent {
-    constructor(dialogRef, message, translate, data = {}) {
-        this.dialogRef = dialogRef;
-        this.message = message;
-        this.translate = translate;
-        this.data = data;
+    constructor() {
+        this.dialogRef = inject(DialogRef);
+        this.message = inject(MessageService);
+        this.translate = inject(TranslateService);
+        this.data = inject(DIALOG_DATA, {
+            optional: true,
+        }) ?? {};
         this.onUpdate$$ = new Subject();
         this.submitting$$ = new BehaviorSubject(false);
         this.destroy$$ = new Subject();
@@ -11520,7 +11843,7 @@ class UpdateKeyValueDialogComponent {
         this.destroy$$.next();
         this.destroy$$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateKeyValueDialogComponent, deps: [{ token: i1.DialogRef }, { token: i1.MessageService }, { token: i2$1.TranslateService }, { token: DIALOG_DATA, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateKeyValueDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: UpdateKeyValueDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header>\n  {{ data.title || 'update' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <form\n    #ngForm=\"ngForm\"\n    (ngSubmit)=\"ngForm.valid && onUpdate$$.next()\"\n  >\n    <acl-key-value-form-table\n      [(ngModel)]=\"keyValues\"\n      [readonlyKeys]=\"data.readonlyKeys\"\n      [validator]=\"data.validator\"\n      [errorMapper]=\"data.errorMapper\"\n      name=\"key-values\"\n    ></acl-key-value-form-table>\n  </form>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"submitting$$ | async\"\n    [disabled]=\"submitting$$ | async\"\n    (click)=\"ngForm.onSubmit(null)\"\n  >\n    {{ data.confirmButton || 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    type=\"button\"\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: i1.DialogFooterComponent, selector: "aui-dialog-footer" }, { kind: "directive", type: i1.DialogCloseDirective, selector: "[auiDialogClose]", inputs: ["auiDialogClose"], exportAs: ["auiDialogClose"] }, { kind: "component", type: KeyValueFormTableComponent, selector: "acl-key-value-form-table", inputs: ["resourceName", "resourceNameTranslated", "multiLineValue", "validator", "errorMapper", "placeholder", "readonly", "textKey", "maxRow", "minRow", "readonlyKeys", "zeroStateTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: UpdateKeyValueDialogComponent, decorators: [{
@@ -11533,12 +11856,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         ButtonComponent,
                         AsyncPipe,
                     ], template: "<aui-dialog-header>\n  {{ data.title || 'update' | translate }}\n</aui-dialog-header>\n<aui-dialog-content>\n  <form\n    #ngForm=\"ngForm\"\n    (ngSubmit)=\"ngForm.valid && onUpdate$$.next()\"\n  >\n    <acl-key-value-form-table\n      [(ngModel)]=\"keyValues\"\n      [readonlyKeys]=\"data.readonlyKeys\"\n      [validator]=\"data.validator\"\n      [errorMapper]=\"data.errorMapper\"\n      name=\"key-values\"\n    ></acl-key-value-form-table>\n  </form>\n</aui-dialog-content>\n<aui-dialog-footer>\n  <button\n    aui-button=\"primary\"\n    [loading]=\"submitting$$ | async\"\n    [disabled]=\"submitting$$ | async\"\n    (click)=\"ngForm.onSubmit(null)\"\n  >\n    {{ data.confirmButton || 'update' | translate }}\n  </button>\n  <button\n    aui-button\n    type=\"button\"\n    auiDialogClose\n  >\n    {{ 'cancel' | translate }}\n  </button>\n</aui-dialog-footer>\n" }]
-        }], ctorParameters: () => [{ type: i1.DialogRef }, { type: i1.MessageService }, { type: i2$1.TranslateService }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [DIALOG_DATA]
-                }] }] });
+        }], ctorParameters: () => [] });
 
 class K8sSharedUtilService extends K8sUtilService {
     constructor() {
@@ -11966,14 +12284,25 @@ class CodeDisplayDialogComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CodeDisplayDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: CodeDisplayDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header [divider]=\"false\">\n  <div [class.ellipsis-dialog-header]=\"data.ellipsis\">\n    <span [class.text-ellipsis]=\"data.ellipsis\">\n      {{ data.title || ('view_yaml' | translate) }}\n    </span>\n    @if (data.extra) {\n      <span class=\"extra\">{{ data.extra }}</span>\n    }\n  </div>\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-code-editor\n    style=\"display: block; height: 65vh\"\n    [ngModel]=\"data.code || ''\"\n    [options]=\"codeEditorOptions\"\n    [actionsConfig]=\"editorActions\"\n  ></aui-code-editor>\n</aui-dialog-content>\n", dependencies: [{ kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "ngmodule", type: CodeEditorModule }, { kind: "component", type: i2$3.CodeEditorComponent, selector: "aui-code-editor", inputs: ["options", "plain", "showLanguageLabel", "value", "originalValue", "actionsConfig", "previewMode", "diffMode", "modelUri"], outputs: ["editorChange", "editorBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: CodeDisplayDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<aui-dialog-header [divider]=\"false\">\n  <div [class.ellipsis-dialog-header]=\"data.ellipsis\">\n    <span [class.text-ellipsis]=\"data.ellipsis\">\n      {{ data.title || ('view_yaml' | translate) }}\n    </span>\n    @if (data.extra) {\n      <span class=\"extra\">{{ data.extra }}</span>\n    }\n  </div>\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-code-editor\n    style=\"display: block; height: 65vh\"\n    [ngModel]=\"data.code || ''\"\n    [options]=\"codeEditorOptions\"\n    [actionsConfig]=\"editorActions\"\n  ></aui-code-editor>\n</aui-dialog-content>\n", dependencies: [{ kind: "component", type: i1.DialogHeaderComponent, selector: "aui-dialog-header", inputs: ["divider", "closeable", "result"] }, { kind: "component", type: i1.DialogContentComponent, selector: "aui-dialog-content" }, { kind: "component", type: CodeEditorComponent, selector: "aui-code-editor", inputs: ["options", "plain", "showLanguageLabel", "value", "originalValue", "actionsConfig", "previewMode", "diffMode", "modelUri"], outputs: ["editorChange", "editorBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: CodeDisplayDialogComponent, decorators: [{
             type: Component,
-            args: [{ preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DIALOG_MODULE, CodeEditorModule, FormsModule, TranslatePipe], template: "<aui-dialog-header [divider]=\"false\">\n  <div [class.ellipsis-dialog-header]=\"data.ellipsis\">\n    <span [class.text-ellipsis]=\"data.ellipsis\">\n      {{ data.title || ('view_yaml' | translate) }}\n    </span>\n    @if (data.extra) {\n      <span class=\"extra\">{{ data.extra }}</span>\n    }\n  </div>\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-code-editor\n    style=\"display: block; height: 65vh\"\n    [ngModel]=\"data.code || ''\"\n    [options]=\"codeEditorOptions\"\n    [actionsConfig]=\"editorActions\"\n  ></aui-code-editor>\n</aui-dialog-content>\n" }]
+            args: [{ preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DIALOG_MODULE, CodeEditorComponent, FormsModule, TranslatePipe], template: "<aui-dialog-header [divider]=\"false\">\n  <div [class.ellipsis-dialog-header]=\"data.ellipsis\">\n    <span [class.text-ellipsis]=\"data.ellipsis\">\n      {{ data.title || ('view_yaml' | translate) }}\n    </span>\n    @if (data.extra) {\n      <span class=\"extra\">{{ data.extra }}</span>\n    }\n  </div>\n</aui-dialog-header>\n<aui-dialog-content>\n  <aui-code-editor\n    style=\"display: block; height: 65vh\"\n    [ngModel]=\"data.code || ''\"\n    [options]=\"codeEditorOptions\"\n    [actionsConfig]=\"editorActions\"\n  ></aui-code-editor>\n</aui-dialog-content>\n" }]
         }], ctorParameters: () => [] });
 
-class ResourceYamlDisplayComponent {
+/**
+ * @packageDocumentation
+ * @module code
+ */
+// for logs
+const logsReadOptions = {
+    wordWrap: 'on',
+    readOnly: true,
+    renderLineHighlight: 'none',
+};
+
+class ResourceYamlDisplayComponent {
     constructor() {
         this.concise$$ = new BehaviorSubject(false);
         this.reduce$$ = new BehaviorSubject(true);
@@ -11996,7 +12325,7 @@ class ResourceYamlDisplayComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResourceYamlDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ResourceYamlDisplayComponent, isStandalone: true, selector: "acl-resource-yaml-display", inputs: { hasWrapper: "hasWrapper", conciseEnable: "conciseEnable", manageFieldActionEnable: "manageFieldActionEnable", resource: "resource" }, ngImport: i0, template: "@if (hasWrapper) {\n  <aui-card>\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </aui-card>\n} @else {\n  <aui-code-editor\n    name=\"yaml\"\n    [ngModel]=\"yaml$ | async\"\n    [options]=\"editorOptions\"\n    [actionsConfig]=\"viewActions\"\n  >\n    <ng-container auiCodeEditorToolbarLeft>\n      @if (conciseEnable) {\n        <aui-checkbox\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"concise$$ | async\"\n          (ngModelChange)=\"conciseChange($event)\"\n        >\n          {{ 'preview_concise_yaml' | translate }}\n        </aui-checkbox>\n      }\n      @if (manageFieldActionEnable) {\n        <aui-checkbox\n          [hidden]=\"concise$$ | async\"\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"reduce$$ | async\"\n          (ngModelChange)=\"reduce$$.next($event)\"\n        >\n          {{ 'hide_manage_fields_field' | translate }}\n        </aui-checkbox>\n      }\n    </ng-container>\n  </aui-code-editor>\n}\n<ng-template #content>\n  <aui-code-editor\n    name=\"yaml\"\n    [ngModel]=\"yaml$ | async\"\n    [options]=\"editorOptions\"\n    [actionsConfig]=\"viewActions\"\n  >\n    <ng-container auiCodeEditorToolbarLeft>\n      @if (conciseEnable) {\n        <aui-checkbox\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"concise$$ | async\"\n          (ngModelChange)=\"conciseChange($event)\"\n        >\n          {{ 'preview_concise_yaml' | translate }}\n        </aui-checkbox>\n      }\n      @if (manageFieldActionEnable) {\n        <aui-checkbox\n          [hidden]=\"concise$$ | async\"\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"reduce$$ | async\"\n          (ngModelChange)=\"reduce$$.next($event)\"\n        >\n          {{ 'hide_manage_fields_field' | translate }}\n        </aui-checkbox>\n      }\n    </ng-container>\n  </aui-code-editor>\n</ng-template>\n", styles: [":host(:not(.dialog-content)) ::ng-deep .aui-code-editor{min-height:100%}:host(:not(.dialog-content)){display:block;height:calc(100vh - (var(--acl-page-header-height) + 44px) - 147px)}:host(:not(.dialog-content))>.aui-card{height:100%}:host(:not(.dialog-content))>.aui-card .aui-card__content,:host(:not(.dialog-content))>.aui-card aui-code-editor,:host(:not(.dialog-content))>.aui-card .aui-code-editor{height:100%;min-height:100%}:host{display:block}:host ::ng-deep aui-card,:host ::ng-deep .aui-card,:host ::ng-deep .aui-card__content{height:100%}:host ::ng-deep .aui-checkbox{margin-right:0}:host aui-code-editor{height:100%}\n"], dependencies: [{ kind: "component", type: i1.CardComponent, selector: "aui-card", inputs: ["divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1.CheckboxComponent, selector: "aui-checkbox", inputs: ["name", "type", "label", "indeterminate"] }, { kind: "ngmodule", type: CodeEditorModule }, { kind: "component", type: i2$3.CodeEditorComponent, selector: "aui-code-editor", inputs: ["options", "plain", "showLanguageLabel", "value", "originalValue", "actionsConfig", "previewMode", "diffMode", "modelUri"], outputs: ["editorChange", "editorBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ResourceYamlDisplayComponent, isStandalone: true, selector: "acl-resource-yaml-display", inputs: { hasWrapper: "hasWrapper", conciseEnable: "conciseEnable", manageFieldActionEnable: "manageFieldActionEnable", resource: "resource" }, ngImport: i0, template: "@if (hasWrapper) {\n  <aui-card>\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </aui-card>\n} @else {\n  <aui-code-editor\n    name=\"yaml\"\n    [ngModel]=\"yaml$ | async\"\n    [options]=\"editorOptions\"\n    [actionsConfig]=\"viewActions\"\n  >\n    <ng-container auiCodeEditorToolbarLeft>\n      @if (conciseEnable) {\n        <aui-checkbox\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"concise$$ | async\"\n          (ngModelChange)=\"conciseChange($event)\"\n        >\n          {{ 'preview_concise_yaml' | translate }}\n        </aui-checkbox>\n      }\n      @if (manageFieldActionEnable) {\n        <aui-checkbox\n          [hidden]=\"concise$$ | async\"\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"reduce$$ | async\"\n          (ngModelChange)=\"reduce$$.next($event)\"\n        >\n          {{ 'hide_manage_fields_field' | translate }}\n        </aui-checkbox>\n      }\n    </ng-container>\n  </aui-code-editor>\n}\n<ng-template #content>\n  <aui-code-editor\n    name=\"yaml\"\n    [ngModel]=\"yaml$ | async\"\n    [options]=\"editorOptions\"\n    [actionsConfig]=\"viewActions\"\n  >\n    <ng-container auiCodeEditorToolbarLeft>\n      @if (conciseEnable) {\n        <aui-checkbox\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"concise$$ | async\"\n          (ngModelChange)=\"conciseChange($event)\"\n        >\n          {{ 'preview_concise_yaml' | translate }}\n        </aui-checkbox>\n      }\n      @if (manageFieldActionEnable) {\n        <aui-checkbox\n          [hidden]=\"concise$$ | async\"\n          class=\"aui-code-editor-toolbar__control-button\"\n          [ngModel]=\"reduce$$ | async\"\n          (ngModelChange)=\"reduce$$.next($event)\"\n        >\n          {{ 'hide_manage_fields_field' | translate }}\n        </aui-checkbox>\n      }\n    </ng-container>\n  </aui-code-editor>\n</ng-template>\n", styles: [":host(:not(.dialog-content)) ::ng-deep .aui-code-editor{min-height:100%}:host(:not(.dialog-content)){display:block;height:calc(100vh - (var(--acl-page-header-height) + 44px) - 147px)}:host(:not(.dialog-content))>.aui-card{height:100%}:host(:not(.dialog-content))>.aui-card .aui-card__content,:host(:not(.dialog-content))>.aui-card aui-code-editor,:host(:not(.dialog-content))>.aui-card .aui-code-editor{height:100%;min-height:100%}:host{display:block}:host ::ng-deep aui-card,:host ::ng-deep .aui-card,:host ::ng-deep .aui-card__content{height:100%}:host ::ng-deep .aui-checkbox{margin-right:0}:host aui-code-editor{height:100%}\n"], dependencies: [{ kind: "component", type: i1.CardComponent, selector: "aui-card", inputs: ["divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1.CheckboxComponent, selector: "aui-checkbox", inputs: ["name", "type", "label", "indeterminate"] }, { kind: "component", type: CodeEditorComponent, selector: "aui-code-editor", inputs: ["options", "plain", "showLanguageLabel", "value", "originalValue", "actionsConfig", "previewMode", "diffMode", "modelUri"], outputs: ["editorChange", "editorBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     ObservableInput(),
@@ -12008,7 +12337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                         CARD_MODULE,
                         FormsModule,
                         CHECKBOX_MODULE,
-                        CodeEditorModule,
+                        CodeEditorComponent,
                         TranslatePipe,
                         AsyncPipe,
                         NgTemplateOutlet,
@@ -12023,10 +12352,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
                 type: Input
             }], resource$: [] } });
 
-/**
- * @packageDocumentation
- * @module code
- */
 class K8sYamlDisplayDialogComponent {
     constructor() {
         this.data = inject(DIALOG_DATA);
@@ -12039,6 +12364,1114 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
             args: [{ preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [DIALOG_MODULE, TranslatePipe, ResourceYamlDisplayComponent], template: "<aui-dialog-header [divider]=\"false\">\n  <div [class.ellipsis-dialog-header]=\"data.ellipsis\">\n    <span [class.text-ellipsis]=\"data.ellipsis\">\n      {{ data.title || ('view_yaml' | translate) }}\n    </span>\n    @if (data.extra) {\n      <span class=\"extra\">{{ data.extra }}</span>\n    }\n  </div>\n</aui-dialog-header>\n<aui-dialog-content>\n  <acl-resource-yaml-display\n    [resource]=\"data.resource\"\n    [hasWrapper]=\"false\"\n    class=\"dialog-content\"\n  ></acl-resource-yaml-display>\n</aui-dialog-content>\n" }]
         }] });
 
+/**
+ * 自动折叠 managedFields 字段
+ * @param monacoEditor Monaco 编辑器实例
+ */
+function foldManagedFields(monacoEditor) {
+    if (!monacoEditor) {
+        return;
+    }
+    const model = monacoEditor.getModel();
+    if (!model) {
+        return;
+    }
+    try {
+        // 查找所有 managedFields 字段（只在 metadata 下的）
+        const managedFieldsMatches = model.findMatches('^(\\s+)managedFields:', false, true, false, null, true);
+        if (managedFieldsMatches && managedFieldsMatches.length > 0) {
+            const foldingRanges = [];
+            for (const match of managedFieldsMatches) {
+                const startLine = match.range.startLineNumber;
+                const endLine = findManagedFieldsEndLine(model, startLine);
+                if (endLine > startLine) {
+                    foldingRanges.push({
+                        startLineNumber: startLine,
+                        startColumn: 1,
+                        endLineNumber: endLine,
+                        endColumn: model.getLineMaxColumn(endLine),
+                    });
+                }
+            }
+            if (foldingRanges.length > 0) {
+                // 递归折叠每个 managedFields 区域，确保每次折叠完成后再进行下一次
+                foldRangesSequentially(monacoEditor, foldingRanges?.reverse(), 0);
+            }
+        }
+    }
+    catch (error) {
+        console.warn('Failed to fold managedFields:', error);
+    }
+}
+/**
+ * 递归折叠多个区域，确保每次折叠完成后再进行下一次
+ * @param monacoEditor Monaco 编辑器实例
+ * @param foldingRanges 折叠区域数组
+ * @param index 当前折叠的索引
+ */
+async function foldRangesSequentially(monacoEditor, foldingRanges, index) {
+    if (index >= foldingRanges.length) {
+        return;
+    }
+    const range = foldingRanges[index];
+    monacoEditor.setSelection(range);
+    await Promise.resolve(monacoEditor.getAction('editor.fold')?.run());
+    return foldRangesSequentially(monacoEditor, foldingRanges, index + 1);
+}
+/**
+ * 查找 managedFields 字段的结束行
+ * @param model Monaco 编辑器模型
+ * @param startLine 起始行号
+ * @returns 结束行号
+ */
+function findManagedFieldsEndLine(model, startLine) {
+    const totalLines = model.getLineCount();
+    const startIndent = getLineIndentation(model, startLine);
+    // 从下一行开始查找
+    for (let line = startLine + 1; line <= totalLines; line++) {
+        const lineContent = model.getLineContent(line).trim();
+        // 跳过空行
+        if (!lineContent) {
+            continue;
+        }
+        const currentIndent = getLineIndentation(model, line);
+        // 如果缩进小于等于起始行，说明 managedFields 字段结束
+        if (currentIndent <= startIndent) {
+            return line - 1;
+        }
+    }
+    return totalLines;
+}
+/**
+ * 获取行的缩进级别
+ * @param model Monaco 编辑器模型
+ * @param lineNumber 行号
+ * @returns 缩进级别（空格数）
+ */
+function getLineIndentation(model, lineNumber) {
+    const lineContent = model.getLineContent(lineNumber);
+    const match = lineContent.match(/^(\s*)/);
+    return match ? match[1].length : 0;
+}
+/**
+ * ManagedFields 自动折叠器
+ * 用于在内容变化时自动折叠 managedFields 字段
+ */
+class ManagedFieldsAutoFolder {
+    constructor() {
+        this.lastFoldedContent = '';
+    }
+    /**
+     * 开始监听内容变化并自动折叠
+     * @param editorProvider 编辑器实例提供者
+     * @param contentObservable 内容变化的 Observable
+     */
+    startAutoFold(editorProvider, contentObservable) {
+        this.stopAutoFold();
+        this.subscription = contentObservable.subscribe(() => {
+            setTimeout(() => {
+                const editor = editorProvider.getEditorInstance();
+                if (editor) {
+                    const model = editor.getModel();
+                    if (model) {
+                        const currentContent = model.getValue();
+                        // 只有当内容真正发生变化时才执行折叠
+                        if (currentContent.includes('managedFields:') &&
+                            currentContent !== this.lastFoldedContent) {
+                            foldManagedFields(editor);
+                            this.lastFoldedContent = currentContent;
+                        }
+                    }
+                }
+            }, 100);
+        });
+    }
+    /**
+     * 停止自动折叠
+     */
+    stopAutoFold() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+            this.subscription = undefined;
+        }
+    }
+    /**
+     * 手动执行一次折叠
+     * @param editorProvider 编辑器实例提供者
+     */
+    foldOnce(editorProvider) {
+        const editor = editorProvider.getEditorInstance();
+        if (editor) {
+            foldManagedFields(editor);
+            const model = editor.getModel();
+            if (model) {
+                this.lastFoldedContent = model.getValue();
+            }
+        }
+    }
+}
+
+/**
+ * Kubernetes 资源的内置 YAML 示例
+ * 按照 apiVersion.kind 的格式组织
+ */
+const BUILT_IN_YAML_EXAMPLES = {
+    'apps/v1.Deployment': [
+        {
+            title: 'Basic Deployment',
+            description: 'A basic deployment example with nginx container',
+            yaml: `apiVersion: apps/v1
+kind: Deployment
+metadata:
+  labels:
+    app: nginx
+  name: nginx-deployment
+  namespace: ''
+spec:
+  selector:
+    matchLabels:
+      app: nginx
+  template:
+    metadata:
+      labels:
+        app: nginx
+    spec:
+      containers:
+        - image: nginx:1.7.9
+          name: nginx
+          ports:
+            - containerPort: 80
+          securityContext:
+            allowPrivilegeEscalation: false
+            capabilities:
+              drop:
+                - ALL
+            runAsNonRoot: true
+            seccompProfile:
+              type: RuntimeDefault
+      securityContext:
+        runAsNonRoot: true
+        seccompProfile:
+          type: RuntimeDefault`,
+        },
+    ],
+    'v1.ConfigMap': [
+        {
+            title: 'Basic ConfigMap',
+            description: 'A basic ConfigMap example with properties and file data',
+            yaml: `apiVersion: v1
+kind: ConfigMap
+metadata:
+  name: example
+  namespace: ''
+data:
+  example.property.1: hello
+  example.property.2: world
+  example.property.file: |-
+    property.1=value-1
+    property.2=value-2
+    property.3=value-3`,
+        },
+    ],
+    'batch/v1.CronJob': [
+        {
+            title: 'Basic CronJob',
+            description: 'A basic CronJob example that runs daily',
+            yaml: `apiVersion: batch/v1
+kind: CronJob
+metadata:
+  name: hello
+spec:
+  jobTemplate:
+    metadata:
+      labels:
+        cronjob.cpaas.io/name: hello
+    spec:
+      template:
+        metadata:
+          labels:
+            cronjob.cpaas.io/name: hello
+        spec:
+          containers:
+            - args:
+                - /bin/sh
+                - -c
+                - date; echo Hello from the Kubernetes cluster
+              image: busybox
+              name: hello
+              securityContext:
+                allowPrivilegeEscalation: false
+                capabilities:
+                  drop:
+                    - ALL
+                runAsNonRoot: true
+                seccompProfile:
+                  type: RuntimeDefault
+          securityContext:
+            runAsNonRoot: true
+            seccompProfile:
+              type: RuntimeDefault
+          restartPolicy: Never
+  schedule: "*/1 * * * *"`,
+        },
+    ],
+    'v1.PersistentVolume': [
+        {
+            title: 'Basic PersistentVolume',
+            description: 'A basic PersistentVolume example with NFS storage',
+            yaml: `apiVersion: v1
+kind: PersistentVolume
+metadata:
+  name: example
+  namespace: ''
+spec:
+  capacity:
+    storage: 5Gi
+  accessModes:
+    - ReadWriteOnce
+  persistentVolumeReclaimPolicy: Retain
+  storageClassName: slow
+  nfs:
+    path: /tmp
+    server: 172.17.0.2`,
+        },
+    ],
+    'autoscaling/v2.HorizontalPodAutoscaler': [
+        {
+            title: 'Basic HorizontalPodAutoscaler',
+            description: 'A basic HPA example with CPU utilization target',
+            yaml: `apiVersion: autoscaling/v2
+kind: HorizontalPodAutoscaler
+metadata:
+  name: example
+  namespace: ''
+spec:
+  scaleTargetRef:
+    apiVersion: apps/v1
+    kind: Deployment
+    name: example
+  minReplicas: 1
+  maxReplicas: 3
+  metrics:
+  - type: Resource
+    resource:
+      name: cpu
+      target:
+        averageUtilization: 50
+        type: Utilization`,
+        },
+    ],
+    'apps/v1.DaemonSet': [
+        {
+            title: 'Basic DaemonSet',
+            description: 'A basic DaemonSet example with nginx container',
+            yaml: `apiVersion: apps/v1
+kind: DaemonSet
+metadata:
+  name: fluentd-elasticsearch
+  namespace: ''
+  labels:
+    k8s-app: fluentd-logging
+spec:
+  selector:
+    matchLabels:
+      name: fluentd-elasticsearch
+  template:
+    metadata:
+      labels:
+        name: fluentd-elasticsearch
+    spec:
+      tolerations:
+      - key: node-role.kubernetes.io/control-plane
+        operator: Exists
+        effect: NoSchedule
+      - key: node-role.kubernetes.io/master
+        operator: Exists
+        effect: NoSchedule
+      containers:
+      - name: fluentd-elasticsearch
+        image: quay.io/fluentd_elasticsearch/fluentd:v2.5.2
+        resources:
+          limits:
+            memory: 200Mi
+          requests:
+            cpu: 100m
+            memory: 200Mi
+        volumeMounts:
+        - name: varlog
+          mountPath: /var/log
+        securityContext:
+          allowPrivilegeEscalation: false
+          capabilities:
+            drop:
+              - ALL
+          runAsNonRoot: true
+          runAsUser: 1000
+          runAsGroup: 1000
+          seccompProfile:
+            type: RuntimeDefault
+      securityContext:
+        runAsNonRoot: true
+        seccompProfile:
+          type: RuntimeDefault
+      terminationGracePeriodSeconds: 30
+      volumes:
+      - name: varlog
+        emptyDir: {}`,
+        },
+    ],
+    'v1.PersistentVolumeClaim': [
+        {
+            title: 'Basic PersistentVolumeClaim',
+            description: 'A basic PVC example requesting 1Gi storage',
+            yaml: `apiVersion: v1
+kind: PersistentVolumeClaim
+metadata:
+  name: example
+  namespace:: ''
+spec:
+  accessModes:
+    - ReadWriteOnce
+  volumeMode: Filesystem
+  resources:
+    requests:
+      storage: 1Gi`,
+        },
+    ],
+    'v1.ResourceQuota': [
+        {
+            title: 'Compute ResourceQuota',
+            description: 'A ResourceQuota example for compute resources',
+            yaml: `apiVersion: v1
+kind: ResourceQuota
+metadata:
+  name: compute-quota
+  namespace: ''
+spec:
+  hard:
+    requests.cpu: '1'
+    requests.memory: 1Gi
+    limits.cpu: '2'
+    limits.memory: 2Gi`,
+        },
+        {
+            title: 'Storage Class ResourceQuota',
+            description: 'A ResourceQuota example for storage class specific quotas',
+            yaml: `apiVersion: v1
+kind: ResourceQuota
+metadata:
+  name: storage-class-quota
+  namespace: ''
+spec:
+  hard:
+    requests.storage: 100Gi
+    persistentvolumeclaims: '100'
+    # For quota specific to a storage class, the storage class must have the same name
+    gold.storage-class.kubernetes.io/requests.storage: 3Gi
+    gold.storage-class.kubernetes.io/persistentvolumeclaims: '5'
+    silver.storage-class.kubernetes.io/requests.storage: 2Gi
+    silver.storage-class.kubernetes.io/persistentvolumeclaims: '3'
+    bronze.storage-class.kubernetes.io/requests.storage: 1Gi
+    bronze.storage-class.kubernetes.io/persistentvolumeclaims: '1'`,
+        },
+        {
+            title: 'Object Counts ResourceQuota',
+            description: 'A ResourceQuota example for object count limits',
+            yaml: `apiVersion: v1
+kind: ResourceQuota
+metadata:
+  name: object-counts
+  namespace: ''
+spec:
+  hard:
+    configmaps: "10"
+    persistentvolumeclaims: "4"
+    replicationcontrollers: "20"
+    secrets: "10"
+    services: "10"
+    services.loadbalancers: "2"`,
+        },
+    ],
+    'v1.LimitRange': [
+        {
+            title: 'Memory LimitRange',
+            description: 'A LimitRange example for container memory limits',
+            yaml: `apiVersion: v1
+kind: LimitRange
+metadata:
+  name: mem-limit-range
+  namespace: ''
+spec:
+  limits:
+  - default:
+      memory: 512Mi
+    defaultRequest:
+      memory: 256Mi
+    type: Container`,
+        },
+    ],
+    'apps/v1.StatefulSet': [
+        {
+            title: 'Basic StatefulSet',
+            description: 'A basic StatefulSet example with persistent storage',
+            yaml: `apiVersion: apps/v1
+kind: StatefulSet
+metadata:
+  name: example
+  namespace: ''
+spec:
+  replicas: 3
+  selector:
+    matchLabels:
+      app: httpd
+  serviceName: httpd
+  template:
+    metadata:
+      labels:
+        app: httpd
+    spec:
+      containers:
+        - image: nginx:1.7.9
+          name: httpd
+          ports:
+            - containerPort: 8080
+              name: web
+          volumeMounts:
+            - mountPath: /var/www/html
+              name: www
+          securityContext:
+            allowPrivilegeEscalation: false
+            capabilities:
+              drop:
+                - ALL
+            runAsNonRoot: true
+            seccompProfile:
+              type: RuntimeDefault
+      securityContext:
+        runAsNonRoot: true
+        seccompProfile:
+          type: RuntimeDefault
+      terminationGracePeriodSeconds: 10
+  volumeClaimTemplates:
+    - metadata:
+        name: www
+      spec:
+        accessModes:
+          - ReadWriteOnce
+        resources:
+          requests:
+            storage: 1Gi`,
+        },
+    ],
+    'storage.k8s.io/v1.StorageClass': [
+        {
+            title: 'Fast StorageClass',
+            description: 'Ceph fast storage class example',
+            yaml: `apiVersion: storage.k8s.io/v1
+kind: StorageClass
+metadata:
+  name: example
+  namespace: ''
+provisioner: my-provisioner
+reclaimPolicy: Delete
+`,
+        },
+    ],
+    'v1.Secret': [
+        {
+            title: 'Basic Secret',
+            description: 'A basic Secret example with username and password',
+            yaml: `apiVersion: v1
+kind: Secret
+metadata:
+  name: example
+  namespace: ''
+type: Opaque
+stringData:
+  username: admin
+  password: opensec`,
+        },
+    ],
+    'app.k8s.io/v1beta1.Application': [
+        {
+            title: 'Basic Application',
+            description: 'A basic Application example with Deployment and Service',
+            yaml: `apiVersion: apps/v1
+kind: Deployment
+metadata:
+  labels:
+    app: nginx
+  name: nginx-deployment
+  namespace: ''
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      app: nginx
+  template:
+    metadata:
+      labels:
+        app: nginx
+    spec:
+      containers:
+        - image: nginx:1.7.9
+          name: nginx
+          ports:
+            - containerPort: 80
+          securityContext:
+            allowPrivilegeEscalation: false
+            capabilities:
+              drop:
+                - ALL
+            runAsNonRoot: true
+            seccompProfile:
+              type: RuntimeDefault
+      securityContext:
+        runAsNonRoot: true
+        seccompProfile:
+          type: RuntimeDefault
+---
+apiVersion: v1
+kind: Service
+metadata:
+  labels:
+    app: nginx
+  name: nginx
+spec:
+  ports:
+    - port: 80
+      protocol: TCP
+      targetPort: 80
+  selector:
+    app: nginx
+  type: ClusterIP`,
+        },
+    ],
+};
+
+class ResourceYamlSidebarComponent {
+    constructor() {
+        this.close = new EventEmitter();
+        this.tryYaml = new EventEmitter();
+        this.schemaEnable = true;
+        this.exampleEnable = true;
+        this.DEFINITIONS_PREFIX = '#/definitions/';
+        this.path = [];
+        this.examples = [];
+        this.hasSchema = false;
+        this.hasExamples = false;
+        this.http = inject(HttpClient);
+        this.cdr = inject(ChangeDetectorRef);
+        this.host = inject((ElementRef));
+    }
+    ngOnInit() {
+        this.refresh();
+        this.loadExamples();
+    }
+    ngOnChanges(changes) {
+        if (changes.schema || changes.resource) {
+            this.refresh();
+            this.loadExamples();
+        }
+    }
+    refresh() {
+        if (this.schema) {
+            this.currentSchema = this.schema;
+            this.currentSchemaDescription = this.schema.description;
+            this.properties = this.schema.properties || {};
+            this.path = [];
+            this.hasSchema = true;
+        }
+        else {
+            this.hasSchema = false;
+        }
+        if (this.resource) {
+            this.resourceKind = this.resource.kind || 'Resource';
+        }
+    }
+    loadExamples() {
+        if (!this.resource) {
+            this.examples = [];
+            this.hasExamples = false;
+            this.cdr.markForCheck();
+            return;
+        }
+        const resourceKey = `${this.resource.apiVersion}.${this.resource.kind}`;
+        const builtInExamples = BUILT_IN_YAML_EXAMPLES[resourceKey] || [];
+        // 加载 ConsoleYAMLSample CRD 中的示例
+        this.loadConsoleYAMLSamples().subscribe({
+            next: crdExamples => {
+                this.examples = [
+                    ...builtInExamples,
+                    ...(this.extraExamples || []),
+                    ...crdExamples,
+                ];
+                this.hasExamples = this.examples.length > 0;
+                this.cdr.markForCheck();
+            },
+            error: () => {
+                // 如果加载 CRD 示例失败，只使用内置示例
+                this.examples = builtInExamples;
+                this.hasExamples = this.examples.length > 0;
+                this.cdr.markForCheck();
+            },
+        });
+    }
+    loadConsoleYAMLSamples() {
+        if (!this.resource) {
+            return of([]);
+        }
+        // 构建查询 ConsoleYAMLSample 的 API 路径
+        const apiPath = '{{API_GATEWAY}}/kubernetes/business-1/apis/console.alauda.io/v1/consoleyamlsamples';
+        return this.http.get(apiPath).pipe(map(response => {
+            return response.items
+                .filter(sample => {
+                const target = sample.spec.targetResource;
+                return (target.apiVersion === this.resource.apiVersion &&
+                    target.kind === this.resource.kind);
+            })
+                .map(sample => ({
+                title: sample.spec.title,
+                description: sample.spec.description,
+                yaml: sample.spec.yaml,
+                snippet: sample.spec.snippet,
+            }));
+        }), catchError(() => of([])));
+    }
+    drillDownToProperty(name) {
+        const property = this.currentSchema.properties?.[name];
+        if (property) {
+            this.currentSchemaDescription = property.description;
+            let targetSchema = null;
+            // 处理 $ref 引用
+            if (property.$ref || property.items?.$ref) {
+                const ref = property.$ref || property.items?.$ref;
+                if (ref.startsWith(this.DEFINITIONS_PREFIX)) {
+                    // const definitionName = ref.replace(this.DEFINITIONS_PREFIX, '');
+                    // 从根 schema 的 definitions 中获取定义
+                    // todo: 书勋
+                    // const rootDefinitions = this.schemaService.definitions;
+                    // targetSchema = rootDefinitions?.[definitionName] || null;
+                }
+            }
+            // 处理普通的嵌套属性
+            else if (property.properties || property.items?.properties) {
+                targetSchema = property.items?.properties ? property.items : property;
+            }
+            if (targetSchema) {
+                this.currentSchema = targetSchema;
+                this.path.push(name);
+                this.properties = targetSchema.properties || {};
+                this.scrollTop();
+            }
+        }
+    }
+    navigateToPath(index) {
+        const targetPath = this.path.slice(0, index + 1);
+        this.path = [...targetPath];
+        let currentObj = this.schema;
+        for (const pathSegment of targetPath) {
+            const property = currentObj.properties?.[pathSegment];
+            if (property) {
+                this.currentSchemaDescription = property.description;
+                // 处理 $ref 引用
+                if (property.$ref || property.items?.$ref) {
+                    const ref = property.$ref || property.items?.$ref;
+                    if (ref.startsWith(this.DEFINITIONS_PREFIX)) {
+                        // const definitionName = ref.replace(this.DEFINITIONS_PREFIX, '');
+                        // todo: 书勋
+                        // const rootDefinitions = this.schemaService.definitions;
+                        // const definition = rootDefinitions?.[definitionName];
+                        // if (definition) {
+                        //   currentObj = definition;
+                        // }
+                    }
+                }
+                // 处理普通的嵌套属性
+                else {
+                    currentObj = property.items?.properties ? property.items : property;
+                }
+            }
+        }
+        this.currentSchema = currentObj;
+        this.properties = currentObj.properties || {};
+    }
+    /**
+     * 检查属性是否有 $ref 引用或嵌套属性
+     */
+    hasViewableContent(property) {
+        return (
+        // 有 properties 的对象
+        (property.type === 'object' &&
+            property.properties &&
+            Object.keys(property.properties).length > 0) ||
+            // 有 properties 的数组项
+            (property.type === 'array' &&
+                property.items &&
+                typeof property.items === 'object' &&
+                property.items.properties &&
+                Object.keys(property.items.properties || {})
+                    .length > 0) ||
+            // 有 $ref 引用
+            !!property.$ref ||
+            !!property?.items?.$ref);
+    }
+    // Examples 相关方法
+    tryExample(example) {
+        // 触发事件，让父组件处理 try it 功能，将 YAML 内容发送给父组件
+        this.tryYaml.emit(example.yaml);
+    }
+    downloadYaml(example) {
+        const blob = new Blob([example.yaml], { type: 'text/yaml' });
+        const url = window.URL.createObjectURL(blob);
+        const link = document.createElement('a');
+        link.href = url;
+        link.download = `${example.title.toLowerCase().replace(/\s+/g, '-')}.yaml`;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        window.URL.revokeObjectURL(url);
+    }
+    // 处理描述中的链接
+    processDescription(description) {
+        if (!description)
+            return '';
+        // 将 URL 转换为可点击的链接
+        const urlRegex = /(https?:\/\/[^\s]+)/g;
+        return description
+            .replace(urlRegex, '<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>')
+            .replace(/\n/g, '<br>'); // 保留换行符
+    }
+    scrollTop() {
+        this.host.nativeElement.scrollTo({
+            top: 0,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResourceYamlSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ResourceYamlSidebarComponent, isStandalone: true, selector: "acl-resource-yaml-sidebar", inputs: { resource: "resource", schema: "schema", schemaEnable: "schemaEnable", exampleEnable: "exampleEnable", extraExamples: "extraExamples" }, outputs: { close: "close", tryYaml: "tryYaml" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"schema-header\">\n  <span>{{ resourceKind }}</span>\n  <aui-icon\n    icon=\"xmark\"\n    (click)=\"close.next()\"\n  ></aui-icon>\n</div>\n<aui-tab-group type=\"card\">\n  @if (schemaEnable && hasSchema) {\n    <aui-tab>\n      <ng-container *auiTabLabel> Schema </ng-container>\n      <ng-container *auiTabContent>\n        @if (schema) {\n          <div class=\"schema-content\">\n            <div class=\"schema-path\">\n              @if (path.length) {\n                <a\n                  href=\"javascript:\"\n                  (click)=\"refresh()\"\n                  >{{ resourceKind }}</a\n                >\n              }\n              @for (p of path; track p; let i = $index; let isLast = $last) {\n                @if (!isLast) {\n                  <span class=\"path-mark\">></span>\n                  <a\n                    href=\"javascript:\"\n                    (click)=\"navigateToPath(i)\"\n                    >{{ p }}</a\n                  >\n                }\n                @if (isLast) {\n                  <span class=\"path-mark\">></span>\n                  <span>{{ p }}</span>\n                }\n              }\n            </div>\n            @if (currentSchemaDescription) {\n              <div\n                class=\"schema-desc\"\n                [innerHTML]=\"\n                  currentSchemaDescription\n                    | aclParseJsonTranslate\n                    | pure: processDescription\n                \"\n              ></div>\n            }\n            <div class=\"schema-list\">\n              @for (item of properties | keyvalue; track item) {\n                <div class=\"schema-item\">\n                  <h3>\n                    <span>{{ item.key }}</span>\n                    <span class=\"obj-type\">{{ item.value.type }}</span>\n                  </h3>\n                  <p\n                    [innerHTML]=\"\n                      item.value.description | pure: processDescription\n                    \"\n                  ></p>\n                  @if (item.value | pure: hasViewableContent) {\n                    <p>\n                      <a\n                        href=\"javascript:\"\n                        (click)=\"drillDownToProperty(item.key)\"\n                      >\n                        {{ 'view_detail' | translate }}\n                      </a>\n                    </p>\n                  }\n                </div>\n              }\n            </div>\n          </div>\n        }\n      </ng-container>\n    </aui-tab>\n  }\n  @if (exampleEnable && hasExamples) {\n    <aui-tab>\n      <ng-container *auiTabLabel> Examples </ng-container>\n      <ng-container *auiTabContent>\n        <div class=\"example-list\">\n          @for (example of examples; track example; let i = $index) {\n            <div class=\"example-item\">\n              <h3>\n                {{ i + 1 }}. <span>{{ example.title }}</span>\n              </h3>\n              <p\n                [innerHTML]=\"example.description | pure: processDescription\"\n              ></p>\n              <p class=\"example-actions\">\n                <a\n                  href=\"javascript:\"\n                  (click)=\"tryExample(example)\"\n                >\n                  <aui-icon\n                    icon=\"arrow_turn_up\"\n                    size=\"14\"\n                    margin=\"right\"\n                  ></aui-icon>\n                  <span>Try it</span>\n                </a>\n                <a\n                  href=\"javascript:\"\n                  (click)=\"downloadYaml(example)\"\n                >\n                  <aui-icon\n                    icon=\"download\"\n                    size=\"14\"\n                    margin=\"right\"\n                  ></aui-icon>\n                  <span>Download YAML</span>\n                </a>\n              </p>\n            </div>\n          }\n        </div>\n      </ng-container>\n    </aui-tab>\n  }\n</aui-tab-group>\n", styles: [":host{display:block;box-sizing:border-box;min-width:360px;padding:16px;background-color:rgb(var(--aui-color-n-10));box-shadow:0 0 4px rgba(var(--aui-color-n-1),.16);margin-left:12px;overflow-y:scroll}:host::-webkit-scrollbar{width:8px;height:4px}:host::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}:host::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}:host::-webkit-scrollbar-corner{background-color:transparent}aui-tab-group{display:block;margin-top:5px}.schema-header{height:40px;display:flex;justify-content:space-between;align-items:center;font-size:18px}.schema-header aui-icon{font-size:16px;color:rgb(var(--aui-color-n-6));cursor:pointer}.schema-header aui-icon:hover{color:rgb(var(--aui-color-primary))}.schema-content{line-height:20px;overflow-y:auto;height:calc(100% - 40px)}.schema-content::-webkit-scrollbar{width:8px;height:4px}.schema-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.schema-content::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.schema-content::-webkit-scrollbar-corner{background-color:transparent}.schema-desc{margin-bottom:12px}.schema-desc a{color:#007bff;text-decoration:none}.schema-desc a:hover{text-decoration:underline}.schema-path{display:flex;flex-wrap:wrap}.schema-path *{margin-left:2px;word-break:break-all}.schema-path span:first-child{margin-right:2px}.schema-path .path-mark{margin:0 4px;color:rgb(var(--aui-color-n-6))}.schema-path{margin-bottom:12px}.schema-list .schema-item:not(:last-of-type),.schema-list .example-item:not(:last-of-type),.example-list .schema-item:not(:last-of-type),.example-list .example-item:not(:last-of-type){border-bottom:1px solid rgb(var(--aui-color-border));margin-bottom:12px}.schema-list .schema-item,.schema-list .example-item,.example-list .schema-item,.example-list .example-item{padding-left:16px}.schema-list .schema-item h3:before,.example-list .schema-item h3:before{content:\"\";display:block;width:6px;height:6px;border-radius:50%;background-color:rgb(var(--aui-color-n-6));position:absolute;left:-12px;top:8px}.schema-list h3,.example-list h3{position:relative;font-weight:500;margin-bottom:12px;word-break:break-word}.schema-list h3 span,.example-list h3 span{margin-right:4px}.schema-list h3 .obj-type,.example-list h3 .obj-type{color:rgb(var(--aui-color-n-4))}.schema-list p,.example-list p{margin-bottom:12px;word-break:break-word}.schema-list p a,.example-list p a{color:#007bff;text-decoration:none}.schema-list p a:hover,.example-list p a:hover{text-decoration:underline}.schema-examples{padding:16px}.examples-header{margin-bottom:16px}.examples-header h3{margin:0;font-size:18px;font-weight:600;color:#333}.examples-content .examples-list .example-item{margin-bottom:24px;border:1px solid #e1e5e9;border-radius:6px;overflow:hidden}.examples-content .examples-list .example-item:last-child{margin-bottom:0}.examples-content .examples-list .example-item .example-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background-color:#f8f9fa;border-bottom:1px solid #e1e5e9}.examples-content .examples-list .example-item .example-header .example-title{margin:0;font-size:16px;font-weight:600;color:#333}.examples-content .examples-list .example-item .example-header .example-actions{display:flex;gap:8px}.examples-content .examples-list .example-item .example-header .example-actions .btn{padding:4px 12px;font-size:12px;border-radius:4px;cursor:pointer;transition:all .2s ease}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-primary{color:#007bff;border:1px solid #007bff;background-color:transparent}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-primary:hover{color:#fff;background-color:#007bff}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-secondary{color:#6c757d;border:1px solid #6c757d;background-color:transparent}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-secondary:hover{color:#fff;background-color:#6c757d}.examples-content .examples-list .example-item .example-header .example-list .example-item .example-actions{display:flex;justify-content:space-between}.examples-content .examples-list .example-item .example-description{padding:12px 16px;color:#666;font-size:14px;line-height:1.5;border-bottom:1px solid #e1e5e9}.examples-content .examples-list .example-item .example-description a{color:#007bff;text-decoration:none}.examples-content .examples-list .example-item .example-description a:hover{text-decoration:underline}.examples-content .examples-list .example-item .example-yaml{background-color:#f8f9fa}.examples-content .examples-list .example-item .example-yaml pre{margin:0;padding:16px;background-color:transparent;border:none;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;line-height:1.4;color:#333;overflow-x:auto}.examples-content .examples-list .example-item .example-yaml pre code{background-color:transparent;padding:0;color:inherit}\n"], dependencies: [{ kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i1.TabGroupComponent, selector: "aui-tab-group", inputs: ["selectedIndex", "tab", "type", "title", "size", "lazy"], outputs: ["selectedIndexChange", "tabChange", "selectedTabChange", "focusChange"], exportAs: ["auiTabGroup"] }, { kind: "component", type: i1.TabComponent, selector: "aui-tab", inputs: ["name", "label", "closeable", "disabled"], outputs: ["close"], exportAs: ["auiTab"] }, { kind: "directive", type: i1.TabLabelDirective, selector: "[auiTabLabel]" }, { kind: "directive", type: i1.TabContentDirective, selector: "[auiTabContent]" }, { kind: "ngmodule", type: ButtonModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: ParseJsonTranslatePipe, name: "aclParseJsonTranslate" }, { kind: "pipe", type: PurePipe, name: "pure" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResourceYamlSidebarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'acl-resource-yaml-sidebar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        TranslatePipe,
+                        KeyValuePipe,
+                        ParseJsonTranslatePipe,
+                        IconModule,
+                        TabsModule,
+                        ButtonModule,
+                        PurePipe,
+                    ], template: "<div class=\"schema-header\">\n  <span>{{ resourceKind }}</span>\n  <aui-icon\n    icon=\"xmark\"\n    (click)=\"close.next()\"\n  ></aui-icon>\n</div>\n<aui-tab-group type=\"card\">\n  @if (schemaEnable && hasSchema) {\n    <aui-tab>\n      <ng-container *auiTabLabel> Schema </ng-container>\n      <ng-container *auiTabContent>\n        @if (schema) {\n          <div class=\"schema-content\">\n            <div class=\"schema-path\">\n              @if (path.length) {\n                <a\n                  href=\"javascript:\"\n                  (click)=\"refresh()\"\n                  >{{ resourceKind }}</a\n                >\n              }\n              @for (p of path; track p; let i = $index; let isLast = $last) {\n                @if (!isLast) {\n                  <span class=\"path-mark\">></span>\n                  <a\n                    href=\"javascript:\"\n                    (click)=\"navigateToPath(i)\"\n                    >{{ p }}</a\n                  >\n                }\n                @if (isLast) {\n                  <span class=\"path-mark\">></span>\n                  <span>{{ p }}</span>\n                }\n              }\n            </div>\n            @if (currentSchemaDescription) {\n              <div\n                class=\"schema-desc\"\n                [innerHTML]=\"\n                  currentSchemaDescription\n                    | aclParseJsonTranslate\n                    | pure: processDescription\n                \"\n              ></div>\n            }\n            <div class=\"schema-list\">\n              @for (item of properties | keyvalue; track item) {\n                <div class=\"schema-item\">\n                  <h3>\n                    <span>{{ item.key }}</span>\n                    <span class=\"obj-type\">{{ item.value.type }}</span>\n                  </h3>\n                  <p\n                    [innerHTML]=\"\n                      item.value.description | pure: processDescription\n                    \"\n                  ></p>\n                  @if (item.value | pure: hasViewableContent) {\n                    <p>\n                      <a\n                        href=\"javascript:\"\n                        (click)=\"drillDownToProperty(item.key)\"\n                      >\n                        {{ 'view_detail' | translate }}\n                      </a>\n                    </p>\n                  }\n                </div>\n              }\n            </div>\n          </div>\n        }\n      </ng-container>\n    </aui-tab>\n  }\n  @if (exampleEnable && hasExamples) {\n    <aui-tab>\n      <ng-container *auiTabLabel> Examples </ng-container>\n      <ng-container *auiTabContent>\n        <div class=\"example-list\">\n          @for (example of examples; track example; let i = $index) {\n            <div class=\"example-item\">\n              <h3>\n                {{ i + 1 }}. <span>{{ example.title }}</span>\n              </h3>\n              <p\n                [innerHTML]=\"example.description | pure: processDescription\"\n              ></p>\n              <p class=\"example-actions\">\n                <a\n                  href=\"javascript:\"\n                  (click)=\"tryExample(example)\"\n                >\n                  <aui-icon\n                    icon=\"arrow_turn_up\"\n                    size=\"14\"\n                    margin=\"right\"\n                  ></aui-icon>\n                  <span>Try it</span>\n                </a>\n                <a\n                  href=\"javascript:\"\n                  (click)=\"downloadYaml(example)\"\n                >\n                  <aui-icon\n                    icon=\"download\"\n                    size=\"14\"\n                    margin=\"right\"\n                  ></aui-icon>\n                  <span>Download YAML</span>\n                </a>\n              </p>\n            </div>\n          }\n        </div>\n      </ng-container>\n    </aui-tab>\n  }\n</aui-tab-group>\n", styles: [":host{display:block;box-sizing:border-box;min-width:360px;padding:16px;background-color:rgb(var(--aui-color-n-10));box-shadow:0 0 4px rgba(var(--aui-color-n-1),.16);margin-left:12px;overflow-y:scroll}:host::-webkit-scrollbar{width:8px;height:4px}:host::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}:host::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}:host::-webkit-scrollbar-corner{background-color:transparent}aui-tab-group{display:block;margin-top:5px}.schema-header{height:40px;display:flex;justify-content:space-between;align-items:center;font-size:18px}.schema-header aui-icon{font-size:16px;color:rgb(var(--aui-color-n-6));cursor:pointer}.schema-header aui-icon:hover{color:rgb(var(--aui-color-primary))}.schema-content{line-height:20px;overflow-y:auto;height:calc(100% - 40px)}.schema-content::-webkit-scrollbar{width:8px;height:4px}.schema-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:rgb(var(--aui-color-n-7))}.schema-content::-webkit-scrollbar-thumb:hover{background-color:rgb(var(--aui-color-n-5))}.schema-content::-webkit-scrollbar-corner{background-color:transparent}.schema-desc{margin-bottom:12px}.schema-desc a{color:#007bff;text-decoration:none}.schema-desc a:hover{text-decoration:underline}.schema-path{display:flex;flex-wrap:wrap}.schema-path *{margin-left:2px;word-break:break-all}.schema-path span:first-child{margin-right:2px}.schema-path .path-mark{margin:0 4px;color:rgb(var(--aui-color-n-6))}.schema-path{margin-bottom:12px}.schema-list .schema-item:not(:last-of-type),.schema-list .example-item:not(:last-of-type),.example-list .schema-item:not(:last-of-type),.example-list .example-item:not(:last-of-type){border-bottom:1px solid rgb(var(--aui-color-border));margin-bottom:12px}.schema-list .schema-item,.schema-list .example-item,.example-list .schema-item,.example-list .example-item{padding-left:16px}.schema-list .schema-item h3:before,.example-list .schema-item h3:before{content:\"\";display:block;width:6px;height:6px;border-radius:50%;background-color:rgb(var(--aui-color-n-6));position:absolute;left:-12px;top:8px}.schema-list h3,.example-list h3{position:relative;font-weight:500;margin-bottom:12px;word-break:break-word}.schema-list h3 span,.example-list h3 span{margin-right:4px}.schema-list h3 .obj-type,.example-list h3 .obj-type{color:rgb(var(--aui-color-n-4))}.schema-list p,.example-list p{margin-bottom:12px;word-break:break-word}.schema-list p a,.example-list p a{color:#007bff;text-decoration:none}.schema-list p a:hover,.example-list p a:hover{text-decoration:underline}.schema-examples{padding:16px}.examples-header{margin-bottom:16px}.examples-header h3{margin:0;font-size:18px;font-weight:600;color:#333}.examples-content .examples-list .example-item{margin-bottom:24px;border:1px solid #e1e5e9;border-radius:6px;overflow:hidden}.examples-content .examples-list .example-item:last-child{margin-bottom:0}.examples-content .examples-list .example-item .example-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background-color:#f8f9fa;border-bottom:1px solid #e1e5e9}.examples-content .examples-list .example-item .example-header .example-title{margin:0;font-size:16px;font-weight:600;color:#333}.examples-content .examples-list .example-item .example-header .example-actions{display:flex;gap:8px}.examples-content .examples-list .example-item .example-header .example-actions .btn{padding:4px 12px;font-size:12px;border-radius:4px;cursor:pointer;transition:all .2s ease}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-primary{color:#007bff;border:1px solid #007bff;background-color:transparent}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-primary:hover{color:#fff;background-color:#007bff}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-secondary{color:#6c757d;border:1px solid #6c757d;background-color:transparent}.examples-content .examples-list .example-item .example-header .example-actions .btn.btn-outline-secondary:hover{color:#fff;background-color:#6c757d}.examples-content .examples-list .example-item .example-header .example-list .example-item .example-actions{display:flex;justify-content:space-between}.examples-content .examples-list .example-item .example-description{padding:12px 16px;color:#666;font-size:14px;line-height:1.5;border-bottom:1px solid #e1e5e9}.examples-content .examples-list .example-item .example-description a{color:#007bff;text-decoration:none}.examples-content .examples-list .example-item .example-description a:hover{text-decoration:underline}.examples-content .examples-list .example-item .example-yaml{background-color:#f8f9fa}.examples-content .examples-list .example-item .example-yaml pre{margin:0;padding:16px;background-color:transparent;border:none;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;line-height:1.4;color:#333;overflow-x:auto}.examples-content .examples-list .example-item .example-yaml pre code{background-color:transparent;padding:0;color:inherit}\n"] }]
+        }], propDecorators: { resource: [{
+                type: Input
+            }], schema: [{
+                type: Input
+            }], close: [{
+                type: Output
+            }], tryYaml: [{
+                type: Output
+            }], schemaEnable: [{
+                type: Input
+            }], exampleEnable: [{
+                type: Input
+            }], extraExamples: [{
+                type: Input
+            }] } });
+
+class ResourceYamlEditorComponent {
+    set originalValue(value) {
+        this._originalValue = value || '';
+    }
+    get originalValue() {
+        return this._originalValue;
+    }
+    constructor() {
+        this.destroy$ = new Subject();
+        this._value = '';
+        this._originalValue = '';
+        this.onChange = (_value) => {
+            // Placeholder for form control change callback
+        };
+        this.onTouched = () => {
+            // Placeholder for form control touched callback
+        };
+        this.showSidebar$$ = new BehaviorSubject(true);
+        this.showDebugPanel$$ = new BehaviorSubject(true);
+        this.monacoEditor = null;
+        this.registeredSchemas = new Set();
+        this.pendingSchemas = new Set();
+        this.schemaService = inject(KubernetesSchemaService);
+        this.monacoLanguageService = inject(MonacoLanguageService);
+        this.hasWrapper = true;
+        this.showDebugInfo = false;
+        this.sidebarEnable = true;
+        this.schemaEnable = true;
+        this.exampleEnable = true;
+        this.autoFoldManagedFields = true;
+        this.options = yamlWriteMinimapOptions;
+        this.actionsConfig = updateActions;
+        this.tryYaml = new EventEmitter();
+        this.autoFillNamespace = true;
+        this.hasFolded = false;
+        /**
+         * 自动获取的 schema，当没有手动提供 schema 时使用
+         */
+        this.autoSchema$ = this.resource$.pipe(switchMap(resource => {
+            if (!resource) {
+                return of(null);
+            }
+            const firstResource = (Array.isArray(resource) ? resource[0] : resource);
+            if (!firstResource?.apiVersion || !firstResource?.kind) {
+                return of(null);
+            }
+            return this.schemaService.getResourceSchema(firstResource.apiVersion, firstResource.kind, this.clusterName);
+        }), publishRef());
+        /**
+         * 最终使用的 schema，优先使用手动提供的，否则使用自动获取的
+         */
+        this.finalSchema$ = combineLatest([this.schema$, this.autoSchema$]).pipe(map(([manualSchema, autoSchema]) => manualSchema || autoSchema), distinctUntilChanged(), shareReplay(1));
+        this.yamlSchemaService = this.monacoLanguageService.getYamlSchemaService();
+        // 自动设置 schema
+        combineLatest([this.resource$, this.finalSchema$])
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(([resource, schema]) => {
+            if (resource && schema) {
+                const firstResource = Array.isArray(resource)
+                    ? resource[0]
+                    : resource;
+                if (firstResource && !Array.isArray(firstResource)) {
+                    this.setYamlSchema(firstResource, schema);
+                }
+            }
+        });
+        this.autoSchema$.pipe(takeUntil(this.destroy$)).subscribe();
+    }
+    ngAfterViewInit() {
+        // 监听 YAML 内容变化，自动折叠 managedFields
+        // if (this.autoFoldManagedFields && this.schemaService.definitions) {
+        //   this.selfFoldManagedFields();
+        // }
+        if (this.autoFoldManagedFields) {
+            this.selfFoldManagedFields();
+        }
+    }
+    selfFoldManagedFields() {
+        if (this.hasFolded) {
+            return;
+        }
+        this.hasFolded = true;
+        setTimeout(() => {
+            const editor = this.getEditorInstance();
+            if (editor) {
+                foldManagedFields(editor);
+            }
+        }, 0);
+    }
+    get value() {
+        return this._value;
+    }
+    set value(val) {
+        this._value = val;
+        this.onChange(val);
+        this.onTouched();
+    }
+    // ControlValueAccessor implementation
+    writeValue(value) {
+        this._value = value || '';
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    toggleSidebar() {
+        this.showSidebar$$.next(!this.showSidebar$$.value);
+    }
+    toggleDebugInfo() {
+        this.showDebugPanel$$.next(!this.showDebugPanel$$.value);
+    }
+    getCurrentResource() {
+        const resource = this.resource;
+        if (Array.isArray(resource)) {
+            return resource.length > 0 ? resource[0] : null;
+        }
+        return resource || null;
+    }
+    getCurrentSchema() {
+        return this.schema || null;
+    }
+    getDebugInfo() {
+        const resource = this.getCurrentResource();
+        return {
+            hasResource: !!resource,
+            resourceApiVersion: resource?.apiVersion,
+            resourceKind: resource?.kind,
+            hasManualSchema: !!this.schema,
+        };
+    }
+    onTryYaml(yamlContent) {
+        let targetYaml = yamlContent;
+        if (this.autoFillNamespace && this.namespace) {
+            targetYaml = parseAll(yamlContent)
+                .filter(r => !!r)
+                .map((r) => {
+                if (!r?.metadata?.namespace) {
+                    return {
+                        ...r,
+                        metadata: {
+                            ...r.metadata,
+                            namespace: this.namespace,
+                        },
+                    };
+                }
+                return r;
+            })
+                .map(r => stringify$1(r, { sortMapEntries: true }))
+                .join('---\r\n');
+        }
+        this.tryYaml.emit(targetYaml);
+    }
+    /**
+     * 设置 YAML schema 以提供 hover 提示和自动完成
+     */
+    setYamlSchema(resource, schema) {
+        if (!schema) {
+            return;
+        }
+        // 使用 apiVersion + kind 组合作为标识
+        const apiVersion = resource?.apiVersion || 'unknown';
+        const kind = resource?.kind || 'unknown';
+        const schemaKey = `${apiVersion}/${kind}`;
+        this.modelUri = `${schemaKey}.yaml`;
+        this.selfFoldManagedFields();
+        // 检查是否已经注册过相同的 schema，避免重复注册
+        if (this.registeredSchemas.has(schemaKey) ||
+            this.pendingSchemas.has(schemaKey)) {
+            return;
+        }
+        this.pendingSchemas.add(schemaKey);
+        const registerSchema = (schemaToRegister) => {
+            this.yamlSchemaService.addSchema({
+                uri: `k8s://${schemaKey}.schema.json`,
+                fileMatch: [this.modelUri],
+                schema: schemaToRegister,
+            });
+            this.registeredSchemas.add(schemaKey);
+            this.pendingSchemas.delete(schemaKey);
+        };
+        const schemaDefinitions = schema?.definitions;
+        if (schemaDefinitions && Object.keys(schemaDefinitions).length > 0) {
+            registerSchema(schema);
+            return;
+        }
+        this.schemaService
+            .getAllResourceDefinitionsCached(this.clusterName)
+            .pipe(take(1), takeUntil(this.destroy$))
+            .subscribe(definitions => {
+            const fullSchema = {
+                ...schema,
+                definitions: definitions || schemaDefinitions || {},
+            };
+            registerSchema(fullSchema);
+        });
+    }
+    /**
+     * 获取 Monaco 编辑器实例
+     */
+    getEditorInstance() {
+        if (!this.monacoEditor && this.codeEditorRef?.editor) {
+            this.monacoEditor = this.codeEditorRef.editor;
+        }
+        return this.monacoEditor;
+    }
+    /**
+     * 手动折叠 managedFields
+     */
+    foldManagedFields() {
+        const editor = this.getEditorInstance();
+        if (editor) {
+            foldManagedFields(editor);
+        }
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResourceYamlEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: ResourceYamlEditorComponent, isStandalone: true, selector: "acl-resource-yaml-editor", inputs: { hasWrapper: "hasWrapper", showDebugInfo: "showDebugInfo", sidebarEnable: "sidebarEnable", schema: "schema", schemaEnable: "schemaEnable", exampleEnable: "exampleEnable", resource: "resource", autoFoldManagedFields: "autoFoldManagedFields", originalValue: "originalValue", options: "options", actionsConfig: "actionsConfig", autoFillNamespace: "autoFillNamespace", extraExamples: "extraExamples", clusterName: "clusterName", namespace: "namespace" }, outputs: { tryYaml: "tryYaml" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ResourceYamlEditorComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "codeEditorRef", first: true, predicate: ["codeEditor"], descendants: true }], ngImport: i0, template: "@if (hasWrapper) {\n  <aui-card>\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </aui-card>\n} @else {\n  <div\n    class=\"yaml-editor-container\"\n    [class.with-sidebar]=\"showSidebar$$ | async\"\n  >\n    <div class=\"yaml-editor-section\">\n      <aui-code-editor\n        #codeEditor\n        name=\"yaml\"\n        [originalValue]=\"originalValue\"\n        [(ngModel)]=\"value\"\n        [options]=\"options\"\n        [actionsConfig]=\"actionsConfig\"\n        [modelUri]=\"modelUri\"\n      >\n        <ng-container auiCodeEditorToolbarRightSide>\n          <!-- Schema \u6309\u94AE\uFF1A\u5F53\u542F\u7528\u4FA7\u8FB9\u680F\u65F6\u663E\u793A -->\n          @if (sidebarEnable && !!(resource$ | async)) {\n            <button\n              [hidden]=\"!!codeEditor.fullscreenDialog\"\n              class=\"aui-code-editor-toolbar__control-button\"\n              type=\"button\"\n              [disabled]=\"!(finalSchema$ | async) && !exampleEnable\"\n              (click)=\"toggleSidebar()\"\n              [auiTooltip]=\"\n                ((showSidebar$$ | async) ? 'hide_sidebar' : 'view_sidebar')\n                  | translate\n              \"\n            >\n              <aui-icon\n                [icon]=\"\n                  (showSidebar$$ | async)\n                    ? 'prod:expand_sidebar'\n                    : 'prod:collapse_sidebar'\n                \"\n              ></aui-icon>\n            </button>\n          }\n        </ng-container>\n      </aui-code-editor>\n    </div>\n    @if ((showSidebar$$ | async) && (resource$ | async)) {\n      <div class=\"yaml-sidebar-section\">\n        <acl-resource-yaml-sidebar\n          [resource]=\"getCurrentResource()\"\n          [schema]=\"finalSchema$ | async\"\n          [schemaEnable]=\"schemaEnable\"\n          [exampleEnable]=\"exampleEnable\"\n          [extraExamples]=\"extraExamples\"\n          (close)=\"toggleSidebar()\"\n          (tryYaml)=\"onTryYaml($event)\"\n        ></acl-resource-yaml-sidebar>\n      </div>\n    }\n  </div>\n}\n<ng-template #content>\n  <div\n    class=\"yaml-editor-container\"\n    [class.with-sidebar]=\"showSidebar$$ | async\"\n  >\n    <div class=\"yaml-editor-section\">\n      <aui-code-editor\n        #codeEditor\n        name=\"yaml\"\n        [originalValue]=\"originalValue\"\n        [(ngModel)]=\"value\"\n        [options]=\"options\"\n        [actionsConfig]=\"actionsConfig\"\n        [modelUri]=\"modelUri\"\n      >\n        <ng-container auiCodeEditorToolbarRightSide>\n          <!-- Schema \u6309\u94AE\uFF1A\u5F53\u542F\u7528\u4FA7\u8FB9\u680F\u65F6\u663E\u793A -->\n          @if (sidebarEnable && !!(resource$ | async)) {\n            <button\n              [hidden]=\"!!codeEditor.fullscreenDialog\"\n              class=\"aui-code-editor-toolbar__control-button\"\n              type=\"button\"\n              [disabled]=\"!(finalSchema$ | async) && !exampleEnable\"\n              (click)=\"toggleSidebar()\"\n              [auiTooltip]=\"\n                ((showSidebar$$ | async) ? 'hide_sidebar' : 'view_sidebar')\n                  | translate\n              \"\n            >\n              <aui-icon\n                [icon]=\"\n                  (showSidebar$$ | async)\n                    ? 'prod:expand_sidebar'\n                    : 'prod:collapse_sidebar'\n                \"\n              ></aui-icon>\n            </button>\n          }\n        </ng-container>\n      </aui-code-editor>\n    </div>\n    @if ((showSidebar$$ | async) && (resource$ | async)) {\n      <div class=\"yaml-sidebar-section\">\n        <acl-resource-yaml-sidebar\n          [resource]=\"getCurrentResource()\"\n          [schema]=\"finalSchema$ | async\"\n          [schemaEnable]=\"schemaEnable\"\n          [exampleEnable]=\"exampleEnable\"\n          [extraExamples]=\"extraExamples\"\n          (close)=\"toggleSidebar()\"\n          (tryYaml)=\"onTryYaml($event)\"\n        ></acl-resource-yaml-sidebar>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host(:not(.dialog-content)) ::ng-deep .aui-code-editor{min-height:100%}:host(:not(.dialog-content)){display:block;height:calc(100vh - (var(--acl-page-header-height) + 44px) - 147px)}:host(:not(.dialog-content))>.aui-card{height:100%}:host(:not(.dialog-content))>.aui-card .aui-card__content,:host(:not(.dialog-content))>.aui-card aui-code-editor,:host(:not(.dialog-content))>.aui-card .aui-code-editor{height:100%;min-height:100%}:host{display:block}:host ::ng-deep aui-card,:host ::ng-deep .aui-card,:host ::ng-deep .aui-card__content{height:100%}:host ::ng-deep .aui-checkbox{margin-right:0}:host aui-code-editor{height:100%}.yaml-editor-container{display:flex;height:100%}.yaml-editor-container.with-sidebar .yaml-editor-section{flex:2;min-width:0}.yaml-editor-container.with-sidebar .yaml-sidebar-section{flex:1 0 0%}.yaml-editor-container:not(.with-sidebar) .yaml-editor-section{flex:1}.yaml-editor-section{display:flex;flex-direction:column;height:100%}.yaml-editor-section aui-code-editor{flex:1;height:100%}.yaml-sidebar-section{display:flex;flex-direction:column;height:100%}.yaml-sidebar-section acl-resource-yaml-sidebar{flex:1;height:100%}.yaml-debug-section{position:absolute;top:0;right:0;width:350px;height:100%;background:var(--aui-color-bg-container);border-left:1px solid var(--aui-color-border-default);z-index:1000;overflow-y:auto}.debug-panel{padding:16px;font-size:12px}.debug-panel h4{margin:0 0 12px;font-size:14px;color:var(--aui-color-text-primary)}.debug-panel .debug-item{margin-bottom:16px}.debug-panel .debug-item strong{color:var(--aui-color-text-primary);display:block;margin-bottom:4px}.debug-panel .debug-item ul{margin:0;padding-left:16px}.debug-panel .debug-item ul li{margin-bottom:2px;color:var(--aui-color-text-secondary)}.debug-panel .debug-actions{border-top:1px solid var(--aui-color-border-default);padding-top:12px;text-align:right}@media (width <= 1200px){.yaml-editor-container.with-sidebar .yaml-sidebar-section{width:350px}}@media (width <= 992px){.yaml-editor-container.with-sidebar{flex-direction:column}.yaml-editor-container.with-sidebar .yaml-editor-section{flex:1;min-height:50%}.yaml-editor-container.with-sidebar .yaml-sidebar-section{width:100%;height:50%;border-top:1px solid var(--aui-color-border, #e0e0e0);border-left:none}}\n"], dependencies: [{ kind: "component", type: i1.CardComponent, selector: "aui-card", inputs: ["divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: CodeEditorComponent, selector: "aui-code-editor", inputs: ["options", "plain", "showLanguageLabel", "value", "originalValue", "actionsConfig", "previewMode", "diffMode", "modelUri"], outputs: ["editorChange", "editorBlur"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ResourceYamlSidebarComponent, selector: "acl-resource-yaml-sidebar", inputs: ["resource", "schema", "schemaEnable", "exampleEnable", "extraExamples"], outputs: ["close", "tryYaml"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[auiTooltip]", inputs: ["auiTooltip", "auiTooltipContext", "auiTooltipClass", "auiTooltipType", "auiTooltipPosition", "auiTooltipTrigger", "auiTooltipDisabled", "auiTooltipHideOnClick", "auiTooltipAnimType"], outputs: ["auiTooltipVisibleChange"], exportAs: ["auiTooltip"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+__decorate([
+    ObservableInput(),
+    __metadata("design:type", Observable)
+], ResourceYamlEditorComponent.prototype, "resource$", void 0);
+__decorate([
+    ObservableInput(),
+    __metadata("design:type", Observable)
+], ResourceYamlEditorComponent.prototype, "schema$", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: ResourceYamlEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'acl-resource-yaml-editor', preserveWhitespaces: false, standalone: true, imports: [
+                        CARD_MODULE,
+                        FormsModule,
+                        CHECKBOX_MODULE,
+                        ButtonModule,
+                        CodeEditorComponent,
+                        AsyncPipe,
+                        NgTemplateOutlet,
+                        ResourceYamlSidebarComponent,
+                        IconModule,
+                        TooltipModule,
+                        TranslatePipe,
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ResourceYamlEditorComponent),
+                            multi: true,
+                        },
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (hasWrapper) {\n  <aui-card>\n    <ng-container *ngTemplateOutlet=\"content\" />\n  </aui-card>\n} @else {\n  <div\n    class=\"yaml-editor-container\"\n    [class.with-sidebar]=\"showSidebar$$ | async\"\n  >\n    <div class=\"yaml-editor-section\">\n      <aui-code-editor\n        #codeEditor\n        name=\"yaml\"\n        [originalValue]=\"originalValue\"\n        [(ngModel)]=\"value\"\n        [options]=\"options\"\n        [actionsConfig]=\"actionsConfig\"\n        [modelUri]=\"modelUri\"\n      >\n        <ng-container auiCodeEditorToolbarRightSide>\n          <!-- Schema \u6309\u94AE\uFF1A\u5F53\u542F\u7528\u4FA7\u8FB9\u680F\u65F6\u663E\u793A -->\n          @if (sidebarEnable && !!(resource$ | async)) {\n            <button\n              [hidden]=\"!!codeEditor.fullscreenDialog\"\n              class=\"aui-code-editor-toolbar__control-button\"\n              type=\"button\"\n              [disabled]=\"!(finalSchema$ | async) && !exampleEnable\"\n              (click)=\"toggleSidebar()\"\n              [auiTooltip]=\"\n                ((showSidebar$$ | async) ? 'hide_sidebar' : 'view_sidebar')\n                  | translate\n              \"\n            >\n              <aui-icon\n                [icon]=\"\n                  (showSidebar$$ | async)\n                    ? 'prod:expand_sidebar'\n                    : 'prod:collapse_sidebar'\n                \"\n              ></aui-icon>\n            </button>\n          }\n        </ng-container>\n      </aui-code-editor>\n    </div>\n    @if ((showSidebar$$ | async) && (resource$ | async)) {\n      <div class=\"yaml-sidebar-section\">\n        <acl-resource-yaml-sidebar\n          [resource]=\"getCurrentResource()\"\n          [schema]=\"finalSchema$ | async\"\n          [schemaEnable]=\"schemaEnable\"\n          [exampleEnable]=\"exampleEnable\"\n          [extraExamples]=\"extraExamples\"\n          (close)=\"toggleSidebar()\"\n          (tryYaml)=\"onTryYaml($event)\"\n        ></acl-resource-yaml-sidebar>\n      </div>\n    }\n  </div>\n}\n<ng-template #content>\n  <div\n    class=\"yaml-editor-container\"\n    [class.with-sidebar]=\"showSidebar$$ | async\"\n  >\n    <div class=\"yaml-editor-section\">\n      <aui-code-editor\n        #codeEditor\n        name=\"yaml\"\n        [originalValue]=\"originalValue\"\n        [(ngModel)]=\"value\"\n        [options]=\"options\"\n        [actionsConfig]=\"actionsConfig\"\n        [modelUri]=\"modelUri\"\n      >\n        <ng-container auiCodeEditorToolbarRightSide>\n          <!-- Schema \u6309\u94AE\uFF1A\u5F53\u542F\u7528\u4FA7\u8FB9\u680F\u65F6\u663E\u793A -->\n          @if (sidebarEnable && !!(resource$ | async)) {\n            <button\n              [hidden]=\"!!codeEditor.fullscreenDialog\"\n              class=\"aui-code-editor-toolbar__control-button\"\n              type=\"button\"\n              [disabled]=\"!(finalSchema$ | async) && !exampleEnable\"\n              (click)=\"toggleSidebar()\"\n              [auiTooltip]=\"\n                ((showSidebar$$ | async) ? 'hide_sidebar' : 'view_sidebar')\n                  | translate\n              \"\n            >\n              <aui-icon\n                [icon]=\"\n                  (showSidebar$$ | async)\n                    ? 'prod:expand_sidebar'\n                    : 'prod:collapse_sidebar'\n                \"\n              ></aui-icon>\n            </button>\n          }\n        </ng-container>\n      </aui-code-editor>\n    </div>\n    @if ((showSidebar$$ | async) && (resource$ | async)) {\n      <div class=\"yaml-sidebar-section\">\n        <acl-resource-yaml-sidebar\n          [resource]=\"getCurrentResource()\"\n          [schema]=\"finalSchema$ | async\"\n          [schemaEnable]=\"schemaEnable\"\n          [exampleEnable]=\"exampleEnable\"\n          [extraExamples]=\"extraExamples\"\n          (close)=\"toggleSidebar()\"\n          (tryYaml)=\"onTryYaml($event)\"\n        ></acl-resource-yaml-sidebar>\n      </div>\n    }\n  </div>\n</ng-template>\n", styles: [":host(:not(.dialog-content)) ::ng-deep .aui-code-editor{min-height:100%}:host(:not(.dialog-content)){display:block;height:calc(100vh - (var(--acl-page-header-height) + 44px) - 147px)}:host(:not(.dialog-content))>.aui-card{height:100%}:host(:not(.dialog-content))>.aui-card .aui-card__content,:host(:not(.dialog-content))>.aui-card aui-code-editor,:host(:not(.dialog-content))>.aui-card .aui-code-editor{height:100%;min-height:100%}:host{display:block}:host ::ng-deep aui-card,:host ::ng-deep .aui-card,:host ::ng-deep .aui-card__content{height:100%}:host ::ng-deep .aui-checkbox{margin-right:0}:host aui-code-editor{height:100%}.yaml-editor-container{display:flex;height:100%}.yaml-editor-container.with-sidebar .yaml-editor-section{flex:2;min-width:0}.yaml-editor-container.with-sidebar .yaml-sidebar-section{flex:1 0 0%}.yaml-editor-container:not(.with-sidebar) .yaml-editor-section{flex:1}.yaml-editor-section{display:flex;flex-direction:column;height:100%}.yaml-editor-section aui-code-editor{flex:1;height:100%}.yaml-sidebar-section{display:flex;flex-direction:column;height:100%}.yaml-sidebar-section acl-resource-yaml-sidebar{flex:1;height:100%}.yaml-debug-section{position:absolute;top:0;right:0;width:350px;height:100%;background:var(--aui-color-bg-container);border-left:1px solid var(--aui-color-border-default);z-index:1000;overflow-y:auto}.debug-panel{padding:16px;font-size:12px}.debug-panel h4{margin:0 0 12px;font-size:14px;color:var(--aui-color-text-primary)}.debug-panel .debug-item{margin-bottom:16px}.debug-panel .debug-item strong{color:var(--aui-color-text-primary);display:block;margin-bottom:4px}.debug-panel .debug-item ul{margin:0;padding-left:16px}.debug-panel .debug-item ul li{margin-bottom:2px;color:var(--aui-color-text-secondary)}.debug-panel .debug-actions{border-top:1px solid var(--aui-color-border-default);padding-top:12px;text-align:right}@media (width <= 1200px){.yaml-editor-container.with-sidebar .yaml-sidebar-section{width:350px}}@media (width <= 992px){.yaml-editor-container.with-sidebar{flex-direction:column}.yaml-editor-container.with-sidebar .yaml-editor-section{flex:1;min-height:50%}.yaml-editor-container.with-sidebar .yaml-sidebar-section{width:100%;height:50%;border-top:1px solid var(--aui-color-border, #e0e0e0);border-left:none}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { codeEditorRef: [{
+                type: ViewChild,
+                args: ['codeEditor', { static: false }]
+            }], hasWrapper: [{
+                type: Input
+            }], showDebugInfo: [{
+                type: Input
+            }], sidebarEnable: [{
+                type: Input
+            }], schema: [{
+                type: Input
+            }], schemaEnable: [{
+                type: Input
+            }], exampleEnable: [{
+                type: Input
+            }], resource: [{
+                type: Input
+            }], autoFoldManagedFields: [{
+                type: Input
+            }], originalValue: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], actionsConfig: [{
+                type: Input
+            }], tryYaml: [{
+                type: Output
+            }], resource$: [], schema$: [], autoFillNamespace: [{
+                type: Input
+            }], extraExamples: [{
+                type: Input
+            }], clusterName: [{
+                type: Input
+            }], namespace: [{
+                type: Input
+            }] } });
+
 /**
  * [[include:code/README.md]]
  * @module code
@@ -12394,5 +13827,5 @@ const ASYNC_DATA_MODULE = [
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION, AIT_API_GROUP, ALL, ALL_VALUE, ANNOTATIONS, API_GATEWAY, ARGOCD_GROUP, ARRAY_FORM_TABLE_MODULE, ARRAY_TABLE_FORM_ERROR_BG, ASSIGN_ALL, ASYNC_DATA_MODULE, AccessMode, AccessModes, AlaudaDeployStatus, AlaudaRunningStatus, ArrayFormTableComponent, ArrayFormTableFooterDirective, ArrayFormTableHeaderDirective, ArrayFormTableRowControlDirective, ArrayFormTableRowDirective, ArrayFormTableRowErrorDirective, ArrayFormTableRowSeparatorDirective, ArrayFormTableZeroStateDirective, AsyncDataLoader, AsyncFunctionValidatorDirective, AuiCodeEditorHelperDirective, BASE_TIMEZONE, BaseFormContainer, BaseNestedFormControl, BaseNestedFormControlPure, BaseStringMapFormComponent, Bracket, CHART_PICKER_TIME_RANGES, CLUSTER, COMMON_RESOURCE_DEFINITIONS, CORE_UNITS, CORE_UNIT_REG, CREATE, CREATED_AT, CREATION_TIMESTAMP, CREATOR, CRON_ENABLE_7_FOR_SUNDAY, CRON_FORMAT_ERROR, CRON_MIN_INTERVAL_ERROR, CRYPTO_HEADER_KEY, CRYPTO_KEY, CRYPTO_RANDOM_HEADER_KEY, CRYPTO_TYPE, CUSTOM, CUSTOMIZED, CUSTOM_RANGE, CalcPipe, CardSectionComponent, ClickOutsideDirective, CloudHelmRequestStateEnum, CodeDisplayDialogComponent, CoerceNumberDirective, ConfirmDeleteComponent, ConfirmDeleteContentDirective, ConfirmDeleteLabelDirective, ConfirmDeleteTipDirective, ControlValueTraceDirective, CronHumanReadablePipe, CronWeekDays, CrontabNextPipe, CurrentTimeComponent, DATE_FORMAT, DATE_TIME_FORMAT, DEFAULT_CODE_EDITOR_OPTIONS, DEFAULT_CONTAINER_ANNOTATION, DEFAULT_OPERATOR, DEFAULT_OPTIONS, DEFAULT_REASON, DELIMITER, DESCRIPTION, DISPLAY_NAME, DNS1123SubdomainValidator, DOMAIN_PATTERN, DOMAIN_PATTERN_BASE, DOT, DOWNGRADE_WATCH_ENABLED, DOWNGRADE_WATCH_POLLING, DUPLICATE_ERROR_KEY, DUPLICATION_JUSTIFY_STRATEGY, DataSource, DateRangePickerComponent, DeclareDirective, DefaultStatusColorMapper, DefaultStatusIconMapper, DeleteType, DeletingTagComponent, DisabledContainerComponent, DisabledDirective, DragHandleDirective, DurationPipe, E2eAttributeBindingDirective, EFFECT_DIRECTIVE_MODULE, EMAIL_PATTERN, EMPTY, ERRORS_MAPPER_MODULE, ESCAPE_DEACTIVATE_CHECK, ErrorStateComponent, ErrorsMapperComponent, ErrorsMapperDirective, FALSE, FIELDSET_GROUP_COMPONENTS, FeatureGateDirective, FieldSetColumnComponent, FieldSetColumnGroupComponent, FieldSetGroupComponent, FieldSetItemActionDirective, FieldSetItemComponent, FileResultType, FoldableBlockComponent, FoldableItemInTableComponent, FormItemMarginEffectDirective, FunctionValidatorDirective, GLOBAL_CLUSTER, GenericStatusColor, GenericStatusIcon, GuardStatus, HTTP_ADDRESS_PATTERN, HTTP_DUAL_IP_OR_DOMAIN_PATTERN, HTTP_IP_OR_DOMAIN_PATTERN, HYPHEN, HelmRequestPhaseEnum, HelpDocDirective, HelpDocUrlPipe, HelpDocumentComponent, HelpDocumentService, IMAGE_TAG_PATTERN, INT_PATTERN, INT_ZERO_PATTERN, IPV4_IPV6_ADDRESS_HOSTNAME_PORT_PATTERN, IPV6_ADDRESS_HOSTNAME_PATTERN, IPV6_ADDRESS_HOSTNAME_PORT_PATTERN, IPV6_PATTERN_BASE, IP_ADDRESS_HOSTNAME_PATTERN, IP_ADDRESS_HOSTNAME_PATTERN_EXTEND, IP_ADDRESS_HOSTNAME_PORT_PATTERN, IP_ADDRESS_PATTERN, IP_ADDRESS_PORT_PATTERN, IP_ADDRESS_SUBNET_PATTERN, IP_PATTERN, IP_PATTERN_BASE, IP_V4_OR_V6_PATTERN, IP_V6_ADDRESS_PATTERN, IP_V6_PATTERN, InterceptDeactivateDirective, InterceptDeactivateGuard, InterceptDeactivateService, JobStatusColorMapper, JobStatusEnum, JobStatusIconMapper, K8SResourceList, K8SResourceListFooterComponent, K8SResourcePagedList, K8S_APP_API_GROUP, K8S_CORE_API_GROUP, K8S_RESOURCE_LABEL_KEY_NAME_PATTERN, K8S_RESOURCE_LABEL_KEY_PREFIX_PATTERN, K8S_RESOURCE_LABEL_VALUE_PATTERN, K8S_RESOURCE_LIST_MODULE, K8S_RESOURCE_NAME_START_WITH_CHARS_ONLY, K8S_RESOURCE_TRANSLATE_KEY, K8sListFooterLoadingErrorDirective, K8sListFooterNoDataDirective, K8sResourceAction, K8sResourceMarkComponent, K8sResourceTranslateKeyPipe, K8sSharedUtilService, K8sYamlDisplayDialogComponent, KNOWN_COLUMNS, KeyValueFormTableComponent, KeyValueTableComponent, LABELS, LINK, LOCAL_STORAGE_KEY_THEME_MODE, ListDisplayComponent, ListenResizeDirective, LoadAction, LocaleTransformPipe, MACHINE_API_GROUP, METADATA, MUTABLE_BASIC_OPTIONS, MUTABLE_MODULE, MarkedPipe, MaxLengthValidatorDirective, MaxValidatorDirective, MinLengthValidatorDirective, MinValidatorDirective, MinimumFormatPipe, MosaicComponent, MosaicLeftDirective, MosaicRightDirective, MultiSearchActionInputComponent, MultiSearchAdvanced, MultiSearchBasic, MultiSearchComponent, MutableDirective, NAME, NAMESPACE, NOTIFICATION_SERVER_NAME, NOTIFY_DURATION_HEADER, NOTIFY_ON_ERROR_HEADER, NOTIFY_ON_ERROR_HEADERS, NOT_NOTIFY_ON_ERROR_HEADERS, NUMBER_PATTERN, NamespaceBadgeComponent, NotBeValidatorDirective, OAM_GROUP, OnResizeChangeService, OneOfValidatorDirective, OverviewBannerComponent, PACKAGE_RUNTIME_VALUE, PAGE_GUARD_MODULE, PLATFORM_OPS_MODE, PORT_PATTERN, POSITIVE_INT_PATTERN, POSITIVE_NUMBER_PATTERN, PREFIX_LABEL_CLASS, PROJECT, PUBLIC_NAMESPACE, PageGuardComponent, PageGuardContentDirective, PageGuardDescriptionDirective, PageGuardImageDirective, PageGuardOperationDirective, PageStateComponent, ParseJsonTranslatePipe, PasswordInputComponent, PodStatusColorMapper, PodStatusComponent, PodStatusEnum, PodStatusIconMapper, PreventClipboardDirective, PreventDirective, PreventHandler, ProductKey, REASON_MAP, RESOURCE_MAC_TYPES, RESOURCE_REQUIREMENT_KEYS, ReadonlyFieldDirective, Reason, RelativeTimeComponent, RequestPool, ResizeDirective, ResourceLabelComponent, ResourceMultiSelectComponent, ResourceYamlDisplayComponent, SERVICE_PORT_BASE_PROTOCOLS, SERVICE_PORT_PROTOCOLS, SERVICE_SESSION_AFFINITIES, SERVICE_TYPES, SLASH, SPACE, SPEC, STATUS, STRATEGY_JUDGE_MAPPER, STRONG_PASSWORD_SPECIAL_CHARS, ScrollBorderObserverDirective, ScrollToFirstInvalidDirective, ScrollToFirstInvalidMarkerDirective, SearchItemComponent, SearchItemLabelDirective, SearchPanelComponent, SecretType, SelectPrefixLabelDirective, SpanComponent, StatusIconComponent, StopDirective, StringArrayFormTableComponent, StrongPasswordDirective, StrongPasswordTooltipComponent, TEMPLATE_OPTIONS, TIMEZONES, TIME_FORMAT, TOKEN_HELP_DOC_DATA, TRUE, TableCellDefDirective, TableComponent, TableCustomColumnsComponent, TableUtilService, TagsLabelComponent, TaintEffect, TestTagComponent, TextEllipsisComponent, TextTooltipDirective, TextWithUrlComponent, ThemeTransformPipe, TimezoneDisplayPipe, TolerationOperator, TrimDirective, UNDERSCORE, UNITS, UNIT_REG, UPDATE, UPDATED_AT, UPDATED__AT, UpdateDescriptionDialogComponent, UpdateDisplayNameDialogComponent, UpdateKeyValueDialogComponent, UploadFileComponent, UserSecurityPolicyRule, UserState, VOLUME_SNAPSHOT_GROUP, ValidateRowDuplicateService, ValidatorsDirective, VolumeMode, VolumeModes, VolumeTypeEnum, WEEK_DAYS, WILDCARD, WORKSPACE_PARAMS, WorkloadKind, WorkloadStatusColorMapper, WorkloadStatusEnum, WorkloadStatusIconComponent, WorkloadStatusIconMapper, YamlUtilService, ZeroStateComponent, addUnitCoreM, addUnitGi, addUnitMi, appendImageHeader, atobWithFallback, buildImageAddress, buildUrl, checkValueExit, clearWindowsXtermTools, commonOptions, compareMinorVersion, compareVersion, copyValue, createActions, createNestedFormControl, cronValidator, cronValidatorBasic, dataTransfer, dateValueOf, defaultFilter, defaultSorter, emptyObjectRemoveRuleFactory, errorColor, extractListParamsFromRoute, extractPagedListParams, extractWorkspace, extractWorkspaceFromRoute, filterEmptyValue, filterTrees, findPath, firstPath, formatCPU, formatMemory, formatNumber, genControlDepsMap, getAppropriateMemory, getBaseHref, getCpu, getCronWeekDayNumbers, getDisabledState, getDisabledState$, getHelpDocUrl, getHostname, getJobStatus, getK8sResourceAnnotationErrorMapper, getK8sResourceAnnotationErrorMapper$, getK8sResourceLabelErrorMapper, getK8sResourceLabelErrorMapper$, getMemory, getPickerTimeRanges, getPodAggregatedStatus, getPodIPs, getPodStatus, getPrivateIP, getPrivateIPv4, getPrivateIPv6, getRelativePath, getResourceLimitAsyncValidatorFn, getResourceLimitValidatorFn, getResourceValue, getResourceViewModel, getToPath, getValidVersion, getWorkloadStatus, initGreaterValidator, isAbsoluteUrl, isB, isCronFieldCountCorrect, isCronWeekDayCorrect, isCronWeekDaysContinuous, isErrorMessage, isJsonObjectString, isK8sResource, isL, isR, isSelectAll, isT, isValidRID, isValidWorkspace, k8sResourceAnnotationKeyValidator, k8sResourceAnnotationValidator, k8sResourceLabelKeyValidator, k8sResourceLabelValidator, k8sResourceLabelValueValidator, loadEnv, logsActions, logsReadOptions, mapTrees, matchExpressionsToString, matchLabelsToString, maxParallelByHttpVersion, noShowRowError, normalizeParams, numToStr, parseDaemonSetStatus, parseDeploymentStatus, parseImageAddress, parseRID, parseStatefulSetStatus, parseToWorkloadStatus, parseUrlInText, parseValidImageName, parseValueAndUnit, parseVersion, parseWorkspace, prefixFilterRuleFactory, primaryColor, queryListParams, randomPassword, readonlyOptions, reduceTrees, removeDirtyFieldsBeforeUpdate, resourceUnits, rowBackgroundColorFn, safeAssign, scrollIntoView, setNode, setupErrorMapper, shortNum, sortByCreationTimestamp, stringToMatchLabels, stringifyRID, stringifyWorkspace, successColor, tableSort, tableSortAdvance, tagRenderDefault, textWriteOptions, toLowerFirstLetter, toNumber, toPercent, toPx, toUnitGi, toUnitI, toUnitMi, toUnitNum, toUnitNumM, trackByName, trackByUid, transferResource, updateActions, versionRegex, viewActions, warnColor, withLoadState, workspaceToPath, yamlFilterField, yamlReadOptions, yamlWriteOptions };
+export { ACTION, AIT_API_GROUP, ALL, ALL_VALUE, ANNOTATIONS, API_GATEWAY, ARGOCD_GROUP, ARRAY_FORM_TABLE_MODULE, ARRAY_TABLE_FORM_ERROR_BG, ASSIGN_ALL, ASYNC_DATA_MODULE, AccessMode, AccessModes, AclTableVirtualComponent, AclTableVirtualHeaderDefDirective, AclTableVirtualModule, AclTableVirtualPlaceholderDefDirective, AclTableVirtualRowDefDirective, AlaudaDeployStatus, AlaudaRunningStatus, ArrayFormTableComponent, ArrayFormTableFooterDirective, ArrayFormTableHeaderDirective, ArrayFormTableRowControlDirective, ArrayFormTableRowDirective, ArrayFormTableRowErrorDirective, ArrayFormTableRowSeparatorDirective, ArrayFormTableZeroStateDirective, AsyncDataLoader, AsyncFunctionValidatorDirective, AuiCodeEditorHelperDirective, BASE_TIMEZONE, BUILT_IN_YAML_EXAMPLES, BaseFormContainer, BaseNestedFormControl, BaseNestedFormControlPure, BaseStringMapFormComponent, Bracket, CHART_PICKER_TIME_RANGES, CLUSTER, COMMON_RESOURCE_DEFINITIONS, CORE_UNITS, CORE_UNIT_REG, CREATE, CREATED_AT, CREATION_TIMESTAMP, CREATOR, CRON_ENABLE_7_FOR_SUNDAY, CRON_FORMAT_ERROR, CRON_MIN_INTERVAL_ERROR, CRYPTO_HEADER_KEY, CRYPTO_KEY, CRYPTO_RANDOM_HEADER_KEY, CRYPTO_TYPE, CUSTOM, CUSTOMIZED, CUSTOM_RANGE, CalcPipe, CardSectionComponent, ClickOutsideDirective, CloudHelmRequestStateEnum, CodeDisplayDialogComponent, CoerceNumberDirective, ConfirmDeleteComponent, ConfirmDeleteContentDirective, ConfirmDeleteLabelDirective, ConfirmDeleteTipDirective, ControlValueTraceDirective, CronHumanReadablePipe, CronWeekDays, CrontabNextPipe, CurrentTimeComponent, DATE_FORMAT, DATE_TIME_FORMAT, DEFAULT_CODE_EDITOR_OPTIONS, DEFAULT_CONTAINER_ANNOTATION, DEFAULT_OPERATOR, DEFAULT_OPTIONS, DEFAULT_REASON, DELIMITER, DESCRIPTION, DISPLAY_NAME, DNS1123SubdomainValidator, DOMAIN_PATTERN, DOMAIN_PATTERN_BASE, DOT, DOWNGRADE_WATCH_ENABLED, DOWNGRADE_WATCH_POLLING, DUPLICATE_ERROR_KEY, DUPLICATION_JUSTIFY_STRATEGY, DataSource, DateRangePickerComponent, DeclareDirective, DefaultStatusColorMapper, DefaultStatusIconMapper, DeleteType, DeletingTagComponent, DisabledContainerComponent, DisabledDirective, DragHandleDirective, DurationPipe, E2eAttributeBindingDirective, EFFECT_DIRECTIVE_MODULE, EMAIL_PATTERN, EMPTY, ERRORS_MAPPER_MODULE, ESCAPE_DEACTIVATE_CHECK, ErrorStateComponent, ErrorsMapperComponent, ErrorsMapperDirective, FALSE, FIELDSET_GROUP_COMPONENTS, FeatureGateDirective, FieldSetColumnComponent, FieldSetColumnGroupComponent, FieldSetGroupComponent, FieldSetItemActionDirective, FieldSetItemComponent, FileResultType, FoldableBlockComponent, FoldableItemInTableComponent, FormItemMarginEffectDirective, FunctionValidatorDirective, GLOBAL_CLUSTER, GenericStatusColor, GenericStatusIcon, GuardStatus, HTTP_ADDRESS_PATTERN, HTTP_DUAL_IP_OR_DOMAIN_PATTERN, HTTP_IP_OR_DOMAIN_PATTERN, HYPHEN, HelmRequestPhaseEnum, HelpDocDirective, HelpDocUrlPipe, HelpDocumentComponent, HelpDocumentService, IMAGE_TAG_PATTERN, INT_PATTERN, INT_ZERO_PATTERN, IPV4_IPV6_ADDRESS_HOSTNAME_PORT_PATTERN, IPV6_ADDRESS_HOSTNAME_PATTERN, IPV6_ADDRESS_HOSTNAME_PORT_PATTERN, IPV6_PATTERN_BASE, IP_ADDRESS_HOSTNAME_PATTERN, IP_ADDRESS_HOSTNAME_PATTERN_EXTEND, IP_ADDRESS_HOSTNAME_PORT_PATTERN, IP_ADDRESS_PATTERN, IP_ADDRESS_PORT_PATTERN, IP_ADDRESS_SUBNET_PATTERN, IP_PATTERN, IP_PATTERN_BASE, IP_V4_OR_V6_PATTERN, IP_V6_ADDRESS_PATTERN, IP_V6_PATTERN, InterceptDeactivateDirective, InterceptDeactivateGuard, InterceptDeactivateService, JobStatusColorMapper, JobStatusEnum, JobStatusIconMapper, K8SResourceList, K8SResourceListFooterComponent, K8SResourcePagedList, K8S_APP_API_GROUP, K8S_CORE_API_GROUP, K8S_RESOURCE_LABEL_KEY_NAME_PATTERN, K8S_RESOURCE_LABEL_KEY_PREFIX_PATTERN, K8S_RESOURCE_LABEL_VALUE_PATTERN, K8S_RESOURCE_LIST_MODULE, K8S_RESOURCE_NAME_START_WITH_CHARS_ONLY, K8S_RESOURCE_TRANSLATE_KEY, K8sListFooterLoadingErrorDirective, K8sListFooterNoDataDirective, K8sResourceAction, K8sResourceMarkComponent, K8sResourceTranslateKeyPipe, K8sSharedUtilService, K8sYamlDisplayDialogComponent, KNOWN_COLUMNS, KeyValueFormTableComponent, KeyValueTableComponent, LABELS, LINK, LOCAL_STORAGE_KEY_THEME_MODE, ListDisplayComponent, ListenResizeDirective, LoadAction, LocaleTransformPipe, MACHINE_API_GROUP, METADATA, MUTABLE_BASIC_OPTIONS, MUTABLE_MODULE, MarkedPipe, MaxLengthValidatorDirective, MaxValidatorDirective, MinLengthValidatorDirective, MinValidatorDirective, MinimumFormatPipe, MosaicComponent, MosaicLeftDirective, MosaicRightDirective, MultiSearchActionInputComponent, MultiSearchAdvanced, MultiSearchBasic, MultiSearchComponent, MutableDirective, NAME, NAMESPACE, NOTIFICATION_SERVER_NAME, NOTIFY_DURATION_HEADER, NOTIFY_ON_ERROR_HEADER, NOTIFY_ON_ERROR_HEADERS, NOT_NOTIFY_ON_ERROR_HEADERS, NUMBER_PATTERN, NamespaceBadgeComponent, NotBeValidatorDirective, OAM_GROUP, OnResizeChangeService, OneOfValidatorDirective, OverviewBannerComponent, PACKAGE_RUNTIME_VALUE, PAGE_GUARD_MODULE, PLATFORM_OPS_MODE, PORT_PATTERN, POSITIVE_INT_PATTERN, POSITIVE_NUMBER_PATTERN, PREFIX_LABEL_CLASS, PROJECT, PUBLIC_NAMESPACE, PageGuardComponent, PageGuardContentDirective, PageGuardDescriptionDirective, PageGuardImageDirective, PageGuardOperationDirective, PageStateComponent, ParseJsonTranslatePipe, PasswordInputComponent, PluginClusterSelectorComponent, PodStatusColorMapper, PodStatusComponent, PodStatusEnum, PodStatusIconMapper, PreventClipboardDirective, PreventDirective, PreventHandler, ProductKey, REASON_MAP, RESOURCE_MAC_TYPES, RESOURCE_REQUIREMENT_KEYS, ReadonlyFieldDirective, Reason, RelativeTimeComponent, RequestPool, ResizeDirective, ResourceLabelComponent, ResourceMultiSelectComponent, ResourceYamlDisplayComponent, ResourceYamlEditorComponent, SERVICE_PORT_BASE_PROTOCOLS, SERVICE_PORT_PROTOCOLS, SERVICE_SESSION_AFFINITIES, SERVICE_TYPES, SLASH, SPACE, SPEC, STATUS, STRATEGY_JUDGE_MAPPER, STRONG_PASSWORD_SPECIAL_CHARS, ScrollBorderObserverDirective, ScrollToFirstInvalidDirective, ScrollToFirstInvalidMarkerDirective, SearchItemComponent, SearchItemLabelDirective, SearchPanelComponent, SecretType, SelectPrefixLabelDirective, SpanComponent, StatusIconComponent, StopDirective, StringArrayFormTableComponent, StrongPasswordDirective, StrongPasswordTooltipComponent, TEMPLATE_OPTIONS, TIMEZONES, TIME_FORMAT, TOKEN_HELP_DOC_DATA, TRUE, TableCellDefDirective, TableComponent, TableCustomColumnsComponent, TableHeaderCellDefDirective, TableUtilService, TagsLabelComponent, TaintEffect, TerminatingTagComponent, TestTagComponent, TextEllipsisComponent, TextTooltipDirective, TextWithUrlComponent, ThemeTransformPipe, TimezoneDisplayPipe, TolerationOperator, TrimDirective, UNDERSCORE, UNITS, UNIT_REG, UPDATE, UPDATED_AT, UPDATED__AT, UpdateDescriptionDialogComponent, UpdateDisplayNameDialogComponent, UpdateKeyValueDialogComponent, UploadFileComponent, UserSecurityPolicyRule, UserState, VOLUME_SNAPSHOT_GROUP, ValidateRowDuplicateService, ValidatorsDirective, VolumeMode, VolumeModes, VolumeTypeEnum, WEEK_DAYS, WILDCARD, WORKSPACE_PARAMS, WorkloadKind, WorkloadStatusColorMapper, WorkloadStatusEnum, WorkloadStatusIconComponent, WorkloadStatusIconMapper, YamlUtilService, ZeroStateComponent, addUnitCoreM, addUnitGi, addUnitMi, appendImageHeader, atobWithFallback, buildImageAddress, buildUrl, checkValueExit, clearWindowsXtermTools, compareMinorVersion, compareVersion, copyValue, createNestedFormControl, cronValidator, cronValidatorBasic, dataTransfer, dateValueOf, defaultFilter, defaultSorter, emptyObjectRemoveRuleFactory, errorColor, extractListParamsFromRoute, extractPagedListParams, extractWorkspace, extractWorkspaceFromRoute, filterEmptyValue, filterTrees, findPath, firstPath, formatCPU, formatMemory, formatNumber, genControlDepsMap, getAppropriateMemory, getBaseHref, getCpu, getCronWeekDayNumbers, getDisabledState, getDisabledState$, getHelpDocUrl, getHostname, getJobStatus, getK8sResourceAnnotationErrorMapper, getK8sResourceAnnotationErrorMapper$, getK8sResourceLabelErrorMapper, getK8sResourceLabelErrorMapper$, getMemory, getPickerTimeRanges, getPodAggregatedStatus, getPodIPs, getPodStatus, getPrivateIP, getPrivateIPv4, getPrivateIPv6, getRelativePath, getResourceLimitAsyncValidatorFn, getResourceLimitValidatorFn, getResourceValue, getResourceViewModel, getToPath, getValidVersion, getWorkloadStatus, initGreaterValidator, isAbsoluteUrl, isB, isCronFieldCountCorrect, isCronWeekDayCorrect, isCronWeekDaysContinuous, isErrorMessage, isJsonObjectString, isK8sResource, isL, isR, isSelectAll, isT, isValidRID, isValidWorkspace, k8sResourceAnnotationKeyValidator, k8sResourceAnnotationValidator, k8sResourceLabelKeyValidator, k8sResourceLabelValidator, k8sResourceLabelValueValidator, loadEnv, logsReadOptions, mapTrees, matchExpressionsToString, matchLabelsToString, maxParallelByHttpVersion, noShowRowError, normalizeParams, numToStr, parseDaemonSetStatus, parseDeploymentStatus, parseImageAddress, parseRID, parseStatefulSetStatus, parseToWorkloadStatus, parseUrlInText, parseValidImageName, parseValueAndUnit, parseVersion, parseWorkspace, prefixFilterRuleFactory, primaryColor, queryListParams, randomPassword, reduceTrees, removeDirtyFieldsBeforeUpdate, resourceUnits, rowBackgroundColorFn, safeAssign, scrollIntoView, setNode, setupErrorMapper, shortNum, sortByCreationTimestamp, stringToMatchLabels, stringifyRID, stringifyWorkspace, successColor, tableSort, tableSortAdvance, tagRenderDefault, toLowerFirstLetter, toNumber, toPercent, toPx, toUnitGi, toUnitI, toUnitMi, toUnitNum, toUnitNumM, trackByName, trackByUid, transferResource, versionRegex, warnColor, withLoadState, workspaceToPath, yamlFilterField };
 //# sourceMappingURL=alauda-fe-dynamic-plugin-shared.mjs.map