@iapps/ng-dhis2-ui 1.1.56 → 1.1.58

package/fesm2022/iapps-ng-dhis2-ui.mjs

@@ -8,7 +8,7 @@ import { NgxDhis2HttpClientService } from '@iapps/ngx-dhis2-http-client';
 import * as React from 'react';
 import React__default, { useState, useCallback, useRef, useEffect, createContext, useContext, useMemo } from 'react';
 import * as ReactDOM from 'react-dom/client';
-import { catchError, of, map, zip, firstValueFrom, Subject, takeUntil } from 'rxjs';
+import { catchError, of, map, zip, firstValueFrom, filter, Subject, takeUntil } from 'rxjs';
 import i18n from '@dhis2/d2-i18n';
 import { colors, theme, spacers } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
@@ -34,8 +34,8 @@ import * as i2 from '@angular/forms';
 import { Validators, UntypedFormControl, UntypedFormGroup, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import { toObservable } from '@angular/core/rxjs-interop';
 import { format } from 'date-fns';
+import { DataQueryFilter, DataFilterCondition, ProgramRuleEngine } from '@iapps/d2-web-sdk';
 import moment from 'moment';
-import { ProgramRuleEngine } from '@iapps/d2-web-sdk';
 
 class SharedDhis2UiModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.8", ngImport: i0, type: SharedDhis2UiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -4065,11 +4065,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.8", ngImpor
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
 const useFieldValidation = (props) => {
-    const { form, touched, field, value } = props;
+    const { form, touched, field, value, initialError, recordExistError } = props;
     const hasError = useMemo(() => {
+        if (recordExistError) {
+            return true;
+        }
+        if (initialError && value) {
+            return true;
+        }
         return touched && (form.get(field.id) || form.get(field.key))?.invalid;
-    }, [value, touched]);
+    }, [value, touched, initialError, recordExistError]);
     const validationError = useMemo(() => {
+        if (recordExistError) {
+            return recordExistError;
+        }
+        if (initialError && value) {
+            return initialError;
+        }
         if (!touched) {
             return undefined;
         }
@@ -4080,25 +4092,26 @@ const useFieldValidation = (props) => {
         if (error['min']) {
             return `${field.label || 'Value'} should not be less than ${error['min'].min}!`;
         }
-        else if (error['max']) {
+        if (error['max']) {
             return `${field.label || 'Value'} should not be greater than ${error['max'].max}!`;
         }
-        else if (error['pattern']) {
+        if (error['pattern']) {
             if (field.type === 'email') {
                 return `The email address provided is not valid`;
             }
-            else if (field.type === 'tel') {
+            if (field.type === 'tel') {
                 return 'Phone number provided is not valid';
             }
-            else {
-                return `${field.label || 'Value'} should have appropriate format`;
-            }
+            return `${field.label || 'Value'} should have appropriate format`;
+        }
+        if (error['customError']) {
+            return error['customError'];
         }
         return error['required']
             ? `${field.label || 'Value'} is required`
             : undefined;
-    }, [hasError]);
-    return { hasError, validationError };
+    }, [touched, value, initialError, recordExistError]);
+    return { validationError, hasError };
 };
 
 // Copyright 2025 UDSM DHIS2 Lab. All rights reserved.
@@ -4134,6 +4147,7 @@ class FormField {
         this.programStage = options.programStage;
         this.program = options.program;
         this.trackedEntityInstance = options.trackedEntityInstance;
+        this.trackedEntityType = options.trackedEntityType;
         this.hasOptions = options.hasOptions;
         this.dependentField = options.dependentField;
         this.displayInList = options.displayInList;
@@ -4319,6 +4333,8 @@ class FieldUtil {
                 return 'number';
             case FieldType.PHONE_NUMBER:
                 return 'tel';
+            case FieldType.EMAIL:
+                return 'email';
             case FieldType.ORG_UNIT:
                 return 'org-unit';
             case FieldType.DATE:
@@ -4435,8 +4451,11 @@ class FormUtil {
                 const maxValidators = field.max
                     ? [Validators.max(field.max)]
                     : [];
-                const phoneNumberValidator = field.type === 'tel'
-                    ? [Validators.pattern('\\+255[6-7][1-9][0-9]{7}$')]
+                const phoneNumberValidator = field.type === 'tel' ? [] : [];
+                const emailValidator = field.type === 'email'
+                    ? [
+                        Validators.pattern('^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}$'),
+                    ]
                     : [];
                 group[field.key] = field.required
                     ? new UntypedFormControl({ value, disabled: field.disabled }, {
@@ -4445,6 +4464,7 @@ class FormUtil {
                             ...minValidators,
                             ...maxValidators,
                             ...phoneNumberValidator,
+                            ...emailValidator,
                         ],
                         updateOn: 'change',
                     })
@@ -4453,6 +4473,7 @@ class FormUtil {
                             ...minValidators,
                             ...maxValidators,
                             ...phoneNumberValidator,
+                            ...emailValidator,
                         ],
                     });
                 if (field.referenceKey) {
@@ -4466,6 +4487,7 @@ class FormUtil {
                                 ...minValidators,
                                 ...maxValidators,
                                 ...phoneNumberValidator,
+                                ...emailValidator,
                             ],
                             updateOn: 'change',
                         })
@@ -4474,6 +4496,7 @@ class FormUtil {
                                 ...minValidators,
                                 ...maxValidators,
                                 ...phoneNumberValidator,
+                                ...emailValidator,
                             ],
                         });
                 }
