@yourself.create/ngx-form-designer 0.0.12 → 0.0.14

package/fesm2022/uch-web-ngx-form-designer.mjs

@@ -329,6 +329,8 @@ class RuleEvaluationService {
                 return value !== null && value !== undefined && value !== '';
             case 'truthy':
                 return !!value;
+            case 'notTruthy':
+                return !value;
             default: return false;
         }
     }
@@ -1379,11 +1381,10 @@ class DesignerStateService {
                 const originalField = clipboardFields.get(oldRefId);
                 if (originalField) {
                     const newFieldId = v4();
-                    const newField = {
-                        ...originalField,
+                    const newField = this.cloneFieldForDuplication(originalField, {
                         id: newFieldId,
                         name: `${originalField.name}_${Date.now()}_${Math.floor(Math.random() * 1000)}`
-                    };
+                    });
                     targetSchema.fields.push(newField);
                     newNode.refId = newFieldId;
                 }
@@ -2308,12 +2309,11 @@ class DesignerStateService {
                 const originalField = scopeFields.find(f => f.id === cloned.refId);
                 if (originalField) {
                     const newFieldId = v4();
-                    const newField = {
-                        ...this.cloneValue(originalField),
+                    const newField = this.cloneFieldForDuplication(originalField, {
                         id: newFieldId,
                         name: `${originalField.name}_copy_${Date.now()}`,
                         label: `${originalField.label || 'Field'} (Copy)`
-                    };
+                    });
                     scopeFields.push(newField);
                     cloned.refId = newFieldId;
                 }
@@ -2383,11 +2383,10 @@ class DesignerStateService {
         if (!location)
             return;
         const newFieldId = v4();
-        const newField = {
-            ...this.cloneValue(location.field),
+        const newField = this.cloneFieldForDuplication(location.field, {
             id: newFieldId,
             name: `${location.field.name}_copy_${Date.now()}`
-        };
+        });
         location.schema.fields.push(newField);
         const widgetNode = this.findWidgetByRefId(location.schema.layout, fieldId);
         if (!widgetNode) {
@@ -2914,6 +2913,42 @@ class DesignerStateService {
     cloneValue(value) {
         return structuredClone(value);
     }
+    cloneFieldForDuplication(field, overrides) {
+        const clonedField = this.cloneValue(field);
+        const bindingIdMap = new Map();
+        const events = clonedField.events?.map(binding => {
+            const nextBindingId = v4();
+            bindingIdMap.set(binding.id, nextBindingId);
+            return {
+                ...binding,
+                id: nextBindingId,
+                actions: binding.actions.map(action => {
+                    if (action.type !== 'api') {
+                        return action;
+                    }
+                    return {
+                        ...action,
+                        datasourceId: action.datasourceId ? this.createEventDatasourceId() : action.datasourceId
+                    };
+                })
+            };
+        });
+        const dataConfig = clonedField.dataConfig?.eventId && bindingIdMap.has(clonedField.dataConfig.eventId)
+            ? {
+                ...clonedField.dataConfig,
+                eventId: bindingIdMap.get(clonedField.dataConfig.eventId)
+            }
+            : clonedField.dataConfig;
+        return {
+            ...clonedField,
+            ...overrides,
+            events,
+            dataConfig
+        };
+    }
+    createEventDatasourceId() {
+        return `evt_ds_${v4().replace(/-/g, '')}`;
+    }
     clampIndex(index, length) {
         if (index < 0)
             return 0;
@@ -4471,6 +4506,9 @@ class FormEventRunner {
             if (!field || !field.events)
                 return;
             const bindings = field.events.filter(b => b.on === evt.type && b.enabled !== false);
+            if (evt.type === 'change' && this.isEmptyEventValue(evt.value)) {
+                await this.clearInactiveApiBindingDatasources(field, bindings, evt);
+            }
             for (const binding of bindings) {
                 for (const action of binding.actions) {
                     const stop = await this.executeAction(action, binding.id, evt, schema.fields);
@@ -4484,6 +4522,46 @@ class FormEventRunner {
             this.processingDepth--;
         }
     }
+    async clearInactiveApiBindingDatasources(field, activeBindings, evt) {
+        if (!this.dataSourceWriter || !field.events?.length) {
+            return;
+        }
+        const activeBindingIds = new Set(activeBindings.map(binding => binding.id));
+        const clearedDatasourceIds = new Set();
+        for (const binding of field.events) {
+            if (binding.enabled === false || activeBindingIds.has(binding.id)) {
+                continue;
+            }
+            for (const action of binding.actions) {
+                if (action.type !== 'api') {
+                    continue;
+                }
+                const datasourceId = this.resolveDatasourceId(action, evt);
+                if (!datasourceId || clearedDatasourceIds.has(datasourceId)) {
+                    continue;
+                }
+                clearedDatasourceIds.add(datasourceId);
+                try {
+                    await this.dataSourceWriter({
+                        datasourceId,
+                        rows: [],
+                        action,
+                        event: evt,
+                        response: []
+                    });
+                    this.engine.emitDataSourceUpdate(datasourceId);
+                }
+                catch (error) {
+                    this.logger.warn('Failed to clear API action datasource after the source field was emptied.', {
+                        event: evt,
+                        action,
+                        datasourceId,
+                        error
+                    });
+                }
+            }
+        }
+    }
     async executeAction(action, eventId, evt, fields) {
         if (action.type === 'log') {
             this.logger.log(action.message || 'Event fired', { event: evt });
@@ -4493,6 +4571,10 @@ class FormEventRunner {
             this.handleSetValue(action, evt, fields);
             return false;
         }
+        if (action.type === 'clearFields') {
+            this.handleClearFields(action, fields);
+            return false;
+        }
         if (action.type === 'navigate') {
             return this.handleNavigateAction(action, fields);
         }
@@ -4501,9 +4583,6 @@ class FormEventRunner {
     }
     handleSetValue(action, evt, fields) {
         const target = fields.find(f => f.id === action.targetFieldId);
-        if (!target)
-            return;
-        const previousValue = this.engine.getValue(target.name);
         let val;
         if (action.valueFrom === 'literal') {
             val = action.valueLiteral;
@@ -4517,15 +4596,30 @@ class FormEventRunner {
                 val = this.engine.getValue(source.name);
             }
         }
-        this.engine.setValue(target.name, val);
-        if (!Object.is(previousValue, val)) {
-            this.engine.emitUiEvent({
-                fieldId: target.id,
-                fieldName: target.name,
-                type: 'change',
-                value: val
-            });
+        this.applyFieldValue(target, val);
+    }
+    handleClearFields(action, fields) {
+        const targetFieldIds = [...new Set(action.targetFieldIds ?? [])];
+        for (const targetFieldId of targetFieldIds) {
+            const target = fields.find(field => field.id === targetFieldId);
+            this.applyFieldValue(target, null);
+        }
+    }
+    applyFieldValue(target, value) {
+        if (!target) {
+            return;
+        }
+        const previousValue = this.engine.getValue(target.name);
+        this.engine.setValue(target.name, value);
+        if (Object.is(previousValue, value)) {
+            return;
         }
+        this.engine.emitUiEvent({
+            fieldId: target.id,
+            fieldName: target.name,
+            type: 'change',
+            value
+        });
     }
     async handleApiAction(action, eventId, evt, fields) {
         if (!this.apiExecutor) {
@@ -4655,6 +4749,8 @@ class FormEventRunner {
                 return !this.isEmptyValue(left);
             case 'truthy':
                 return !!left;
+            case 'notTruthy':
+                return !left;
             default:
                 return false;
         }
@@ -4737,6 +4833,18 @@ class FormEventRunner {
         }
         return [{ value }];
     }
+    isEmptyEventValue(value) {
+        if (value === undefined || value === null) {
+            return true;
+        }
+        if (typeof value === 'string') {
+            return value.trim().length === 0;
+        }
+        if (Array.isArray(value)) {
+            return value.length === 0;
+        }
+        return false;
+    }
 }
 
 const FILE_UPLOAD_CLIENT = new InjectionToken('FILE_UPLOAD_CLIENT');
@@ -5187,6 +5295,7 @@ class JsonFormRendererComponent {
     fieldDataAccessApi;
     formContentId;
     formContentVersion;
+    refreshKey;
     valueChange = new EventEmitter();
     groupedValueChange = new EventEmitter();
     combinedValueChange = new EventEmitter();
@@ -5219,6 +5328,10 @@ class JsonFormRendererComponent {
         if (changes['mode'] && !changes['mode'].firstChange) {
             this.configureRunner();
         }
+        if (changes['refreshKey'] && !changes['refreshKey'].firstChange) {
+            this.createEngine();
+            return;
+        }
         if (changes['fieldDataAccessMap']
             || changes['fieldDataAccessApi']
             || changes['formContentId']
@@ -5960,7 +6073,7 @@ class JsonFormRendererComponent {
             || typeof record['type'] === 'string';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: JsonFormRendererComponent, deps: [{ token: DesignerStateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: JsonFormRendererComponent, isStandalone: true, selector: "app-json-form-renderer", inputs: { schema: "schema", initialValues: "initialValues", initialFieldLabels: "initialFieldLabels", mode: "mode", device: "device", showLayoutGuides: "showLayoutGuides", breakpoint: "breakpoint", eventLogger: "eventLogger", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", navigateToPage: "navigateToPage", uploadOnSubmit: "uploadOnSubmit", severityEvaluationMode: "severityEvaluationMode", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion" }, outputs: { valueChange: "valueChange", groupedValueChange: "groupedValueChange", combinedValueChange: "combinedValueChange", validationChange: "validationChange", uploadedFilesChange: "uploadedFilesChange", formSubmit: "formSubmit" }, usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: JsonFormRendererComponent, isStandalone: true, selector: "app-json-form-renderer", inputs: { schema: "schema", initialValues: "initialValues", initialFieldLabels: "initialFieldLabels", mode: "mode", device: "device", showLayoutGuides: "showLayoutGuides", breakpoint: "breakpoint", eventLogger: "eventLogger", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", navigateToPage: "navigateToPage", uploadOnSubmit: "uploadOnSubmit", severityEvaluationMode: "severityEvaluationMode", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion", refreshKey: "refreshKey" }, outputs: { valueChange: "valueChange", groupedValueChange: "groupedValueChange", combinedValueChange: "combinedValueChange", validationChange: "validationChange", uploadedFilesChange: "uploadedFilesChange", formSubmit: "formSubmit" }, usesOnChanges: true, ngImport: i0, template: `
     <div class="form-renderer-container"
          data-fd="renderer"
          [class.is-mobile]="device === 'mobile'"
@@ -6043,6 +6156,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], formContentVersion: [{
                 type: Input
+            }], refreshKey: [{
+                type: Input
             }], valueChange: [{
                 type: Output
             }], groupedValueChange: [{
@@ -6244,6 +6359,7 @@ class FormJourneyViewerComponent {
     fieldDataAccessApi;
     formContentId;
     formContentVersion;
+    refreshKey;
     formDataChange = new EventEmitter();
     formDataByPageChange = new EventEmitter();
     formValidationChange = new EventEmitter();
@@ -6261,9 +6377,7 @@ class FormJourneyViewerComponent {
         return index >= 0 ? index : 0;
     });
     ngOnInit() {
-        this.activePageId.set(this.journey.startPageId || this.journey.pages[0]?.id || '');
-        this.values.set(this.normalizeInitialValues(this.initialValues));
-        this.fieldLabels.set(this.normalizeInitialFieldLabels(this.initialFieldLabels));
+        this.resetViewerState();
     }
     ngOnChanges(changes) {
         if (changes['initialValues']) {
@@ -6272,6 +6386,10 @@ class FormJourneyViewerComponent {
         if (changes['initialFieldLabels']) {
             this.fieldLabels.set(this.normalizeInitialFieldLabels(this.initialFieldLabels));
         }
+        if (changes['refreshKey'] && !changes['refreshKey'].firstChange) {
+            this.resetViewerState();
+            return;
+        }
         const current = this.activePageId();
         if (current && this.journey.pages.some(page => page.id === current))
             return;
@@ -6320,6 +6438,11 @@ class FormJourneyViewerComponent {
             return {};
         return structuredClone(value);
     }
+    resetViewerState() {
+        this.activePageId.set(this.journey.startPageId || this.journey.pages[0]?.id || '');
+        this.values.set(this.normalizeInitialValues(this.initialValues));
+        this.fieldLabels.set(this.normalizeInitialFieldLabels(this.initialFieldLabels));
+    }
     toValueScope(values) {
         const scope = {};
         for (const fieldValue of Object.values(values)) {
@@ -6378,7 +6501,7 @@ class FormJourneyViewerComponent {
         return flattened;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormJourneyViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormJourneyViewerComponent, isStandalone: true, selector: "app-form-journey-viewer", inputs: { journey: "journey", viewOnly: "viewOnly", severityEvaluationMode: "severityEvaluationMode", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", initialValues: "initialValues", initialFieldLabels: "initialFieldLabels", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion" }, outputs: { formDataChange: "formDataChange", formDataByPageChange: "formDataByPageChange", formValidationChange: "formValidationChange", uploadedFilesChange: "uploadedFilesChange", submit: "submit", activePageIdChange: "activePageIdChange" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: JsonFormRendererComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormJourneyViewerComponent, isStandalone: true, selector: "app-form-journey-viewer", inputs: { journey: "journey", viewOnly: "viewOnly", severityEvaluationMode: "severityEvaluationMode", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", initialValues: "initialValues", initialFieldLabels: "initialFieldLabels", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion", refreshKey: "refreshKey" }, outputs: { formDataChange: "formDataChange", formDataByPageChange: "formDataByPageChange", formValidationChange: "formValidationChange", uploadedFilesChange: "uploadedFilesChange", submit: "submit", activePageIdChange: "activePageIdChange" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: JsonFormRendererComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
     <div class="form-journey-viewer flex h-full w-full flex-col" data-fd="form-journey-viewer">
       <div class="border-b border-gray-200 bg-white px-4 py-2 text-xs text-gray-600" data-fd="journey-progress">
         {{ activePageIndex() + 1 }} / {{ journey.pages.length }}
@@ -6399,6 +6522,7 @@ class FormJourneyViewerComponent {
           [fieldDataAccessApi]="fieldDataAccessApi"
           [formContentId]="formContentId"
           [formContentVersion]="formContentVersion"
+          [refreshKey]="refreshKey"
           [navigateToPage]="navigateToPage"
           (valueChange)="onValueChange($event)"
           (validationChange)="onValidationChange($event)"
@@ -6407,7 +6531,7 @@ class FormJourneyViewerComponent {
         </app-json-form-renderer>
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormJourneyViewerComponent, decorators: [{
             type: Component,
@@ -6436,6 +6560,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
           [fieldDataAccessApi]="fieldDataAccessApi"
           [formContentId]="formContentId"
           [formContentVersion]="formContentVersion"
+          [refreshKey]="refreshKey"
           [navigateToPage]="navigateToPage"
           (valueChange)="onValueChange($event)"
           (validationChange)="onValidationChange($event)"
@@ -6469,6 +6594,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], formContentVersion: [{
                 type: Input
+            }], refreshKey: [{
+                type: Input
             }], formDataChange: [{
                 type: Output
             }], formDataByPageChange: [{
@@ -6516,6 +6643,7 @@ class FormViewerComponent {
     fieldDataAccessApi;
     formContentId;
     formContentVersion;
+    refreshKey;
     formDataChange = new EventEmitter();
     formDataByPageChange = new EventEmitter();
     formValidationChange = new EventEmitter();
@@ -6791,7 +6919,7 @@ class FormViewerComponent {
         return !!value && typeof value === 'object';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormViewerComponent, isStandalone: true, selector: "app-form-viewer", inputs: { schema: "schema", journey: "journey", data: "data", dataUsesFieldNameKeys: "dataUsesFieldNameKeys", options: "options", viewOnly: "viewOnly", severityEvaluationMode: "severityEvaluationMode", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion" }, outputs: { formDataChange: "formDataChange", formDataByPageChange: "formDataByPageChange", formValidationChange: "formValidationChange", uploadedFilesChange: "uploadedFilesChange", submit: "submit", activePageIdChange: "activePageIdChange" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: JsonFormRendererComponent, descendants: true }, { propertyName: "journeyViewer", first: true, predicate: FormJourneyViewerComponent, descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: FormViewerComponent, isStandalone: true, selector: "app-form-viewer", inputs: { schema: "schema", journey: "journey", data: "data", dataUsesFieldNameKeys: "dataUsesFieldNameKeys", options: "options", viewOnly: "viewOnly", severityEvaluationMode: "severityEvaluationMode", eventApis: "eventApis", eventApiExecutor: "eventApiExecutor", fieldDataAccessMap: "fieldDataAccessMap", fieldDataAccessApi: "fieldDataAccessApi", formContentId: "formContentId", formContentVersion: "formContentVersion", refreshKey: "refreshKey" }, outputs: { formDataChange: "formDataChange", formDataByPageChange: "formDataByPageChange", formValidationChange: "formValidationChange", uploadedFilesChange: "uploadedFilesChange", submit: "submit", activePageIdChange: "activePageIdChange" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: JsonFormRendererComponent, descendants: true }, { propertyName: "journeyViewer", first: true, predicate: FormJourneyViewerComponent, descendants: true }], ngImport: i0, template: `
     <div class="form-viewer-container flex flex-col h-full"
          data-fd="form-viewer"
          [attr.data-fd-mode]="viewOnly ? 'preview' : 'live'">
@@ -6810,6 +6938,7 @@ class FormViewerComponent {
                     [fieldDataAccessApi]="fieldDataAccessApi"
                     [formContentId]="formContentId"
                     [formContentVersion]="formContentVersion"
+                    [refreshKey]="refreshKey"
                     (formDataChange)="onValueChange($event)"
                     (formDataByPageChange)="onJourneyValueByPageChange($event)"
                     (formValidationChange)="onValidationChange($event)"
@@ -6834,6 +6963,7 @@ class FormViewerComponent {
                     [fieldDataAccessApi]="fieldDataAccessApi"
                     [formContentId]="formContentId"
                     [formContentVersion]="formContentVersion"
+                    [refreshKey]="refreshKey"
                     (valueChange)="onValueChange($event)"
                     (validationChange)="onValidationChange($event)"
                     (uploadedFilesChange)="onUploadedFilesChange($event)"
@@ -6854,7 +6984,7 @@ class FormViewerComponent {
             </button>
         </div>
     </div>
-  `, isInline: true, styles: [":host{display:block;height:100%;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "component", type: FormJourneyViewerComponent, selector: "app-form-journey-viewer", inputs: ["journey", "viewOnly", "severityEvaluationMode", "eventApis", "eventApiExecutor", "initialValues", "initialFieldLabels", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["formDataChange", "formDataByPageChange", "formValidationChange", "uploadedFilesChange", "submit", "activePageIdChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [":host{display:block;height:100%;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "component", type: FormJourneyViewerComponent, selector: "app-form-journey-viewer", inputs: ["journey", "viewOnly", "severityEvaluationMode", "eventApis", "eventApiExecutor", "initialValues", "initialFieldLabels", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["formDataChange", "formDataByPageChange", "formValidationChange", "uploadedFilesChange", "submit", "activePageIdChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormViewerComponent, decorators: [{
             type: Component,
@@ -6877,6 +7007,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                     [fieldDataAccessApi]="fieldDataAccessApi"
                     [formContentId]="formContentId"
                     [formContentVersion]="formContentVersion"
+                    [refreshKey]="refreshKey"
                     (formDataChange)="onValueChange($event)"
                     (formDataByPageChange)="onJourneyValueByPageChange($event)"
                     (formValidationChange)="onValidationChange($event)"
@@ -6901,6 +7032,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                     [fieldDataAccessApi]="fieldDataAccessApi"
                     [formContentId]="formContentId"
                     [formContentVersion]="formContentVersion"
+                    [refreshKey]="refreshKey"
                     (valueChange)="onValueChange($event)"
                     (validationChange)="onValidationChange($event)"
                     (uploadedFilesChange)="onUploadedFilesChange($event)"
@@ -6948,6 +7080,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                 type: Input
             }], formContentVersion: [{
                 type: Input
+            }], refreshKey: [{
+                type: Input
             }], formDataChange: [{
                 type: Output
             }], formDataByPageChange: [{
@@ -9029,7 +9163,7 @@ class LayoutCanvasComponent {
 
     <!-- Hidden file input for import -->
     <input type="file" #fileInput accept=".json" (change)="onFileSelected($event)" style="display: none;">
-    `, isInline: true, styles: [".canvas-grid{background-image:radial-gradient(rgba(148,163,184,.35) 1px,transparent 1px);background-size:18px 18px}.custom-scrollbar::-webkit-scrollbar{width:6px;height:6px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:transparent;border-radius:10px}.custom-scrollbar:hover::-webkit-scrollbar-thumb{background:#00000026}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:transparent transparent}.custom-scrollbar:hover{scrollbar-color:rgba(0,0,0,.15) transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "ngmodule", type: UiIconModule }, { kind: "component", type: i3$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "component", type: MonacoEditorComponent, selector: "app-monaco-editor", inputs: ["value", "language", "theme", "readOnly", "minimap", "options"], outputs: ["valueChange"] }] });
+    `, isInline: true, styles: [".canvas-grid{background-image:radial-gradient(rgba(148,163,184,.35) 1px,transparent 1px);background-size:18px 18px}.custom-scrollbar::-webkit-scrollbar{width:6px;height:6px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:transparent;border-radius:10px}.custom-scrollbar:hover::-webkit-scrollbar-thumb{background:#00000026}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:transparent transparent}.custom-scrollbar:hover{scrollbar-color:rgba(0,0,0,.15) transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "ngmodule", type: UiIconModule }, { kind: "component", type: i3$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "component", type: MonacoEditorComponent, selector: "app-monaco-editor", inputs: ["value", "language", "theme", "readOnly", "minimap", "options"], outputs: ["valueChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LayoutCanvasComponent, decorators: [{
             type: Component,
@@ -17177,7 +17311,8 @@ class QueryBuilderComponent {
         { label: 'Contains', value: 'contains' },
         { label: 'Is Empty', value: 'empty' },
         { label: 'Not Empty', value: 'notEmpty' },
-        { label: 'Is Truthy', value: 'truthy' }
+        { label: 'Is Truthy', value: 'truthy' },
+        { label: 'Is Not Truthy', value: 'notTruthy' }
     ];
     fieldOptions() {
         return [
@@ -17259,7 +17394,7 @@ class QueryBuilderComponent {
         this.emitChange();
     }
     requiresValue(operator) {
-        return !['empty', 'notEmpty', 'truthy'].includes(operator);
+        return !['empty', 'notEmpty', 'truthy', 'notTruthy'].includes(operator);
     }
     conditionValueSource(condition) {
         return condition.valueSource === 'field' ? 'field' : 'literal';
@@ -19638,7 +19773,7 @@ class FormPreviewComponent {
             </div>
         </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.JsonPipe, name: "json" }, { kind: "ngmodule", type: UiIconModule }, { kind: "component", type: i3$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.JsonPipe, name: "json" }, { kind: "ngmodule", type: UiIconModule }, { kind: "component", type: i3$1.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormPreviewComponent, decorators: [{
             type: Component,
@@ -23646,7 +23781,8 @@ class EventsWorkspaceComponent {
         { label: 'Ends With', value: 'endsWith' },
         { label: 'Is Empty', value: 'empty' },
         { label: 'Is Not Empty', value: 'notEmpty' },
-        { label: 'Is Truthy', value: 'truthy' }
+        { label: 'Is Truthy', value: 'truthy' },
+        { label: 'Is Not Truthy', value: 'notTruthy' }
     ];
     currentSchema = computed(() => this.draftSchema() ?? this.schema());
     fields = computed(() => this.flattenFields(this.currentSchema()));
@@ -23755,6 +23891,7 @@ class EventsWorkspaceComponent {
     actionTypeOptions(binding, actionIndex) {
         return [
             { label: 'Set Value', value: 'setValue' },
+            { label: 'Clear Fields', value: 'clearFields' },
             { label: 'Log', value: 'log' },
             { label: 'Navigate', value: 'navigate' },
             { label: 'API', value: 'api', disabled: !this.canSelectApiAction(binding, actionIndex) }
@@ -23828,6 +23965,15 @@ class EventsWorkspaceComponent {
                 binding.actions[actionIndex] = nextAction;
                 return;
             }
+            if (currentAction.type === 'clearFields') {
+                const nextAction = {
+                    ...currentAction,
+                    ...patch,
+                    targetFieldIds: [...patch.targetFieldIds ?? currentAction.targetFieldIds]
+                };
+                binding.actions[actionIndex] = nextAction;
+                return;
+            }
             if (currentAction.type === 'log') {
                 const nextAction = {
                     ...currentAction,
@@ -24043,6 +24189,9 @@ class EventsWorkspaceComponent {
     asSetValue(action) {
         return action;
     }
+    asClearFields(action) {
+        return action;
+    }
     asLog(action) {
         return action;
     }
@@ -24124,7 +24273,7 @@ class EventsWorkspaceComponent {
         this.updateNavigateConditionGroup(bindingIndex, actionIndex, this.toNavigateLogicGroup(next));
     }
     navigateOperatorNeedsValue(operator) {
-        return !['empty', 'notEmpty', 'truthy'].includes(operator);
+        return !['empty', 'notEmpty', 'truthy', 'notTruthy'].includes(operator);
     }
     navigateConditionFields() {
         return this.fields().map(field => ({
@@ -24149,6 +24298,22 @@ class EventsWorkspaceComponent {
     hasApiAction(binding) {
         return binding.actions.some(action => action.type === 'api');
     }
+    isClearFieldSelected(action, fieldId) {
+        return action.targetFieldIds.includes(fieldId);
+    }
+    toggleClearFieldTarget(action, fieldId, selected) {
+        if (action.type !== 'clearFields') {
+            return;
+        }
+        const targetFieldIds = selected
+            ? [...new Set([...action.targetFieldIds, fieldId])]
+            : action.targetFieldIds.filter(id => id !== fieldId);
+        const path = this.findActionPath(action);
+        if (!path) {
+            return;
+        }
+        this.patchAction(path.bindingIndex, path.actionIndex, { targetFieldIds });
+    }
     canSelectApiAction(binding, actionIndex) {
         const current = binding.actions[actionIndex];
         if (current?.type === 'api')
@@ -24205,6 +24370,12 @@ class EventsWorkspaceComponent {
                 valueLiteral: ''
             };
         }
+        if (type === 'clearFields') {
+            return {
+                type: 'clearFields',
+                targetFieldIds: []
+            };
+        }
         if (type === 'api') {
             return {
                 type: 'api',
@@ -24744,6 +24915,32 @@ class EventsWorkspaceComponent {
                     </div>
                   </ng-container>
 
+                  <ng-container *ngIf="action.type === 'clearFields'">
+                    <div>
+                      <label class="mb-1 block text-[11px] font-medium text-gray-600">Fields To Clear</label>
+                      <div class="max-h-40 overflow-y-auto rounded-md border border-gray-200 bg-white">
+                        <label
+                          *ngFor="let targetField of availableTargetFields(); trackBy: trackFieldById"
+                          class="flex items-center gap-2 border-b border-gray-100 px-2 py-1.5 text-xs last:border-b-0">
+                          <input
+                            type="checkbox"
+                            class="rounded border-gray-300 text-blue-600 focus:ring-blue-500"
+                            [disabled]="readOnly()"
+                            [ngModel]="isClearFieldSelected(asClearFields(action), targetField.id)"
+                            (ngModelChange)="toggleClearFieldTarget(action, targetField.id, $event)">
+                          <span>{{ targetField.label }}</span>
+                          <span class="text-[10px] text-gray-400">({{ targetField.name }})</span>
+                        </label>
+                        <div *ngIf="!availableTargetFields().length" class="px-2 py-3 text-xs text-gray-500">
+                          No fields available.
+                        </div>
+                      </div>
+                      <p class="mt-2 text-[10px] text-gray-500">
+                        Clears selected fields to an empty runtime value.
+                      </p>
+                    </div>
+                  </ng-container>
+
                   <ng-container *ngIf="action.type === 'log'">
                     <label class="mb-1 block text-[11px] font-medium text-gray-600">Message</label>
                     <input
@@ -25125,6 +25322,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
                     </div>
                   </ng-container>
 
+                  <ng-container *ngIf="action.type === 'clearFields'">
+                    <div>
+                      <label class="mb-1 block text-[11px] font-medium text-gray-600">Fields To Clear</label>
+                      <div class="max-h-40 overflow-y-auto rounded-md border border-gray-200 bg-white">
+                        <label
+                          *ngFor="let targetField of availableTargetFields(); trackBy: trackFieldById"
+                          class="flex items-center gap-2 border-b border-gray-100 px-2 py-1.5 text-xs last:border-b-0">
+                          <input
+                            type="checkbox"
+                            class="rounded border-gray-300 text-blue-600 focus:ring-blue-500"
+                            [disabled]="readOnly()"
+                            [ngModel]="isClearFieldSelected(asClearFields(action), targetField.id)"
+                            (ngModelChange)="toggleClearFieldTarget(action, targetField.id, $event)">
+                          <span>{{ targetField.label }}</span>
+                          <span class="text-[10px] text-gray-400">({{ targetField.name }})</span>
+                        </label>
+                        <div *ngIf="!availableTargetFields().length" class="px-2 py-3 text-xs text-gray-500">
+                          No fields available.
+                        </div>
+                      </div>
+                      <p class="mt-2 text-[10px] text-gray-500">
+                        Clears selected fields to an empty runtime value.
+                      </p>
+                    </div>
+                  </ng-container>
+
                   <ng-container *ngIf="action.type === 'log'">
                     <label class="mb-1 block text-[11px] font-medium text-gray-600">Message</label>
                     <input
@@ -26293,7 +26516,7 @@ class FormDesignerShellComponent {
         </div>
       </section>
     </div>
-  `, isInline: true, styles: ["@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.animate-slide-in-right{animation:slideInRight .3s cubic-bezier(.16,1,.3,1)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "component", type: JsonFormDesignerComponent, selector: "app-json-form-designer", inputs: ["flavor", "mode", "eventApis", "eventApiExecutor", "pages", "activePageId", "canRemovePage"], outputs: ["pageAdd", "pageSelect", "pageRemove", "pageRename", "pageRouteChange"] }, { kind: "component", type: EventsWorkspaceComponent, selector: "app-events-workspace", inputs: ["schema", "readOnly", "eventApis", "eventApiBrowser", "pages"], outputs: ["schemaChange", "eventsSave"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "component", type: EmailRendererComponent, selector: "app-email-renderer", inputs: ["schema", "engine"] }, { kind: "component", type: GlobalDataManagerComponent, selector: "app-global-data-manager", outputs: ["close"] }, { kind: "component", type: AiChatDrawerComponent, selector: "app-ai-chat-drawer", outputs: ["close", "expand"] }, { kind: "component", type: AiWorkspaceComponent, selector: "app-ai-workspace", outputs: ["close"] }] });
+  `, isInline: true, styles: ["@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.animate-slide-in-right{animation:slideInRight .3s cubic-bezier(.16,1,.3,1)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "component", type: JsonFormDesignerComponent, selector: "app-json-form-designer", inputs: ["flavor", "mode", "eventApis", "eventApiExecutor", "pages", "activePageId", "canRemovePage"], outputs: ["pageAdd", "pageSelect", "pageRemove", "pageRename", "pageRouteChange"] }, { kind: "component", type: EventsWorkspaceComponent, selector: "app-events-workspace", inputs: ["schema", "readOnly", "eventApis", "eventApiBrowser", "pages"], outputs: ["schemaChange", "eventsSave"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }, { kind: "component", type: EmailRendererComponent, selector: "app-email-renderer", inputs: ["schema", "engine"] }, { kind: "component", type: GlobalDataManagerComponent, selector: "app-global-data-manager", outputs: ["close"] }, { kind: "component", type: AiChatDrawerComponent, selector: "app-ai-chat-drawer", outputs: ["close", "expand"] }, { kind: "component", type: AiWorkspaceComponent, selector: "app-ai-workspace", outputs: ["close"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FormDesignerShellComponent, decorators: [{
             type: Component,
@@ -31547,7 +31770,7 @@ class WebsitePreviewShellComponent {
         }
       </main>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: JsonFormRendererComponent, selector: "app-json-form-renderer", inputs: ["schema", "initialValues", "initialFieldLabels", "mode", "device", "showLayoutGuides", "breakpoint", "eventLogger", "eventApis", "eventApiExecutor", "navigateToPage", "uploadOnSubmit", "severityEvaluationMode", "fieldDataAccessMap", "fieldDataAccessApi", "formContentId", "formContentVersion", "refreshKey"], outputs: ["valueChange", "groupedValueChange", "combinedValueChange", "validationChange", "uploadedFilesChange", "formSubmit"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: WebsitePreviewShellComponent, decorators: [{
             type: Component,
@@ -32681,6 +32904,10 @@ class TextFieldWidgetComponent {
                 this.clearResolvedValue();
                 return;
             }
+            if (clearWhenMissing && !(await this.hasResolvedRows())) {
+                this.clearResolvedValue();
+                return;
+            }
             const val = await this.dataProvider.getValue(this.config, this.engine);
             this.displayPrefix = await this.dataProvider.getValueDisplayPrefix(this.config, this.engine);
             if (val === undefined || val === null) {
@@ -32690,23 +32917,37 @@ class TextFieldWidgetComponent {
                 this.clearResolvedValue();
                 return;
             }
-            this.control.setValue(val, { emitEvent: false });
-            this.syncFormattedNumberValue();
-            if (this.engine) {
-                this.engine.setValue(this.config.name, val);
-            }
+            this.applyResolvedValue(val);
         }
         catch {
             // Ignore failed datasource refreshes; field remains editable.
         }
     }
+    async hasResolvedRows() {
+        const rows = await this.dataProvider.getList(this.config, this.engine);
+        return rows.length > 0;
+    }
     clearResolvedValue() {
         this.displayPrefix = '';
-        this.control.setValue(null, { emitEvent: false });
+        this.applyResolvedValue(null);
+    }
+    applyResolvedValue(value) {
+        const previousValue = this.engine?.getValue(this.config.name);
+        this.control.setValue(value, { emitEvent: false });
         this.syncFormattedNumberValue();
-        if (this.engine) {
-            this.engine.setValue(this.config.name, null);
+        if (!this.engine) {
+            return;
+        }
+        this.engine.setValue(this.config.name, value);
+        if (Object.is(previousValue, value)) {
+            return;
         }
+        this.engine.emitUiEvent({
+            fieldId: this.config.id,
+            fieldName: this.config.name,
+            type: 'change',
+            value
+        });
     }
     async hasSelectedRowMatch() {
         const cfg = this.config.dataConfig;