@epistola.app/valtimo-plugin 0.0.1

package/dist/lib/components/generate-document-configuration/generate-document-configuration.component.d.ts

@@ -0,0 +1,78 @@
+import { EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { FunctionConfigurationComponent, PluginConfigurationData } from '@valtimo/plugin';
+import { FormOutput, SelectItem } from '@valtimo/components';
+import { CaseManagementParams, ManagementContext } from '@valtimo/shared';
+import { ProcessLinkStateService } from '@valtimo/process-link';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { GenerateDocumentConfig, TemplateField } from '../../models';
+import { EpistolaPluginService } from '../../services';
+import * as i0 from "@angular/core";
+export type VariantSelectionMode = 'explicit' | 'attributes';
+export declare class GenerateDocumentConfigurationComponent implements FunctionConfigurationComponent, OnInit, OnDestroy {
+    private readonly epistolaPluginService;
+    private readonly processLinkStateService;
+    save$: Observable<void>;
+    disabled$: Observable<boolean>;
+    pluginId: string;
+    prefillConfiguration$: Observable<GenerateDocumentConfig>;
+    selectedPluginConfigurationData$?: Observable<PluginConfigurationData>;
+    context$?: Observable<[ManagementContext, CaseManagementParams]>;
+    valid: EventEmitter<boolean>;
+    configuration: EventEmitter<GenerateDocumentConfig>;
+    templateOptions$: BehaviorSubject<SelectItem[]>;
+    templatesLoading$: BehaviorSubject<boolean>;
+    variantOptions$: BehaviorSubject<SelectItem[]>;
+    variantsLoading$: BehaviorSubject<boolean>;
+    environmentOptions$: BehaviorSubject<SelectItem[]>;
+    environmentsLoading$: BehaviorSubject<boolean>;
+    templateFields$: BehaviorSubject<TemplateField[]>;
+    templateFieldsLoading$: BehaviorSubject<boolean>;
+    dataMapping$: BehaviorSubject<Record<string, any>>;
+    prefillDataMapping$: Observable<Record<string, any>>;
+    outputFormatOptions: SelectItem[];
+    readonly selectedTemplateId$: BehaviorSubject<string>;
+    readonly selectedVariantId$: BehaviorSubject<string>;
+    variantSelectionMode: VariantSelectionMode;
+    variantAttributeEntries: {
+        key: string;
+        value: string;
+    }[];
+    caseDefinitionKey: string | null;
+    processVariables: string[];
+    requiredFieldsStatus: {
+        mapped: number;
+        total: number;
+    };
+    private readonly destroy$;
+    private saveSubscription;
+    private readonly formValue$;
+    private readonly valid$;
+    private pluginConfigurationId$;
+    constructor(epistolaPluginService: EpistolaPluginService, processLinkStateService: ProcessLinkStateService);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    formValueChange(formOutput: FormOutput): void;
+    onDataMappingChange(mapping: Record<string, any>): void;
+    onRequiredFieldsStatusChange(status: {
+        mapped: number;
+        total: number;
+    }): void;
+    onVariantSelectionModeChange(mode: VariantSelectionMode): void;
+    addAttributeEntry(): void;
+    removeAttributeEntry(index: number): void;
+    onAttributeEntryChange(): void;
+    private revalidate;
+    private formatAttributes;
+    private initContext;
+    private initPrefillDataMapping;
+    private initPluginConfiguration;
+    private initTemplatesLoading;
+    private initEnvironmentsLoading;
+    private initVariantsLoading;
+    private initTemplateFieldsLoading;
+    private loadProcessVariables;
+    private handleValid;
+    private openSaveSubscription;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GenerateDocumentConfigurationComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GenerateDocumentConfigurationComponent, "epistola-generate-document-configuration", never, { "save$": { "alias": "save$"; "required": false; }; "disabled$": { "alias": "disabled$"; "required": false; }; "pluginId": { "alias": "pluginId"; "required": false; }; "prefillConfiguration$": { "alias": "prefillConfiguration$"; "required": false; }; "selectedPluginConfigurationData$": { "alias": "selectedPluginConfigurationData$"; "required": false; }; "context$": { "alias": "context$"; "required": false; }; }, { "valid": "valid"; "configuration": "configuration"; }, never, never, true, never>;
+}

package/dist/lib/epistola.module.d.ts

@@ -0,0 +1,17 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/common/http";
+import * as i3 from "@valtimo/plugin";
+import * as i4 from "@valtimo/components";
+import * as i5 from "./components/epistola-configuration/epistola-configuration.component";
+import * as i6 from "./components/generate-document-configuration/generate-document-configuration.component";
+import * as i7 from "./components/check-job-status-configuration/check-job-status-configuration.component";
+import * as i8 from "./components/download-document-configuration/download-document-configuration.component";
+import * as i9 from "./components/data-mapping-tree/data-mapping-tree.component";
+import * as i10 from "./components/field-tree/field-tree.component";
+import * as i11 from "./components/epistola-download/epistola-download.component";
+export declare class EpistolaPluginModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<EpistolaPluginModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EpistolaPluginModule, never, [typeof i1.CommonModule, typeof i2.HttpClientModule, typeof i3.PluginTranslatePipeModule, typeof i4.FormModule, typeof i4.InputModule, typeof i4.SelectModule, typeof i5.EpistolaConfigurationComponent, typeof i6.GenerateDocumentConfigurationComponent, typeof i7.CheckJobStatusConfigurationComponent, typeof i8.DownloadDocumentConfigurationComponent, typeof i9.DataMappingTreeComponent, typeof i10.FieldTreeComponent, typeof i11.EpistolaDownloadComponent], [typeof i5.EpistolaConfigurationComponent, typeof i6.GenerateDocumentConfigurationComponent, typeof i7.CheckJobStatusConfigurationComponent, typeof i8.DownloadDocumentConfigurationComponent, typeof i9.DataMappingTreeComponent, typeof i10.FieldTreeComponent, typeof i11.EpistolaDownloadComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<EpistolaPluginModule>;
+}

package/dist/lib/epistola.specification.d.ts

@@ -0,0 +1,3 @@
+import { PluginSpecification } from '@valtimo/plugin';
+declare const epistolaPluginSpecification: PluginSpecification;
+export { epistolaPluginSpecification };

package/dist/lib/models/config.d.ts

@@ -0,0 +1,49 @@
+import { PluginConfigurationData } from '@valtimo/plugin';
+/**
+ * Plugin-level configuration for Epistola.
+ * Contains connection settings and defaults.
+ */
+export interface EpistolaPluginConfig extends PluginConfigurationData {
+    baseUrl: string;
+    apiKey: string;
+    tenantId: string;
+    defaultEnvironmentId?: string;
+    templateSyncEnabled?: boolean;
+}
+/**
+ * Action configuration for the generate-document action.
+ * Contains all parameters needed to generate a document.
+ *
+ * Variant selection supports two modes:
+ * - Explicit: set variantId directly
+ * - By attributes: set variantAttributes with key-value pairs (values can be value resolver expressions)
+ */
+export interface GenerateDocumentConfig {
+    templateId: string;
+    variantId?: string;
+    variantAttributes?: Record<string, string>;
+    environmentId?: string;
+    dataMapping: Record<string, any>;
+    outputFormat: 'PDF' | 'HTML';
+    filename: string;
+    correlationId?: string;
+    resultProcessVariable: string;
+}
+/**
+ * Action configuration for the check-job-status action.
+ * Specifies which process variables to read from and write to.
+ */
+export interface CheckJobStatusConfig {
+    requestIdVariable: string;
+    statusVariable: string;
+    documentIdVariable?: string;
+    errorMessageVariable?: string;
+}
+/**
+ * Action configuration for the download-document action.
+ * Specifies which process variables to read from and write to.
+ */
+export interface DownloadDocumentConfig {
+    documentIdVariable: string;
+    contentVariable: string;
+}

package/dist/lib/models/index.d.ts

@@ -0,0 +1,2 @@
+export * from './config';
+export * from './template';

package/dist/lib/models/template.d.ts

@@ -0,0 +1,63 @@
+/**
+ * Basic information about an Epistola template.
+ */
+export interface TemplateInfo {
+    id: string;
+    name: string;
+    description?: string;
+}
+/**
+ * Detailed information about an Epistola template including its fields.
+ */
+export interface TemplateDetails {
+    id: string;
+    name: string;
+    fields: TemplateField[];
+}
+/**
+ * Represents a field in an Epistola template.
+ * Supports nested structures through the children property.
+ */
+export interface TemplateField {
+    name: string;
+    path: string;
+    type: string;
+    fieldType: 'SCALAR' | 'OBJECT' | 'ARRAY';
+    required: boolean;
+    description?: string;
+    children?: TemplateField[];
+}
+/**
+ * Represents a single data mapping entry.
+ */
+export interface DataMappingEntry {
+    templateField: string;
+    dataSource: string;
+}
+/**
+ * Source type for data mapping: how the value is provided.
+ */
+export type DataSourceType = 'document' | 'processVariable' | 'manual';
+/**
+ * Validation result from the backend.
+ */
+export interface ValidationResult {
+    valid: boolean;
+    missingRequiredFields: string[];
+}
+/**
+ * Information about an Epistola environment.
+ */
+export interface EnvironmentInfo {
+    id: string;
+    name: string;
+}
+/**
+ * Information about an Epistola template variant.
+ */
+export interface VariantInfo {
+    id: string;
+    templateId: string;
+    name: string;
+    attributes: Record<string, string>;
+}

package/dist/lib/services/epistola-plugin.service.d.ts

@@ -0,0 +1,42 @@
+import { HttpClient } from '@angular/common/http';
+import { ConfigService } from '@valtimo/shared';
+import { Observable } from 'rxjs';
+import { EnvironmentInfo, TemplateDetails, TemplateInfo, ValidationResult, VariantInfo } from '../models';
+import * as i0 from "@angular/core";
+/**
+ * Service for interacting with Epistola plugin API endpoints.
+ * Provides methods to fetch templates, environments, variants,
+ * process variables, and validate mappings.
+ */
+export declare class EpistolaPluginService {
+    private readonly http;
+    private readonly configService;
+    private readonly apiEndpoint;
+    constructor(http: HttpClient, configService: ConfigService);
+    /**
+     * Get all available templates for a plugin configuration.
+     */
+    getTemplates(pluginConfigurationId: string): Observable<TemplateInfo[]>;
+    /**
+     * Get template details including its fields.
+     */
+    getTemplateDetails(pluginConfigurationId: string, templateId: string): Observable<TemplateDetails>;
+    /**
+     * Get all available environments for a plugin configuration.
+     */
+    getEnvironments(pluginConfigurationId: string): Observable<EnvironmentInfo[]>;
+    /**
+     * Get all variants for a specific template.
+     */
+    getVariants(pluginConfigurationId: string, templateId: string): Observable<VariantInfo[]>;
+    /**
+     * Discover process variable names for a given process definition.
+     */
+    getProcessVariables(processDefinitionKey: string): Observable<string[]>;
+    /**
+     * Validate that a data mapping covers all required template fields.
+     */
+    validateMapping(pluginConfigurationId: string, templateId: string, dataMapping: Record<string, any>): Observable<ValidationResult>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EpistolaPluginService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<EpistolaPluginService>;
+}

package/dist/lib/services/index.d.ts

@@ -0,0 +1 @@
+export * from './epistola-plugin.service';

package/dist/public_api.d.ts

@@ -0,0 +1,12 @@
+export * from './lib/models';
+export * from './lib/services';
+export * from './lib/epistola.module';
+export * from './lib/epistola.specification';
+export * from './lib/components/epistola-configuration/epistola-configuration.component';
+export * from './lib/components/generate-document-configuration/generate-document-configuration.component';
+export * from './lib/components/check-job-status-configuration/check-job-status-configuration.component';
+export * from './lib/components/download-document-configuration/download-document-configuration.component';
+export * from './lib/components/field-tree/field-tree.component';
+export * from './lib/components/data-mapping-tree/data-mapping-tree.component';
+export * from './lib/components/epistola-download/epistola-download.component';
+export * from './lib/components/epistola-download/epistola-download.formio';

package/ng-package.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "dist",
+  "lib": {
+    "entryFile": "src/public_api.ts"
+  },
+  "allowedNonPeerDependencies": [
+    "@angular/common",
+    "@angular/core",
+    "@angular/forms",
+    "@valtimo/plugin",
+    "@valtimo/components",
+    "@ngx-translate/core",
+    "rxjs",
+    "tslib"
+  ]
+}

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@epistola.app/valtimo-plugin",
+  "version": "0.0.1",
+  "description": "Epistola document generation plugin for Valtimo",
+  "license": "EUPL-1.2",
+  "module": "dist/fesm2022/epistola.app-valtimo-plugin.mjs",
+  "typings": "dist/index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/fesm2022/epistola.app-valtimo-plugin.mjs"
+    }
+  },
+  "sideEffects": false,
+  "scripts": {
+    "build": "ng-packagr -p ng-package.json",
+    "watch": "ng-packagr -p ng-package.json --watch",
+    "test": "echo 'No tests configured yet'"
+  },
+  "peerDependencies": {
+    "@angular/common": ">=17.0.0",
+    "@angular/core": ">=17.0.0",
+    "@angular/forms": ">=17.0.0",
+    "@valtimo/plugin": "^13.0.0",
+    "@valtimo/components": "^13.0.0",
+    "@valtimo/shared": "^13.0.0",
+    "@valtimo/process-link": "^13.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.6.0"
+  },
+  "devDependencies": {
+    "ng-packagr": "^19.0.0"
+  }
+}