@@ -4692,6 +4715,9 @@ class MetadataRule {
         const regex = /(A|#|V)\{([^}]+)\}/g;
         return this.rule?.condition?.replace(regex, (match, _, ruleVariable) => {
             const ruleVariableObject = this.ruleVariables?.find((variable) => variable.name === ruleVariable);
+            if (!ruleVariableObject) {
+                return `{${ruleVariable}}`;
+            }
             const code = camelCase(ruleVariableObject?.dataElement?.code) ||
                 ruleVariableObject?.dataElement?.id ||
                 camelCase(ruleVariableObject?.trackedEntityAttribute?.code) ||
@@ -4719,6 +4745,7 @@ class FormMetadataSection {
                 sortOrder: programTrackedEntityAttribute['sortOrder'],
                 mandatory: programTrackedEntityAttribute['mandatory'],
                 allowFutureDate: programTrackedEntityAttribute['allowFutureDate'],
+                trackedEntityType: (this.params.program['trackedEntityType'] || {})['id'],
                 metaType: 'ATTRIBUTE',
             };
         });
@@ -5331,6 +5358,7 @@ class BaseFormFieldComponent extends ReactWrapperModule {
         this.httpClient = inject(NgxDhis2HttpClientService);
         this.fieldType = 'textbox';
         this.field = input.required();
+        this.fieldError = input();
         this.fieldConfig = input(new FieldConfig());
         this.form = model.required();
         this.isValid = input();
@@ -5338,6 +5366,7 @@ class BaseFormFieldComponent extends ReactWrapperModule {
         this.value = model();
         this.value$ = toObservable(this.value);
         this.isValueAssigned$ = toObservable(this.isValueAssigned);
+        this.fieldError$ = toObservable(this.fieldError);
         this.label = computed(() => {
             return !this.fieldConfig()?.hideLabel ? this.field().label : undefined;
         });
@@ -5369,13 +5398,30 @@ class BaseFormFieldComponent extends ReactWrapperModule {
             const [selected, setSelected] = useState();
             const [touched, setTouched] = useState(false);
             const [disabled, setDisabled] = useState(this.field()?.disabled ?? this.field()?.generated ?? false);
+            const [initialError, setInitialError] = useState();
+            const [recordExistError, setRecordExistError] = useState();
+            const [checkingUniqueness, setCheckingUniqueness] = useState();
             useEffect(() => {
                 if (this.isValueAssigned()) {
+                    const value = this.form().get(this.field().id)?.value ||
+                        this.form().get(this.field().key)?.value;
                     setDisabled(true);
-                    setValue(this.form().get(this.field().id)?.value ||
-                        this.form().get(this.field().key)?.value);
+                    setValue(value);
+                    checkValueUniqueness();
                 }
             }, [this.isValueAssigned()]);
+            useEffect(() => {
+                const fieldErrorSubscription = this.fieldError$
+                    .pipe(filter((error) => error !== initialError))
+                    .subscribe({
+                    next: (error) => {
+                        setInitialError(error);
+                    },
+                });
+                return () => {
+                    fieldErrorSubscription.unsubscribe();
+                };
+            });
             const onChange = (payload) => setSelected(payload.selected);
             const arrayValue = useMemo(() => {
                 if (value && value.length > 0) {
@@ -5383,131 +5429,186 @@ class BaseFormFieldComponent extends ReactWrapperModule {
                 }
                 return [];
             }, [value]);
-            const { hasError, validationError } = useFieldValidation({
+            const { validationError, hasError } = useFieldValidation({
                 field: this.field(),
                 form: this.form(),
+                initialError,
+                recordExistError,
                 value,
                 touched,
             });
-            switch (this.field().controlType) {
-                case 'textarea':
-                    return (React__default.createElement(TextAreaField, { error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, required: this.field().required, name: this.field().id, label: this.label(), rows: 5, placeholder: this.placeholder(), value: value, onChange: (event) => {
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(event.value);
-                                this.immediateUpdate.emit({
-                                    form: this.form(),
-                                    value: event.value,
-                                });
+            const checkValueUniqueness = async () => {
+                if (this.field().unique && this.field().trackedEntityType) {
+                    setCheckingUniqueness(true);
+                    setRecordExistError(undefined);
+                    const d2 = window.d2Web;
+                    try {
+                        const response = (await d2.trackerModule.trackedEntity
+                            .setTrackedEntityType(this.field().trackedEntityType)
+                            .setOuMode('ACCESSIBLE')
+                            .setFilters([
+                            new DataQueryFilter()
+                                .setAttribute(this.field().id)
+                                .setCondition(DataFilterCondition.Equal)
+                                .setValue(value),
+                        ])
+                            .get())?.data;
+                        setCheckingUniqueness(false);
+                        if (response?.length > 0) {
+                            const customError = `Record with this ${this.label()} is already registered`;
+                            (this.form().controls[this.field().id] ||
+                                this.form().controls[this.field().key])?.setErrors({
+                                customError,
                             });
-                            setValue(event.value);
-                            setTouched(true);
-                        }, onBlur: () => {
-                            this.ngZone.run(() => {
-                                this.update.emit({ form: this.form(), value });
-                            });
-                        } }));
-                case 'org-unit':
-                    return (React__default.createElement(OrgUnitFormField, { label: this.label(), key: this.field().id, required: this.field().required, onSelectOrgUnit: (selectedOrgUnit) => {
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(selectedOrgUnit);
-                                this.update.emit({
-                                    form: this.form(),
-                                    value: selectedOrgUnit,
+                            setRecordExistError(customError);
+                        }
+                    }
+                    catch (e) {
+                        setCheckingUniqueness(false);
+                        setRecordExistError(undefined);
+                    }
+                }
+            };
+            const formFieldContent = () => {
+                switch (this.field().controlType) {
+                    case 'textarea':
+                        return (React__default.createElement(TextAreaField, { error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, required: this.field().required, name: this.field().id, label: this.label(), rows: 5, placeholder: this.placeholder(), value: value, onChange: (event) => {
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(event.value);
+                                    this.immediateUpdate.emit({
+                                        form: this.form(),
+                                        value: event.value,
+                                    });
                                 });
-                            });
-                            setValue(selectedOrgUnit);
-                            setTouched(true);
-                        }, selected: value }));
-                case 'transfer':
-                    return (React__default.createElement(Transfer, { filterable: true, filterPlaceholder: "Search", selected: selected, leftHeader: React__default.createElement("div", { style: {
-                                fontSize: 14,
-                                padding: '8px 4px',
-                            } }, this.field().availableOptionsLabel), rightHeader: React__default.createElement("div", { style: {
-                                fontSize: 14,
-                                padding: '8px 4px',
-                            } }, this.field().selectedOptionsLabel), options: this.field().options, onChange: (event) => {
-                            onChange({ selected: event.selected });
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(event.selected);
-                            });
-                            setValue(event.selected);
-                            setTouched(true);
-                            this.update.emit({ form: this.form(), value });
-                        } }));
-                case 'checkbox':
-                    return (React__default.createElement(Checkbox, { checked: Boolean(value), error: hasError, label: this.label(), name: this.field().id, disabled: disabled, onChange: (event) => {
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(event.checked);
-                            });
-                            setValue(event.checked);
-                            setTouched(true);
-                        }, onBlur: () => {
-                            this.ngZone.run(() => {
+                                setValue(event.value);
+                                setTouched(true);
+                            }, onBlur: () => {
+                                checkValueUniqueness();
+                                this.ngZone.run(() => {
+                                    this.update.emit({ form: this.form(), value });
+                                });
+                            } }));
+                    case 'org-unit':
+                        return (React__default.createElement(OrgUnitFormField, { label: this.label(), key: this.field().id, required: this.field().required, onSelectOrgUnit: (selectedOrgUnit) => {
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(selectedOrgUnit);
+                                    this.update.emit({
+                                        form: this.form(),
+                                        value: selectedOrgUnit,
+                                    });
+                                });
+                                setValue(selectedOrgUnit);
+                                setTouched(true);
+                            }, selected: value }));
+                    case 'transfer':
+                        return (React__default.createElement(Transfer, { filterable: true, filterPlaceholder: "Search", selected: selected, leftHeader: React__default.createElement("div", { style: {
+                                    fontSize: 14,
+                                    padding: '8px 4px',
+                                } }, this.field().availableOptionsLabel), rightHeader: React__default.createElement("div", { style: {
+                                    fontSize: 14,
+                                    padding: '8px 4px',
+                                } }, this.field().selectedOptionsLabel), options: this.field().options, onChange: (event) => {
+                                onChange({ selected: event.selected });
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(event.selected);
+                                });
+                                setValue(event.selected);
+                                setTouched(true);
                                 this.update.emit({ form: this.form(), value });
-                            });
-                        } }));
-                case 'dropdown':
-                    return (React__default.createElement(SingleSelectField, { filterable: (this.field().options || []).length > 5, clearable: true, error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, disabled: disabled, required: this.field().required, className: "select", label: this.label(), selected: value, onChange: (event) => {
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(event.selected);
-                                this.update.emit({
-                                    form: this.form(),
-                                    value: event.selected,
+                            } }));
+                    case 'checkbox':
+                        return (React__default.createElement(Checkbox, { checked: Boolean(value), error: hasError, label: this.label(), name: this.field().id, disabled: disabled, onChange: (event) => {
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(event.checked);
                                 });
-                            });
-                            setValue(event.selected);
-                            setTouched(true);
-                        } }, (this.field().options || []).map((option) => (React__default.createElement(SingleSelectOption, { key: crypto.randomUUID() || option.key, label: option.label, value: option.value })))));
-                case 'multi-dropdown':
-                    return (React__default.createElement(MultiSelectField, { clearText: "Clear", clearable: true, empty: "No data found", filterable: (this.field().options || []).length > 5, filterPlaceholder: "Type to filter options", error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, disabled: disabled, label: this.label(), required: this.field().required, loadingText: "Loading options", noMatchText: "No options found", onChange: (event) => {
-                            const selectedValue = (event.selected || []).join(',');
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(selectedValue);
-                                this.update.emit({
-                                    form: this.form(),
-                                    value: selectedValue,
+                                setValue(event.checked);
+                                setTouched(true);
+                            }, onBlur: () => {
+                                checkValueUniqueness();
+                                this.ngZone.run(() => {
+                                    this.update.emit({ form: this.form(), value });
                                 });
-                            });
-                            setValue(selectedValue);
-                            setTouched(true);
-                        }, selected: arrayValue }, (this.field().options || []).map((option) => (React__default.createElement(MultiSelectOption, { key: option.key, label: option.label, value: option.value })))));
-                case 'file':
-                    return (React__default.createElement(React__default.Fragment, null,
-                        React__default.createElement(FileUploadField, { label: this.label(), id: this.field().id, hasError: hasError, required: this.field().required, validationText: validationError, performUpload: true, uploadUrl: 'fileResources', onUploadSuccess: (fileId) => {
+                            } }));
+                    case 'dropdown':
+                        return (React__default.createElement(SingleSelectField, { filterable: (this.field().options || []).length > 5, clearable: true, error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, disabled: disabled, required: this.field().required, className: "select", label: this.label(), selected: value, onChange: (event) => {
                                 this.ngZone.run(() => {
-                                    this.form().get(this.field().id) ||
-                                        this.form().get(this.field().key)?.setValue(fileId);
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(event.selected);
                                     this.update.emit({
                                         form: this.form(),
-                                        value: fileId,
+                                        value: event.selected,
                                     });
                                 });
-                                setValue(fileId);
+                                setValue(event.selected);
                                 setTouched(true);
-                            } })));
-                default:
-                    return (React__default.createElement(InputField$1, { error: hasError, validationText: validationError, type: this.field().type, inputWidth: this.fieldConfig()?.inputWidth, required: this.field().required, name: this.field().id, label: this.label(), min: this.field().min?.toString(), max: this.field().max?.toString(), placeholder: this.placeholder(), value: value, readOnly: disabled, onChange: (event) => {
-                            this.ngZone.run(() => {
-                                (this.form().get(this.field().id) ||
-                                    this.form().get(this.field().key))?.setValue(event.value);
-                                this.immediateUpdate.emit({
-                                    form: this.form(),
-                                    value: event.value,
+                            }, onBlur: () => {
+                                checkValueUniqueness();
+                            } }, (this.field().options || []).map((option) => (React__default.createElement(SingleSelectOption, { key: crypto.randomUUID() || option.key, label: option.label, value: option.value })))));
+                    case 'multi-dropdown':
+                        return (React__default.createElement(MultiSelectField, { clearText: "Clear", clearable: true, empty: "No data found", filterable: (this.field().options || []).length > 5, filterPlaceholder: "Type to filter options", error: hasError, validationText: validationError, inputWidth: this.fieldConfig()?.inputWidth, disabled: disabled, label: this.label(), required: this.field().required, loadingText: "Loading options", noMatchText: "No options found", onChange: (event) => {
+                                const selectedValue = (event.selected || []).join(',');
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(selectedValue);
+                                    this.update.emit({
+                                        form: this.form(),
+                                        value: selectedValue,
+                                    });
                                 });
-                            });
-                            setValue(event.value);
-                            setTouched(true);
-                        }, onBlur: () => {
-                            this.ngZone.run(() => {
-                                this.update.emit({ form: this.form(), value });
-                            });
-                        } }));
+                                setValue(selectedValue);
+                                setTouched(true);
+                            }, onBlur: () => {
+                                checkValueUniqueness();
+                            }, selected: arrayValue }, (this.field().options || []).map((option) => (React__default.createElement(MultiSelectOption, { key: option.key, label: option.label, value: option.value })))));
+                    case 'file':
+                        return (React__default.createElement(React__default.Fragment, null,
+                            React__default.createElement(FileUploadField, { label: this.label(), id: this.field().id, hasError: hasError, required: this.field().required, validationText: validationError, performUpload: true, uploadUrl: 'fileResources', onUploadSuccess: (fileId) => {
+                                    this.ngZone.run(() => {
+                                        this.form().get(this.field().id) ||
+                                            this.form().get(this.field().key)?.setValue(fileId);
+                                        this.update.emit({
+                                            form: this.form(),
+                                            value: fileId,
+                                        });
+                                    });
+                                    setValue(fileId);
+                                    setTouched(true);
+                                } })));
+                    default:
+                        return (React__default.createElement(InputField$1, { error: hasError, validationText: validationError, type: this.field().type, inputWidth: this.fieldConfig()?.inputWidth, required: this.field().required, name: this.field().id, label: this.label(), min: this.field().min?.toString(), max: this.field().max?.toString(), placeholder: this.placeholder(), value: value, readOnly: disabled, onChange: (event) => {
+                                this.ngZone.run(() => {
+                                    (this.form().get(this.field().id) ||
+                                        this.form().get(this.field().key))?.setValue(event.value);
+                                    this.immediateUpdate.emit({
+                                        form: this.form(),
+                                        value: event.value,
+                                    });
+                                });
+                                setValue(event.value);
+                                setTouched(true);
+                            }, onBlur: () => {
+                                checkValueUniqueness();
+                                this.ngZone.run(() => {
+                                    this.update.emit({ form: this.form(), value });
+                                });
+                            } }));
+                }
+            };
+            {
+                return (React__default.createElement(React__default.Fragment, null,
+                    formFieldContent(),
+                    checkingUniqueness && (React__default.createElement("div", { style: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: 8,
+                            paddingTop: 8,
+                        } },
+                        React__default.createElement(CircularLoader$1, { small: true }),
+                        React__default.createElement("div", { style: { color: colors$1.grey800, fontSize: 14 } }, "Checking...")))));
             }
         };
     }
