@mosaicoo/form-angular 0.2.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/README.md +18 -0
- package/fesm2022/mosaicoo-form-angular-designer.mjs +1305 -0
- package/fesm2022/mosaicoo-form-angular-designer.mjs.map +1 -0
- package/fesm2022/mosaicoo-form-angular.mjs +464 -112
- package/fesm2022/mosaicoo-form-angular.mjs.map +1 -1
- package/package.json +6 -2
- package/types/mosaicoo-form-angular-designer.d.ts +155 -0
- package/types/mosaicoo-form-angular.d.ts +137 -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,11 +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[];
|
|
91
|
+
prefix(): string | null;
|
|
92
|
+
suffix(): string | null;
|
|
93
|
+
tagValues(): string[];
|
|
94
|
+
addTag(event: Event): void;
|
|
95
|
+
removeTag(index: number): void;
|
|
133
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;
|
|
134
107
|
addRow(): void;
|
|
135
108
|
removeRow(index: number): void;
|
|
136
109
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormNodeComponent, never>;
|
|
137
|
-
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>;
|
|
138
189
|
}
|
|
139
190
|
|
|
140
191
|
/**
|
|
@@ -171,11 +222,31 @@ declare const MFORM_FIELD_COMPONENTS: InjectionToken<FieldComponentMap[]>;
|
|
|
171
222
|
* base URLs, caching). Without it, a plain `fetch` is used.
|
|
172
223
|
*/
|
|
173
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>;
|
|
174
243
|
interface MosaicooFormConfig {
|
|
175
244
|
/** Custom/override field components, keyed by field `type`. */
|
|
176
245
|
components?: FieldComponentMap;
|
|
177
246
|
/** Host transport for remote options sources. */
|
|
178
247
|
remoteFetcher?: RemoteOptionsFetcher;
|
|
248
|
+
/** Host-owned file upload for `file` fields. */
|
|
249
|
+
uploadFiles?: FileUploadFn;
|
|
179
250
|
}
|
|
180
251
|
/**
|
|
181
252
|
* Registers renderer extensions at any injector level:
|
|
@@ -193,5 +264,5 @@ interface MosaicooFormConfig {
|
|
|
193
264
|
*/
|
|
194
265
|
declare function provideMosaicooForm(config: MosaicooFormConfig): EnvironmentProviders;
|
|
195
266
|
|
|
196
|
-
export { FormNodeComponent, FormRendererComponent, MFORM_FIELD_COMPONENTS, MFORM_REMOTE_FETCHER, provideMosaicooForm };
|
|
197
|
-
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 };
|