@ng-nest/ui 22.0.3 → 22.0.5

package/fesm2022/ng-nest-ui-form.mjs

@@ -1,573 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, output, Component, model, InjectionToken, inject, ViewContainerRef, signal, viewChild, OutputEmitterRef, ChangeDetectionStrategy, ViewEncapsulation, computed, NgModule } from '@angular/core';
-import { XToCssPixelValue, XToNumber, XToBoolean, XIdentity, XIsEmpty, XIsFunction, XIsChange } from '@ng-nest/ui/core';
-import * as i1 from '@angular/forms';
-import { UntypedFormGroup, UntypedFormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { XFormControlFunction, XFormInputValidator } from '@ng-nest/ui/base-form';
-import { XRowComponent, XColComponent } from '@ng-nest/ui/layout';
-import { NgClass, NgTemplateOutlet } from '@angular/common';
-import { XOutletDirective } from '@ng-nest/ui/outlet';
-import { Subject } from 'rxjs';
-import { map, takeUntil } from 'rxjs/operators';
-import { XI18nService, zh_CN } from '@ng-nest/ui/i18n';
-import { toSignal } from '@angular/core/rxjs-interop';
-import * as i2 from '@angular/cdk/portal';
-import { CdkPortalOutlet, ComponentPortal, PortalModule } from '@angular/cdk/portal';
-import { XInputComponent } from '@ng-nest/ui/input';
-import { XAutoCompleteComponent } from '@ng-nest/ui/auto-complete';
-import { XCascadeComponent } from '@ng-nest/ui/cascade';
-import { XCheckboxComponent } from '@ng-nest/ui/checkbox';
-import { XColorPickerComponent } from '@ng-nest/ui/color-picker';
-import { XDatePickerComponent } from '@ng-nest/ui/date-picker';
-import { XFindComponent } from '@ng-nest/ui/find';
-import { XInputNumberComponent } from '@ng-nest/ui/input-number';
-import { XRadioComponent } from '@ng-nest/ui/radio';
-import { XRateComponent } from '@ng-nest/ui/rate';
-import { XSelectComponent } from '@ng-nest/ui/select';
-import { XSliderSelectComponent } from '@ng-nest/ui/slider-select';
-import { XSwitchComponent } from '@ng-nest/ui/switch';
-import { XTextareaComponent } from '@ng-nest/ui/textarea';
-import { XTimePickerComponent } from '@ng-nest/ui/time-picker';
-import { XIconComponent } from '@ng-nest/ui/icon';
-
-/**
- * Form
- * @selector x-form
- * @decorator component
- */
-const XFormPrefix = 'x-form';
-const X_FORM_CONFIG_NAME = 'form';
-/**
- * Form Property
- */
-class XFormProperty extends XFormControlFunction(X_FORM_CONFIG_NAME) {
-    constructor() {
-        super(...arguments);
-        /**
-         * @zh_CN 表单 FormGroup
-         * @en_US Form FormGroup
-         * @default new UntypedFormGroup({})
-         */
-        this.formGroup = input(new UntypedFormGroup({}), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "formGroup" }] : /* istanbul ignore next */ []));
-        /**
-         * @zh_CN 表单名称
-         * @en_US Form name
-         */
-        this.title = input('', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
-        /**
-         * @zh_CN 控件间距
-         * @en_US Control spacing
-         */
-        this.space = input(this.config?.space ?? '1.75rem', { ...(ngDevMode ? { debugName: "space" } : /* istanbul ignore next */ {}), transform: XToCssPixelValue });
-        /**
-         * @zh_CN 控件宽度，24栅格
-         * @en_US Control width, 24 grid
-         */
-        this.span = input(null, { ...(ngDevMode ? { debugName: "span" } : /* istanbul ignore next */ {}), transform: XToNumber });
-        /**
-         * @zh_CN 标签后缀
-         * @en_US Label suffix
-         */
-        this.labelSuffix = input(this.config?.labelSuffix ?? '', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "labelSuffix" }] : /* istanbul ignore next */ []));
-        /**
-         * @zh_CN 表单控件
-         * @en_US Form control
-         */
-        this.controls = input([], /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
-        /**
-         * @zh_CN 表单宽度
-         * @en_US Form width
-         */
-        this.width = input(this.config?.width ?? '100%', { ...(ngDevMode ? { debugName: "width" } : /* istanbul ignore next */ {}), transform: XToCssPixelValue });
-        /**
-         * @zh_CN 自定义模板
-         * @en_US Custom template
-         */
-        this.controlTpl = input({}, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "controlTpl" }] : /* istanbul ignore next */ []));
-        /**
-         * @zh_CN 禁用
-         * @en_US Disabled
-         */
-        this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: XToBoolean });
-        /**
-         * @zh_CN Submit
-         * @en_US Submit
-         */
-        this.xSubmit = output();
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: XFormProperty, isStandalone: true, selector: "x-form-property", inputs: { formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, span: { classPropertyName: "span", publicName: "span", isSignal: true, isRequired: false, transformFunction: null }, labelSuffix: { classPropertyName: "labelSuffix", publicName: "labelSuffix", isSignal: true, isRequired: false, transformFunction: null }, controls: { classPropertyName: "controls", publicName: "controls", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, controlTpl: { classPropertyName: "controlTpl", publicName: "controlTpl", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { xSubmit: "xSubmit" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormProperty, decorators: [{
-            type: Component,
-            args: [{ selector: `${XFormPrefix}-property`, template: '' }]
-        }], propDecorators: { formGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "formGroup", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], space: [{ type: i0.Input, args: [{ isSignal: true, alias: "space", required: false }] }], span: [{ type: i0.Input, args: [{ isSignal: true, alias: "span", required: false }] }], labelSuffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelSuffix", required: false }] }], controls: [{ type: i0.Input, args: [{ isSignal: true, alias: "controls", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], controlTpl: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlTpl", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], xSubmit: [{ type: i0.Output, args: ["xSubmit"] }] } });
-/**
- * @zh_CN 控件对象
- * @en_US Control object
- */
-class XControl extends XIdentity {
-    constructor(option = {}) {
-        super();
-        if (XIsEmpty(this.value))
-            this.value = '';
-        Object.assign(this, option);
-    }
-}
-/**
- * Control
- * @selector x-control
- * @decorator component
- */
-const XControlPrefix = 'x-control';
-/**
- * Control Property
- */
-class XControlProperty {
-    constructor() {
-        /**
-         * @zh_CN 控件对象
-         * @en_US Control object
-         */
-        this.option = model.required({ ...(ngDevMode ? { debugName: "option" } : /* istanbul ignore next */ {}) });
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XControlProperty, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: XControlProperty, isStandalone: true, selector: "x-control-property", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { option: "optionChange" }, ngImport: i0, template: '', isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XControlProperty, decorators: [{
-            type: Component,
-            args: [{ selector: `${XControlPrefix}-property`, template: '' }]
-        }], propDecorators: { option: [{ type: i0.Input, args: [{ isSignal: true, alias: "option", required: true }] }, { type: i0.Output, args: ["optionChange"] }] } });
-/**
- * Form control
- */
-class XFormControl extends UntypedFormControl {
-    constructor() {
-        super(...arguments);
-        /**
-         * @zh_CN 提示信息
-         * @en_US Prompt information
-         */
-        this.messages = [];
-    }
-}
-class XInputControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XSelectControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XCascadeControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XCheckboxControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XColorPickerControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XDatePickerControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XInputNumberControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XRadioControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XRateControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XSliderSelectControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XSwitchControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XTimePickerControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XTextareaControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XFindControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-class XAutoCompleteControl extends XControl {
-    constructor(option = {}) {
-        super(option);
-    }
-}
-
-const X_FORM_CONTEXT = new InjectionToken('X_FORM_CONTEXT');
-
-class XControlComponent extends XControlProperty {
-    constructor() {
-        super();
-        this.i18n = inject(XI18nService);
-        this.viewContainerRef = inject(ViewContainerRef);
-        this._sharedProps = signal(['span', 'direction', 'justify', 'align', 'labelWidth', 'labelAlign'], /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "_sharedProps" }] : /* istanbul ignore next */ []));
-        this.validatorFns = signal([], /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "validatorFns" }] : /* istanbul ignore next */ []));
-        this.formControl = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "formControl" }] : /* istanbul ignore next */ []));
-        this._unSubject = new Subject();
-        this.value = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-        this.form = inject(X_FORM_CONTEXT, { optional: true });
-        this.locale = toSignal(this.i18n.localeChange.pipe(map((x) => x.form)), { initialValue: zh_CN.form });
-        this.portal = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "portal" }] : /* istanbul ignore next */ []));
-        this.portalOutlet = viewChild.required(CdkPortalOutlet);
-    }
-    ngOnInit() {
-        this.setOption();
-        this.formControl.set(new UntypedFormControl(this.option().value, {
-            nonNullable: this.option().nonNullable
-        }));
-        this.setValidators();
-        this.formControl()
-            .statusChanges.pipe(takeUntil(this._unSubject))
-            .subscribe((x) => {
-            this.setMessages(x);
-        });
-        this.formControl()
-            .valueChanges.pipe(takeUntil(this._unSubject))
-            .subscribe((x) => {
-            this.componentRef?.instance?.writeValue(x);
-        });
-        this.option().setValidators = () => this.setValidators();
-        this.form.formGroup().addControl(this.option().id, this.formControl());
-    }
-    ngAfterViewInit() {
-        this.componentPortal = this.createComponentPortal(this.option());
-        this.componentRef = this.portalOutlet().attachComponentPortal(this.componentPortal);
-        for (let key in this.option()) {
-            if (key in this.componentRef.instance) {
-                const val = this.componentRef.instance[key];
-                if (XIsFunction(val)) {
-                    const valSymbols = Object.getOwnPropertySymbols(val);
-                    if (valSymbols.length !== 1)
-                        break;
-                    const valSymbol = val[valSymbols[0]];
-                    if (valSymbol.hasOwnProperty('transformFn')) {
-                        // input
-                        this.componentRef.setInput(key, this.option()[key]);
-                    }
-                    else {
-                        // signal
-                        val.set(this.option()[key]);
-                    }
-                }
-                else if (val instanceof OutputEmitterRef) {
-                    // output
-                    val.subscribe((x) => this.option()[key](x));
-                }
-            }
-        }
-        if (this.option().value !== undefined) {
-            this.componentRef.instance.writeValue(this.option().value);
-            this.value.set(this.option().value);
-            this.formControl().patchValue(this.option().value, { emitEvent: false });
-        }
-        this.componentRef.instance.valueObservable.subscribe((x) => {
-            this.value.set(x);
-            this.formControl().patchValue(x);
-        });
-        this.form.controlTypes[this.option().id] = this.option();
-        this.form.controlComponents[this.option().id] = this.componentRef.instance;
-    }
-    ngOnDestroy() {
-        this._unSubject.next();
-        this._unSubject.unsubscribe();
-    }
-    setValidators() {
-        this.validatorFns.set([]);
-        if (this.option().disabled || this.form.disabled()) {
-            this.formControl().disable();
-        }
-        else {
-            this.formControl().enable();
-        }
-        if (this.option().required && !this.form.disabled()) {
-            this.validatorFns.update((x) => [...x, Validators.required]);
-        }
-        if (this.option().pattern) {
-            this.setPattern();
-        }
-        if (XIsFunction(this.option().inputValidator)) {
-            this.validatorFns.update((x) => [...x, XFormInputValidator(this.option().inputValidator)]);
-        }
-        this.formControl().setValidators(this.validatorFns());
-        this.formControl().updateValueAndValidity({ onlySelf: true });
-    }
-    setOption() {
-        for (let prop of this._sharedProps()) {
-            if (XIsEmpty(this.option()[prop])) {
-                this.option.update((x) => {
-                    x[prop] = this.form[prop]();
-                    return x;
-                });
-            }
-        }
-        if (XIsEmpty(this.option().label)) {
-            this.option.update((x) => {
-                x.label = '';
-                return x;
-            });
-        }
-        this.option.update((x) => {
-            x.label = `${this.option().label}${this.form.labelSuffix()}`;
-            return x;
-        });
-    }
-    setPattern() {
-        const pattern = this.option().pattern;
-        if (pattern) {
-            this.validatorFns.update((x) => [...x, Validators.pattern(pattern)]);
-        }
-        return;
-    }
-    getPatternMsg(_pattern) {
-        const controlPattern = this.option().pattern;
-        if (controlPattern) {
-            return this.option().message;
-        }
-        return '';
-    }
-    setMessages(state) {
-        let control = this.formControl();
-        if (state === 'INVALID' && this.formControl().errors !== null) {
-            let messages = [];
-            for (const key in control.errors) {
-                const label = this.option().label || this.option().id;
-                if (key === 'required') {
-                    messages = [...messages, `${label} ${this.locale()?.required || 'required'}`];
-                }
-                else if (key === 'pattern') {
-                    messages = [...messages, `${label} ${this.getPatternMsg(control.errors[key].requiredPattern)}`];
-                }
-                else if (key === 'inputValidator') {
-                    messages = [...messages, `${label} ${this.option().message}`];
-                }
-            }
-            control.messages = messages;
-        }
-        else if (state === 'VALID') {
-            control.messages = [];
-        }
-    }
-    createComponentPortal(option) {
-        switch (option.control) {
-            case 'input':
-                return new ComponentPortal(XInputComponent, this.viewContainerRef);
-            case 'select':
-                return new ComponentPortal(XSelectComponent, this.viewContainerRef);
-            case 'checkbox':
-                return new ComponentPortal(XCheckboxComponent, this.viewContainerRef);
-            case 'radio':
-                return new ComponentPortal(XRadioComponent, this.viewContainerRef);
-            case 'switch':
-                return new ComponentPortal(XSwitchComponent, this.viewContainerRef);
-            case 'rate':
-                return new ComponentPortal(XRateComponent, this.viewContainerRef);
-            case 'date-picker':
-                return new ComponentPortal(XDatePickerComponent, this.viewContainerRef);
-            case 'time-picker':
-                return new ComponentPortal(XTimePickerComponent, this.viewContainerRef);
-            case 'input-number':
-                return new ComponentPortal(XInputNumberComponent, this.viewContainerRef);
-            case 'slider-select':
-                return new ComponentPortal(XSliderSelectComponent, this.viewContainerRef);
-            case 'cascade':
-                return new ComponentPortal(XCascadeComponent, this.viewContainerRef);
-            case 'color-picker':
-                return new ComponentPortal(XColorPickerComponent, this.viewContainerRef);
-            case 'textarea':
-                return new ComponentPortal(XTextareaComponent, this.viewContainerRef);
-            case 'find':
-                return new ComponentPortal(XFindComponent, this.viewContainerRef);
-            case 'auto-complete':
-                return new ComponentPortal(XAutoCompleteComponent, this.viewContainerRef);
-            default:
-                return new ComponentPortal(XInputComponent, this.viewContainerRef);
-        }
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.1", type: XControlComponent, isStandalone: true, selector: "x-control", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"x-control\" [formGroup]=\"form.formGroup()\">\r\n  <ng-template cdkPortalOutlet></ng-template>\r\n</div>\r\n", styles: [".x-control{margin:0;padding:0}.x-control x-input,.x-control x-select,.x-control x-date-picker,.x-control x-time-picker,.x-control x-input-number,.x-control x-slider-select,.x-control x-cascade,.x-control x-color-picker,.x-control x-textarea,.x-control x-auto-complete{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XControlComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'x-control', imports: [FormsModule, ReactiveFormsModule, PortalModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"x-control\" [formGroup]=\"form.formGroup()\">\r\n  <ng-template cdkPortalOutlet></ng-template>\r\n</div>\r\n", styles: [".x-control{margin:0;padding:0}.x-control x-input,.x-control x-select,.x-control x-date-picker,.x-control x-time-picker,.x-control x-input-number,.x-control x-slider-select,.x-control x-cascade,.x-control x-color-picker,.x-control x-textarea,.x-control x-auto-complete{width:100%}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { portalOutlet: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkPortalOutlet), { isSignal: true }] }] } });
-
-class XFormComponent extends XFormProperty {
-    constructor() {
-        super(...arguments);
-        this.controlsType = computed(() => {
-            const controls = this.controls();
-            return controls && controls.length > 0 && controls[0].controls ? 'rows' : 'controls';
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "controlsType" }] : /* istanbul ignore next */ []));
-        this.controlComponents = {};
-        this.controlTypes = {};
-        this.formId = Number(Math.random().toString().substring(2, 6) + Date.now()).toString(36);
-        this.classMap = computed(() => ({
-            [`${XFormPrefix}-${this.controlsType()}`]: true
-        }), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "classMap" }] : /* istanbul ignore next */ []));
-    }
-    ngOnChanges(changes) {
-        const { disabled } = changes;
-        XIsChange(disabled) && this.setDisabled();
-    }
-    ngAfterViewInit() {
-        this.setDisabled();
-    }
-    setDisabled() {
-        if (Object.keys(this.controlComponents).length === 0)
-            return;
-        if (this.disabled()) {
-            for (let key in this.controlComponents) {
-                let [control, type] = [this.controlComponents[key], this.controlTypes[key]];
-                control.disabledSignal.set(true);
-                control.requiredSignal.set(false);
-                control.patternSignal.set(null);
-                type.setValidators && type.setValidators();
-            }
-        }
-        else {
-            for (let key in this.controlComponents) {
-                let [control, type] = [this.controlComponents[key], this.controlTypes[key]];
-                control.disabledSignal.set(type.disabled);
-                control.requiredSignal.set(type.required);
-                control.patternSignal.set(type.pattern);
-                type.setValidators && type.setValidators();
-            }
-        }
-        this.formGroup().updateValueAndValidity();
-    }
-    setValidator() {
-        for (let key in this.controlComponents) {
-            let [control, type] = [this.controlComponents[key], this.controlTypes[key]];
-            control.formControlValidator();
-            type.setValidators && type.setValidators();
-            control.cdr.detectChanges();
-        }
-    }
-    resetValidator() {
-        for (let key in this.controlComponents) {
-            let [control] = [this.controlComponents[key]];
-            control.validatorSignal.set(false);
-            control.cdr.detectChanges();
-        }
-    }
-    getValidatorMessages() {
-        let result = [];
-        if (this.formGroup().valid)
-            return result;
-        else {
-            const eachControls = (array) => {
-                for (const ctr of array) {
-                    const formCtr = this.formGroup().controls[ctr.id];
-                    if (formCtr && formCtr.invalid) {
-                        result = [...result, ...formCtr.messages];
-                    }
-                }
-            };
-            if (this.controlsType() === 'rows') {
-                for (const row of this.controls()) {
-                    eachControls(row.controls);
-                }
-            }
-            else {
-                eachControls(this.controls());
-            }
-        }
-        return result;
-    }
-    onSubmit(event) {
-        this.setValidator();
-        this.xSubmit.emit(event);
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: XFormComponent, isStandalone: true, selector: "x-form", providers: [
-            {
-                provide: X_FORM_CONTEXT,
-                useExisting: XFormComponent
-            }
-        ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form\r\n  #form\r\n  class=\"x-form\"\r\n  [class.x-form-has-content]=\"content.innerHTML.trim()\"\r\n  [formGroup]=\"formGroup()\"\r\n  [style.width]=\"width()\"\r\n  [style.padding-bottom]=\"controlsType() === 'controls' ? this.space() : '0px'\"\r\n  [ngClass]=\"classMap()\"\r\n  (ngSubmit)=\"onSubmit($event)\"\r\n>\r\n  @if (title()) {\r\n    <div class=\"x-form-title\">{{ title() }}</div>\r\n  }\r\n  @switch (controlsType()) {\r\n    @case ('controls') {\r\n      <ng-container *ngTemplateOutlet=\"controlsTemp; context: { controls: controls() }\"> </ng-container>\r\n    }\r\n    @case ('rows') {\r\n      <ng-container *ngTemplateOutlet=\"rowsTemp; context: { rows: controls() }\"></ng-container>\r\n    }\r\n  }\r\n  <div class=\"x-form-content\" #content><ng-content></ng-content></div>\r\n</form>\r\n\r\n<ng-template #rowsTemp let-rows=\"rows\">\r\n  @for (row of rows; track row) {\r\n    <div class=\"x-form-category\" [hidden]=\"row.hidden\">\r\n      <ng-container *ngTemplateOutlet=\"titleTemp; context: { row: row }\"></ng-container>\r\n      <ng-container *ngTemplateOutlet=\"controlsTemp; context: { controls: row.controls }\"></ng-container>\r\n    </div>\r\n  }\r\n</ng-template>\r\n\r\n<ng-template #controlsTemp let-controls=\"controls\">\r\n  <x-row [space]=\"space()\">\r\n    @for (control of controls; track control) {\r\n      <x-col [style.padding-top]=\"space()\" [span]=\"!control.span ? span() : control.span\" [hidden]=\"control.hidden\">\r\n        <ng-container *xOutlet=\"controlTpl()[control.id]; context: { $option: control }\">\r\n          <x-control [option]=\"control\"></x-control>\r\n        </ng-container>\r\n      </x-col>\r\n    }\r\n  </x-row>\r\n</ng-template>\r\n\r\n<ng-template #titleTemp let-row=\"row\">\r\n  <label class=\"x-form-title\">\r\n    @if (row.icon) {\r\n      <x-icon [type]=\"row.icon\"></x-icon>\r\n    }\r\n    <span>{{ row.title }}</span>\r\n  </label>\r\n</ng-template>\r\n", styles: [".x-form{margin:0;padding:0}.x-form{display:inline-block;overflow:hidden}.x-form-title{display:inline-flex;align-items:center;font-size:var(--x-font-size-medium)}.x-form-title>x-icon{margin-right:.25rem}.x-form-category{width:100%;overflow:hidden}.x-form-rows>x-row[hidden]{display:none}.x-form-rows>x-row:not(:first-child){margin-top:1.5rem}.x-form x-col[hidden]{display:none}.x-form-has-content .x-form-content{margin-top:1.5rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: XRowComponent, selector: "x-row" }, { kind: "component", type: XColComponent, selector: "x-col" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "component", type: XControlComponent, selector: "x-control" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XFormPrefix}`, imports: [
-                        NgClass,
-                        NgTemplateOutlet,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        XRowComponent,
-                        XColComponent,
-                        XOutletDirective,
-                        XIconComponent,
-                        XControlComponent
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
-                        {
-                            provide: X_FORM_CONTEXT,
-                            useExisting: XFormComponent
-                        }
-                    ], template: "<form\r\n  #form\r\n  class=\"x-form\"\r\n  [class.x-form-has-content]=\"content.innerHTML.trim()\"\r\n  [formGroup]=\"formGroup()\"\r\n  [style.width]=\"width()\"\r\n  [style.padding-bottom]=\"controlsType() === 'controls' ? this.space() : '0px'\"\r\n  [ngClass]=\"classMap()\"\r\n  (ngSubmit)=\"onSubmit($event)\"\r\n>\r\n  @if (title()) {\r\n    <div class=\"x-form-title\">{{ title() }}</div>\r\n  }\r\n  @switch (controlsType()) {\r\n    @case ('controls') {\r\n      <ng-container *ngTemplateOutlet=\"controlsTemp; context: { controls: controls() }\"> </ng-container>\r\n    }\r\n    @case ('rows') {\r\n      <ng-container *ngTemplateOutlet=\"rowsTemp; context: { rows: controls() }\"></ng-container>\r\n    }\r\n  }\r\n  <div class=\"x-form-content\" #content><ng-content></ng-content></div>\r\n</form>\r\n\r\n<ng-template #rowsTemp let-rows=\"rows\">\r\n  @for (row of rows; track row) {\r\n    <div class=\"x-form-category\" [hidden]=\"row.hidden\">\r\n      <ng-container *ngTemplateOutlet=\"titleTemp; context: { row: row }\"></ng-container>\r\n      <ng-container *ngTemplateOutlet=\"controlsTemp; context: { controls: row.controls }\"></ng-container>\r\n    </div>\r\n  }\r\n</ng-template>\r\n\r\n<ng-template #controlsTemp let-controls=\"controls\">\r\n  <x-row [space]=\"space()\">\r\n    @for (control of controls; track control) {\r\n      <x-col [style.padding-top]=\"space()\" [span]=\"!control.span ? span() : control.span\" [hidden]=\"control.hidden\">\r\n        <ng-container *xOutlet=\"controlTpl()[control.id]; context: { $option: control }\">\r\n          <x-control [option]=\"control\"></x-control>\r\n        </ng-container>\r\n      </x-col>\r\n    }\r\n  </x-row>\r\n</ng-template>\r\n\r\n<ng-template #titleTemp let-row=\"row\">\r\n  <label class=\"x-form-title\">\r\n    @if (row.icon) {\r\n      <x-icon [type]=\"row.icon\"></x-icon>\r\n    }\r\n    <span>{{ row.title }}</span>\r\n  </label>\r\n</ng-template>\r\n", styles: [".x-form{margin:0;padding:0}.x-form{display:inline-block;overflow:hidden}.x-form-title{display:inline-flex;align-items:center;font-size:var(--x-font-size-medium)}.x-form-title>x-icon{margin-right:.25rem}.x-form-category{width:100%;overflow:hidden}.x-form-rows>x-row[hidden]{display:none}.x-form-rows>x-row:not(:first-child){margin-top:1.5rem}.x-form x-col[hidden]{display:none}.x-form-has-content .x-form-content{margin-top:1.5rem}\n"] }]
-        }] });
-
-class XFormModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: XFormModule, imports: [XFormComponent, XControlComponent], exports: [XFormComponent, XControlComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormModule, imports: [XFormComponent, XControlComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: XFormModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    exports: [XFormComponent, XControlComponent],
-                    imports: [XFormComponent, XControlComponent]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { XAutoCompleteControl, XCascadeControl, XCheckboxControl, XColorPickerControl, XControl, XControlComponent, XControlPrefix, XControlProperty, XDatePickerControl, XFindControl, XFormComponent, XFormControl, XFormModule, XFormPrefix, XFormProperty, XInputControl, XInputNumberControl, XRadioControl, XRateControl, XSelectControl, XSliderSelectControl, XSwitchControl, XTextareaControl, XTimePickerControl };
-//# sourceMappingURL=ng-nest-ui-form.mjs.map