@jigisha_ruparel/taf-client-form-angular 0.1.0

package/fesm2022/jigisha_ruparel-taf-client-form-angular.mjs

@@ -0,0 +1,301 @@
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, inject, ChangeDetectorRef, Output, Input, ViewEncapsulation, Component } from '@angular/core';
+import { TAF_METADATA, TAF_DATA, TAF_PERMISSIONS } from '@jigisha_ruparel/taf-client-angular';
+import { createTafFormBinding } from '@jigisha_ruparel/taf-client-form';
+
+/**
+ * `<taf-form>` — a metadata-driven, themeable form.
+ *
+ * Builds one control per field from an entity's metadata (via `createTafFormBinding`), validates
+ * client-side from the field config, and submits through the data slice. BYO-theme: NO bundled
+ * colors/fonts — only `taf-form__*` class hooks + `ViewEncapsulation.None`. Zoneless-safe
+ * (`markForCheck()` after each async state change).
+ */
+class TafFormComponent {
+    entity;
+    recordId;
+    fields;
+    saved = new EventEmitter();
+    cancelled = new EventEmitter();
+    model = null;
+    values = {};
+    errors = {};
+    loading = false;
+    loadError = null;
+    saving = false;
+    submitError = null;
+    /** Monotonic id so a slow earlier load() can't clobber a newer one's result. */
+    loadRequestId = 0;
+    metadataClient = inject(TAF_METADATA);
+    dataClient = inject(TAF_DATA);
+    permissionsClient = inject(TAF_PERMISSIONS);
+    cdr = inject(ChangeDetectorRef);
+    binding = createTafFormBinding({
+        metadata: this.metadataClient,
+        data: this.dataClient,
+        permissions: this.permissionsClient,
+    });
+    get canSubmit() {
+        if (!this.model)
+            return false;
+        return this.model.mode === 'edit' ? this.model.access.canUpdate : this.model.access.canCreate;
+    }
+    ngOnChanges(changes) {
+        if (changes['entity'] || changes['recordId'] || changes['fields'])
+            void this.load();
+    }
+    asString(v) {
+        return v == null ? '' : String(v);
+    }
+    controlKind(field) {
+        if (field.type === 'boolean')
+            return 'checkbox';
+        if (field.options?.length)
+            return 'select';
+        return 'input';
+    }
+    inputType(field) {
+        if (field.type === 'number')
+            return 'number';
+        if (field.type === 'date')
+            return 'date';
+        if (field.type === 'datetime')
+            return 'datetime-local';
+        return 'text';
+    }
+    setValue(field, event) {
+        delete this.errors[field.field]; // clear this field's error as the user edits it
+        const raw = event.target.value;
+        if (field.type === 'number') {
+            if (raw === '') {
+                this.values[field.field] = null;
+                return;
+            }
+            const n = Number(raw);
+            // Keep invalid input as the raw string so validate()/the server reject it, not a silent null.
+            this.values[field.field] = Number.isNaN(n) ? raw : n;
+            return;
+        }
+        this.values[field.field] = raw;
+    }
+    setChecked(field, event) {
+        delete this.errors[field.field];
+        this.values[field.field] = event.target.checked;
+    }
+    /** Native date/datetime inputs need yyyy-MM-dd / yyyy-MM-ddTHH:mm, not a full ISO string. */
+    formatForInput(field, raw) {
+        if (typeof raw === 'string' && raw.length >= 10) {
+            if (field.type === 'date')
+                return raw.slice(0, 10);
+            if (field.type === 'datetime')
+                return raw.slice(0, 16);
+        }
+        return raw;
+    }
+    async onSubmit(event) {
+        event.preventDefault();
+        if (!this.model)
+            return;
+        this.errors = this.binding.validate(this.model, this.values);
+        if (Object.keys(this.errors).length) {
+            this.cdr.markForCheck();
+            return;
+        }
+        this.saving = true;
+        this.submitError = null;
+        this.cdr.markForCheck();
+        try {
+            const res = await this.binding.submit(this.model, this.values);
+            this.saved.emit(res);
+        }
+        catch (err) {
+            this.submitError = err instanceof Error ? err.message : 'Failed to save.';
+        }
+        finally {
+            this.saving = false;
+            this.cdr.markForCheck();
+        }
+    }
+    onCancel() {
+        this.cancelled.emit();
+    }
+    async load() {
+        if (!this.entity) {
+            this.model = null;
+            return;
+        }
+        const requestId = ++this.loadRequestId;
+        this.loading = true;
+        this.loadError = null;
+        this.errors = {};
+        this.submitError = null;
+        this.cdr.markForCheck();
+        try {
+            const model = await this.binding.load(this.entity, { id: this.recordId, fields: this.fields });
+            if (requestId !== this.loadRequestId)
+                return; // a newer load() has started — discard this result
+            this.model = model;
+            const values = { ...model.values };
+            for (const f of model.fields)
+                values[f.field] = this.formatForInput(f, values[f.field]);
+            this.values = values;
+        }
+        catch (err) {
+            if (requestId !== this.loadRequestId)
+                return;
+            this.loadError = err instanceof Error ? err.message : 'Failed to load the form.';
+            this.model = null;
+        }
+        finally {
+            if (requestId === this.loadRequestId) {
+                this.loading = false;
+                this.cdr.markForCheck();
+            }
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: TafFormComponent, isStandalone: true, selector: "taf-form", inputs: { entity: "entity", recordId: "recordId", fields: "fields" }, outputs: { saved: "saved", cancelled: "cancelled" }, usesOnChanges: true, ngImport: i0, template: `
+    <form class="taf-form" (submit)="onSubmit($event)">
+      <div class="taf-form__loading" *ngIf="loading">Loading…</div>
+      <div class="taf-form__error" *ngIf="loadError">{{ loadError }}</div>
+
+      <div class="taf-form__field" *ngFor="let field of model?.fields ?? []" [attr.data-type]="field.type">
+        <label class="taf-form__label" [attr.for]="'taf-form-' + field.field">
+          {{ field.label }}<span class="taf-form__required" *ngIf="field.required && field.updatable">*</span>
+        </label>
+
+        <ng-container [ngSwitch]="controlKind(field)">
+          <input
+            *ngSwitchCase="'checkbox'"
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            type="checkbox"
+            [checked]="!!values[field.field]"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (change)="setChecked(field, $event)"
+          />
+          <select
+            *ngSwitchCase="'select'"
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (change)="setValue(field, $event)"
+          >
+            <option value=""></option>
+            <option
+              *ngFor="let opt of field.options ?? []"
+              [value]="asString(opt.value)"
+              [selected]="asString(values[field.field]) === asString(opt.value)"
+            >{{ opt.label }}</option>
+          </select>
+          <input
+            *ngSwitchDefault
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            [attr.type]="inputType(field)"
+            [value]="values[field.field] ?? ''"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (input)="setValue(field, $event)"
+          />
+        </ng-container>
+
+        <div class="taf-form__error-text" *ngIf="errors[field.field]">{{ errors[field.field] }}</div>
+      </div>
+
+      <div class="taf-form__actions" *ngIf="model">
+        <button type="submit" class="taf-form__submit" [disabled]="saving || !canSubmit">Save</button>
+        <button type="button" class="taf-form__cancel" [disabled]="saving" (click)="onCancel()">Cancel</button>
+        <span class="taf-form__submit-error" *ngIf="submitError">{{ submitError }}</span>
+      </div>
+    </form>
+  `, isInline: true, styles: ["taf-form{display:block}\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: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'taf-form', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: `
+    <form class="taf-form" (submit)="onSubmit($event)">
+      <div class="taf-form__loading" *ngIf="loading">Loading…</div>
+      <div class="taf-form__error" *ngIf="loadError">{{ loadError }}</div>
+
+      <div class="taf-form__field" *ngFor="let field of model?.fields ?? []" [attr.data-type]="field.type">
+        <label class="taf-form__label" [attr.for]="'taf-form-' + field.field">
+          {{ field.label }}<span class="taf-form__required" *ngIf="field.required && field.updatable">*</span>
+        </label>
+
+        <ng-container [ngSwitch]="controlKind(field)">
+          <input
+            *ngSwitchCase="'checkbox'"
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            type="checkbox"
+            [checked]="!!values[field.field]"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (change)="setChecked(field, $event)"
+          />
+          <select
+            *ngSwitchCase="'select'"
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (change)="setValue(field, $event)"
+          >
+            <option value=""></option>
+            <option
+              *ngFor="let opt of field.options ?? []"
+              [value]="asString(opt.value)"
+              [selected]="asString(values[field.field]) === asString(opt.value)"
+            >{{ opt.label }}</option>
+          </select>
+          <input
+            *ngSwitchDefault
+            class="taf-form__control"
+            [attr.data-type]="field.type"
+            [id]="'taf-form-' + field.field"
+            [attr.type]="inputType(field)"
+            [value]="values[field.field] ?? ''"
+            [disabled]="!field.updatable"
+            [attr.aria-invalid]="!!errors[field.field]"
+            (input)="setValue(field, $event)"
+          />
+        </ng-container>
+
+        <div class="taf-form__error-text" *ngIf="errors[field.field]">{{ errors[field.field] }}</div>
+      </div>
+
+      <div class="taf-form__actions" *ngIf="model">
+        <button type="submit" class="taf-form__submit" [disabled]="saving || !canSubmit">Save</button>
+        <button type="button" class="taf-form__cancel" [disabled]="saving" (click)="onCancel()">Cancel</button>
+        <span class="taf-form__submit-error" *ngIf="submitError">{{ submitError }}</span>
+      </div>
+    </form>
+  `, styles: ["taf-form{display:block}\n"] }]
+        }], propDecorators: { entity: [{
+                type: Input
+            }], recordId: [{
+                type: Input
+            }], fields: [{
+                type: Input
+            }], saved: [{
+                type: Output
+            }], cancelled: [{
+                type: Output
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TafFormComponent };
+//# sourceMappingURL=jigisha_ruparel-taf-client-form-angular.mjs.map

package/fesm2022/jigisha_ruparel-taf-client-form-angular.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"jigisha_ruparel-taf-client-form-angular.mjs","sources":["../../src/taf-form.component.ts","../../src/jigisha_ruparel-taf-client-form-angular.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectorRef, Component, EventEmitter, Input, Output, ViewEncapsulation, inject } from '@angular/core';\nimport type { InjectionToken, OnChanges, SimpleChanges } from '@angular/core';\nimport { TAF_DATA, TAF_METADATA, TAF_PERMISSIONS } from '@jigisha_ruparel/taf-client-angular';\nimport {\n  createTafFormBinding,\n  type TafFormBinding,\n  type TafFormField,\n  type TafFormModel,\n} from '@jigisha_ruparel/taf-client-form';\n\n/**\n * The exact client shapes `createTafFormBinding` expects, derived structurally from its own\n * signature — same duplicate-declaration bridge rationale as `<taf-grid>`: the injected\n * `TAF_*` tokens are bridged through `unknown` to this package's own `InjectionToken`.\n */\ntype FormBindingDeps = Parameters<typeof createTafFormBinding>[0];\n\n/**\n * `<taf-form>` — a metadata-driven, themeable form.\n *\n * Builds one control per field from an entity's metadata (via `createTafFormBinding`), validates\n * client-side from the field config, and submits through the data slice. BYO-theme: NO bundled\n * colors/fonts — only `taf-form__*` class hooks + `ViewEncapsulation.None`. Zoneless-safe\n * (`markForCheck()` after each async state change).\n */\n@Component({\n  selector: 'taf-form',\n  standalone: true,\n  imports: [CommonModule],\n  encapsulation: ViewEncapsulation.None,\n  template: `\n    <form class=\"taf-form\" (submit)=\"onSubmit($event)\">\n      <div class=\"taf-form__loading\" *ngIf=\"loading\">Loading…</div>\n      <div class=\"taf-form__error\" *ngIf=\"loadError\">{{ loadError }}</div>\n\n      <div class=\"taf-form__field\" *ngFor=\"let field of model?.fields ?? []\" [attr.data-type]=\"field.type\">\n        <label class=\"taf-form__label\" [attr.for]=\"'taf-form-' + field.field\">\n          {{ field.label }}<span class=\"taf-form__required\" *ngIf=\"field.required && field.updatable\">*</span>\n        </label>\n\n        <ng-container [ngSwitch]=\"controlKind(field)\">\n          <input\n            *ngSwitchCase=\"'checkbox'\"\n            class=\"taf-form__control\"\n            [attr.data-type]=\"field.type\"\n            [id]=\"'taf-form-' + field.field\"\n            type=\"checkbox\"\n            [checked]=\"!!values[field.field]\"\n            [disabled]=\"!field.updatable\"\n            [attr.aria-invalid]=\"!!errors[field.field]\"\n            (change)=\"setChecked(field, $event)\"\n          />\n          <select\n            *ngSwitchCase=\"'select'\"\n            class=\"taf-form__control\"\n            [attr.data-type]=\"field.type\"\n            [id]=\"'taf-form-' + field.field\"\n            [disabled]=\"!field.updatable\"\n            [attr.aria-invalid]=\"!!errors[field.field]\"\n            (change)=\"setValue(field, $event)\"\n          >\n            <option value=\"\"></option>\n            <option\n              *ngFor=\"let opt of field.options ?? []\"\n              [value]=\"asString(opt.value)\"\n              [selected]=\"asString(values[field.field]) === asString(opt.value)\"\n            >{{ opt.label }}</option>\n          </select>\n          <input\n            *ngSwitchDefault\n            class=\"taf-form__control\"\n            [attr.data-type]=\"field.type\"\n            [id]=\"'taf-form-' + field.field\"\n            [attr.type]=\"inputType(field)\"\n            [value]=\"values[field.field] ?? ''\"\n            [disabled]=\"!field.updatable\"\n            [attr.aria-invalid]=\"!!errors[field.field]\"\n            (input)=\"setValue(field, $event)\"\n          />\n        </ng-container>\n\n        <div class=\"taf-form__error-text\" *ngIf=\"errors[field.field]\">{{ errors[field.field] }}</div>\n      </div>\n\n      <div class=\"taf-form__actions\" *ngIf=\"model\">\n        <button type=\"submit\" class=\"taf-form__submit\" [disabled]=\"saving || !canSubmit\">Save</button>\n        <button type=\"button\" class=\"taf-form__cancel\" [disabled]=\"saving\" (click)=\"onCancel()\">Cancel</button>\n        <span class=\"taf-form__submit-error\" *ngIf=\"submitError\">{{ submitError }}</span>\n      </div>\n    </form>\n  `,\n  styles: [\n    `\n      taf-form { display: block; }\n    `,\n  ],\n})\nexport class TafFormComponent implements OnChanges {\n  @Input() entity?: string;\n  @Input() recordId?: string;\n  @Input() fields?: string[];\n\n  @Output() saved = new EventEmitter<{ id: string }>();\n  @Output() cancelled = new EventEmitter<void>();\n\n  model: TafFormModel | null = null;\n  values: Record<string, unknown> = {};\n  errors: Record<string, string> = {};\n  loading = false;\n  loadError: string | null = null;\n  saving = false;\n  submitError: string | null = null;\n\n  /** Monotonic id so a slow earlier load() can't clobber a newer one's result. */\n  private loadRequestId = 0;\n\n  private readonly metadataClient = inject(TAF_METADATA as unknown as InjectionToken<FormBindingDeps['metadata']>);\n  private readonly dataClient = inject(TAF_DATA as unknown as InjectionToken<FormBindingDeps['data']>);\n  private readonly permissionsClient = inject(TAF_PERMISSIONS as unknown as InjectionToken<FormBindingDeps['permissions']>);\n  private readonly cdr = inject(ChangeDetectorRef);\n  private readonly binding: TafFormBinding = createTafFormBinding({\n    metadata: this.metadataClient,\n    data: this.dataClient,\n    permissions: this.permissionsClient,\n  });\n\n  get canSubmit(): boolean {\n    if (!this.model) return false;\n    return this.model.mode === 'edit' ? this.model.access.canUpdate : this.model.access.canCreate;\n  }\n\n  ngOnChanges(changes: SimpleChanges): void {\n    if (changes['entity'] || changes['recordId'] || changes['fields']) void this.load();\n  }\n\n  asString(v: unknown): string {\n    return v == null ? '' : String(v);\n  }\n\n  controlKind(field: TafFormField): 'checkbox' | 'select' | 'input' {\n    if (field.type === 'boolean') return 'checkbox';\n    if (field.options?.length) return 'select';\n    return 'input';\n  }\n\n  inputType(field: TafFormField): string {\n    if (field.type === 'number') return 'number';\n    if (field.type === 'date') return 'date';\n    if (field.type === 'datetime') return 'datetime-local';\n    return 'text';\n  }\n\n  setValue(field: TafFormField, event: Event): void {\n    delete this.errors[field.field]; // clear this field's error as the user edits it\n    const raw = (event.target as HTMLInputElement | HTMLSelectElement).value;\n    if (field.type === 'number') {\n      if (raw === '') { this.values[field.field] = null; return; }\n      const n = Number(raw);\n      // Keep invalid input as the raw string so validate()/the server reject it, not a silent null.\n      this.values[field.field] = Number.isNaN(n) ? raw : n;\n      return;\n    }\n    this.values[field.field] = raw;\n  }\n\n  setChecked(field: TafFormField, event: Event): void {\n    delete this.errors[field.field];\n    this.values[field.field] = (event.target as HTMLInputElement).checked;\n  }\n\n  /** Native date/datetime inputs need yyyy-MM-dd / yyyy-MM-ddTHH:mm, not a full ISO string. */\n  private formatForInput(field: TafFormField, raw: unknown): unknown {\n    if (typeof raw === 'string' && raw.length >= 10) {\n      if (field.type === 'date') return raw.slice(0, 10);\n      if (field.type === 'datetime') return raw.slice(0, 16);\n    }\n    return raw;\n  }\n\n  async onSubmit(event: Event): Promise<void> {\n    event.preventDefault();\n    if (!this.model) return;\n    this.errors = this.binding.validate(this.model, this.values);\n    if (Object.keys(this.errors).length) { this.cdr.markForCheck(); return; }\n    this.saving = true;\n    this.submitError = null;\n    this.cdr.markForCheck();\n    try {\n      const res = await this.binding.submit(this.model, this.values);\n      this.saved.emit(res);\n    } catch (err) {\n      this.submitError = err instanceof Error ? err.message : 'Failed to save.';\n    } finally {\n      this.saving = false;\n      this.cdr.markForCheck();\n    }\n  }\n\n  onCancel(): void {\n    this.cancelled.emit();\n  }\n\n  private async load(): Promise<void> {\n    if (!this.entity) { this.model = null; return; }\n    const requestId = ++this.loadRequestId;\n    this.loading = true;\n    this.loadError = null;\n    this.errors = {};\n    this.submitError = null;\n    this.cdr.markForCheck();\n    try {\n      const model = await this.binding.load(this.entity, { id: this.recordId, fields: this.fields });\n      if (requestId !== this.loadRequestId) return; // a newer load() has started — discard this result\n      this.model = model;\n      const values: Record<string, unknown> = { ...model.values };\n      for (const f of model.fields) values[f.field] = this.formatForInput(f, values[f.field]);\n      this.values = values;\n    } catch (err) {\n      if (requestId !== this.loadRequestId) return;\n      this.loadError = err instanceof Error ? err.message : 'Failed to load the form.';\n      this.model = null;\n    } finally {\n      if (requestId === this.loadRequestId) {\n        this.loading = false;\n        this.cdr.markForCheck();\n      }\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@jigisha_ruparel/taf-client-form-angular",
+  "version": "0.1.0",
+  "license": "UNLICENSED",
+  "description": "TAF client SDK — Angular <taf-form>: a metadata-driven, themeable form component.",
+  "type": "module",
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public",
+    "directory": "dist"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0",
+    "@jigisha_ruparel/taf-client-form": "0.1.0",
+    "@jigisha_ruparel/taf-client-angular": "0.4.0"
+  },
+  "peerDependencies": {
+    "@angular/core": ">=17",
+    "@angular/common": ">=17"
+  },
+  "module": "fesm2022/jigisha_ruparel-taf-client-form-angular.mjs",
+  "typings": "types/jigisha_ruparel-taf-client-form-angular.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/jigisha_ruparel-taf-client-form-angular.d.ts",
+      "default": "./fesm2022/jigisha_ruparel-taf-client-form-angular.mjs"
+    }
+  }
+}

