@ng-forge/dynamic-forms-ionic 0.1.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,642 @@
|
|
|
1
|
+
import * as _ng_forge_dynamic_forms from '@ng-forge/dynamic-forms';
|
|
2
|
+
import { FormEvent, ButtonField, FieldDef, LogicConfig, FieldComponent, DynamicText, FormEventConstructor, EventArgs, ArrayItemContext, CheckboxField, CheckedFieldComponent, ValidationMessages, DatepickerField, DatepickerProps, ValueFieldComponent, InputField, InputProps, MultiCheckboxField, ValueType, FieldOption, RadioField, SelectField, SelectProps, SliderField, TextareaField, TextareaProps, ToggleField, FieldTypeDefinition } from '@ng-forge/dynamic-forms';
|
|
3
|
+
import * as _angular_core from '@angular/core';
|
|
4
|
+
import { InjectionToken, Provider } from '@angular/core';
|
|
5
|
+
import { FieldTree } from '@angular/forms/signals';
|
|
6
|
+
|
|
7
|
+
interface IonicButtonProps {
|
|
8
|
+
expand?: 'full' | 'block';
|
|
9
|
+
fill?: 'clear' | 'outline' | 'solid' | 'default';
|
|
10
|
+
shape?: 'round';
|
|
11
|
+
size?: 'small' | 'default' | 'large';
|
|
12
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
|
13
|
+
strong?: boolean;
|
|
14
|
+
type?: 'button' | 'submit' | 'reset';
|
|
15
|
+
}
|
|
16
|
+
type IonicButtonField<TEvent extends FormEvent> = ButtonField<IonicButtonProps, TEvent>;
|
|
17
|
+
type IonicButtonComponent<TEvent extends FormEvent> = FieldComponent<IonicButtonField<TEvent>>;
|
|
18
|
+
/**
|
|
19
|
+
* Specific button field types with preconfigured events
|
|
20
|
+
*/
|
|
21
|
+
/** Submit button field - automatically disabled when form is invalid */
|
|
22
|
+
interface IonicSubmitButtonField extends Omit<FieldDef<IonicButtonProps>, 'event'> {
|
|
23
|
+
type: 'submit';
|
|
24
|
+
key: string;
|
|
25
|
+
label: string;
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
className?: string;
|
|
28
|
+
props?: IonicButtonProps;
|
|
29
|
+
/** Logic rules for dynamic disabled state (overrides form-level defaults) */
|
|
30
|
+
logic?: LogicConfig[];
|
|
31
|
+
}
|
|
32
|
+
/** Next page button field - with preconfigured NextPageEvent */
|
|
33
|
+
interface IonicNextButtonField extends Omit<FieldDef<IonicButtonProps>, 'event'> {
|
|
34
|
+
type: 'next';
|
|
35
|
+
key: string;
|
|
36
|
+
label: string;
|
|
37
|
+
disabled?: boolean;
|
|
38
|
+
className?: string;
|
|
39
|
+
props?: IonicButtonProps;
|
|
40
|
+
/** Logic rules for dynamic disabled state (overrides form-level defaults) */
|
|
41
|
+
logic?: LogicConfig[];
|
|
42
|
+
}
|
|
43
|
+
/** Previous page button field - with preconfigured PreviousPageEvent */
|
|
44
|
+
interface IonicPreviousButtonField extends Omit<FieldDef<IonicButtonProps>, 'event'> {
|
|
45
|
+
type: 'previous';
|
|
46
|
+
key: string;
|
|
47
|
+
label: string;
|
|
48
|
+
disabled?: boolean;
|
|
49
|
+
className?: string;
|
|
50
|
+
props?: IonicButtonProps;
|
|
51
|
+
}
|
|
52
|
+
/** Add array item button field - with preconfigured AddArrayItemEvent */
|
|
53
|
+
interface AddArrayItemButtonField extends Omit<FieldDef<IonicButtonProps>, 'event'> {
|
|
54
|
+
type: 'addArrayItem';
|
|
55
|
+
key: string;
|
|
56
|
+
label: string;
|
|
57
|
+
disabled?: boolean;
|
|
58
|
+
className?: string;
|
|
59
|
+
props?: IonicButtonProps;
|
|
60
|
+
/**
|
|
61
|
+
* The key of the array field to add items to.
|
|
62
|
+
* Required when the button is placed outside the array.
|
|
63
|
+
* When inside an array, this is automatically determined from context.
|
|
64
|
+
*/
|
|
65
|
+
arrayKey?: string;
|
|
66
|
+
}
|
|
67
|
+
/** Remove array item button field - with preconfigured RemoveArrayItemEvent */
|
|
68
|
+
interface RemoveArrayItemButtonField extends Omit<FieldDef<IonicButtonProps>, 'event'> {
|
|
69
|
+
type: 'removeArrayItem';
|
|
70
|
+
key: string;
|
|
71
|
+
label: string;
|
|
72
|
+
disabled?: boolean;
|
|
73
|
+
className?: string;
|
|
74
|
+
props?: IonicButtonProps;
|
|
75
|
+
/**
|
|
76
|
+
* The key of the array field to remove items from.
|
|
77
|
+
* Required when the button is placed outside the array.
|
|
78
|
+
* When inside an array, this is automatically determined from context.
|
|
79
|
+
*/
|
|
80
|
+
arrayKey?: string;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
declare class IonicButtonFieldComponent<TEvent extends FormEvent> implements IonicButtonComponent<TEvent> {
|
|
84
|
+
private readonly eventBus;
|
|
85
|
+
private readonly arrayContext;
|
|
86
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
87
|
+
readonly label: _angular_core.InputSignal<DynamicText>;
|
|
88
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
89
|
+
readonly hidden: _angular_core.InputSignal<boolean>;
|
|
90
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
91
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
92
|
+
/** Event to dispatch on click. Optional for submit buttons (native form submit handles it). */
|
|
93
|
+
readonly event: _angular_core.InputSignal<FormEventConstructor<TEvent> | undefined>;
|
|
94
|
+
readonly eventArgs: _angular_core.InputSignal<EventArgs | undefined>;
|
|
95
|
+
readonly props: _angular_core.InputSignal<IonicButtonProps | undefined>;
|
|
96
|
+
readonly eventContext: _angular_core.InputSignal<ArrayItemContext | undefined>;
|
|
97
|
+
/** Resolved button type - defaults to 'button' if not specified in props */
|
|
98
|
+
readonly buttonType: _angular_core.Signal<"button" | "submit" | "reset">;
|
|
99
|
+
readonly buttonTestId: _angular_core.Signal<string>;
|
|
100
|
+
/**
|
|
101
|
+
* Handle button click.
|
|
102
|
+
* - For submit buttons (type="submit"): do nothing, native form submit handles it
|
|
103
|
+
* - For other buttons: dispatch the configured event via EventBus
|
|
104
|
+
*/
|
|
105
|
+
onClick(): void;
|
|
106
|
+
private dispatchEvent;
|
|
107
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicButtonFieldComponent<any>, never>;
|
|
108
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicButtonFieldComponent<any>, "df-ionic-button", never, { "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "event": { "alias": "event"; "required": false; "isSignal": true; }; "eventArgs": { "alias": "eventArgs"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "eventContext": { "alias": "eventContext"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
interface IonicCheckboxProps {
|
|
112
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked';
|
|
113
|
+
justify?: 'start' | 'end' | 'space-between';
|
|
114
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
115
|
+
indeterminate?: boolean;
|
|
116
|
+
}
|
|
117
|
+
type IonicCheckboxField = CheckboxField<IonicCheckboxProps>;
|
|
118
|
+
type IonicCheckboxComponent = CheckedFieldComponent<IonicCheckboxField>;
|
|
119
|
+
|
|
120
|
+
declare class IonicCheckboxFieldComponent implements IonicCheckboxComponent {
|
|
121
|
+
readonly field: _angular_core.InputSignal<FieldTree<boolean>>;
|
|
122
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
123
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
124
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
125
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
126
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
127
|
+
readonly props: _angular_core.InputSignal<IonicCheckboxProps | undefined>;
|
|
128
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
129
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
130
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
131
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
132
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
133
|
+
/** Base ID for error elements */
|
|
134
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
135
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
136
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
137
|
+
/** Whether the field has a required validator */
|
|
138
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
139
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicCheckboxFieldComponent, never>;
|
|
140
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicCheckboxFieldComponent, "df-ionic-checkbox", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
interface IonicDatepickerProps extends DatepickerProps {
|
|
144
|
+
presentation?: 'date' | 'date-time' | 'time' | 'time-date' | 'month' | 'month-year' | 'year';
|
|
145
|
+
multiple?: boolean;
|
|
146
|
+
preferWheel?: boolean;
|
|
147
|
+
showDefaultButtons?: boolean;
|
|
148
|
+
showDefaultTitle?: boolean;
|
|
149
|
+
showDefaultTimeLabel?: boolean;
|
|
150
|
+
showClearButton?: boolean;
|
|
151
|
+
doneText?: string;
|
|
152
|
+
cancelText?: string;
|
|
153
|
+
size?: 'cover' | 'fixed';
|
|
154
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
155
|
+
}
|
|
156
|
+
type IonicDatepickerField = DatepickerField<IonicDatepickerProps>;
|
|
157
|
+
type IonicDatepickerComponent = ValueFieldComponent<IonicDatepickerField>;
|
|
158
|
+
|
|
159
|
+
declare class IonicDatepickerFieldComponent implements IonicDatepickerComponent {
|
|
160
|
+
readonly field: _angular_core.InputSignal<FieldTree<Date | null>>;
|
|
161
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
162
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
163
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
164
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
165
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
166
|
+
readonly minDate: _angular_core.InputSignal<Date | null>;
|
|
167
|
+
readonly maxDate: _angular_core.InputSignal<Date | null>;
|
|
168
|
+
readonly startAt: _angular_core.InputSignal<Date | null>;
|
|
169
|
+
readonly props: _angular_core.InputSignal<IonicDatepickerProps | undefined>;
|
|
170
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
171
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
172
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
173
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
174
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
175
|
+
readonly isModalOpen: _angular_core.WritableSignal<boolean>;
|
|
176
|
+
/** Base ID for error elements */
|
|
177
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
178
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
179
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
180
|
+
/** Whether the field has a required validator */
|
|
181
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
182
|
+
openModal(): void;
|
|
183
|
+
closeModal(): void;
|
|
184
|
+
onDateChange(event: CustomEvent): void;
|
|
185
|
+
dateToIsoString(date: Date | null | undefined): string | undefined;
|
|
186
|
+
formatDisplayDate(date: Date | null | undefined): string;
|
|
187
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicDatepickerFieldComponent, never>;
|
|
188
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicDatepickerFieldComponent, "df-ionic-datepicker", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "startAt": { "alias": "startAt"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
interface IonicInputProps extends InputProps {
|
|
192
|
+
fill?: 'solid' | 'outline';
|
|
193
|
+
shape?: 'round';
|
|
194
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked' | 'floating';
|
|
195
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
|
196
|
+
helperText?: DynamicText;
|
|
197
|
+
errorText?: DynamicText;
|
|
198
|
+
counter?: boolean;
|
|
199
|
+
maxlength?: number;
|
|
200
|
+
clearInput?: boolean;
|
|
201
|
+
type?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url';
|
|
202
|
+
}
|
|
203
|
+
type IonicInputField = InputField<IonicInputProps>;
|
|
204
|
+
type IonicInputComponent = ValueFieldComponent<IonicInputField>;
|
|
205
|
+
|
|
206
|
+
declare class IonicInputFieldComponent implements IonicInputComponent {
|
|
207
|
+
private ionicConfig;
|
|
208
|
+
readonly field: _angular_core.InputSignal<FieldTree<string>>;
|
|
209
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
210
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
211
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
212
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
213
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
214
|
+
readonly props: _angular_core.InputSignal<IonicInputProps | undefined>;
|
|
215
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
216
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
217
|
+
readonly effectiveFill: _angular_core.Signal<"outline" | "solid">;
|
|
218
|
+
readonly effectiveShape: _angular_core.Signal<"round" | undefined>;
|
|
219
|
+
readonly effectiveLabelPlacement: _angular_core.Signal<"start" | "end" | "fixed" | "stacked" | "floating">;
|
|
220
|
+
readonly effectiveColor: _angular_core.Signal<"primary" | "secondary" | "tertiary" | "success" | "warning" | "danger" | "light" | "medium" | "dark" | undefined>;
|
|
221
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
222
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
223
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
224
|
+
/** Base ID for error elements */
|
|
225
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
226
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
227
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
228
|
+
/** Whether the field has a required validator */
|
|
229
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
230
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicInputFieldComponent, never>;
|
|
231
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicInputFieldComponent, "df-ionic-input", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
interface IonicMultiCheckboxProps<T> {
|
|
235
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked';
|
|
236
|
+
justify?: 'start' | 'end' | 'space-between';
|
|
237
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
238
|
+
}
|
|
239
|
+
type IonicMultiCheckboxField<T> = MultiCheckboxField<T, IonicMultiCheckboxProps<T>>;
|
|
240
|
+
type IonicMultiCheckboxComponent<T> = ValueFieldComponent<IonicMultiCheckboxField<T>>;
|
|
241
|
+
|
|
242
|
+
declare class IonicMultiCheckboxFieldComponent<T extends ValueType> implements IonicMultiCheckboxComponent<T> {
|
|
243
|
+
readonly field: _angular_core.InputSignal<FieldTree<T[]>>;
|
|
244
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
245
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
246
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
247
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
248
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
249
|
+
readonly options: _angular_core.InputSignal<FieldOption<T>[]>;
|
|
250
|
+
readonly props: _angular_core.InputSignal<IonicMultiCheckboxProps<T> | undefined>;
|
|
251
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
252
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
253
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
254
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
255
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
256
|
+
/** Base ID for error elements */
|
|
257
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
258
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
259
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
260
|
+
/** Whether the field has a required validator */
|
|
261
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
262
|
+
valueViewModel: _angular_core.WritableSignal<FieldOption<T>[]>;
|
|
263
|
+
constructor();
|
|
264
|
+
onCheckboxChange(option: FieldOption<T>, checked: boolean): void;
|
|
265
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicMultiCheckboxFieldComponent<any>, never>;
|
|
266
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicMultiCheckboxFieldComponent<any>, "df-ionic-multi-checkbox", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
interface IonicRadioProps<T> {
|
|
270
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked';
|
|
271
|
+
justify?: 'start' | 'end' | 'space-between';
|
|
272
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
273
|
+
compareWith?: (o1: T, o2: T) => boolean;
|
|
274
|
+
}
|
|
275
|
+
type IonicRadioField<T> = RadioField<T, IonicRadioProps<T>>;
|
|
276
|
+
type IonicRadioComponent<T> = ValueFieldComponent<IonicRadioField<T>>;
|
|
277
|
+
|
|
278
|
+
declare class IonicRadioFieldComponent<T> implements IonicRadioComponent<T> {
|
|
279
|
+
readonly field: _angular_core.InputSignal<FieldTree<T>>;
|
|
280
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
281
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
282
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
283
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
284
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
285
|
+
readonly options: _angular_core.InputSignal<FieldOption<T>[]>;
|
|
286
|
+
readonly props: _angular_core.InputSignal<IonicRadioProps<T> | undefined>;
|
|
287
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
288
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
289
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
290
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
291
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
292
|
+
defaultCompare: (value1: any, value2: any) => boolean;
|
|
293
|
+
/** Base ID for error elements */
|
|
294
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
295
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
296
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
297
|
+
/** Whether the field has a required validator */
|
|
298
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
299
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicRadioFieldComponent<any>, never>;
|
|
300
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicRadioFieldComponent<any>, "df-ionic-radio", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
interface IonicSelectProps<T> extends SelectProps {
|
|
304
|
+
multiple?: boolean;
|
|
305
|
+
interface?: 'action-sheet' | 'popover' | 'alert';
|
|
306
|
+
interfaceOptions?: unknown;
|
|
307
|
+
cancelText?: string;
|
|
308
|
+
okText?: string;
|
|
309
|
+
placeholder?: DynamicText;
|
|
310
|
+
fill?: 'solid' | 'outline';
|
|
311
|
+
shape?: 'round';
|
|
312
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked' | 'floating';
|
|
313
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
314
|
+
compareWith?: (o1: T, o2: T) => boolean;
|
|
315
|
+
}
|
|
316
|
+
type IonicSelectField<T> = SelectField<T, IonicSelectProps<T>>;
|
|
317
|
+
type IonicSelectComponent<T> = ValueFieldComponent<IonicSelectField<T>>;
|
|
318
|
+
|
|
319
|
+
declare class IonicSelectFieldComponent<T> implements IonicSelectComponent<T> {
|
|
320
|
+
readonly field: _angular_core.InputSignal<FieldTree<T>>;
|
|
321
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
322
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
323
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
324
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
325
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
326
|
+
readonly options: _angular_core.InputSignal<FieldOption<T>[]>;
|
|
327
|
+
readonly props: _angular_core.InputSignal<IonicSelectProps<T> | undefined>;
|
|
328
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
329
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
330
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
331
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
332
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
333
|
+
defaultCompare: (value1: any, value2: any) => boolean;
|
|
334
|
+
/** Base ID for error elements */
|
|
335
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
336
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
337
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
338
|
+
/** Whether the field has a required validator */
|
|
339
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
340
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicSelectFieldComponent<any>, never>;
|
|
341
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicSelectFieldComponent<any>, "df-ionic-select", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
342
|
+
}
|
|
343
|
+
|
|
344
|
+
interface IonicSliderProps {
|
|
345
|
+
min?: number;
|
|
346
|
+
max?: number;
|
|
347
|
+
step?: number;
|
|
348
|
+
dualKnobs?: boolean;
|
|
349
|
+
pin?: boolean;
|
|
350
|
+
pinFormatter?: (value: number) => string | number;
|
|
351
|
+
ticks?: boolean;
|
|
352
|
+
snaps?: boolean;
|
|
353
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
354
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked';
|
|
355
|
+
}
|
|
356
|
+
type IonicSliderField = SliderField<IonicSliderProps>;
|
|
357
|
+
type IonicSliderComponent = ValueFieldComponent<IonicSliderField>;
|
|
358
|
+
|
|
359
|
+
declare class IonicSliderFieldComponent implements IonicSliderComponent {
|
|
360
|
+
readonly field: _angular_core.InputSignal<FieldTree<number>>;
|
|
361
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
362
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
363
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
364
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
365
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
366
|
+
readonly props: _angular_core.InputSignal<IonicSliderProps | undefined>;
|
|
367
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
368
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
369
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
370
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
371
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
372
|
+
protected defaultPinFormatter: (value: number) => string;
|
|
373
|
+
/** Base ID for error elements */
|
|
374
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
375
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
376
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
377
|
+
/** Whether the field has a required validator */
|
|
378
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
379
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicSliderFieldComponent, never>;
|
|
380
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicSliderFieldComponent, "df-ionic-slider", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
381
|
+
}
|
|
382
|
+
|
|
383
|
+
interface IonicTextareaProps extends TextareaProps {
|
|
384
|
+
rows?: number;
|
|
385
|
+
autoGrow?: boolean;
|
|
386
|
+
maxlength?: number;
|
|
387
|
+
counter?: boolean;
|
|
388
|
+
fill?: 'solid' | 'outline';
|
|
389
|
+
shape?: 'round';
|
|
390
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked' | 'floating';
|
|
391
|
+
helperText?: DynamicText;
|
|
392
|
+
errorText?: DynamicText;
|
|
393
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
|
394
|
+
}
|
|
395
|
+
type IonicTextareaField = TextareaField<IonicTextareaProps>;
|
|
396
|
+
type IonicTextareaComponent = ValueFieldComponent<IonicTextareaField>;
|
|
397
|
+
|
|
398
|
+
declare class IonicTextareaFieldComponent implements IonicTextareaComponent {
|
|
399
|
+
readonly field: _angular_core.InputSignal<FieldTree<string>>;
|
|
400
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
401
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
402
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
403
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
404
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
405
|
+
readonly props: _angular_core.InputSignal<IonicTextareaProps | undefined>;
|
|
406
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
407
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
408
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
409
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
410
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
411
|
+
/** Base ID for error elements */
|
|
412
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
413
|
+
/** Whether the field is currently in an invalid state (invalid AND touched) */
|
|
414
|
+
readonly isAriaInvalid: _angular_core.Signal<boolean>;
|
|
415
|
+
/** Whether the field has a required validator */
|
|
416
|
+
readonly isRequired: _angular_core.Signal<boolean>;
|
|
417
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicTextareaFieldComponent, never>;
|
|
418
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicTextareaFieldComponent, "df-ionic-textarea", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
interface IonicToggleProps {
|
|
422
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked';
|
|
423
|
+
justify?: 'start' | 'end' | 'space-between';
|
|
424
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger';
|
|
425
|
+
enableOnOffLabels?: boolean;
|
|
426
|
+
}
|
|
427
|
+
type IonicToggleField = ToggleField<IonicToggleProps>;
|
|
428
|
+
type IonicToggleComponent = CheckedFieldComponent<IonicToggleField>;
|
|
429
|
+
|
|
430
|
+
declare class IonicToggleFieldComponent implements IonicToggleComponent {
|
|
431
|
+
readonly field: _angular_core.InputSignal<FieldTree<boolean>>;
|
|
432
|
+
readonly key: _angular_core.InputSignal<string>;
|
|
433
|
+
readonly label: _angular_core.InputSignal<DynamicText | undefined>;
|
|
434
|
+
readonly placeholder: _angular_core.InputSignal<DynamicText | undefined>;
|
|
435
|
+
readonly className: _angular_core.InputSignal<string>;
|
|
436
|
+
readonly tabIndex: _angular_core.InputSignal<number | undefined>;
|
|
437
|
+
readonly props: _angular_core.InputSignal<IonicToggleProps | undefined>;
|
|
438
|
+
readonly validationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
439
|
+
readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
|
|
440
|
+
readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
441
|
+
readonly showErrors: _angular_core.Signal<boolean>;
|
|
442
|
+
readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms.ResolvedError[]>;
|
|
443
|
+
/** Base ID for error elements */
|
|
444
|
+
readonly errorId: _angular_core.Signal<string>;
|
|
445
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IonicToggleFieldComponent, never>;
|
|
446
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IonicToggleFieldComponent, "df-ionic-toggle", never, { "field": { "alias": "field"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "props": { "alias": "props"; "required": false; "isSignal": true; }; "validationMessages": { "alias": "validationMessages"; "required": false; "isSignal": true; }; "defaultValidationMessages": { "alias": "defaultValidationMessages"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
/**
|
|
450
|
+
* Ionic field type definitions
|
|
451
|
+
* Follows the FieldTypeDefinition interface for proper registry integration
|
|
452
|
+
*/
|
|
453
|
+
declare const IONIC_FIELD_TYPES: FieldTypeDefinition[];
|
|
454
|
+
|
|
455
|
+
/**
|
|
456
|
+
* Configuration options for Ionic form fields.
|
|
457
|
+
* These settings will be applied as defaults to all Ionic form fields
|
|
458
|
+
* unless overridden by individual field props.
|
|
459
|
+
*/
|
|
460
|
+
interface IonicConfig {
|
|
461
|
+
/**
|
|
462
|
+
* Default fill style for form inputs
|
|
463
|
+
* @default 'solid'
|
|
464
|
+
*/
|
|
465
|
+
fill?: 'solid' | 'outline';
|
|
466
|
+
/**
|
|
467
|
+
* Default shape for form controls
|
|
468
|
+
* @default undefined
|
|
469
|
+
*/
|
|
470
|
+
shape?: 'round';
|
|
471
|
+
/**
|
|
472
|
+
* Default label placement for form inputs
|
|
473
|
+
* @default 'start'
|
|
474
|
+
*/
|
|
475
|
+
labelPlacement?: 'start' | 'end' | 'fixed' | 'stacked' | 'floating';
|
|
476
|
+
/**
|
|
477
|
+
* Default color theme for form controls
|
|
478
|
+
* @default 'primary'
|
|
479
|
+
*/
|
|
480
|
+
color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
|
481
|
+
/**
|
|
482
|
+
* Default size for buttons
|
|
483
|
+
* @default 'default'
|
|
484
|
+
*/
|
|
485
|
+
size?: 'small' | 'default' | 'large';
|
|
486
|
+
/**
|
|
487
|
+
* Default expand behavior for buttons
|
|
488
|
+
* @default undefined
|
|
489
|
+
*/
|
|
490
|
+
expand?: 'full' | 'block';
|
|
491
|
+
/**
|
|
492
|
+
* Default fill style for buttons (overrides general fill if set)
|
|
493
|
+
* @default 'solid'
|
|
494
|
+
*/
|
|
495
|
+
buttonFill?: 'clear' | 'outline' | 'solid' | 'default';
|
|
496
|
+
/**
|
|
497
|
+
* Whether buttons should be strong (bold) by default
|
|
498
|
+
* @default false
|
|
499
|
+
*/
|
|
500
|
+
strong?: boolean;
|
|
501
|
+
}
|
|
502
|
+
|
|
503
|
+
/**
|
|
504
|
+
* Injection token for Ionic form configuration.
|
|
505
|
+
* Use this to provide global configuration for Ionic form fields.
|
|
506
|
+
*
|
|
507
|
+
* @example
|
|
508
|
+
* ```typescript
|
|
509
|
+
* import { provideDynamicForm } from '@ng-forge/dynamic-forms';
|
|
510
|
+
* import { withIonicFields } from '@ng-forge/dynamic-forms-ionic';
|
|
511
|
+
*
|
|
512
|
+
* export const appConfig: ApplicationConfig = {
|
|
513
|
+
* providers: [
|
|
514
|
+
* provideDynamicForm(
|
|
515
|
+
* ...withIonicFields({
|
|
516
|
+
* fill: 'outline',
|
|
517
|
+
* labelPlacement: 'floating'
|
|
518
|
+
* })
|
|
519
|
+
* )
|
|
520
|
+
* ]
|
|
521
|
+
* };
|
|
522
|
+
* ```
|
|
523
|
+
*/
|
|
524
|
+
declare const IONIC_CONFIG: InjectionToken<IonicConfig>;
|
|
525
|
+
|
|
526
|
+
/**
|
|
527
|
+
* Ionic field type constants
|
|
528
|
+
* Based on available field components in the /fields folder
|
|
529
|
+
*/
|
|
530
|
+
declare const IonicField: {
|
|
531
|
+
readonly Input: "input";
|
|
532
|
+
readonly Select: "select";
|
|
533
|
+
readonly Checkbox: "checkbox";
|
|
534
|
+
readonly Button: "button";
|
|
535
|
+
readonly Submit: "submit";
|
|
536
|
+
readonly Next: "next";
|
|
537
|
+
readonly Previous: "previous";
|
|
538
|
+
readonly AddArrayItem: "addArrayItem";
|
|
539
|
+
readonly RemoveArrayItem: "removeArrayItem";
|
|
540
|
+
readonly Textarea: "textarea";
|
|
541
|
+
readonly Radio: "radio";
|
|
542
|
+
readonly MultiCheckbox: "multi-checkbox";
|
|
543
|
+
readonly Datepicker: "datepicker";
|
|
544
|
+
readonly Slider: "slider";
|
|
545
|
+
readonly Toggle: "toggle";
|
|
546
|
+
};
|
|
547
|
+
type IonicFieldType = (typeof IonicField)[keyof typeof IonicField];
|
|
548
|
+
|
|
549
|
+
/**
|
|
550
|
+
* Module augmentation for @ng-forge/dynamic-form
|
|
551
|
+
* This file augments the FieldRegistryLeaves interface to include
|
|
552
|
+
* all Ionic field types provided by this library.
|
|
553
|
+
*/
|
|
554
|
+
|
|
555
|
+
declare module '@ng-forge/dynamic-forms' {
|
|
556
|
+
interface FieldRegistryLeaves {
|
|
557
|
+
input: IonicInputField;
|
|
558
|
+
select: IonicSelectField<unknown>;
|
|
559
|
+
checkbox: IonicCheckboxField;
|
|
560
|
+
button: IonicButtonField<FormEvent>;
|
|
561
|
+
submit: IonicSubmitButtonField;
|
|
562
|
+
next: IonicNextButtonField;
|
|
563
|
+
previous: IonicPreviousButtonField;
|
|
564
|
+
textarea: IonicTextareaField;
|
|
565
|
+
radio: IonicRadioField<unknown>;
|
|
566
|
+
'multi-checkbox': IonicMultiCheckboxField<unknown>;
|
|
567
|
+
datepicker: IonicDatepickerField;
|
|
568
|
+
slider: IonicSliderField;
|
|
569
|
+
toggle: IonicToggleField;
|
|
570
|
+
addArrayItem: AddArrayItemButtonField;
|
|
571
|
+
removeArrayItem: RemoveArrayItemButtonField;
|
|
572
|
+
}
|
|
573
|
+
}
|
|
574
|
+
|
|
575
|
+
/**
|
|
576
|
+
* Field type definitions with optional config providers
|
|
577
|
+
*/
|
|
578
|
+
type FieldTypeDefinitionsWithConfig = FieldTypeDefinition[] & {
|
|
579
|
+
__configProviders?: Provider[];
|
|
580
|
+
};
|
|
581
|
+
/**
|
|
582
|
+
* Configure dynamic forms with Ionic field types.
|
|
583
|
+
* Provides all Ionic field types for use with provideDynamicForm.
|
|
584
|
+
*
|
|
585
|
+
* @param config - Optional global configuration for Ionic form fields
|
|
586
|
+
*
|
|
587
|
+
* @example
|
|
588
|
+
* ```typescript
|
|
589
|
+
* // Application-level setup
|
|
590
|
+
* import { ApplicationConfig } from '@angular/core';
|
|
591
|
+
* import { provideDynamicForm } from '@ng-forge/dynamic-form';
|
|
592
|
+
* import { withIonicFields } from '@ng-forge/dynamic-form-ionic';
|
|
593
|
+
*
|
|
594
|
+
* export const appConfig: ApplicationConfig = {
|
|
595
|
+
* providers: [
|
|
596
|
+
* provideDynamicForm(...withIonicFields())
|
|
597
|
+
* ]
|
|
598
|
+
* };
|
|
599
|
+
* ```
|
|
600
|
+
*
|
|
601
|
+
* @example
|
|
602
|
+
* ```typescript
|
|
603
|
+
* // With global configuration
|
|
604
|
+
* export const appConfig: ApplicationConfig = {
|
|
605
|
+
* providers: [
|
|
606
|
+
* provideDynamicForm(
|
|
607
|
+
* ...withIonicFields({
|
|
608
|
+
* fill: 'outline',
|
|
609
|
+
* labelPlacement: 'floating'
|
|
610
|
+
* })
|
|
611
|
+
* )
|
|
612
|
+
* ]
|
|
613
|
+
* };
|
|
614
|
+
* ```
|
|
615
|
+
*
|
|
616
|
+
* @returns Array of field type definitions for Ionic components
|
|
617
|
+
*/
|
|
618
|
+
declare function withIonicFields(config?: IonicConfig): FieldTypeDefinitionsWithConfig;
|
|
619
|
+
/**
|
|
620
|
+
* Module augmentation to extend the global DynamicFormFieldRegistry
|
|
621
|
+
* with Ionic field types
|
|
622
|
+
*/
|
|
623
|
+
declare module '@ng-forge/dynamic-forms' {
|
|
624
|
+
interface DynamicFormFieldRegistry {
|
|
625
|
+
input: IonicInputField;
|
|
626
|
+
select: IonicSelectField<any>;
|
|
627
|
+
checkbox: IonicCheckboxField;
|
|
628
|
+
button: IonicButtonField<any>;
|
|
629
|
+
submit: IonicSubmitButtonField;
|
|
630
|
+
next: IonicNextButtonField;
|
|
631
|
+
previous: IonicPreviousButtonField;
|
|
632
|
+
textarea: IonicTextareaField;
|
|
633
|
+
radio: IonicRadioField<any>;
|
|
634
|
+
'multi-checkbox': IonicMultiCheckboxField<any>;
|
|
635
|
+
datepicker: IonicDatepickerField;
|
|
636
|
+
slider: IonicSliderField;
|
|
637
|
+
toggle: IonicToggleField;
|
|
638
|
+
}
|
|
639
|
+
}
|
|
640
|
+
|
|
641
|
+
export { IONIC_CONFIG, IONIC_FIELD_TYPES, IonicButtonFieldComponent, IonicCheckboxFieldComponent, IonicDatepickerFieldComponent, IonicField, IonicInputFieldComponent, IonicMultiCheckboxFieldComponent, IonicRadioFieldComponent, IonicSelectFieldComponent, IonicSliderFieldComponent, IonicTextareaFieldComponent, IonicToggleFieldComponent, withIonicFields };
|
|
642
|
+
export type { AddArrayItemButtonField, IonicButtonField, IonicButtonProps, IonicCheckboxComponent, IonicCheckboxField, IonicCheckboxProps, IonicConfig, IonicDatepickerComponent, IonicDatepickerField, IonicDatepickerProps, IonicFieldType, IonicInputComponent, IonicInputField, IonicInputProps, IonicMultiCheckboxComponent, IonicMultiCheckboxField, IonicMultiCheckboxProps, IonicNextButtonField, IonicPreviousButtonField, IonicRadioComponent, IonicRadioField, IonicRadioProps, IonicSelectComponent, IonicSelectField, IonicSelectProps, IonicSliderComponent, IonicSliderField, IonicSliderProps, IonicSubmitButtonField, IonicTextareaComponent, IonicTextareaField, IonicTextareaProps, IonicToggleComponent, IonicToggleField, IonicToggleProps, RemoveArrayItemButtonField };
|