package/src/lib/assets/epistola-logo.ts

@@ -0,0 +1,4 @@
+// Placeholder logo - a simple document icon in SVG format, base64 encoded
+// TODO: Replace with actual Epistola logo
+export const EPISTOLA_PLUGIN_LOGO_BASE64 =
+  'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iIzMzNjZjYyI+PHBhdGggZD0iTTE0IDJINmMtMS4xIDAtMiAuOS0yIDJ2MTZjMCAxLjEuOSAyIDIgMmgxMmMxLjEgMCAyLS45IDItMlY4bC02LTZ6bTQgMThINlY0aDd2NWg1djExeiIvPjxwYXRoIGQ9Ik04IDEyaDh2Mkg4em0wIDRoOHYtMkg4em0wLThWNmg0djJ6Ii8+PC9zdmc+';

package/src/lib/assets/index.ts

@@ -0,0 +1 @@
+export * from './epistola-logo';

package/src/lib/components/check-job-status-configuration/check-job-status-configuration.component.html

@@ -0,0 +1,51 @@
+<v-form
+    (valueChange)="formValueChange($event)"
+    *ngIf="{
+      disabled: safeDisabled$ | async,
+      prefill: prefillConfiguration$ ? (prefillConfiguration$ | async) : null
+    } as obs"
+>
+  <v-input
+    name="requestIdVariable"
+    [title]="'requestIdVariable' | pluginTranslate: pluginId | async"
+    [tooltip]="'requestIdVariableTooltip' | pluginTranslate: pluginId | async"
+    [margin]="true"
+    [defaultValue]="obs.prefill?.requestIdVariable || 'epistolaRequestId'"
+    [disabled]="obs.disabled"
+    [required]="true"
+  >
+  </v-input>
+
+  <v-input
+    name="statusVariable"
+    [title]="'statusVariable' | pluginTranslate: pluginId | async"
+    [tooltip]="'statusVariableTooltip' | pluginTranslate: pluginId | async"
+    [margin]="true"
+    [defaultValue]="obs.prefill?.statusVariable || 'epistolaStatus'"
+    [disabled]="obs.disabled"
+    [required]="true"
+  >
+  </v-input>
+
+  <v-input
+    name="documentIdVariable"
+    [title]="'documentIdVariable' | pluginTranslate: pluginId | async"
+    [tooltip]="'documentIdVariableTooltip' | pluginTranslate: pluginId | async"
+    [margin]="true"
+    [defaultValue]="obs.prefill?.documentIdVariable || 'epistolaDocumentId'"
+    [disabled]="obs.disabled"
+    [required]="false"
+  >
+  </v-input>
+
+  <v-input
+    name="errorMessageVariable"
+    [title]="'errorMessageVariable' | pluginTranslate: pluginId | async"
+    [tooltip]="'errorMessageVariableTooltip' | pluginTranslate: pluginId | async"
+    [margin]="true"
+    [defaultValue]="obs.prefill?.errorMessageVariable || 'epistolaErrorMessage'"
+    [disabled]="obs.disabled"
+    [required]="false"
+  >
+  </v-input>
+</v-form>