package/types/jigisha_ruparel-taf-client-form-angular.d.ts

@@ -0,0 +1,51 @@
+import * as i0 from '@angular/core';
+import { OnChanges, EventEmitter, SimpleChanges } from '@angular/core';
+import { TafFormModel, TafFormField } from '@jigisha_ruparel/taf-client-form';
+
+/**
+ * `<taf-form>` — a metadata-driven, themeable form.
+ *
+ * Builds one control per field from an entity's metadata (via `createTafFormBinding`), validates
+ * client-side from the field config, and submits through the data slice. BYO-theme: NO bundled
+ * colors/fonts — only `taf-form__*` class hooks + `ViewEncapsulation.None`. Zoneless-safe
+ * (`markForCheck()` after each async state change).
+ */
+declare class TafFormComponent implements OnChanges {
+    entity?: string;
+    recordId?: string;
+    fields?: string[];
+    saved: EventEmitter<{
+        id: string;
+    }>;
+    cancelled: EventEmitter<void>;
+    model: TafFormModel | null;
+    values: Record<string, unknown>;
+    errors: Record<string, string>;
+    loading: boolean;
+    loadError: string | null;
+    saving: boolean;
+    submitError: string | null;
+    /** Monotonic id so a slow earlier load() can't clobber a newer one's result. */
+    private loadRequestId;
+    private readonly metadataClient;
+    private readonly dataClient;
+    private readonly permissionsClient;
+    private readonly cdr;
+    private readonly binding;
+    get canSubmit(): boolean;
+    ngOnChanges(changes: SimpleChanges): void;
+    asString(v: unknown): string;
+    controlKind(field: TafFormField): 'checkbox' | 'select' | 'input';
+    inputType(field: TafFormField): string;
+    setValue(field: TafFormField, event: Event): void;
+    setChecked(field: TafFormField, event: Event): void;
+    /** Native date/datetime inputs need yyyy-MM-dd / yyyy-MM-ddTHH:mm, not a full ISO string. */
+    private formatForInput;
+    onSubmit(event: Event): Promise<void>;
+    onCancel(): void;
+    private load;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TafFormComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TafFormComponent, "taf-form", never, { "entity": { "alias": "entity"; "required": false; }; "recordId": { "alias": "recordId"; "required": false; }; "fields": { "alias": "fields"; "required": false; }; }, { "saved": "saved"; "cancelled": "cancelled"; }, never, never, true, never>;
+}
+
+export { TafFormComponent };