@dynamic-field-kit/angular 1.5.1 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,339 @@
1
+ import * as i0 from '@angular/core';
2
+ import { OnChanges, ChangeDetectorRef, EventEmitter, SimpleChanges, AfterViewInit, OnDestroy, ViewContainerRef, OnInit, TemplateRef, Type, InjectionToken } from '@angular/core';
3
+ import { FieldTypeKey, Properties, FieldDescription, ResolvedFieldRendererProps, BaseLayout, ResponsiveLayout, ValidationResult, LayoutConfig, FieldRegistry } from '@dynamic-field-kit/core';
4
+ export { ColumnLayoutConfig, FieldDescription, FieldRegistry, FieldRendererProps, FieldTypeKey, GridLayoutConfig, LayoutConfig, RowLayoutConfig, ValidationContext, ValidationResult, collectFieldPaths, fieldRegistry, indexGroupPathMap, resolveDisabled, resolveOptions, resolveReadOnly, validateField, validateFieldAsync, validateFields, validateFieldsAsync, validators } from '@dynamic-field-kit/core';
5
+ import * as i1 from '@angular/common';
6
+
7
+ interface FieldInputProps {
8
+ value?: unknown;
9
+ label?: string;
10
+ placeholder?: string;
11
+ required?: boolean;
12
+ disabled?: boolean;
13
+ readOnly?: boolean;
14
+ touched?: boolean;
15
+ dirty?: boolean;
16
+ error?: string | string[];
17
+ options?: unknown[];
18
+ className?: string;
19
+ description?: string;
20
+ id?: string;
21
+ ariaInvalid?: boolean;
22
+ ariaDescribedBy?: string;
23
+ ariaRequired?: boolean;
24
+ min?: number | string;
25
+ max?: number | string;
26
+ step?: number | string;
27
+ accept?: string;
28
+ multiple?: boolean;
29
+ }
30
+ declare abstract class BaseInputComponent implements OnChanges {
31
+ protected cdr: ChangeDetectorRef;
32
+ value?: unknown;
33
+ label?: string;
34
+ placeholder?: string;
35
+ required?: boolean;
36
+ disabled?: boolean;
37
+ readOnly?: boolean;
38
+ /**
39
+ * Whether the field has been blurred (or marked touched by the form store).
40
+ * Renderers gate error display on this to avoid shouting at a user who has
41
+ * not reached the field yet.
42
+ */
43
+ touched?: boolean;
44
+ /** Whether the value differs from the one the form opened with. */
45
+ dirty?: boolean;
46
+ error?: string | string[];
47
+ options?: unknown[];
48
+ className?: string;
49
+ description?: string;
50
+ id?: string;
51
+ ariaInvalid?: boolean;
52
+ ariaDescribedBy?: string;
53
+ ariaRequired?: boolean;
54
+ min?: number | string;
55
+ max?: number | string;
56
+ step?: number | string;
57
+ accept?: string;
58
+ multiple?: boolean;
59
+ valueChange: EventEmitter<unknown>;
60
+ constructor(cdr: ChangeDetectorRef);
61
+ ngOnChanges(_changes: SimpleChanges): void;
62
+ protected detectChanges(): void;
63
+ protected hasChanges(changes: SimpleChanges, prop: string): boolean;
64
+ static ɵfac: i0.ɵɵFactoryDeclaration<BaseInputComponent, never>;
65
+ static ɵcmp: i0.ɵɵComponentDeclaration<BaseInputComponent, "ng-component", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "touched": { "alias": "touched"; "required": false; }; "dirty": { "alias": "dirty"; "required": false; }; "error": { "alias": "error"; "required": false; }; "options": { "alias": "options"; "required": false; }; "className": { "alias": "className"; "required": false; }; "description": { "alias": "description"; "required": false; }; "id": { "alias": "id"; "required": false; }; "ariaInvalid": { "alias": "ariaInvalid"; "required": false; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
66
+ }
67
+
68
+ declare class DynamicInput extends BaseInputComponent implements OnChanges, AfterViewInit, OnDestroy {
69
+ type: FieldTypeKey;
70
+ extraProps?: Properties;
71
+ valueChange: EventEmitter<unknown>;
72
+ onChange: EventEmitter<unknown>;
73
+ private registry;
74
+ host: ViewContainerRef;
75
+ private compRef?;
76
+ private inputInstance?;
77
+ private subscriptions;
78
+ private supplied;
79
+ ngOnChanges(changes: SimpleChanges): void;
80
+ ngAfterViewInit(): void;
81
+ ngOnDestroy(): void;
82
+ private syncPropsToInstance;
83
+ private cleanup;
84
+ private cleanupSubscriptions;
85
+ private cleanupRenderedComponent;
86
+ private render;
87
+ private isComponentType;
88
+ private renderComponent;
89
+ private renderFallback;
90
+ private getFallbackProps;
91
+ private applyProps;
92
+ private applyExtraProps;
93
+ private bindOutputs;
94
+ private emitValue;
95
+ private renderDefaultFallbackHTML5;
96
+ private renderError;
97
+ static ɵfac: i0.ɵɵFactoryDeclaration<DynamicInput, never>;
98
+ static ɵcmp: i0.ɵɵComponentDeclaration<DynamicInput, "dfk-dynamic-input", never, { "type": { "alias": "type"; "required": false; }; "extraProps": { "alias": "extraProps"; "required": false; }; }, { "valueChange": "valueChange"; "onChange": "onChange"; }, never, never, true, never>;
99
+ }
100
+
101
+ declare class FieldInput implements OnChanges {
102
+ private cdr;
103
+ fieldDescription?: FieldDescription;
104
+ /**
105
+ * Data at this field's own level. Preferred over `value`: the shared
106
+ * `buildFieldRendererProps` needs the surrounding data to resolve
107
+ * `appearCondition`, dynamic options and cross-field validation. When only
108
+ * `value` is bound (mounting this component directly), a one-key object is
109
+ * synthesised from it.
110
+ */
111
+ data?: Properties;
112
+ /** Top-level form data, for fields nested inside a repeatable group. */
113
+ rootData?: Properties;
114
+ value?: unknown;
115
+ options?: Record<string, unknown>[];
116
+ disabled?: boolean;
117
+ readOnly?: boolean;
118
+ error?: string | string[];
119
+ /** Distinguishes a controlled empty error from an omitted error input. */
120
+ validationControlled: boolean;
121
+ /** Whether the field has been blurred, or marked touched by a form store. */
122
+ touched?: boolean;
123
+ /** Whether the value differs from the one the form opened with. */
124
+ dirty?: boolean;
125
+ /** Per-form-instance id namespace; see core's `makeFieldId`. */
126
+ idPrefix: string;
127
+ onValueChangeField: EventEmitter<{
128
+ value: unknown;
129
+ key: string;
130
+ }>;
131
+ /**
132
+ * Emits this field's name when focus leaves it. Driven by `focusout`, which
133
+ * bubbles, so it works for any renderer without the renderer having to
134
+ * declare a blur output of its own.
135
+ */
136
+ onBlurField: EventEmitter<string>;
137
+ /**
138
+ * The full renderer prop bag, built once per change-detection pass rather
139
+ * than from one getter per binding - `buildFieldRendererProps` validates the
140
+ * field, and running that ~20 times per pass would be wasteful.
141
+ */
142
+ rendererProps: ResolvedFieldRendererProps | null;
143
+ constructor(cdr: ChangeDetectorRef);
144
+ ngOnChanges(_changes: SimpleChanges): void;
145
+ private buildProps;
146
+ static ɵfac: i0.ɵɵFactoryDeclaration<FieldInput, never>;
147
+ static ɵcmp: i0.ɵɵComponentDeclaration<FieldInput, "dfk-field-input", never, { "fieldDescription": { "alias": "fieldDescription"; "required": false; }; "data": { "alias": "data"; "required": false; }; "rootData": { "alias": "rootData"; "required": false; }; "value": { "alias": "value"; "required": false; }; "options": { "alias": "options"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "error": { "alias": "error"; "required": false; }; "validationControlled": { "alias": "validationControlled"; "required": false; }; "touched": { "alias": "touched"; "required": false; }; "dirty": { "alias": "dirty"; "required": false; }; "idPrefix": { "alias": "idPrefix"; "required": false; }; }, { "onValueChangeField": "onValueChangeField"; "onBlurField": "onBlurField"; }, never, never, true, never>;
148
+ }
149
+
150
+ type BaseLayoutConfig = BaseLayout;
151
+ type ResponsiveLayoutConfig = ResponsiveLayout;
152
+
153
+ declare class MultiFieldInput implements OnInit, OnChanges {
154
+ private cdr;
155
+ fieldDescriptions: FieldDescription[];
156
+ properties?: Properties;
157
+ onChange: EventEmitter<Properties>;
158
+ validityChange: EventEmitter<ValidationResult>;
159
+ /**
160
+ * Emits a field's name when it loses focus. Touched state is tracked
161
+ * internally either way; this is the hook for driving an external form store
162
+ * - pass `createDynamicFormStore`'s `handleBlur` to get its `touched` map and
163
+ * `validateOnBlur` behaviour.
164
+ */
165
+ onBlurField: EventEmitter<string>;
166
+ /**
167
+ * Controlled touched map. When bound it is the single source of truth and
168
+ * the internal tracker is bypassed, so `createDynamicFormStore`'s `touched`
169
+ * signal (updated by setFieldTouched/touchAll/handleSubmit, cleared by
170
+ * reset) is what renderers actually see. Leave it unbound to keep the
171
+ * internal, blur-only tracker.
172
+ */
173
+ touched?: Record<string, boolean>;
174
+ /** Controlled error map; bind the form store's `errors()` signal here. */
175
+ errors?: Record<string, string[]>;
176
+ /** Emits the next touched map whenever a field is blurred. */
177
+ touchedChange: EventEmitter<Record<string, boolean>>;
178
+ /**
179
+ * Namespace for generated field ids: a field renders with
180
+ * `${idPrefix}-${name}`. Defaults to a value unique to this component
181
+ * instance, so two forms containing the same field name do not emit
182
+ * duplicate DOM ids. Bind a fixed string to pin ids (`idPrefix="dfk-field"`
183
+ * restores the pre-1.6 ids), or set `FieldDescription.id` per field.
184
+ */
185
+ idPrefix?: string;
186
+ private touchedFields;
187
+ private readonly instanceId;
188
+ private initialProperties;
189
+ private indexedErrorsSource?;
190
+ private indexedErrors;
191
+ private indexedTouchedSource?;
192
+ private indexedTouched;
193
+ get effectiveIdPrefix(): string;
194
+ /** The touched map in effect: the controlled input, else the internal one. */
195
+ private get effectiveTouched();
196
+ handleBlurField(fieldName: string): void;
197
+ /** Whether this field has been blurred at least once. */
198
+ isTouched(fieldName: string): boolean;
199
+ /** Whether this field's value differs from the one the form opened with. */
200
+ isFieldDirty(fieldName: string): boolean;
201
+ fieldErrors(fieldName: string): string[] | undefined;
202
+ errorsForItem(fieldName: string, index: number): Record<string, string[]> | undefined;
203
+ touchedForItem(fieldName: string, index: number): Record<string, boolean>;
204
+ handleGroupBlur(fieldName: string, index: number, key: string): void;
205
+ /**
206
+ * Clears the internally tracked touched state. Only meaningful in
207
+ * uncontrolled mode - when `touched` is bound, resetting the form store
208
+ * (e.g. `createDynamicFormStore().reset()`) already clears it.
209
+ */
210
+ resetTouched(): void;
211
+ setFieldTouched(fieldName: string, isTouched?: boolean): void;
212
+ layout: LayoutConfig;
213
+ rootData?: Properties;
214
+ data: Properties;
215
+ visibleFields: FieldDescription[];
216
+ private initialised;
217
+ private isMobile;
218
+ constructor(cdr: ChangeDetectorRef);
219
+ onWindowResize(): void;
220
+ get resolvedLayout(): BaseLayoutConfig;
221
+ get resolvedLayoutType(): string;
222
+ get gap(): number;
223
+ get columns(): number;
224
+ trackByFn(index: number, field: FieldDescription): string | number;
225
+ trackByIndex(index: number): number;
226
+ private groupTrackByCache;
227
+ groupTrackBy(field: FieldDescription): (index: number, item: Properties) => unknown;
228
+ ngOnInit(): void;
229
+ ngOnChanges(_changes: SimpleChanges): void;
230
+ private updateIsMobile;
231
+ private init;
232
+ private updateVisibleFields;
233
+ onFieldChange(event: {
234
+ value: unknown;
235
+ key: string;
236
+ }): void;
237
+ getItems(field: FieldDescription): Properties[];
238
+ canAddItem(field: FieldDescription): boolean;
239
+ canRemoveItem(field: FieldDescription): boolean;
240
+ onGroupItemAdd(field: FieldDescription): void;
241
+ onGroupItemRemove(field: FieldDescription, index: number): void;
242
+ onGroupItemChange(field: FieldDescription, index: number, next: Properties): void;
243
+ private commitData;
244
+ static ɵfac: i0.ɵɵFactoryDeclaration<MultiFieldInput, never>;
245
+ static ɵcmp: i0.ɵɵComponentDeclaration<MultiFieldInput, "dfk-multi-field-input", never, { "fieldDescriptions": { "alias": "fieldDescriptions"; "required": false; }; "properties": { "alias": "properties"; "required": false; }; "touched": { "alias": "touched"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "idPrefix": { "alias": "idPrefix"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "rootData": { "alias": "rootData"; "required": false; }; }, { "onChange": "onChange"; "validityChange": "validityChange"; "onBlurField": "onBlurField"; "touchedChange": "touchedChange"; }, never, never, true, never>;
246
+ }
247
+
248
+ declare class DynamicFormDevToolsComponent {
249
+ data: Properties;
250
+ errors: Record<string, string[]>;
251
+ touched: Record<string, boolean>;
252
+ isDirty: boolean;
253
+ fields: FieldDescription[];
254
+ /** Number of fields carrying errors, mirroring the react and vue overlays. */
255
+ errorCount(): number;
256
+ isOpen: i0.WritableSignal<boolean>;
257
+ activeTab: i0.WritableSignal<"data" | "meta" | "errors" | "fields">;
258
+ tabs: Array<'data' | 'errors' | 'meta' | 'fields'>;
259
+ static ɵfac: i0.ɵɵFactoryDeclaration<DynamicFormDevToolsComponent, never>;
260
+ static ɵcmp: i0.ɵɵComponentDeclaration<DynamicFormDevToolsComponent, "dfk-dev-tools", never, { "data": { "alias": "data"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "touched": { "alias": "touched"; "required": false; }; "isDirty": { "alias": "isDirty"; "required": false; }; "fields": { "alias": "fields"; "required": false; }; }, {}, never, never, true, never>;
261
+ }
262
+
263
+ interface DynamicFormOptions {
264
+ fields: FieldDescription[];
265
+ initialValues?: Properties;
266
+ validateOnBlur?: boolean;
267
+ validateOnChange?: boolean;
268
+ }
269
+ declare function createDynamicFormStore(options: DynamicFormOptions): {
270
+ data: i0.WritableSignal<Properties>;
271
+ errors: i0.WritableSignal<Record<string, string[]>>;
272
+ isValid: i0.Signal<boolean>;
273
+ isValidating: i0.WritableSignal<boolean>;
274
+ isValidationComplete: i0.Signal<boolean>;
275
+ validationStatus: i0.Signal<"invalid" | "valid" | "pending">;
276
+ isDirty: i0.WritableSignal<boolean>;
277
+ touched: i0.WritableSignal<Record<string, boolean>>;
278
+ isSubmitting: i0.WritableSignal<boolean>;
279
+ isSubmitted: i0.WritableSignal<boolean>;
280
+ setFieldValue: (name: string, value: unknown) => void;
281
+ setFieldTouched: (name: string, isTouched?: boolean) => void;
282
+ touchAll: () => void;
283
+ resetTouched: () => void;
284
+ handleChange: (newData: Properties) => void;
285
+ handleBlur: (fieldName: string) => void;
286
+ reset: (newValues?: Properties) => void;
287
+ validate: () => boolean;
288
+ validateAsync: () => Promise<boolean>;
289
+ handleSubmit: (onValid: (data: Properties) => void | Promise<void>, onInvalid?: (errors: Record<string, string[]>) => void) => (e?: Event) => Promise<void>;
290
+ };
291
+
292
+ declare class ColumnLayout {
293
+ config?: {
294
+ gap?: number;
295
+ };
296
+ template: TemplateRef<unknown>;
297
+ get gap(): number;
298
+ static ɵfac: i0.ɵɵFactoryDeclaration<ColumnLayout, never>;
299
+ static ɵcmp: i0.ɵɵComponentDeclaration<ColumnLayout, "dfk-column-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
300
+ }
301
+ declare class RowLayout {
302
+ config?: {
303
+ gap?: number;
304
+ };
305
+ template: TemplateRef<unknown>;
306
+ get gap(): number;
307
+ static ɵfac: i0.ɵɵFactoryDeclaration<RowLayout, never>;
308
+ static ɵcmp: i0.ɵɵComponentDeclaration<RowLayout, "dfk-row-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
309
+ }
310
+ declare class GridLayout {
311
+ config?: {
312
+ columns?: number;
313
+ gap?: number;
314
+ };
315
+ template: TemplateRef<unknown>;
316
+ get columns(): number;
317
+ get gap(): number;
318
+ static ɵfac: i0.ɵɵFactoryDeclaration<GridLayout, never>;
319
+ static ɵcmp: i0.ɵɵComponentDeclaration<GridLayout, "dfk-grid-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
320
+ }
321
+
322
+ type AngularLayoutComponent = Type<unknown>;
323
+ declare class LayoutRegistry {
324
+ private layouts;
325
+ register(type: string, component: AngularLayoutComponent): void;
326
+ get(type: string): AngularLayoutComponent | undefined;
327
+ }
328
+ declare const layoutRegistry: LayoutRegistry;
329
+
330
+ declare class DynamicFieldKitModule {
331
+ static ɵfac: i0.ɵɵFactoryDeclaration<DynamicFieldKitModule, never>;
332
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DynamicFieldKitModule, never, [typeof i1.CommonModule, typeof DynamicInput, typeof FieldInput, typeof MultiFieldInput, typeof ColumnLayout, typeof RowLayout, typeof GridLayout], [typeof DynamicInput, typeof FieldInput, typeof MultiFieldInput, typeof ColumnLayout, typeof RowLayout, typeof GridLayout]>;
333
+ static ɵinj: i0.ɵɵInjectorDeclaration<DynamicFieldKitModule>;
334
+ }
335
+
336
+ declare const FIELD_REGISTRY: InjectionToken<FieldRegistry>;
337
+
338
+ export { BaseInputComponent, ColumnLayout, DynamicFieldKitModule, DynamicFormDevToolsComponent, DynamicInput, FIELD_REGISTRY, FieldInput, GridLayout, LayoutRegistry, MultiFieldInput, RowLayout, createDynamicFormStore, layoutRegistry };
339
+ export type { BaseLayoutConfig, DynamicFormOptions, FieldInputProps, ResponsiveLayoutConfig };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dynamic-field-kit/angular",
3
- "version": "1.5.1",
3
+ "version": "1.6.0",
4
4
  "description": "Angular renderer for dynamic-field-kit",
5
5
  "license": "MIT",
6
6
  "private": false,
@@ -10,7 +10,16 @@
10
10
  ],
11
11
  "main": "dist/fesm2022/dynamic-field-kit-angular.mjs",
12
12
  "module": "dist/fesm2022/dynamic-field-kit-angular.mjs",
13
- "types": "dist/index.d.ts",
13
+ "types": "dist/types/dynamic-field-kit-angular.d.ts",
14
+ "exports": {
15
+ ".": {
16
+ "types": "./dist/types/dynamic-field-kit-angular.d.ts",
17
+ "default": "./dist/fesm2022/dynamic-field-kit-angular.mjs"
18
+ },
19
+ "./package.json": {
20
+ "default": "./package.json"
21
+ }
22
+ },
14
23
  "files": [
15
24
  "dist",
16
25
  "!dist/README.md",
@@ -18,8 +27,8 @@
18
27
  "CHANGELOG.md"
19
28
  ],
20
29
  "peerDependencies": {
21
- "@angular/common": ">=14 <22",
22
- "@angular/core": ">=14 <22",
30
+ "@angular/common": ">=16 <22",
31
+ "@angular/core": ">=16 <22",
23
32
  "@dynamic-field-kit/core": "^1.3.0"
24
33
  },
25
34
  "publishConfig": {
@@ -37,24 +46,23 @@
37
46
  "devDependencies": {
38
47
  "@analogjs/vite-plugin-angular": "^2.7.1",
39
48
  "@analogjs/vitest-angular": "^2.7.1",
40
- "@angular-devkit/build-angular": "^19.2.27",
41
- "@angular/cdk": "^19.0.0",
42
- "@angular/common": "^19.0.0",
43
- "@angular/compiler": "^19.0.0",
44
- "@angular/compiler-cli": "^19.0.0",
45
- "@angular/core": "^19.0.0",
46
- "@angular/forms": "^19.0.0",
47
- "@angular/platform-browser": "^19.0.0",
48
- "@angular/platform-browser-dynamic": "^19.0.0",
49
- "@dynamic-field-kit/core": "^1.5.1",
49
+ "@angular-devkit/build-angular": "^21.2.0",
50
+ "@angular/cdk": "^21.2.14",
51
+ "@angular/common": "^21.2.0",
52
+ "@angular/compiler": "^21.2.0",
53
+ "@angular/compiler-cli": "^21.2.0",
54
+ "@angular/core": "^21.2.0",
55
+ "@angular/forms": "^21.2.0",
56
+ "@angular/platform-browser": "^21.2.0",
57
+ "@dynamic-field-kit/core": "^1.6.0",
50
58
  "@vitest/coverage-istanbul": "^4.1.11",
51
59
  "jsdom": "^29.1.1",
52
- "ng-packagr": "^19.2.2",
60
+ "ng-packagr": "^21.2.0",
53
61
  "rimraf": "^6.1.3",
54
62
  "rxjs": "^7.8.0",
55
- "typescript": "~5.8.3",
63
+ "typescript": "~5.9.3",
56
64
  "vitest": "^4.1.11",
57
- "zone.js": "^0.15.0"
65
+ "zone.js": "~0.16.0"
58
66
  },
59
67
  "repository": {
60
68
  "type": "git",
@@ -84,14 +92,5 @@
84
92
  "homepage": "https://vannt-dev.github.io/dynamic-field-kit/",
85
93
  "bugs": {
86
94
  "url": "https://github.com/vannt-dev/dynamic-field-kit/issues"
87
- },
88
- "exports": {
89
- ".": {
90
- "types": "./dist/index.d.ts",
91
- "default": "./dist/fesm2022/dynamic-field-kit-angular.mjs"
92
- },
93
- "./package.json": {
94
- "default": "./package.json"
95
- }
96
95
  }
97
96
  }
@@ -1,34 +0,0 @@
1
- import { ChangeDetectorRef, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
2
- import * as i0 from "@angular/core";
3
- export interface FieldInputProps {
4
- value?: unknown;
5
- label?: string;
6
- placeholder?: string;
7
- required?: boolean;
8
- disabled?: boolean;
9
- readOnly?: boolean;
10
- error?: string | string[];
11
- options?: unknown[];
12
- className?: string;
13
- description?: string;
14
- }
15
- export declare abstract class BaseInputComponent implements OnChanges {
16
- protected cdr: ChangeDetectorRef;
17
- value?: unknown;
18
- label?: string;
19
- placeholder?: string;
20
- required?: boolean;
21
- disabled?: boolean;
22
- readOnly?: boolean;
23
- error?: string | string[];
24
- options?: unknown[];
25
- className?: string;
26
- description?: string;
27
- valueChange: EventEmitter<unknown>;
28
- constructor(cdr: ChangeDetectorRef);
29
- ngOnChanges(_changes: SimpleChanges): void;
30
- protected detectChanges(): void;
31
- protected hasChanges(changes: SimpleChanges, prop: string): boolean;
32
- static ɵfac: i0.ɵɵFactoryDeclaration<BaseInputComponent, never>;
33
- static ɵcmp: i0.ɵɵComponentDeclaration<BaseInputComponent, "ng-component", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "error": { "alias": "error"; "required": false; }; "options": { "alias": "options"; "required": false; }; "className": { "alias": "className"; "required": false; }; "description": { "alias": "description"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
34
- }
@@ -1,16 +0,0 @@
1
- import { FieldDescription, Properties } from '@dynamic-field-kit/core';
2
- import * as i0 from "@angular/core";
3
- export declare class DynamicFormDevToolsComponent {
4
- data: Properties;
5
- errors: Record<string, string[]>;
6
- touched: Record<string, boolean>;
7
- isDirty: boolean;
8
- fields: FieldDescription[];
9
- /** Number of fields carrying errors, mirroring the react and vue overlays. */
10
- errorCount(): number;
11
- isOpen: import("@angular/core").WritableSignal<boolean>;
12
- activeTab: import("@angular/core").WritableSignal<"data" | "meta" | "errors" | "fields">;
13
- tabs: Array<'data' | 'errors' | 'meta' | 'fields'>;
14
- static ɵfac: i0.ɵɵFactoryDeclaration<DynamicFormDevToolsComponent, never>;
15
- static ɵcmp: i0.ɵɵComponentDeclaration<DynamicFormDevToolsComponent, "dfk-dev-tools", never, { "data": { "alias": "data"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "touched": { "alias": "touched"; "required": false; }; "isDirty": { "alias": "isDirty"; "required": false; }; "fields": { "alias": "fields"; "required": false; }; }, {}, never, never, true, never>;
16
- }
@@ -1,36 +0,0 @@
1
- import { AfterViewInit, EventEmitter, OnChanges, OnDestroy, SimpleChanges, ViewContainerRef } from '@angular/core';
2
- import { FieldTypeKey, Properties } from '@dynamic-field-kit/core';
3
- import { BaseInputComponent } from './BaseInput.js';
4
- import * as i0 from "@angular/core";
5
- export declare class DynamicInput extends BaseInputComponent implements OnChanges, AfterViewInit, OnDestroy {
6
- type: FieldTypeKey;
7
- extraProps?: Properties;
8
- valueChange: EventEmitter<unknown>;
9
- onChange: EventEmitter<unknown>;
10
- private registry;
11
- host: ViewContainerRef;
12
- private compRef?;
13
- private inputInstance?;
14
- private subscriptions;
15
- private supplied;
16
- ngOnChanges(changes: SimpleChanges): void;
17
- ngAfterViewInit(): void;
18
- ngOnDestroy(): void;
19
- private syncPropsToInstance;
20
- private cleanup;
21
- private cleanupSubscriptions;
22
- private cleanupRenderedComponent;
23
- private render;
24
- private isComponentType;
25
- private renderComponent;
26
- private renderFallback;
27
- private getFallbackProps;
28
- private applyProps;
29
- private applyExtraProps;
30
- private bindOutputs;
31
- private emitValue;
32
- private renderDefaultFallbackHTML5;
33
- private renderError;
34
- static ɵfac: i0.ɵɵFactoryDeclaration<DynamicInput, never>;
35
- static ɵcmp: i0.ɵɵComponentDeclaration<DynamicInput, "dfk-dynamic-input", never, { "type": { "alias": "type"; "required": false; }; "extraProps": { "alias": "extraProps"; "required": false; }; }, { "valueChange": "valueChange"; "onChange": "onChange"; }, never, never, true, never>;
36
- }
@@ -1,28 +0,0 @@
1
- import { ChangeDetectorRef, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
2
- import { FieldDescription } from '@dynamic-field-kit/core';
3
- import * as i0 from "@angular/core";
4
- export declare class FieldInput implements OnChanges {
5
- private cdr;
6
- fieldDescription?: FieldDescription;
7
- value?: unknown;
8
- options?: Record<string, unknown>[];
9
- disabled?: boolean;
10
- readOnly?: boolean;
11
- error?: string | string[];
12
- onValueChangeField: EventEmitter<{
13
- value: unknown;
14
- key: string;
15
- }>;
16
- /**
17
- * Emits this field's name when focus leaves it. Driven by `focusout`, which
18
- * bubbles, so it works for any renderer without the renderer having to
19
- * declare a blur output of its own.
20
- */
21
- onBlurField: EventEmitter<string>;
22
- shouldRender: boolean;
23
- get resolvedOptions(): Record<string, unknown>[] | undefined;
24
- constructor(cdr: ChangeDetectorRef);
25
- ngOnChanges(_changes: SimpleChanges): void;
26
- static ɵfac: i0.ɵɵFactoryDeclaration<FieldInput, never>;
27
- static ɵcmp: i0.ɵɵComponentDeclaration<FieldInput, "dfk-field-input", never, { "fieldDescription": { "alias": "fieldDescription"; "required": false; }; "value": { "alias": "value"; "required": false; }; "options": { "alias": "options"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "error": { "alias": "error"; "required": false; }; }, { "onValueChangeField": "onValueChangeField"; "onBlurField": "onBlurField"; }, never, never, true, never>;
28
- }
@@ -1,60 +0,0 @@
1
- import { ChangeDetectorRef, EventEmitter, OnChanges, OnInit, SimpleChanges } from '@angular/core';
2
- import { FieldDescription, Properties } from '@dynamic-field-kit/core';
3
- import type { ValidationResult } from '@dynamic-field-kit/core';
4
- import { BaseLayoutConfig, LayoutConfig } from '../types/layout.js';
5
- import * as i0 from "@angular/core";
6
- export declare class MultiFieldInput implements OnInit, OnChanges {
7
- private cdr;
8
- fieldDescriptions: FieldDescription[];
9
- properties?: Properties;
10
- onChange: EventEmitter<Properties>;
11
- validityChange: EventEmitter<ValidationResult>;
12
- /**
13
- * Emits a field's name when it loses focus. Touched state is tracked
14
- * internally either way; this is the hook for driving an external form store
15
- * - pass `createDynamicFormStore`'s `handleBlur` to get its `touched` map and
16
- * `validateOnBlur` behaviour.
17
- */
18
- onBlurField: EventEmitter<string>;
19
- private touchedFields;
20
- handleBlurField(fieldName: string): void;
21
- /** Whether this field has been blurred at least once. */
22
- isTouched(fieldName: string): boolean;
23
- layout: LayoutConfig;
24
- rootData?: Properties;
25
- data: Properties;
26
- visibleFields: FieldDescription[];
27
- private isMobile;
28
- constructor(cdr: ChangeDetectorRef);
29
- onWindowResize(): void;
30
- get resolvedLayout(): BaseLayoutConfig;
31
- get resolvedLayoutType(): string;
32
- get gap(): number;
33
- get columns(): number;
34
- trackByFn(index: number, field: FieldDescription): string | number;
35
- trackByIndex(index: number): number;
36
- private groupTrackByCache;
37
- groupTrackBy(field: FieldDescription): (index: number, item: Properties) => unknown;
38
- ngOnInit(): void;
39
- ngOnChanges(_changes: SimpleChanges): void;
40
- private updateIsMobile;
41
- private init;
42
- private updateVisibleFields;
43
- onFieldChange(event: {
44
- value: unknown;
45
- key: string;
46
- }): void;
47
- getItems(field: FieldDescription): Properties[];
48
- getResolvedOptions(field: FieldDescription): Properties[] | undefined;
49
- getDisabled(field: FieldDescription): boolean;
50
- getReadOnly(field: FieldDescription): boolean;
51
- getError(field: FieldDescription): string[] | undefined;
52
- canAddItem(field: FieldDescription): boolean;
53
- canRemoveItem(field: FieldDescription): boolean;
54
- onGroupItemAdd(field: FieldDescription): void;
55
- onGroupItemRemove(field: FieldDescription, index: number): void;
56
- onGroupItemChange(field: FieldDescription, index: number, next: Properties): void;
57
- private commitData;
58
- static ɵfac: i0.ɵɵFactoryDeclaration<MultiFieldInput, never>;
59
- static ɵcmp: i0.ɵɵComponentDeclaration<MultiFieldInput, "dfk-multi-field-input", never, { "fieldDescriptions": { "alias": "fieldDescriptions"; "required": false; }; "properties": { "alias": "properties"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "rootData": { "alias": "rootData"; "required": false; }; }, { "onChange": "onChange"; "validityChange": "validityChange"; "onBlurField": "onBlurField"; }, never, never, true, never>;
60
- }
@@ -1,3 +0,0 @@
1
- import { InjectionToken } from '@angular/core';
2
- import { FieldRegistry } from '@dynamic-field-kit/core';
3
- export declare const FIELD_REGISTRY: InjectionToken<FieldRegistry>;
package/dist/index.d.ts DELETED
@@ -1,5 +0,0 @@
1
- /**
2
- * Generated bundle index. Do not edit.
3
- */
4
- /// <amd-module name="@dynamic-field-kit/angular" />
5
- export * from './public-api.js';
@@ -1,31 +0,0 @@
1
- import { TemplateRef } from '@angular/core';
2
- import * as i0 from "@angular/core";
3
- export declare class ColumnLayout {
4
- config?: {
5
- gap?: number;
6
- };
7
- template: TemplateRef<unknown>;
8
- get gap(): number;
9
- static ɵfac: i0.ɵɵFactoryDeclaration<ColumnLayout, never>;
10
- static ɵcmp: i0.ɵɵComponentDeclaration<ColumnLayout, "dfk-column-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
11
- }
12
- export declare class RowLayout {
13
- config?: {
14
- gap?: number;
15
- };
16
- template: TemplateRef<unknown>;
17
- get gap(): number;
18
- static ɵfac: i0.ɵɵFactoryDeclaration<RowLayout, never>;
19
- static ɵcmp: i0.ɵɵComponentDeclaration<RowLayout, "dfk-row-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
20
- }
21
- export declare class GridLayout {
22
- config?: {
23
- columns?: number;
24
- gap?: number;
25
- };
26
- template: TemplateRef<unknown>;
27
- get columns(): number;
28
- get gap(): number;
29
- static ɵfac: i0.ɵɵFactoryDeclaration<GridLayout, never>;
30
- static ɵcmp: i0.ɵɵComponentDeclaration<GridLayout, "dfk-grid-layout", never, { "config": { "alias": "config"; "required": false; }; "template": { "alias": "template"; "required": false; }; }, {}, never, never, true, never>;
31
- }
@@ -1,2 +0,0 @@
1
- export * from './defaultLayouts.js';
2
- export { layoutRegistry, LayoutRegistry } from './layoutRegistry.js';