package/src/lib/components/check-job-status-configuration/check-job-status-configuration.component.scss

@@ -0,0 +1 @@
+// Check job status configuration styles

package/src/lib/components/check-job-status-configuration/check-job-status-configuration.component.ts

@@ -0,0 +1,71 @@
+import {Component, EventEmitter, Input, OnDestroy, OnInit, Output} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {FunctionConfigurationComponent, PluginTranslatePipeModule} from '@valtimo/plugin';
+import {FormModule, FormOutput, InputModule} from '@valtimo/components';
+import {BehaviorSubject, combineLatest, Observable, Subscription, take} from 'rxjs';
+import {delay, startWith} from 'rxjs/operators';
+import {CheckJobStatusConfig} from '../../models';
+
+@Component({
+  selector: 'epistola-check-job-status-configuration',
+  templateUrl: './check-job-status-configuration.component.html',
+  styleUrls: ['./check-job-status-configuration.component.scss'],
+  standalone: true,
+  imports: [CommonModule, PluginTranslatePipeModule, FormModule, InputModule]
+})
+export class CheckJobStatusConfigurationComponent
+  implements FunctionConfigurationComponent, OnInit, OnDestroy
+{
+  @Input() save$!: Observable<void>;
+  @Input() disabled$!: Observable<boolean>;
+  @Input() pluginId!: string;
+  @Input() prefillConfiguration$!: Observable<CheckJobStatusConfig>;
+
+  @Output() valid: EventEmitter<boolean> = new EventEmitter<boolean>();
+  @Output() configuration: EventEmitter<CheckJobStatusConfig> = new EventEmitter<CheckJobStatusConfig>();
+
+  private saveSubscription!: Subscription;
+  private readonly formValue$ = new BehaviorSubject<CheckJobStatusConfig | null>(null);
+  private readonly valid$ = new BehaviorSubject<boolean>(false);
+
+  safeDisabled$!: Observable<boolean>;
+
+  ngOnInit(): void {
+    this.safeDisabled$ = this.disabled$.pipe(
+      startWith(true),
+      delay(0)
+    );
+    this.openSaveSubscription();
+  }
+
+  ngOnDestroy() {
+    this.saveSubscription?.unsubscribe();
+  }
+
+  formValueChange(formOutput: FormOutput): void {
+    const formValue = formOutput as unknown as CheckJobStatusConfig;
+    this.formValue$.next(formValue);
+    this.handleValid(formValue);
+  }
+
+  private handleValid(formValue: CheckJobStatusConfig): void {
+    const valid = !!(
+      formValue?.requestIdVariable &&
+      formValue?.statusVariable
+    );
+    this.valid$.next(valid);
+    this.valid.emit(valid);
+  }
+
+  private openSaveSubscription(): void {
+    this.saveSubscription = this.save$?.subscribe(() => {
+      combineLatest([this.formValue$, this.valid$])
+        .pipe(take(1))
+        .subscribe(([formValue, valid]) => {
+          if (valid && formValue) {
+            this.configuration.emit(formValue);
+          }
+        });
+    });
+  }
+}

