@acorex/components 19.14.0 → 19.14.2

package/fesm2022/acorex-components-common.mjs

@@ -1,2087 +0,0 @@
-import * as i0 from '@angular/core';
-import { model, output, Component, inject, ElementRef, signal, afterNextRender, Injectable, ChangeDetectorRef, ViewContainerRef, EventEmitter, PLATFORM_ID, Input, Host, Self, Optional, Directive, NgModule, InjectionToken, input, HostListener, Output, effect } from '@angular/core';
-import { AXHtmlUtil } from '@acorex/core/utils';
-import { flatten, clone, cloneDeep, isEqual, omit, set } from 'lodash-es';
-import { isBrowser } from '@acorex/core/platform';
-import { AXValidationService } from '@acorex/core/validation';
-import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
-import { DOCUMENT, isPlatformBrowser } from '@angular/common';
-import { noop, Subscription, BehaviorSubject, debounceTime, distinctUntilChanged, Subject, fromEvent, skip } from 'rxjs';
-import { DataSource } from '@angular/cdk/collections';
-import * as i1 from '@angular/platform-browser';
-import { Observable } from 'rxjs/internal/Observable';
-import { map, pairwise, filter, startWith, exhaustMap } from 'rxjs/operators';
-import { classes } from 'polytype';
-import { AXFormatService } from '@acorex/core/format';
-import * as i1$1 from '@angular/forms';
-
-class NXButtonComponent {
-    constructor() {
-        this.text = model();
-        this.toggleableChange = output();
-        this.selectedChange = output();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: NXButtonComponent, isStandalone: true, selector: "ng-component", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { text: "textChange", toggleableChange: "toggleableChange", selectedChange: "selectedChange" }, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXButtonComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: '',
-                }]
-        }] });
-
-class NXColorComponent {
-    constructor() {
-        this.color = model('default');
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: NXColorComponent, isStandalone: true, selector: "ng-component", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { color: "colorChange" }, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXColorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: '',
-                }]
-        }] });
-
-class NXComponent {
-    constructor() {
-        this.#elementRef = inject(ElementRef);
-        this.#isRendered = signal(false);
-        this.isRendered = this.#isRendered.asReadonly();
-        this.#afterNextRender = afterNextRender(() => {
-            if (!this.isRendered()) {
-                this.nativeElement['__axContext__'] = this;
-                this.#isRendered.set(true);
-            }
-        });
-    }
-    #elementRef;
-    #isRendered;
-    #afterNextRender;
-    get nativeElement() {
-        return this.#elementRef.nativeElement;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXComponent, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- *  Base event class
- * @category Events
- */
-class NXEvent {
-}
-/**
- *  Contains native event
- * @category Events
- */
-class NXNativeEvent extends NXEvent {
-}
-/**
- *  Fires each time the user click the element.
- * @category Events
- */
-class NXClickEvent extends NXNativeEvent {
-}
-
-class NXInteractiveComponent extends NXComponent {
-    constructor() {
-        super(...arguments);
-        this.disabled = model(false);
-        this.tabIndex = model(0);
-        this.onFocus = output();
-        this.onBlur = output();
-    }
-    focus() {
-        AXHtmlUtil.focusElement(this.nativeElement);
-    }
-    blur() {
-        AXHtmlUtil.blurElement(this.nativeElement);
-    }
-    hasFocus() {
-        return AXHtmlUtil.hasFocus(this.nativeElement);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXInteractiveComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: NXInteractiveComponent, isStandalone: true, selector: "ng-component", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", tabIndex: "tabIndexChange", onFocus: "onFocus", onBlur: "onBlur" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXInteractiveComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: '',
-                }]
-        }] });
-
-class NXLookComponent {
-    constructor() {
-        this.look = model('solid');
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXLookComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: NXLookComponent, isStandalone: true, selector: "ng-component", inputs: { look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { look: "lookChange" }, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXLookComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: '',
-                }]
-        }] });
-
-class NXValueComponent {
-    constructor() {
-        this.readonly = model();
-        this.name = model();
-        this.value = model();
-        this.onValueChanged = output();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: NXValueComponent, isStandalone: true, selector: "ng-component", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { readonly: "readonlyChange", name: "nameChange", value: "valueChange", onValueChanged: "onValueChanged" }, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NXValueComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: '',
-                }]
-        }] });
-
-const defaultOffset = 3;
-function convertToPlacement(value) {
-    const result = [];
-    if (value == null)
-        return result;
-    if (Array.isArray(value)) {
-        const list = flatten(value.map((m) => convertToPlacement(m)).filter((m) => m != null)).map((m) => clone(m));
-        result.push(...list);
-    }
-    else {
-        if (typeof value === 'string') {
-            const p = AX_PLACEMENT_MAP[value];
-            if (p) {
-                result.push(...[clone(p.origin), ...clone(p.alts)]);
-            }
-        }
-        else {
-            if ('originX' in value && 'originY' in value) {
-                result.push(clone(value));
-            }
-        }
-    }
-    return result;
-}
-const AX_PLACEMENT_TOP = {
-    originX: 'center',
-    originY: 'top',
-    overlayX: 'center',
-    overlayY: 'bottom',
-    offsetY: -defaultOffset,
-};
-const AX_PLACEMENT_TOP_START = {
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    offsetY: -defaultOffset,
-};
-const AX_PLACEMENT_TOP_END = {
-    originX: 'end',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    offsetY: -defaultOffset,
-};
-const AX_PLACEMENT_BOTTOM = {
-    originX: 'center',
-    originY: 'bottom',
-    overlayX: 'center',
-    overlayY: 'top',
-    offsetY: defaultOffset,
-};
-const AX_PLACEMENT_BOTTOM_START = {
-    originX: 'start',
-    originY: 'bottom',
-    overlayX: 'start',
-    overlayY: 'top',
-    offsetY: defaultOffset,
-};
-const AX_PLACEMENT_BOTTOM_END = {
-    originX: 'end',
-    originY: 'bottom',
-    overlayX: 'end',
-    overlayY: 'top',
-    offsetY: defaultOffset,
-};
-const AX_PLACEMENT_START = {
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'center',
-    offsetX: -defaultOffset,
-};
-const AX_PLACEMENT_START_TOP = {
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'end',
-    overlayY: 'top',
-    offsetX: -defaultOffset,
-};
-const AX_PLACEMENT_START_BOTTOM = {
-    originX: 'start',
-    originY: 'bottom',
-    overlayX: 'end',
-    overlayY: 'bottom',
-    offsetX: -defaultOffset,
-};
-const AX_PLACEMENT_END = {
-    originX: 'end',
-    originY: 'center',
-    overlayX: 'start',
-    overlayY: 'center',
-    offsetX: defaultOffset,
-};
-const AX_PLACEMENT_END_TOP = {
-    originX: 'end',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'top',
-    offsetX: defaultOffset,
-};
-const AX_PLACEMENT_END_BOTTOM = {
-    originX: 'end',
-    originY: 'bottom',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    offsetX: defaultOffset,
-};
-const AX_PLACEMENT_MAP = {
-    top: {
-        origin: AX_PLACEMENT_TOP,
-        alts: [AX_PLACEMENT_BOTTOM],
-    },
-    'top-start': {
-        origin: AX_PLACEMENT_TOP_START,
-        alts: [AX_PLACEMENT_BOTTOM_START],
-    },
-    'top-end': {
-        origin: AX_PLACEMENT_TOP_END,
-        alts: [AX_PLACEMENT_BOTTOM_END],
-    },
-    bottom: {
-        origin: AX_PLACEMENT_BOTTOM,
-        alts: [AX_PLACEMENT_BOTTOM],
-    },
-    'bottom-start': {
-        origin: AX_PLACEMENT_BOTTOM_START,
-        alts: [AX_PLACEMENT_BOTTOM_END, AX_PLACEMENT_TOP_START, AX_PLACEMENT_TOP_END, AX_PLACEMENT_START, AX_PLACEMENT_END],
-    },
-    'bottom-end': {
-        origin: AX_PLACEMENT_BOTTOM_END,
-        alts: [AX_PLACEMENT_TOP_END],
-    },
-    end: {
-        origin: AX_PLACEMENT_END,
-        alts: [AX_PLACEMENT_START],
-    },
-    'end-top': {
-        origin: AX_PLACEMENT_END_TOP,
-        alts: [AX_PLACEMENT_END_BOTTOM, AX_PLACEMENT_START_TOP, AX_PLACEMENT_START_BOTTOM],
-    },
-    'end-bottom': {
-        origin: AX_PLACEMENT_END_BOTTOM,
-        alts: [AX_PLACEMENT_END_TOP, AX_PLACEMENT_START_BOTTOM, AX_PLACEMENT_START_TOP],
-    },
-    start: {
-        origin: AX_PLACEMENT_START,
-        alts: [AX_PLACEMENT_END],
-    },
-    'start-top': {
-        origin: AX_PLACEMENT_START_TOP,
-        alts: [AX_PLACEMENT_START_BOTTOM, AX_PLACEMENT_END_TOP, AX_PLACEMENT_END_BOTTOM],
-    },
-    'start-bottom': {
-        origin: AX_PLACEMENT_START_BOTTOM,
-        alts: [AX_PLACEMENT_START_TOP, AX_PLACEMENT_END_BOTTOM, AX_PLACEMENT_END_TOP],
-    },
-};
-
-/**
- * A token that specifies the  selection mode of component.
- */
-
-class AXDomService {
-    generateElementId() {
-        const dateString = Date.now().toString(36);
-        const randomness = Math.random().toString(36).substr(2);
-        return dateString + randomness;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXDomService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXDomService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXDomService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-class MXBaseComponent {
-    constructor() {
-        this._cdr = inject(ChangeDetectorRef);
-        this._elementRef = inject(ElementRef);
-        this._viewRef = inject(ViewContainerRef);
-        this._domService = inject(AXDomService);
-        this._id = this._domService.generateElementId();
-        /**
-         * Fired when an option related to the component changes.
-         *
-         * @event
-         */
-        this.onOptionChanged = new EventEmitter();
-    }
-    get id() {
-        return this._id;
-    }
-    set id(v) {
-        this._id = v;
-    }
-    get cdr() {
-        return this._cdr;
-    }
-    getHostElement() {
-        return this._elementRef?.nativeElement;
-    }
-    getViewContainer() {
-        return this._viewRef;
-    }
-    internalOptionChanging(option) {
-        return option?.value;
-    }
-    internalOptionChanged(option) { }
-    /**
-     *  @ignore
-     */
-    ngOnInit() {
-        this.getHostElement().__axContext__ = this;
-    }
-    setOption(option) {
-        const oldValue = this[option.name];
-        let newValue = this.internalOptionChanging({
-            name: option.name,
-            value: option.value,
-        });
-        if (option.beforeCallback) {
-            newValue = option.beforeCallback(oldValue, newValue);
-        }
-        //TODO : check real changes if value is object
-        if (oldValue != newValue) {
-            this[`_${option.name}`] = option.value;
-            this.onOptionChanged.emit({
-                component: this,
-                name: option.name,
-                newValue,
-                oldValue,
-            });
-            const emitter = this[`${option.name}Change`];
-            emitter?.emit(newValue);
-            this.internalOptionChanged({ name: option.name, value: newValue });
-        }
-        if (option.afterCallback)
-            option.afterCallback(oldValue, newValue);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXBaseComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXBaseComponent, decorators: [{
-            type: Injectable
-        }] });
-
-class MXInteractiveComponent extends MXBaseComponent {
-    constructor() {
-        super(...arguments);
-        /**
-         *  @ignore
-         */
-        this.onTouchedCallback = noop;
-        this._touched = false;
-        /**
-         * Emits an event whenever the disabled state of the component changes.
-         *
-         * @event
-         */
-        this.disabledChange = new EventEmitter();
-        this._tabIndex = 0;
-        /**
-         *  Fires each time the component gets focused.
-         *  @event
-         */
-        this.onFocus = new EventEmitter();
-        /**
-         *  Fires each time the component gets blurred.
-         *  @event
-         */
-        this.onBlur = new EventEmitter();
-        // private _focused = signal(false);
-        // protected markAsFocused() {
-        //   this._focused.set(true);
-        // }
-        // protected markAsBlured() {
-        //   this._focused.set(false);
-        // }
-    }
-    registerOnTouched(fn) {
-        this.onTouchedCallback = fn;
-    }
-    /**
-     * Indicates whether the component has been touched.
-     *
-     */
-    get touched() {
-        return this._touched;
-    }
-    /**
-     *  @ignore
-     */
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouchedCallback();
-            this._touched = true;
-        }
-    }
-    /**
-     *  If set to true, it disables the component.
-     */
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        value = coerceBooleanProperty(value);
-        this.setOption({
-            name: 'disabled',
-            value,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-    /**
-     *  Specifies the tabindex of the component.
-     */
-    get tabIndex() {
-        return this.disabled ? -1 : this._tabIndex;
-    }
-    set tabIndex(value) {
-        this.setOption({
-            name: 'tabIndex',
-            value: value != null ? coerceNumberProperty(value) : 0,
-        });
-    }
-    emitOnFocusEvent(e) {
-        this.onFocus.emit({
-            component: this,
-            htmlElement: this.getHostElement(),
-            nativeEvent: e,
-        });
-    }
-    emitOnBlurEvent(e) {
-        this.markAsTouched();
-        this.onBlur.emit({
-            component: this,
-            htmlElement: this.getHostElement(),
-            nativeEvent: e,
-        });
-    }
-    // /**
-    //  *  Fires each time the user clicks the button.
-    //  *  @event
-    //  */
-    // onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();
-    // protected emitOnClickEvent(e: MouseEvent): void {
-    //   this.onClick.emit({
-    //     component: this,
-    //     htmlElement: this.getHostElement(),
-    //     nativeEvent: e,
-    //   });
-    // }
-    focus() {
-        AXHtmlUtil.focusElement(this.getHostElement());
-    }
-    blur() {
-        AXHtmlUtil.blurElement(this.getHostElement());
-    }
-    /**
-     *  Check component is focused or has any focused element.
-     */
-    hasFocus() {
-        return AXHtmlUtil.hasFocus(this.getHostElement());
-    }
-}
-
-class MXValueComponent extends MXInteractiveComponent {
-    constructor() {
-        super(...arguments);
-        /**
-         *  Fires each time the user press a key.
-         *  @event
-         */
-        this.onValueChanged = new EventEmitter();
-        /**
-         * @deprecated The event should not be used, use ngModelChange instead
-         */
-        this.valueChange = new EventEmitter();
-        this.readonlyChange = new EventEmitter();
-        this._readonly = false;
-        this._dirty = false;
-        this._isUserInteraction = false;
-        this.stateChange = new EventEmitter();
-        this._state = 'clear';
-        this.document = inject(DOCUMENT);
-        this.platformID = inject(PLATFORM_ID);
-        this.validationService = inject(AXValidationService);
-        this.validationRulesChange = new EventEmitter();
-        this.validationRules = [];
-        this.onChangeCallback = noop;
-    }
-    /**
-     *  If set to true, user cannot change the value of component.
-     */
-    get readonly() {
-        return this._readonly;
-    }
-    set readonly(value) {
-        value = coerceBooleanProperty(value);
-        this.setOption({
-            name: 'readonly',
-            value,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-    get name() {
-        return this._name;
-    }
-    set name(value) {
-        this._name = value;
-    }
-    get dirty() {
-        return this._dirty;
-    }
-    markAsDirty() {
-        this._dirty = true;
-    }
-    /**
-     * @deprecated The property should not be used, use ngModel instead
-     */
-    get value() {
-        return this.internalGetValue(this._value) ?? this.defaultValue;
-    }
-    set value(v) {
-        v = this.internalSetValue(v);
-        const old = cloneDeep(this.value);
-        if (v === null || v === undefined || v === '' || (Array.isArray(v) && v.length === 0)) {
-            this.setState('clear');
-            if (old === null || old === undefined || old === '' || (Array.isArray(old) && old.length === 0)) {
-                return;
-            }
-        }
-        if (!isEqual(old, v)) {
-            this._value = v;
-            this.emitOnValueChangedEvent(old, this.value);
-            this.internalValueChanged(this.value);
-        }
-    }
-    get state() {
-        return this._state;
-    }
-    set state(value) {
-        this.setState(value);
-        this.stateChange.emit(value);
-    }
-    emitOnValueChangedEvent(oldValue, newValue) {
-        this.valueChange.emit(newValue);
-        this.onValueChanged.emit({
-            component: this,
-            value: newValue,
-            oldValue: oldValue,
-            name: this.name,
-            isUserInteraction: this._isUserInteraction,
-        });
-        this.onChangeCallback(newValue);
-        this.cdr.markForCheck();
-        this._isUserInteraction = false;
-    }
-    internalSetValue(value) {
-        return value;
-    }
-    internalGetValue(value) {
-        return value;
-    }
-    internalValueChanged(value) { }
-    ngOnInit() {
-        super.ngOnInit();
-        //
-        this.registerValidation();
-    }
-    ngOnDestroy() {
-        this.onValueChanged?.unsubscribe();
-        this.onOptionChanged?.unsubscribe();
-    }
-    registerValidation() {
-        const a = this.getHostElement().querySelectorAll('[ax-form-item="true"]');
-        a.forEach((c) => {
-            c.removeAttribute('ax-form-item');
-        });
-        this.getHostElement().setAttribute('ax-form-item', 'true');
-    }
-    get isRequired() {
-        return this.validationRules?.some((c) => c.rule == 'required');
-    }
-    addValidationRule(rule) {
-        this.validationRules.push(rule);
-        this.validationRulesChange.emit(this.validationRules);
-    }
-    removeValidationRule(ruleToRemove) {
-        this.validationRules = this.validationRules.filter((r) => {
-            if (r.rule !== ruleToRemove.rule) {
-                return true;
-            }
-            // Create copies of options without the 'title' property
-            const rOptionsSanitized = omit(r.options, ['title']);
-            const ruleToRemoveOptionsSanitized = omit(ruleToRemove.options, ['title']);
-            return !isEqual(rOptionsSanitized, ruleToRemoveOptionsSanitized);
-        });
-        this.validationRulesChange.emit(this.validationRules);
-        this.setState('clear');
-    }
-    async validate() {
-        const container_classes = ['ax-editor-container', 'ax-checkbox', 'ax-radio'];
-        const container = container_classes.some((c) => this.getHostElement().classList.contains(c))
-            ? this.getHostElement()
-            : this.getHostElement().querySelector('.ax-editor-container');
-        const formField = container?.closest('ax-form-field') || container?.closest('ax-checkbox');
-        const label = formField?.querySelector('ax-label') || formField?.querySelector('label');
-        //
-        const rules = this.validationService.ruleFor(this.value);
-        this.validationRules.forEach((r) => {
-            r.options['title'] = (label?.firstChild?.textContent ?? this.name)?.replace('*', '').trim();
-            rules.addRule(r.rule, r.options);
-        });
-        const result = await rules.validate();
-        if (result.result) {
-            this.setState('clear');
-        }
-        else {
-            const message = result.rules.find((c) => !c.result).message;
-            this.setState('error', message);
-        }
-        return result;
-    }
-    setState(state, ...args) {
-        //TODO: find a better solution
-        if (isBrowser()) {
-            const container = this.getHostElement().classList.contains('ax-editor-container')
-                ? this.getHostElement()
-                : this.getHostElement().querySelector('.ax-editor-container');
-            const formField = container?.closest('ax-form-field');
-            const label = formField?.querySelector('ax-label') || formField?.querySelector('label');
-            let target = container || this.getHostElement().firstElementChild;
-            if (target?.querySelector('.ax-error-container')) {
-                target = target.querySelector('.ax-error-container');
-            }
-            const parent = target?.parentElement;
-            if (!target || !parent)
-                return;
-            switch (state) {
-                case 'clear':
-                    this._state = 'clear';
-                    if (parent.querySelector('span.ax-error-message')) {
-                        parent.removeChild(parent.querySelector('span.ax-error-message'));
-                    }
-                    label?.classList.remove('ax-state-error');
-                    target.classList.remove('ax-state-error', 'ax-state-success');
-                    break;
-                case 'success':
-                    this.setState('clear');
-                    target.classList.add('ax-state-success');
-                    this._state = 'success';
-                    break;
-                case 'error':
-                    this.setState('clear');
-                    if (args[0] && isPlatformBrowser(this.platformID)) {
-                        const span = this.document.createElement('span');
-                        span.innerHTML = args[0];
-                        span.classList.add('ax-error-message');
-                        parent.appendChild(span);
-                    }
-                    label?.classList.add('ax-state-error');
-                    target.classList.add('ax-state-error');
-                    this._state = 'error';
-                    break;
-            }
-            this.cdr.markForCheck();
-        }
-    }
-    registerOnChange(fn) {
-        this.onChangeCallback = fn;
-    }
-    writeValue(value) {
-        this.value = value;
-    }
-    commitValue(value, u = false) {
-        if (u) {
-            this.markAsTouched();
-            this.markAsDirty();
-            this._isUserInteraction = true;
-        }
-        this.writeValue(value);
-    }
-    reset(e = false) {
-        this.commitValue(null, e);
-    }
-    resetErrors() {
-        this.setState('clear');
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXValueComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXValueComponent, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- *  Contains native event
- * @category Events
- */
-class AXEvent {
-    constructor() {
-        this.isUserInteraction = false;
-    }
-}
-/**
- *  Contains native event
- * @category Events
- */
-class AXHtmlEvent extends AXEvent {
-}
-/**
- *  Contains native event
- * @category Events
- */
-class AXValueChangedEvent extends AXEvent {
-}
-/**
- *  Contains native event
- * @category Events
- */
-class AXOptionChangedEvent extends AXEvent {
-}
-/**
- *  Fires each time the user click the element.
- * @category Events
- */
-class AXClickEvent extends AXHtmlEvent {
-    constructor() {
-        super(...arguments);
-        /**
-         *  uses for extra data
-         */
-        this.data = null;
-        this.nativeEvent = null;
-    }
-}
-/**
- *  Fires each time the user click the element.
- * @category Events
- */
-class AXButtonClickEvent extends AXClickEvent {
-}
-/**
- *  Fires each time the user click the element.
- * @category Events
- */
-class AXItemClickEvent extends AXClickEvent {
-}
-/**
- *  Fires each time the component gets focused.
- * @category Events
- */
-class AXFocusEvent extends AXHtmlEvent {
-}
-/**
- *  Fires each time an item or multiple items selected by the user or value.
- * @category Events
- */
-class AXSelectionValueChangedEvent extends AXValueChangedEvent {
-    constructor() {
-        super(...arguments);
-        this.value = null;
-        this.oldValue = null;
-        this.selectedKeys = [];
-        this.selectedItems = [];
-    }
-}
-/**
- *  Contains range start & end values
- * @category Events
- */
-class AXRangeChangedEvent extends AXEvent {
-}
-
-const TAB_META_KEY = '__meta__';
-class AXComponentCloseEvent extends AXEvent {
-}
-class AXComponentClosing {
-    constructor() {
-        this.cancel = false;
-    }
-}
-class AXComponentResult {
-}
-/**
- *  Defines a CSS class—or multiple classes separated by spaces— which are applied to a span element inside the Button. Allows the usage of custom icons after the primary text.
- */
-class AXComponentClosedPromise extends Promise {
-    constructor(executor) {
-        super(executor);
-    }
-    close() {
-        if (this.closeMethod) {
-            this.closeMethod();
-        }
-    }
-}
-class AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXClosbaleComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClosbaleComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClosbaleComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClosbaleComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXClearableComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClearableComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClearableComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXClearableComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXSearchableComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXSearchableComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXSearchableComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXSearchableComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXValuableComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXValuableComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXValuableComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXValuableComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXFocusableComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXFocusableComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXFocusableComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXFocusableComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXPagedComponent extends AXComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXPagedComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXPagedComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXPagedComponent, decorators: [{
-            type: Injectable
-        }] });
-class AXAutocompleteParentComponent extends MXValueComponent {
-    constructor() {
-        super(...arguments);
-        this.onKeyDown = new EventEmitter();
-        this.onItemSelected = new EventEmitter();
-    }
-    emitOnItemSelected(value, isUserInteraction = false) {
-        if (isEqual(value, this.oldInputEmitValue))
-            return;
-        this.onItemSelected.emit({
-            value,
-            name: this.name,
-            component: this,
-            isUserInteraction,
-            oldValue: this.oldInputEmitValue,
-            htmlElement: this.getHostElement(),
-        });
-        this.oldInputEmitValue = value;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXAutocompleteParentComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXAutocompleteParentComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXAutocompleteParentComponent, decorators: [{
-            type: Injectable
-        }] });
-
-class AXListDataSource extends DataSource {
-    get range() {
-        return this._range;
-    }
-    /**
-     * @ignore
-     */
-    constructor(config) {
-        super();
-        this.config = config;
-        this.debounceTime = 0;
-        this.subscription = new Subscription();
-        this._range = { start: 0, end: 0 };
-        this.source = config.source;
-        if (config.debounceTime)
-            this.debounceTime = config.debounceTime;
-        //
-        this.dataStream = new BehaviorSubject(this.config.source.cachedItems);
-        this.source.onChanged.subscribe((data) => {
-            this.dataStream.next(data.cachedItems);
-        });
-    }
-    connect(collectionViewer) {
-        this.subscription.add(collectionViewer.viewChange
-            .pipe(debounceTime(this.debounceTime))
-            .pipe(distinctUntilChanged())
-            .subscribe((range) => {
-            this._range = range;
-            const startPage = this.getPageForIndex(range.start);
-            const endPage = this.getPageForIndex(range.end - 1);
-            for (let i = startPage; i <= endPage; i++) {
-                this.source.setPage(i);
-            }
-        }));
-        return this.dataStream;
-    }
-    disconnect() {
-        this.subscription.unsubscribe();
-    }
-    getPageForIndex(index) {
-        return Math.floor(index / this.source.config.pageSize);
-    }
-    refresh() {
-        this.dataStream.next(new Array(this.source.pageSize));
-        this.source.refresh();
-    }
-}
-
-class AXDataSource {
-    get totalCount() {
-        return this._totalCount;
-    }
-    get totalPages() {
-        return Math.ceil(this.totalCount / this.config.pageSize);
-    }
-    get pageSize() {
-        return this.config.pageSize;
-    }
-    get cachedItems() {
-        return this._cachedItems;
-    }
-    get items() {
-        return this._items;
-    }
-    get query() {
-        return this._query;
-    }
-    get isLoading() {
-        return this._isLoading;
-    }
-    constructor(config) {
-        this.useCache = true;
-        this._totalCount = 0;
-        this._items = [];
-        this.fetchedPages = new Set();
-        this._page = 0;
-        this._query = { skip: 0, take: 0, sort: [] };
-        this.onChanged = new Subject();
-        this.onItemExpanded = new Subject();
-        this.onItemRefreshChildren = new Subject();
-        this.onLoadingChanged = new Subject();
-        this._isLoading = false;
-        this.config = config;
-        this._cachedItems = new Array(this.config.pageSize);
-        this._items = new Array(0);
-        this._query.take = this.config.pageSize;
-    }
-    load() {
-        const page = this._page;
-        if (this.fetchedPages.has(page) && this.useCache) {
-            return;
-        }
-        this.setLoadingState(true);
-        this.fetchedPages.add(page);
-        this._query.take = this.config.pageSize;
-        this._query.skip = page * this.config.pageSize;
-        this.config
-            .load({ ...this._query })
-            .then((result) => {
-            if (this._totalCount != result.total) {
-                this._cachedItems = new Array(result.total);
-                this._totalCount = result.total;
-            }
-            this._items = result.items;
-            this._cachedItems.splice(page * this.config.pageSize, this.config.pageSize, ...result.items);
-            const event = {
-                cachedItems: this.cachedItems,
-                items: this.items,
-                page: page,
-                totalCount: this.totalCount,
-                totalPages: this.totalPages,
-            };
-            this.onChanged.next(event);
-        })
-            .finally(() => {
-            this.setLoadingState(false);
-        });
-    }
-    async getItemsByFilter(filter) {
-        return await this.config.load({ ...this.query, filter });
-    }
-    setLoadingState(value) {
-        this._isLoading = value;
-        this.onLoadingChanged.next(this._isLoading);
-    }
-    setPage(page) {
-        if (this._page != page || this._items.length == 0) {
-            this._page = page;
-            this.load();
-        }
-    }
-    setPageSize(pageSize) {
-        this.config.pageSize = pageSize;
-        this.load();
-    }
-    filter(value) {
-        this._query.filter = value;
-    }
-    sort(...value) {
-        this._query.sort = value;
-    }
-    clearFilter() {
-        this._query.filter = null;
-    }
-    reset() {
-        this._query.filter = null;
-        this._query.sort = [];
-        this._query.skip = 0;
-        this._items = new Array(0);
-        this._cachedItems = new Array(this.config.pageSize);
-        this.fetchedPages.clear();
-        this._page = 0;
-        this._totalCount = 0;
-    }
-    refresh() {
-        const currentFilter = this._query.filter;
-        const currentSort = this._query.sort;
-        this.reset();
-        this._query.filter = currentFilter;
-        this._query.sort = currentSort;
-        this.load();
-    }
-    find(key) {
-        const fromCache = this.cachedItems.find((c) => (!this.config.key && c == key) || (c && this.config.key && c[this.config.key] == key));
-        if (fromCache)
-            return fromCache;
-        return this.config.byKey ? this.config.byKey(key) : null;
-    }
-}
-function convertArrayToDataSource(items, options = { key: 'id', pageSize: 100 }) {
-    const config = {
-        key: options.key,
-        pageSize: options.pageSize,
-        load: async (e) => {
-            const result = e.filter ? handleSearch(items, e.filter) : items;
-            return {
-                items: result.slice(e.skip, e.skip + e.take),
-                total: result.length,
-            };
-        },
-        byKey: (v) => Promise.resolve(items.find((c) => {
-            return c[options.key] == v;
-        })),
-    };
-    const handleSearch = (items, filter) => {
-        if (!filter?.field || filter.value === undefined || filter.value === null) {
-            return items; // No filter applied
-        }
-        return items.filter((item) => {
-            const itemField = item[filter.field];
-            if (typeof itemField === 'string' && typeof filter.value === 'string') {
-                return itemField.toLowerCase().includes(filter.value.toLowerCase());
-            }
-            return false; // Return false if itemField isn't comparable
-        });
-    };
-    return new AXDataSource(config);
-}
-
-const AX_STYLE_COLOR_TYPES = [
-    'primary',
-    'secondary',
-    'success',
-    'warning',
-    'danger',
-    'default',
-];
-const AX_STYLE_LOOK_TYPES = ['solid', 'blank', 'outline', 'twotone', 'flat', 'fill', 'none'];
-const AX_LOCATIONS = [
-    'bottom-start',
-    'bottom-center',
-    'bottom-end',
-    'top-start',
-    'top-center',
-    'top-end',
-    'center-end',
-    'center-start',
-];
-
-class AXAutoFocusDirective {
-    constructor(renderer, el, _host) {
-        this.renderer = renderer;
-        this.el = el;
-        this._host = _host;
-        this.autoFocus = true;
-        this.time = 50;
-        this.document = inject(DOCUMENT);
-        this.platformID = inject(PLATFORM_ID);
-    }
-    ngAfterViewInit() {
-        this.doFocus();
-    }
-    doFocus() {
-        if (this.autoFocus) {
-            if (this._host) {
-                setTimeout(() => {
-                    this._host.focus();
-                }, this.time);
-                return;
-            }
-            const list = ['button', 'input', '[href]', 'select', 'textarea', '[tabindex]'].map((c) => c + ':not([tabindex="-1"])');
-            const focusable = this.el.nativeElement.querySelector(list.join(', ')) ?? this.el.nativeElement;
-            if (isPlatformBrowser(this.platformID)) {
-                const attr = this.document.createAttribute('autofocus');
-                focusable.setAttributeNode(attr);
-            }
-            const hasTabindex = focusable.hasAttribute('tabindex');
-            if (!hasTabindex) {
-                focusable.setAttribute('tabindex', '0');
-            }
-            setTimeout(() => {
-                focusable.focus();
-            }, this.time);
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXAutoFocusDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: AXFocusableComponent, host: true, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXAutoFocusDirective, isStandalone: true, selector: "[axAutoFocus]", inputs: { autoFocus: ["axAutoFocus", "autoFocus"], time: ["axAutoFocusTime", "time"] }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXAutoFocusDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[axAutoFocus]' }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: AXFocusableComponent, decorators: [{
-                    type: Host
-                }, {
-                    type: Self
-                }, {
-                    type: Optional
-                }] }], propDecorators: { autoFocus: [{
-                type: Input,
-                args: ['axAutoFocus']
-            }], time: [{
-                type: Input,
-                args: ['axAutoFocusTime']
-            }] } });
-
-class AXHotkeysService {
-    constructor(eventManager) {
-        this.eventManager = eventManager;
-        this.document = inject(DOCUMENT);
-        this.defaults = {
-            element: this.document,
-        };
-    }
-    /**
-     * Add shortcut
-     *
-     *
-     * @param options
-     * @returns Observable
-     *
-     */
-    addShortcut(options) {
-        const merged = { ...this.defaults, ...options };
-        const event = `keydown.${merged.keys}`;
-        return new Observable((observer) => {
-            const handler = (e) => {
-                e.preventDefault();
-                observer.next(e);
-            };
-            if (merged.element) {
-                // Todo: check addEventListener is not function
-                const dispose = this.eventManager.addEventListener(merged.element, event, handler);
-                return () => {
-                    dispose();
-                };
-            }
-            else {
-                return null;
-            }
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXHotkeysService, deps: [{ token: i1.EventManager }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXHotkeysService }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXHotkeysService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i1.EventManager }] });
-
-class AXHotkeyDirective {
-    constructor(el, _host, hs) {
-        this.el = el;
-        this._host = _host;
-        this.hs = hs;
-        this.axHotkey = '';
-        this._subs = [];
-    }
-    ngAfterViewInit() {
-        if (!this.axHotkey || !this._host)
-            return;
-        if (typeof this.axHotkey == 'string') {
-            this._addDefaultAction(this.axHotkey);
-        }
-        else if (typeof this.axHotkey == 'object' && !Array.isArray(this.axHotkey)) {
-            this._addHotKeyAction([this.axHotkey]);
-        }
-        else if (Array.isArray(this.axHotkey)) {
-            this._addHotKeyAction(this.axHotkey);
-        }
-    }
-    _addDefaultAction(hotkey) {
-        this._subs.push(this.hs.addShortcut({ keys: hotkey }).subscribe(() => {
-            ['click', 'toggle', 'open', 'focus'].forEach((a) => {
-                if (this._host[a]) {
-                    this._host[a]();
-                    return;
-                }
-            });
-        }));
-    }
-    _addHotKeyAction(hotkeys) {
-        hotkeys.forEach((k) => {
-            const hotkey = Object.entries(k)[0][0];
-            const action = Object.entries(k)[0][1];
-            if (!action)
-                this._addDefaultAction(hotkey);
-            else {
-                this._subs.push(this.hs.addShortcut({ keys: hotkey }).subscribe(() => {
-                    if (typeof action == 'string' && this._host[action]) {
-                        this._host[action]();
-                        return;
-                    }
-                    if (typeof action == 'function') {
-                        action();
-                        return;
-                    }
-                }));
-            }
-        });
-    }
-    ngOnDestroy() {
-        this._subs.forEach((s) => {
-            s.unsubscribe();
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXHotkeyDirective, deps: [{ token: i0.ElementRef }, { token: AXComponent, host: true, optional: true, self: true }, { token: AXHotkeysService }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXHotkeyDirective, isStandalone: true, selector: "[axHotkey]", inputs: { axHotkey: "axHotkey" }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXHotkeyDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[axHotkey]' }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: AXComponent, decorators: [{
-                    type: Host
-                }, {
-                    type: Self
-                }, {
-                    type: Optional
-                }] }, { type: AXHotkeysService }], propDecorators: { axHotkey: [{
-                type: Input
-            }] } });
-
-const AX_DEFAULT_SCROLL_POSITION = {
-    scrollHeight: 0,
-    scrollTop: 0,
-    clientHeight: 0,
-};
-class AXInfiniteScrollerDirective {
-    constructor(elm) {
-        this.elm = elm;
-        this.scrollPercent = 70;
-        this.isUserScrollingDown = (positions) => {
-            return positions[0].sT < positions[1].sT;
-        };
-        this.isScrollExpectedPercent = (position) => {
-            return (position.sT + position.cH) / position.sH > this.scrollPercent / 100;
-        };
-    }
-    ngAfterViewInit() {
-        this.registerScrollEvent();
-        this.streamScrollEvents();
-        this.requestCallbackOnScroll();
-    }
-    registerScrollEvent() {
-        this.scrollEvent$ = fromEvent(this.elm.nativeElement, 'scroll');
-    }
-    streamScrollEvents() {
-        this.userScrolledDown$ = this.scrollEvent$.pipe(map((e) => ({
-            scrollHeight: e.target.scrollHeight,
-            scrollTop: e.target.scrollTop,
-            clientHeight: e.target.clientHeight,
-        })), pairwise(), filter((positions) => this.isUserScrollingDown(positions) && this.isScrollExpectedPercent(positions[1])));
-    }
-    requestCallbackOnScroll() {
-        this.requestOnScroll$ = this.userScrolledDown$;
-        if (this.immediateCallback) {
-            this.requestOnScroll$ = this.requestOnScroll$.pipe(startWith([AX_DEFAULT_SCROLL_POSITION, AX_DEFAULT_SCROLL_POSITION]));
-        }
-        this.requestOnScroll$.pipe(exhaustMap(() => {
-            return this.scrollCallback();
-        }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXInfiniteScrollerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXInfiniteScrollerDirective, isStandalone: true, selector: "[axInfiniteScroller]", inputs: { scrollCallback: "scrollCallback", immediateCallback: "immediateCallback", scrollPercent: "scrollPercent" }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXInfiniteScrollerDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[axInfiniteScroller]' }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { scrollCallback: [{
-                type: Input
-            }], immediateCallback: [{
-                type: Input
-            }], scrollPercent: [{
-                type: Input
-            }] } });
-
-class AXResponsiveDirective {
-    constructor(_elementRef) {
-        this._elementRef = _elementRef;
-        this._observer = new ResizeObserver((entries) => {
-            for (const entry of entries) {
-                if (entry.target) {
-                    const e = entry.target;
-                    const elements = [e, ...Array.from(e.querySelectorAll(`[class*='sm:']`))];
-                    elements
-                        .map((c) => ({
-                        element: c,
-                        classList: Array.from(c.classList)
-                            .filter((c) => c.includes('sm'))
-                            .map((c) => c.slice(3)),
-                    }))
-                        .forEach((c) => {
-                        e.clientWidth < 320 ? c.element.classList.add(...c.classList) : c.element.classList.remove(...c.classList);
-                    });
-                }
-            }
-        });
-        this._observer.observe(_elementRef.nativeElement);
-    }
-    ngOnDestroy() {
-        this._observer?.disconnect();
-        this._observer?.unobserve(this._elementRef.nativeElement);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXResponsiveDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXResponsiveDirective, isStandalone: true, selector: "[axResponsive]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXResponsiveDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[axResponsive]' }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }] });
-
-class AXCommonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXCommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: AXCommonModule, imports: [AXResponsiveDirective, AXInfiniteScrollerDirective, AXAutoFocusDirective, AXHotkeyDirective], exports: [AXResponsiveDirective, AXInfiniteScrollerDirective, AXAutoFocusDirective, AXHotkeyDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXCommonModule, providers: [AXHotkeysService] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXCommonModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [AXResponsiveDirective, AXInfiniteScrollerDirective, AXAutoFocusDirective, AXHotkeyDirective],
-                    exports: [AXResponsiveDirective, AXInfiniteScrollerDirective, AXAutoFocusDirective, AXHotkeyDirective],
-                    providers: [AXHotkeysService],
-                }]
-        }] });
-
-class MXColorComponent extends MXBaseComponent {
-    constructor() {
-        super(...arguments);
-        this.colorChange = new EventEmitter();
-        this._color = 'default';
-    }
-    /**
-     *  Predefined color schemes
-     */
-    get color() {
-        return this._color;
-    }
-    set color(value) {
-        this.setOption({
-            name: 'color',
-            value,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-}
-
-class MXLookableComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXLookableComponent, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXLookableComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXLookableComponent, decorators: [{
-            type: Injectable
-        }] });
-class MXLookComponent extends MXBaseComponent {
-    constructor() {
-        super(...arguments);
-        this.lookChange = new EventEmitter();
-        this._look = 'solid';
-    }
-    /**
-     *  Predefined look schemes
-     */
-    get look() {
-        return this._look;
-    }
-    set look(value) {
-        this.setOption({
-            name: 'look',
-            value,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-}
-
-class MXColorLookComponent extends classes(MXColorComponent, MXLookComponent) {
-}
-
-class MXButtonBaseComponent extends classes(MXInteractiveComponent, MXColorLookComponent) {
-    /**
-     *  Defines the primary text to show inside the button.
-     */
-    get text() {
-        return this._text;
-    }
-    set text(v) {
-        this.setOption({
-            name: 'text',
-            value: v,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-    /**
-     *  Provides visual styling that indicates if the Button is active
-     */
-    get toggleable() {
-        return this._toggleable;
-    }
-    set toggleable(value) {
-        this.setOption({
-            name: 'toggleable',
-            value,
-        });
-    }
-    /**
-     *  Indicates if the Button is selected or not
-     */
-    get selected() {
-        return this._selected;
-    }
-    set selected(value) {
-        this.setOption({
-            name: 'selected',
-            value,
-            afterCallback: () => {
-                this.cdr.markForCheck();
-            },
-        });
-    }
-    /**
-     *  @ignore
-     */
-    constructor() {
-        super();
-        /**
-         * Emits an event when the text associated with the button changes.
-         *
-         * @event
-         */
-        this.textChange = new EventEmitter();
-        /**
-         * Emits an event when the toggleable state of the action sheet changes.
-         *
-         * @event
-         */
-        this.toggleableChange = new EventEmitter();
-        this._toggleable = false;
-        /**
-         * Emits an event whenever the selection state of the component changes.
-         *
-         * @event
-         */
-        this.selectedChange = new EventEmitter();
-        this._selected = false;
-    }
-    /**
-     *  @ignore
-     */
-    get cssClasses() {
-        const cssClasses = {
-            'ax-button-icon': !this.text,
-            'ax-state-disabled': this.disabled,
-            'ax-state-selected': this.selected,
-        };
-        set(cssClasses, `ax-${this.look || 'solid'}`, true);
-        set(cssClasses, `ax-${this.color || 'primary'}`, true);
-        return cssClasses;
-    }
-}
-
-class MXInputBaseValueComponent extends MXValueComponent {
-    constructor() {
-        super(...arguments);
-        /**
-         *  Fires each time the user press a key.
-         *  @event
-         */
-        this.onKeyDown = new EventEmitter();
-        /**
-         *  Fires each time the user press a key.
-         *  @event
-         */
-        this.onKeyUp = new EventEmitter();
-        /**
-         *  Fires each time the user press a key.
-         *  @event
-         */
-        this.onKeyPress = new EventEmitter();
-        /**
-         *  Fires each time the user change the text.
-         *  @event
-         */
-        this.onTextChanged = new EventEmitter();
-    }
-    emitOnKeydownEvent(e) {
-        this.onKeyDown.emit({
-            component: this,
-            nativeEvent: e,
-        });
-    }
-    emitOnKeyupEvent(e) {
-        this.onKeyUp.emit({
-            component: this,
-            nativeEvent: e,
-        });
-    }
-    emitOnKeypressEvent(e) {
-        this.onKeyPress.emit({
-            component: this,
-            nativeEvent: e,
-        });
-    }
-    emitOnTextChanged(value, isUserInteraction = false) {
-        if (isEqual(value, this.oldText))
-            return;
-        this.onTextChanged.emit({
-            value,
-            name: this.name,
-            component: this,
-            isUserInteraction,
-            oldValue: this.oldText,
-            htmlElement: this.getHostElement(),
-        });
-        this.oldText = value;
-    }
-    focus() {
-        const input = this.getHostElement().querySelector('input');
-        if (input)
-            input.focus();
-        else
-            super.focus();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXInputBaseValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXInputBaseValueComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXInputBaseValueComponent, decorators: [{
-            type: Injectable
-        }] });
-
-class MXSelectionBridgeService {
-    constructor() {
-        this.selectedItems = [];
-        this.cacheList = {};
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionBridgeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionBridgeService }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionBridgeService, decorators: [{
-            type: Injectable
-        }] });
-const AX_SELECTION_DATA_TOKEN = new InjectionToken('AX_SELECTION_DATA_TOKEN');
-class MXSelectionValueComponent extends MXValueComponent {
-    constructor() {
-        super(...arguments);
-        this.formatService = inject(AXFormatService);
-        this.dataService = inject(AX_SELECTION_DATA_TOKEN);
-        this._valueField = 'id';
-        this._textTemplate = '';
-        this._textField = 'text';
-        this._disabledField = 'disabled';
-        this._multiple = false;
-    }
-    get valueField() {
-        return this._valueField;
-    }
-    set valueField(v) {
-        this.setOption({
-            name: 'valueField',
-            value: v,
-        });
-    }
-    get textTemplate() {
-        return this._textTemplate;
-    }
-    set textTemplate(v) {
-        this.setOption({
-            name: 'textTemplate',
-            value: v,
-        });
-    }
-    get textField() {
-        return this._textField;
-    }
-    set textField(v) {
-        this.setOption({
-            name: 'textField',
-            value: v,
-        });
-    }
-    get disabledField() {
-        return this._disabledField;
-    }
-    set disabledField(v) {
-        this.setOption({
-            name: 'disabledField',
-            value: v,
-        });
-    }
-    get multiple() {
-        return this._multiple;
-    }
-    set multiple(v) {
-        this.setOption({
-            name: 'multiple',
-            value: v,
-            afterCallback: () => {
-                this.reset(false);
-            },
-        });
-    }
-    get selectedItems() {
-        return this.dataService.selectedItems || [];
-    }
-    internalSetValue(value) {
-        const isArray = Array.isArray(value);
-        if (value == null || (isArray && value.length == 0)) {
-            return this.multiple ? [] : null;
-        }
-        const normalizedItems = isArray ? this.normalizeItemsList(value, true) : this.normalizeItemsList([value], true);
-        if (normalizedItems.length == 0) {
-            return this.multiple ? [] : null;
-        }
-        const result = this.multiple ? normalizedItems.map((c) => c[this.valueField]) : normalizedItems[0][this.valueField];
-        return result;
-    }
-    emitOnValueChangedEvent(oldValue, newValue) {
-        this._normalizeSelectedItems();
-        super.emitOnValueChangedEvent(oldValue, newValue);
-    }
-    normalizeItemsList(items, findBykey = false) {
-        if (items == null)
-            return [];
-        return items.filter((c) => c != null).map((i) => this.normalizeItem(i, findBykey));
-    }
-    normalizeItem(item, findBykey = false) {
-        const complex = typeof item == 'object';
-        const key = complex ? item[this.valueField] : `${item}`;
-        const cacheKey = `k-${key}`;
-        const hasText = !complex || item[this.textField] != null;
-        //
-        if (this.dataService.cacheList[cacheKey] && this.dataService.cacheList[cacheKey][this.textField])
-            return this.dataService.cacheList[cacheKey];
-        //
-        const obj = {};
-        if (complex && hasText) {
-            Object.assign(obj, item);
-        }
-        else {
-            const existsItem = findBykey ? this.getItemByKey(key) : null;
-            if (existsItem && existsItem instanceof Promise) {
-                obj[this.valueField] = key;
-                obj['isLoading'] = true;
-                obj[this.textField] = 'Loading';
-                //
-                existsItem
-                    .then((r) => {
-                    if (typeof r === 'object' && r) {
-                        // obj[this.valueField] = r[this.valueField];
-                        // obj[this.textField] = r[this.textField];
-                        Object.assign(obj, cloneDeep(r));
-                    }
-                    else {
-                        obj[this.valueField] = r || key;
-                        obj[this.textField] = r;
-                    }
-                })
-                    .finally(() => {
-                    delete obj['isLoading'];
-                    this.dataService.cacheList[cacheKey] = obj;
-                    this.cdr.markForCheck();
-                });
-            }
-            else if (existsItem) {
-                obj[this.valueField] = complex ? existsItem[this.valueField] : existsItem;
-                obj[this.textField] = complex ? existsItem[this.textField] : existsItem;
-            }
-            else {
-                obj[this.valueField] = complex ? item[this.valueField] : item;
-                obj[this.textField] = complex ? item[this.textField] : item;
-            }
-        }
-        this.dataService.cacheList[cacheKey] = obj;
-        return obj;
-    }
-    _normalizeSelectedItems() {
-        const values = Array.isArray(this.value) ? this.value : this.value != null ? [this.value] : [];
-        this.dataService.selectedItems = values.map((v) => this.normalizeItem(v));
-    }
-    unselectItems(...items) {
-        if (!items || items.length === 0) {
-            this.commitValue([], true);
-            return;
-        }
-        const normalizeItems = Array.isArray(items) ? this.normalizeItemsList(items) : [this.normalizeItem(items)];
-        const newSelectedItems = this.selectedItems.filter((i) => !normalizeItems.some((n) => n[this.valueField] == i[this.valueField]));
-        this.commitValue(newSelectedItems, true);
-    }
-    selectItems(...items) {
-        if (items && items.length) {
-            let newSelectedItems = Array.isArray(this.value) ? this.value : [this.value];
-            const normalizeItems = Array.isArray(items) ? this.normalizeItemsList(items) : [this.normalizeItem(items)];
-            if (this.multiple) {
-                newSelectedItems = [...newSelectedItems, ...normalizeItems];
-            }
-            else {
-                newSelectedItems = normalizeItems;
-            }
-            this.commitValue(newSelectedItems, true);
-        }
-    }
-    toggleSelect(...items) {
-        items?.forEach((item) => {
-            if (this.multiple) {
-                this.isItemSelected(item) ? this.unselectItems(item) : this.selectItems(item);
-            }
-            else {
-                this.selectItems(item);
-            }
-        });
-    }
-    isItemSelected(item) {
-        return this.selectedItems.some((c) => c[this.valueField] === this.normalizeItem(item)[this.valueField]);
-    }
-    isItemDisabled(item) {
-        return (this.disabled ||
-            coerceBooleanProperty(item[this.disabledField]) === true ||
-            (this.disabledCallback ? this.disabledCallback({ item, index: -1 }) : false));
-    }
-    // protected getDisplayText(item: T) {
-    //   const normalizeItem = this.normalizeItem(item) as any;
-    //   return formattedText || normalizeItem[this.valueField];
-    // }
-    getDisplayText(item) {
-        const normalizeItem = this.normalizeItem(item);
-        const formattedTemplate = this.formatService.format(this.textTemplate, 'string', normalizeItem);
-        if (this.textTemplate && formattedTemplate != this.textTemplate)
-            return formattedTemplate;
-        else
-            return normalizeItem[this.textField] || normalizeItem[this.valueField];
-    }
-    getValue(item) {
-        const normalizeItem = this.normalizeItem(item);
-        return normalizeItem[this.valueField];
-    }
-    clearSelectionCache() {
-        this.dataService.cacheList = {};
-        this.dataService.selectedItems = [];
-        this.cdr.markForCheck();
-    }
-    softClearSelectionCache() {
-        this.dataService.cacheList = {};
-        this.cdr.markForCheck();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionValueComponent }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MXSelectionValueComponent, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- * Directive to copy provided context to the clipboard on click,
- * using Angular's input signal injection for the context.
- * Emits copy status via a writable signal property.
- *
- * Usage:
- * <button
- *   axCopyClipboard
- *   [copiedSignal]="copiedSignal"
- * >Copy</button>
- */
-class AXCopyClipboardDirective {
-    constructor() {
-        this.elementRef = inject(ElementRef);
-        /**
-         * Required string input signal for the context to copy.
-         * Bound via: axCopyClipboard="textSignal"
-         */
-        this.context = input.required({ alias: 'axCopyClipboard' });
-        /**
-         * WritableSignal to capture copy success (true) or failure (false).
-         * Can be bound: [copiedSignal]="myWritableSignal"
-         */
-        this.copied = output();
-    }
-    /**
-     * Trigger copy when the host element is clicked.
-     */
-    async onHostHover() {
-        this.elementRef.nativeElement.style.cursor = 'pointer';
-    }
-    /**
-     * Trigger copy when the host element is clicked.
-     */
-    async onHostClick() {
-        try {
-            const text = this.context();
-            await this.copyToClipboard(text);
-            console.log(this.elementRef.nativeElement);
-            this.copied.emit(true);
-        }
-        catch (err) {
-            console.error('Copy failed', err);
-            this.copied.emit(false);
-        }
-    }
-    /**
-     * Copy the string to the clipboard.
-     */
-    copyToClipboard(text) {
-        if (!text) {
-            return Promise.reject('No text provided to copy');
-        }
-        if (!navigator.clipboard?.writeText) {
-            return Promise.reject('Permission denied to access clipboard');
-        }
-        return navigator.clipboard.writeText(text);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXCopyClipboardDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.10", type: AXCopyClipboardDirective, isStandalone: true, selector: "[axCopyClipboard]", inputs: { context: { classPropertyName: "context", publicName: "axCopyClipboard", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { copied: "copied" }, host: { listeners: { "mouseenter": "onHostHover()", "click": "onHostClick()" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXCopyClipboardDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[axCopyClipboard]',
-                }]
-        }], propDecorators: { onHostHover: [{
-                type: HostListener,
-                args: ['mouseenter']
-            }], onHostClick: [{
-                type: HostListener,
-                args: ['click']
-            }] } });
-
-class AXNgModelDelayedValueChangedDirective {
-    get delayTime() {
-        return this._delayTime;
-    }
-    set delayTime(v) {
-        if (v != this._delayTime) {
-            this._delayTime = v;
-            this.axDelayTimeChange.emit(v);
-            this.update();
-        }
-    }
-    ngOnDestroy() {
-        this.subscription?.unsubscribe();
-    }
-    constructor(ngModel) {
-        this.ngModel = ngModel;
-        this.axDelayedValueChanged = new EventEmitter();
-        this.axDelayTimeChange = new EventEmitter();
-        this._delayTime = 0;
-        this.delayTime = 0;
-    }
-    update() {
-        this.subscription?.unsubscribe();
-        //
-        this.subscription = this.ngModel.control.valueChanges
-            .pipe(skip(1), // skip initial value
-        distinctUntilChanged(), debounceTime(this.delayTime))
-            .subscribe((value) => this.axDelayedValueChanged.emit(value));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXNgModelDelayedValueChangedDirective, deps: [{ token: i1$1.NgModel }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXNgModelDelayedValueChangedDirective, isStandalone: true, selector: "[axDelayedValueChanged]", inputs: { delayTime: "delayTime" }, outputs: { axDelayedValueChanged: "axDelayedValueChanged", axDelayTimeChange: "axDelayTimeChange" }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXNgModelDelayedValueChangedDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[axDelayedValueChanged]',
-                }]
-        }], ctorParameters: () => [{ type: i1$1.NgModel }], propDecorators: { axDelayedValueChanged: [{
-                type: Output
-            }], axDelayTimeChange: [{
-                type: Output
-            }], delayTime: [{
-                type: Input
-            }] } });
-
-class AXInvertedColorDirective {
-    constructor() {
-        this.color = input.required();
-        this.ref = inject(ViewContainerRef);
-        this.platformID = inject(PLATFORM_ID);
-        afterNextRender(() => {
-            this.invertColor();
-        });
-        effect(() => {
-            this.invertColor();
-        });
-    }
-    invertColor() {
-        let color;
-        let foreColor;
-        const invertedVariables = [];
-        if (isPlatformBrowser(this.platformID)) {
-            if (this.color() === 'default') {
-                color = getComputedStyle(document.documentElement).getPropertyValue(`--ax-color-${this.color()}`);
-                foreColor = getComputedStyle(document.documentElement).getPropertyValue(`--ax-color-${this.color()}-fore`);
-                invertedVariables.push({ name: `--ax-color-ghost`, value: `${foreColor}` });
-                invertedVariables.push({ name: `--ax-color-ghost-fore`, value: `${color}` });
-            }
-            else {
-                const range = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
-                color = getComputedStyle(document.documentElement).getPropertyValue(`--ax-color-${this.color()}-500`);
-                foreColor = getComputedStyle(document.documentElement).getPropertyValue(`--ax-color-${this.color()}-fore`);
-                range.forEach((c) => {
-                    invertedVariables.push({ name: `--ax-color-${this.color()}-${c}`, value: `${foreColor}` });
-                });
-                invertedVariables.push({ name: `--ax-color-${this.color()}-fore`, value: `${color}` });
-                invertedVariables.push({ name: `--ax-color-${this.color()}-fore-tint`, value: `${color}` });
-            }
-            invertedVariables.forEach((c) => {
-                this.ref.element.nativeElement.style.setProperty(c.name, c.value);
-            });
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXInvertedColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.10", type: AXInvertedColorDirective, isStandalone: true, selector: "[axInvertedColor]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXInvertedColorDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[axInvertedColor]',
-                }]
-        }], ctorParameters: () => [] });
-
-class AXRippleDirective {
-    constructor(el, cdr) {
-        this.el = el;
-        this.cdr = cdr;
-        this.enabled = true;
-        this.axRippleColor = 'var(--ax-comp-ripple-bg-color, rgba(255, 255, 255, 0.3))';
-        this.document = inject(DOCUMENT);
-        this.platformID = inject(PLATFORM_ID);
-    }
-    ngOnInit() {
-        if (this.enabled) {
-            this.el.nativeElement.addEventListener('click', (event) => {
-                this.onElementClick(event);
-            });
-        }
-    }
-    ngOnDestroy() {
-        this.el.nativeElement.removeEventListener('click', this.createRipple.bind(this));
-    }
-    onElementClick(event) {
-        this.createRipple(event);
-    }
-    createRipple(event) {
-        const element = event.currentTarget;
-        const exists = element.querySelector('.ax-ripple');
-        if (exists)
-            exists.remove();
-        this.el.nativeElement.style.overflow = 'hidden';
-        const rect = element.getBoundingClientRect();
-        const x = Math.floor(((event.clientX - rect.left) / (rect.right - rect.left)) * element.clientWidth);
-        const y = Math.floor(((event.clientY - rect.top) / (rect.bottom - rect.top)) * element.clientHeight);
-        if (isPlatformBrowser(this.platformID)) {
-            const circle = this.document.createElement('span');
-            const diameter = Math.max(element.clientWidth, element.clientHeight);
-            const radius = diameter / 2;
-            circle.style.width = circle.style.height = `${diameter}px`;
-            circle.style.left = `${x - radius}px`;
-            circle.style.top = `${y - radius}px`;
-            circle.style.backgroundColor = `${this.axRippleColor}`;
-            circle.classList.add('ax-ripple');
-            element.appendChild(circle);
-            circle.addEventListener('animationend', () => {
-                circle?.remove();
-            });
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXRippleDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.10", type: AXRippleDirective, isStandalone: true, selector: "[axRipple]", inputs: { enabled: ["axRipple", "enabled"], axRippleColor: "axRippleColor" }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXRippleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[axRipple]',
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { enabled: [{
-                type: Input,
-                args: ['axRipple']
-            }], axRippleColor: [{
-                type: Input
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AXAutoFocusDirective, AXAutocompleteParentComponent, AXButtonClickEvent, AXClearableComponent, AXClickEvent, AXClosbaleComponent, AXCommonModule, AXComponent, AXComponentCloseEvent, AXComponentClosedPromise, AXComponentClosing, AXComponentResult, AXCopyClipboardDirective, AXDataSource, AXDomService, AXEvent, AXFocusEvent, AXFocusableComponent, AXHotkeyDirective, AXHotkeysService, AXHtmlEvent, AXInfiniteScrollerDirective, AXInvertedColorDirective, AXItemClickEvent, AXListDataSource, AXNgModelDelayedValueChangedDirective, AXOptionChangedEvent, AXPagedComponent, AXRangeChangedEvent, AXResponsiveDirective, AXRippleDirective, AXSearchableComponent, AXSelectionValueChangedEvent, AXValuableComponent, AXValueChangedEvent, AX_LOCATIONS, AX_PLACEMENT_BOTTOM, AX_PLACEMENT_BOTTOM_END, AX_PLACEMENT_BOTTOM_START, AX_PLACEMENT_END, AX_PLACEMENT_END_BOTTOM, AX_PLACEMENT_END_TOP, AX_PLACEMENT_MAP, AX_PLACEMENT_START, AX_PLACEMENT_START_BOTTOM, AX_PLACEMENT_START_TOP, AX_PLACEMENT_TOP, AX_PLACEMENT_TOP_END, AX_PLACEMENT_TOP_START, AX_SELECTION_DATA_TOKEN, AX_STYLE_COLOR_TYPES, AX_STYLE_LOOK_TYPES, MXBaseComponent, MXButtonBaseComponent, MXColorComponent, MXColorLookComponent, MXInputBaseValueComponent, MXInteractiveComponent, MXLookComponent, MXLookableComponent, MXSelectionBridgeService, MXSelectionValueComponent, MXValueComponent, NXButtonComponent, NXClickEvent, NXColorComponent, NXComponent, NXEvent, NXInteractiveComponent, NXLookComponent, NXNativeEvent, NXValueComponent, TAB_META_KEY, convertArrayToDataSource, convertToPlacement };
-//# sourceMappingURL=acorex-components-common.mjs.map