@@ -5515,7 +5616,7 @@ class BaseFormFieldComponent extends ReactWrapperModule {
         this.value.set(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.8", ngImport: i0, type: BaseFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.8", type: BaseFormFieldComponent, isStandalone: true, inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, fieldConfig: { classPropertyName: "fieldConfig", publicName: "fieldConfig", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, isValid: { classPropertyName: "isValid", publicName: "isValid", isSignal: true, isRequired: false, transformFunction: null }, isValueAssigned: { classPropertyName: "isValueAssigned", publicName: "isValueAssigned", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { form: "formChange", value: "valueChange", update: "update", immediateUpdate: "immediateUpdate" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.8", type: BaseFormFieldComponent, isStandalone: true, inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, fieldError: { classPropertyName: "fieldError", publicName: "fieldError", isSignal: true, isRequired: false, transformFunction: null }, fieldConfig: { classPropertyName: "fieldConfig", publicName: "fieldConfig", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, isValid: { classPropertyName: "isValid", publicName: "isValid", isSignal: true, isRequired: false, transformFunction: null }, isValueAssigned: { classPropertyName: "isValueAssigned", publicName: "isValueAssigned", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { form: "formChange", value: "valueChange", update: "update", immediateUpdate: "immediateUpdate" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.8", ngImport: i0, type: BaseFormFieldComponent, decorators: [{
             type: Directive
@@ -5548,6 +5649,7 @@ class FormFieldComponent {
         this.immediateFieldUpdate = new EventEmitter();
         this.runtimeOptionChange = new EventEmitter();
         this.value = signal('');
+        this.runtimeError = signal(undefined);
         this._runtimeOptions = [];
         this.runtimeOptions = [];
         this.fieldFilterControl = new FormControl();
@@ -5581,9 +5683,10 @@ class FormFieldComponent {
         });
     }
     #processRules(ruleActions) {
-        ruleActions
-            .filter((ruleAction) => ruleAction.field === this.field().id)
-            .forEach((ruleAction) => {
+        const fieldRuleActions = ruleActions.filter((ruleAction) => ruleAction.field === this.field().id);
+        let runtimeError;
+        let isValueAssigned = false;
+        fieldRuleActions.forEach((ruleAction) => {
             switch (ruleAction.actionType) {
                 case 'ASSIGN': {
                     if (ruleAction.assignedData) {
@@ -5592,16 +5695,26 @@ class FormFieldComponent {
                             this.form
                                 ?.get(this.field().key)
                                 ?.setValue(ruleAction.assignedData);
-                            this.isValueAssigned.set(true);
+                            isValueAssigned = true;
                             this.onValueChange();
                         }
                     }
                     break;
                 }
+                case 'SHOWERROR': {
+                    runtimeError = ruleAction.displayedContent;
+                    (this.form.controls[this.field().id] ||
+                        this.form.controls[this.field().key])?.setErrors({
+                        customError: runtimeError,
+                    });
+                    break;
+                }
                 default:
                     break;
             }
         });
+        this.runtimeError.set(runtimeError);
+        this.isValueAssigned.set(isValueAssigned);
     }
     ngOnDestroy() {
         this._onDestroy.next();
@@ -5709,11 +5822,11 @@ class FormFieldComponent {
         this._runtimeOptions = [...options];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.8", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.8", type: FormFieldComponent, isStandalone: false, selector: "ng-dhis2-ui-form-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, fieldConfig: { classPropertyName: "fieldConfig", publicName: "fieldConfig", isSignal: false, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: false, isRequired: false, transformFunction: null }, isCheckBoxButton: { classPropertyName: "isCheckBoxButton", publicName: "isCheckBoxButton", isSignal: false, isRequired: false, transformFunction: null }, fieldClass: { classPropertyName: "fieldClass", publicName: "fieldClass", isSignal: false, isRequired: false, transformFunction: null }, programRuleActions: { classPropertyName: "programRuleActions", publicName: "programRuleActions", isSignal: true, isRequired: false, transformFunction: null }, dataEntities: { classPropertyName: "dataEntities", publicName: "dataEntities", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { fieldUpdate: "fieldUpdate", immediateFieldUpdate: "immediateFieldUpdate", runtimeOptionChange: "runtimeOptionChange" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"field()\" class=\"form-field-item\">\n  <ng-dhis2-ui-form-field-item\n    [field]=\"field()\"\n    [isValueAssigned]=\"isValueAssigned()\"\n    [fieldConfig]=\"fieldConfig\"\n    [(form)]=\"form\"\n    [value]=\"value()\"\n    (update)=\"onValueChange()\"\n    (immediateUpdate)=\"onImmediateChange($event)\"\n  />\n</div>\n", styles: [".form-field-item{margin-bottom:16px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormFieldItemComponent, selector: "ng-dhis2-ui-form-field-item" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.8", type: FormFieldComponent, isStandalone: false, selector: "ng-dhis2-ui-form-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, fieldConfig: { classPropertyName: "fieldConfig", publicName: "fieldConfig", isSignal: false, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: false, isRequired: false, transformFunction: null }, isCheckBoxButton: { classPropertyName: "isCheckBoxButton", publicName: "isCheckBoxButton", isSignal: false, isRequired: false, transformFunction: null }, fieldClass: { classPropertyName: "fieldClass", publicName: "fieldClass", isSignal: false, isRequired: false, transformFunction: null }, programRuleActions: { classPropertyName: "programRuleActions", publicName: "programRuleActions", isSignal: true, isRequired: false, transformFunction: null }, dataEntities: { classPropertyName: "dataEntities", publicName: "dataEntities", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { fieldUpdate: "fieldUpdate", immediateFieldUpdate: "immediateFieldUpdate", runtimeOptionChange: "runtimeOptionChange" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"field()\" class=\"form-field-item\">\n  <ng-dhis2-ui-form-field-item\n    [field]=\"field()\"\n    [fieldError]=\"runtimeError()\"\n    [isValueAssigned]=\"isValueAssigned()\"\n    [fieldConfig]=\"fieldConfig\"\n    [(form)]=\"form\"\n    [value]=\"value()\"\n    (update)=\"onValueChange()\"\n    (immediateUpdate)=\"onImmediateChange($event)\"\n  />\n</div>\n", styles: [".form-field-item{margin-bottom:16px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormFieldItemComponent, selector: "ng-dhis2-ui-form-field-item" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.8", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-dhis2-ui-form-field', standalone: false, template: "<div *ngIf=\"field()\" class=\"form-field-item\">\n  <ng-dhis2-ui-form-field-item\n    [field]=\"field()\"\n    [isValueAssigned]=\"isValueAssigned()\"\n    [fieldConfig]=\"fieldConfig\"\n    [(form)]=\"form\"\n    [value]=\"value()\"\n    (update)=\"onValueChange()\"\n    (immediateUpdate)=\"onImmediateChange($event)\"\n  />\n</div>\n", styles: [".form-field-item{margin-bottom:16px}\n"] }]
+            args: [{ selector: 'ng-dhis2-ui-form-field', standalone: false, template: "<div *ngIf=\"field()\" class=\"form-field-item\">\n  <ng-dhis2-ui-form-field-item\n    [field]=\"field()\"\n    [fieldError]=\"runtimeError()\"\n    [isValueAssigned]=\"isValueAssigned()\"\n    [fieldConfig]=\"fieldConfig\"\n    [(form)]=\"form\"\n    [value]=\"value()\"\n    (update)=\"onValueChange()\"\n    (immediateUpdate)=\"onImmediateChange($event)\"\n  />\n</div>\n", styles: [".form-field-item{margin-bottom:16px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { fieldConfig: [{
                 type: Input
             }], form: [{
@@ -6647,6 +6760,7 @@ class ProgramEntryFormFieldUtil {
                 sortOrder: programTrackedEntityAttribute.sortOrder,
                 mandatory: programTrackedEntityAttribute.mandatory,
                 allowFutureDate: programTrackedEntityAttribute.allowFutureDate,
+                trackedEntityType: this.program.trackedEntityType?.id,
                 metaType: 'ATTRIBUTE',
                 stepId: null,
             };
@@ -6729,7 +6843,7 @@ class ProgramEntryFormFieldUtil {
                 label: field.formName || field.name,
                 key: field.code ? camelCase(field.code) : field.id,
                 required: field.mandatory,
-                type: field.valueType,
+                type: FieldUtil.getFieldType(field.valueType),
                 options,
                 disabled: this.#getDisabledStatus(field),
                 order: field.sortOrder,
@@ -7000,7 +7114,7 @@ class ProgramEntryFormModule {
             const instance = await this.#getInstance();
             this.instance.set(instance);
             if (this.config().autoAssignedValues) {
-                this.#updateInstanceWithAutoAssignedValues(this.config().autoAssignedValues);
+                this.#updateInstanceWithAutoAssignedValues(this.config().autoAssignedValues || []);
             }
             this.loading.set(false);
         }