@mosaicoo/form-angular 0.3.0 → 0.4.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.
- package/fesm2022/mosaicoo-form-angular-designer.mjs +110 -11
- package/fesm2022/mosaicoo-form-angular-designer.mjs.map +1 -1
- package/fesm2022/mosaicoo-form-angular.mjs +348 -90
- package/fesm2022/mosaicoo-form-angular.mjs.map +1 -1
- package/package.json +2 -2
- package/types/mosaicoo-form-angular-designer.d.ts +8 -1
- package/types/mosaicoo-form-angular.d.ts +132 -66
|
@@ -1,70 +1,10 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { Type, InjectionToken, EnvironmentProviders } from '@angular/core';
|
|
3
3
|
import * as _mosaicoo_form_core from '@mosaicoo/form-core';
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* `<mform-renderer>` — renders a form at runtime from a `FormSchema` (or any
|
|
8
|
-
* definition a registered importer understands) and manages its lifecycle:
|
|
9
|
-
* values, validation, conditional visibility and submission. Wizard schemas
|
|
10
|
-
* (`settings.display: 'wizard'`) render as steps with per-step validation.
|
|
11
|
-
*
|
|
12
|
-
* Theming: every visual primitive reads a `--mform-*` CSS custom property
|
|
13
|
-
* with a self-contained fallback, so the component looks finished on its own
|
|
14
|
-
* and adopts the host design system when the host overrides the tokens.
|
|
15
|
-
*/
|
|
16
|
-
declare class FormRendererComponent {
|
|
17
|
-
/** Native schema input. Takes precedence over `source`. */
|
|
18
|
-
readonly schema: _angular_core.InputSignal<FormSchema | null>;
|
|
19
|
-
/** Foreign definition (object or JSON string) resolved via importers. */
|
|
20
|
-
readonly source: _angular_core.InputSignal<unknown>;
|
|
21
|
-
/** Initial data merged over schema defaults. */
|
|
22
|
-
readonly initialData: _angular_core.InputSignal<Record<string, unknown> | null>;
|
|
23
|
-
/** Named providers resolving `optionsSource: provider` fields. */
|
|
24
|
-
readonly optionsProviders: _angular_core.InputSignal<OptionsProviderRegistry>;
|
|
25
|
-
/** Host-supplied message resolver (localization of validation messages). */
|
|
26
|
-
readonly messages: _angular_core.InputSignal<MessageResolver | null>;
|
|
27
|
-
/** Fixed renderer texts (override to localize). `{{count}}` in `summary`. */
|
|
28
|
-
readonly labels: _angular_core.InputSignalWithTransform<{
|
|
29
|
-
previous: string;
|
|
30
|
-
next: string;
|
|
31
|
-
submit: string;
|
|
32
|
-
summary: string;
|
|
33
|
-
}, Partial<{
|
|
34
|
-
previous: string;
|
|
35
|
-
next: string;
|
|
36
|
-
submit: string;
|
|
37
|
-
summary: string;
|
|
38
|
-
}>>;
|
|
39
|
-
summaryTitle(): string;
|
|
40
|
-
/** Fired on submit; `ok` is false when validation failed. */
|
|
41
|
-
readonly submitted: _angular_core.OutputEmitterRef<SubmitResult>;
|
|
42
|
-
/** Fired on every value change with the full data snapshot. */
|
|
43
|
-
readonly valueChanged: _angular_core.OutputEmitterRef<Record<string, unknown>>;
|
|
44
|
-
/** Bumped on every engine event; nodes read it to refresh. */
|
|
45
|
-
readonly tick: _angular_core.WritableSignal<number>;
|
|
46
|
-
/** Active wizard step index. */
|
|
47
|
-
readonly currentStep: _angular_core.WritableSignal<number>;
|
|
48
|
-
private readonly resolved;
|
|
49
|
-
/** Import degradations for the current `source`, if any. */
|
|
50
|
-
readonly importWarnings: _angular_core.Signal<ImportWarning[]>;
|
|
51
|
-
readonly engine: _angular_core.Signal<FormEngine | null>;
|
|
52
|
-
readonly isWizard: _angular_core.Signal<boolean>;
|
|
53
|
-
/** Wizard pages: the top-level containers of the schema. */
|
|
54
|
-
readonly steps: _angular_core.Signal<ContainerField[]>;
|
|
55
|
-
readonly errorSummary: _angular_core.WritableSignal<FieldError[]>;
|
|
56
|
-
constructor();
|
|
57
|
-
previousStep(): void;
|
|
58
|
-
nextStep(): void;
|
|
59
|
-
onSubmit(event: Event): void;
|
|
60
|
-
/** Finds the wizard step that owns a (possibly row-indexed) data path. */
|
|
61
|
-
private stepIndexForPath;
|
|
62
|
-
private readonly documentRef;
|
|
63
|
-
private focusFirstError;
|
|
64
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormRendererComponent, never>;
|
|
65
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormRendererComponent, "mform-renderer", never, { "schema": { "alias": "schema"; "required": false; "isSignal": true; }; "source": { "alias": "source"; "required": false; "isSignal": true; }; "initialData": { "alias": "initialData"; "required": false; "isSignal": true; }; "optionsProviders": { "alias": "optionsProviders"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; }, { "submitted": "submitted"; "valueChanged": "valueChanged"; }, never, never, true, never>;
|
|
66
|
-
}
|
|
4
|
+
import { FieldNode, FormEngine, OptionsProviderRegistry, FieldOption, InputField, ContainerField, FormSchema, MessageResolver, ValidatorRegistry, SubmitResult, ImportWarning, FieldError, RemoteOptionsFetcher } from '@mosaicoo/form-core';
|
|
67
5
|
|
|
6
|
+
/** Rendering mode: `readonly` hides actions, `disabled` grays everything. */
|
|
7
|
+
type FormMode = 'edit' | 'readonly' | 'disabled';
|
|
68
8
|
/**
|
|
69
9
|
* Renders one schema node (input, container or static) and recurses into
|
|
70
10
|
* children. State lives in the headless engine — this component only projects
|
|
@@ -82,11 +22,27 @@ declare class FormNodeComponent {
|
|
|
82
22
|
readonly bare: _angular_core.InputSignal<boolean>;
|
|
83
23
|
/** Host-registered providers for `optionsSource: provider` fields. */
|
|
84
24
|
readonly providers: _angular_core.InputSignal<OptionsProviderRegistry>;
|
|
25
|
+
/** Rendering mode inherited from the renderer. */
|
|
26
|
+
readonly mode: _angular_core.InputSignal<FormMode>;
|
|
27
|
+
/** Renderer-supplied refresh hook for async completions (zoneless-safe). */
|
|
28
|
+
readonly notify: _angular_core.InputSignal<() => void>;
|
|
85
29
|
readonly activeTab: _angular_core.WritableSignal<number>;
|
|
86
30
|
/** DI-registered custom field components (maps merge; later wins). */
|
|
87
31
|
private readonly componentMaps;
|
|
88
32
|
/** Host transport for remote options; plain fetch when absent. */
|
|
89
33
|
private readonly remoteFetcher;
|
|
34
|
+
/** Host-owned upload for `file` fields. */
|
|
35
|
+
private readonly uploader;
|
|
36
|
+
/**
|
|
37
|
+
* Async resolutions (debounce timers, provider promises) finish outside
|
|
38
|
+
* any template event — explicitly schedule the refresh for zoneless apps.
|
|
39
|
+
*/
|
|
40
|
+
private readonly changeDetector;
|
|
41
|
+
readonly uploading: _angular_core.WritableSignal<boolean>;
|
|
42
|
+
/** Effective disabled state: mode, schema flag or calculated field. */
|
|
43
|
+
controlDisabled(): boolean;
|
|
44
|
+
interactive(): boolean;
|
|
45
|
+
pending(): boolean;
|
|
90
46
|
/** Custom component registered for this field type, if any. */
|
|
91
47
|
customComponent(): Type<unknown> | null;
|
|
92
48
|
/** Inputs handed to a custom component (MformFieldComponent contract). */
|
|
@@ -130,16 +86,106 @@ declare class FormNodeComponent {
|
|
|
130
86
|
setChecked(event: Event): void;
|
|
131
87
|
toggleMap(option: string, event: Event): void;
|
|
132
88
|
setFiles(event: Event): void;
|
|
89
|
+
/** Names shown under a `file` control (refs or plain names). */
|
|
90
|
+
fileNames(): string[];
|
|
133
91
|
prefix(): string | null;
|
|
134
92
|
suffix(): string | null;
|
|
135
93
|
tagValues(): string[];
|
|
136
94
|
addTag(event: Event): void;
|
|
137
95
|
removeTag(index: number): void;
|
|
138
96
|
touch(): void;
|
|
97
|
+
readonly refOptions: _angular_core.WritableSignal<FieldOption[]>;
|
|
98
|
+
readonly refOpen: _angular_core.WritableSignal<boolean>;
|
|
99
|
+
private refTimer;
|
|
100
|
+
/** Label of the chosen option (falls back to the raw value). */
|
|
101
|
+
readonly refLabel: _angular_core.WritableSignal<string | null>;
|
|
102
|
+
refDisplay(): string;
|
|
103
|
+
refSearch(event: Event): void;
|
|
104
|
+
private refResolve;
|
|
105
|
+
refPick(option: FieldOption): void;
|
|
106
|
+
refBlur(): void;
|
|
139
107
|
addRow(): void;
|
|
140
108
|
removeRow(index: number): void;
|
|
141
109
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormNodeComponent, never>;
|
|
142
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormNodeComponent, "mform-node", never, { "node": { "alias": "node"; "required": true; "isSignal": true; }; "engine": { "alias": "engine"; "required": true; "isSignal": true; }; "tick": { "alias": "tick"; "required": true; "isSignal": true; }; "scope": { "alias": "scope"; "required": false; "isSignal": true; }; "bare": { "alias": "bare"; "required": false; "isSignal": true; }; "providers": { "alias": "providers"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
110
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormNodeComponent, "mform-node", never, { "node": { "alias": "node"; "required": true; "isSignal": true; }; "engine": { "alias": "engine"; "required": true; "isSignal": true; }; "tick": { "alias": "tick"; "required": true; "isSignal": true; }; "scope": { "alias": "scope"; "required": false; "isSignal": true; }; "bare": { "alias": "bare"; "required": false; "isSignal": true; }; "providers": { "alias": "providers"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "notify": { "alias": "notify"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* `<mform-renderer>` — renders a form at runtime from a `FormSchema` (or any
|
|
115
|
+
* definition a registered importer understands) and manages its lifecycle:
|
|
116
|
+
* values, validation, conditional visibility and submission. Wizard schemas
|
|
117
|
+
* (`settings.display: 'wizard'`) render as steps with per-step validation.
|
|
118
|
+
*
|
|
119
|
+
* Theming: every visual primitive reads a `--mform-*` CSS custom property
|
|
120
|
+
* with a self-contained fallback, so the component looks finished on its own
|
|
121
|
+
* and adopts the host design system when the host overrides the tokens.
|
|
122
|
+
*/
|
|
123
|
+
declare class FormRendererComponent {
|
|
124
|
+
/** Native schema input. Takes precedence over `source`. */
|
|
125
|
+
readonly schema: _angular_core.InputSignal<FormSchema | null>;
|
|
126
|
+
/** Foreign definition (object or JSON string) resolved via importers. */
|
|
127
|
+
readonly source: _angular_core.InputSignal<unknown>;
|
|
128
|
+
/** Initial data merged over schema defaults. */
|
|
129
|
+
readonly initialData: _angular_core.InputSignal<Record<string, unknown> | null>;
|
|
130
|
+
/** Named providers resolving `optionsSource: provider` fields. */
|
|
131
|
+
readonly optionsProviders: _angular_core.InputSignal<OptionsProviderRegistry>;
|
|
132
|
+
/** Host-supplied message resolver (localization of validation messages). */
|
|
133
|
+
readonly messages: _angular_core.InputSignal<MessageResolver | null>;
|
|
134
|
+
/** Named custom validators (sync or async — Promises get pending states). */
|
|
135
|
+
readonly validators: _angular_core.InputSignal<ValidatorRegistry | null>;
|
|
136
|
+
/** `edit` (default), `readonly` (no actions) or `disabled`. */
|
|
137
|
+
readonly mode: _angular_core.InputSignal<FormMode>;
|
|
138
|
+
/**
|
|
139
|
+
* Optional host submission: called after a VALID submit with the result;
|
|
140
|
+
* rejections surface as the submission error state. Persistence transport
|
|
141
|
+
* stays entirely on the host side.
|
|
142
|
+
*/
|
|
143
|
+
readonly submitHandler: _angular_core.InputSignal<((result: SubmitResult) => Promise<void>) | null>;
|
|
144
|
+
/** True while async validation or the submit handler is running. */
|
|
145
|
+
readonly submitting: _angular_core.WritableSignal<boolean>;
|
|
146
|
+
/** Message when the host submission rejected. */
|
|
147
|
+
readonly submitError: _angular_core.WritableSignal<string | null>;
|
|
148
|
+
/** Fixed renderer texts (override to localize). `{{count}}` in `summary`. */
|
|
149
|
+
readonly labels: _angular_core.InputSignalWithTransform<{
|
|
150
|
+
previous: string;
|
|
151
|
+
next: string;
|
|
152
|
+
submit: string;
|
|
153
|
+
summary: string;
|
|
154
|
+
}, Partial<{
|
|
155
|
+
previous: string;
|
|
156
|
+
next: string;
|
|
157
|
+
submit: string;
|
|
158
|
+
summary: string;
|
|
159
|
+
}>>;
|
|
160
|
+
summaryTitle(): string;
|
|
161
|
+
/** Fired on submit; `ok` is false when validation failed. */
|
|
162
|
+
readonly submitted: _angular_core.OutputEmitterRef<SubmitResult>;
|
|
163
|
+
/** Fired on every value change with the full data snapshot. */
|
|
164
|
+
readonly valueChanged: _angular_core.OutputEmitterRef<Record<string, unknown>>;
|
|
165
|
+
/** Bumped on every engine event; nodes read it to refresh. */
|
|
166
|
+
readonly tick: _angular_core.WritableSignal<number>;
|
|
167
|
+
/** Handed to nodes so async completions re-render (zoneless-safe). */
|
|
168
|
+
readonly bumpTick: () => void;
|
|
169
|
+
/** Active wizard step index. */
|
|
170
|
+
readonly currentStep: _angular_core.WritableSignal<number>;
|
|
171
|
+
private readonly resolved;
|
|
172
|
+
/** Import degradations for the current `source`, if any. */
|
|
173
|
+
readonly importWarnings: _angular_core.Signal<ImportWarning[]>;
|
|
174
|
+
readonly engine: _angular_core.Signal<FormEngine | null>;
|
|
175
|
+
readonly isWizard: _angular_core.Signal<boolean>;
|
|
176
|
+
/** Wizard pages: the top-level containers of the schema. */
|
|
177
|
+
readonly steps: _angular_core.Signal<ContainerField[]>;
|
|
178
|
+
readonly errorSummary: _angular_core.WritableSignal<FieldError[]>;
|
|
179
|
+
constructor();
|
|
180
|
+
previousStep(): void;
|
|
181
|
+
nextStep(): void;
|
|
182
|
+
onSubmit(event: Event): Promise<void>;
|
|
183
|
+
/** Finds the wizard step that owns a (possibly row-indexed) data path. */
|
|
184
|
+
private stepIndexForPath;
|
|
185
|
+
private readonly documentRef;
|
|
186
|
+
private focusFirstError;
|
|
187
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormRendererComponent, never>;
|
|
188
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormRendererComponent, "mform-renderer", never, { "schema": { "alias": "schema"; "required": false; "isSignal": true; }; "source": { "alias": "source"; "required": false; "isSignal": true; }; "initialData": { "alias": "initialData"; "required": false; "isSignal": true; }; "optionsProviders": { "alias": "optionsProviders"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "validators": { "alias": "validators"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "submitHandler": { "alias": "submitHandler"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; }, { "submitted": "submitted"; "valueChanged": "valueChanged"; }, never, never, true, never>;
|
|
143
189
|
}
|
|
144
190
|
|
|
145
191
|
/**
|
|
@@ -176,11 +222,31 @@ declare const MFORM_FIELD_COMPONENTS: InjectionToken<FieldComponentMap[]>;
|
|
|
176
222
|
* base URLs, caching). Without it, a plain `fetch` is used.
|
|
177
223
|
*/
|
|
178
224
|
declare const MFORM_REMOTE_FETCHER: InjectionToken<RemoteOptionsFetcher>;
|
|
225
|
+
/** Reference the host returns after uploading one file. */
|
|
226
|
+
interface UploadedFileRef {
|
|
227
|
+
name: string;
|
|
228
|
+
id?: string;
|
|
229
|
+
url?: string;
|
|
230
|
+
size?: number;
|
|
231
|
+
[extra: string]: unknown;
|
|
232
|
+
}
|
|
233
|
+
/**
|
|
234
|
+
* Host-owned file upload: receives each selected file, delivers it wherever
|
|
235
|
+
* the host decides (API, bucket, queue) and returns the reference stored in
|
|
236
|
+
* the form data. Without it, `file` fields keep only file names.
|
|
237
|
+
*/
|
|
238
|
+
type FileUploadFn = (file: File, context: {
|
|
239
|
+
field: InputField;
|
|
240
|
+
path: string;
|
|
241
|
+
}) => Promise<UploadedFileRef>;
|
|
242
|
+
declare const MFORM_UPLOAD: InjectionToken<FileUploadFn>;
|
|
179
243
|
interface MosaicooFormConfig {
|
|
180
244
|
/** Custom/override field components, keyed by field `type`. */
|
|
181
245
|
components?: FieldComponentMap;
|
|
182
246
|
/** Host transport for remote options sources. */
|
|
183
247
|
remoteFetcher?: RemoteOptionsFetcher;
|
|
248
|
+
/** Host-owned file upload for `file` fields. */
|
|
249
|
+
uploadFiles?: FileUploadFn;
|
|
184
250
|
}
|
|
185
251
|
/**
|
|
186
252
|
* Registers renderer extensions at any injector level:
|
|
@@ -198,5 +264,5 @@ interface MosaicooFormConfig {
|
|
|
198
264
|
*/
|
|
199
265
|
declare function provideMosaicooForm(config: MosaicooFormConfig): EnvironmentProviders;
|
|
200
266
|
|
|
201
|
-
export { FormNodeComponent, FormRendererComponent, MFORM_FIELD_COMPONENTS, MFORM_REMOTE_FETCHER, provideMosaicooForm };
|
|
202
|
-
export type { FieldComponentMap, MformFieldComponent, MosaicooFormConfig };
|
|
267
|
+
export { FormNodeComponent, FormRendererComponent, MFORM_FIELD_COMPONENTS, MFORM_REMOTE_FETCHER, MFORM_UPLOAD, provideMosaicooForm };
|
|
268
|
+
export type { FieldComponentMap, FileUploadFn, FormMode, MformFieldComponent, MosaicooFormConfig, UploadedFileRef };
|