package/src/lib/components/data-mapping-tree/data-mapping-tree.component.html

@@ -0,0 +1,23 @@
+<div class="data-mapping-tree">
+  <div class="mapping-header">
+    <h5>{{ 'dataMappingTitle' | pluginTranslate: pluginId | async }}</h5>
+    <p class="helper-text">{{ 'dataMappingDescription' | pluginTranslate: pluginId | async }}</p>
+  </div>
+
+  <div class="field-tree-root" *ngIf="templateFields.length > 0">
+    <epistola-field-tree
+      *ngFor="let field of templateFields"
+      [field]="field"
+      [value]="getFieldValue(field.name)"
+      [pluginId]="pluginId"
+      [caseDefinitionKey]="caseDefinitionKey"
+      [processVariables]="processVariables"
+      [disabled]="disabled"
+      (valueChange)="onFieldValueChange(field.name, $event)"
+    ></epistola-field-tree>
+  </div>
+
+  <div class="no-fields" *ngIf="templateFields.length === 0">
+    <p>{{ 'noTemplateFields' | pluginTranslate: pluginId | async }}</p>
+  </div>
+</div>

package/src/lib/components/data-mapping-tree/data-mapping-tree.component.scss

@@ -0,0 +1,38 @@
+.data-mapping-tree {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
+.mapping-header {
+  margin-bottom: 0.75rem;
+
+  h5 {
+    margin-bottom: 0.25rem;
+    font-weight: 600;
+  }
+
+  .helper-text {
+    color: #6c757d;
+    font-size: 0.875rem;
+    margin-bottom: 0;
+  }
+}
+
+.field-tree-root {
+  border: 1px solid #e0e0e0;
+  border-radius: 4px;
+  padding: 0.5rem 0.75rem;
+}
+
+.no-fields {
+  padding: 1rem;
+  text-align: center;
+  color: #6c757d;
+  background-color: #f8f9fa;
+  border: 1px solid #dee2e6;
+  border-radius: 4px;
+
+  p {
+    margin-bottom: 0;
+  }
+}

package/src/lib/components/data-mapping-tree/data-mapping-tree.component.ts

@@ -0,0 +1,124 @@
+import {Component, EventEmitter, Input, OnDestroy, OnInit, Output} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {PluginTranslatePipeModule} from '@valtimo/plugin';
+import {Observable, Subject} from 'rxjs';
+import {takeUntil} from 'rxjs/operators';
+import {TemplateField} from '../../models';
+import {FieldTreeComponent} from '../field-tree/field-tree.component';
+
+/**
+ * Top-level wrapper that hosts FieldTreeComponent instances for each top-level template field.
+ * Manages the full nested mapping object, completeness tracking, and emits mapping changes.
+ */
+@Component({
+  selector: 'epistola-data-mapping-tree',
+  templateUrl: './data-mapping-tree.component.html',
+  styleUrls: ['./data-mapping-tree.component.scss'],
+  standalone: true,
+  imports: [
+    CommonModule,
+    PluginTranslatePipeModule,
+    FieldTreeComponent
+  ]
+})
+export class DataMappingTreeComponent implements OnInit, OnDestroy {
+  @Input() pluginId!: string;
+  @Input() templateFields$!: Observable<TemplateField[]>;
+  @Input() prefillMapping$!: Observable<Record<string, any>>;
+  @Input() disabled$!: Observable<boolean>;
+  @Input() caseDefinitionKey: string | null = null;
+  @Input() processVariables: string[] = [];
+
+  @Output() mappingChange = new EventEmitter<Record<string, any>>();
+  @Output() requiredFieldsStatus = new EventEmitter<{mapped: number; total: number}>();
+
+  templateFields: TemplateField[] = [];
+  mapping: Record<string, any> = {};
+  disabled = false;
+
+  private readonly destroy$ = new Subject<void>();
+
+  ngOnInit(): void {
+    this.templateFields$.pipe(
+      takeUntil(this.destroy$)
+    ).subscribe(fields => {
+      this.templateFields = fields;
+      this.emitRequiredFieldsStatus();
+    });
+
+    this.prefillMapping$.pipe(
+      takeUntil(this.destroy$)
+    ).subscribe(mapping => {
+      if (mapping && Object.keys(mapping).length > 0) {
+        this.mapping = {...mapping};
+      }
+      this.emitRequiredFieldsStatus();
+    });
+
+    this.disabled$.pipe(
+      takeUntil(this.destroy$)
+    ).subscribe(disabled => {
+      this.disabled = disabled;
+    });
+  }
+
+  ngOnDestroy(): void {
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
+
+  onFieldValueChange(fieldName: string, value: any): void {
+    if (value === undefined || value === null || value === '') {
+      const {[fieldName]: _, ...rest} = this.mapping;
+      this.mapping = rest;
+    } else {
+      this.mapping = {...this.mapping, [fieldName]: value};
+    }
+    this.mappingChange.emit(this.mapping);
+    this.emitRequiredFieldsStatus();
+  }
+
+  getFieldValue(fieldName: string): any {
+    return this.mapping[fieldName];
+  }
+
+  private emitRequiredFieldsStatus(): void {
+    const stats = this.countRequiredMapped(this.templateFields, this.mapping);
+    this.requiredFieldsStatus.emit(stats);
+  }
+
+  private countRequiredMapped(
+    fields: TemplateField[],
+    mapping: Record<string, any>
+  ): {mapped: number; total: number} {
+    let mapped = 0;
+    let total = 0;
+    for (const field of fields) {
+      if (field.fieldType === 'SCALAR' && field.required) {
+        total++;
+        const val = mapping[field.name];
+        if (typeof val === 'string' && val.trim().length > 0) {
+          mapped++;
+        }
+      } else if (field.fieldType === 'ARRAY' && field.required) {
+        total++;
+        const val = mapping[field.name];
+        if (typeof val === 'string' && val.trim().length > 0) {
+          mapped++;
+        } else if (typeof val === 'object' && val !== null && '_source' in val) {
+          if (typeof val['_source'] === 'string' && val['_source'].trim().length > 0) {
+            mapped++;
+          }
+        }
+      } else if (field.fieldType === 'OBJECT' && field.children) {
+        const nested = (typeof mapping[field.name] === 'object' && mapping[field.name] !== null)
+          ? mapping[field.name]
+          : {};
+        const childStats = this.countRequiredMapped(field.children, nested);
+        mapped += childStats.mapped;
+        total += childStats.total;
+      }
+    }
+    return {mapped, total};
+  }
+}