@decaf-ts/for-angular 0.0.17 → 0.0.18
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/assets/i18n/en.json +3 -73
- package/assets/i18n/pt.json +5 -74
- package/components/crud-field/crud-field.component.d.ts +12 -3
- package/components/crud-form/crud-form.component.d.ts +36 -14
- package/components/empty-state/empty-state.component.d.ts +9 -10
- package/components/fieldset/fieldset.component.d.ts +9 -0
- package/components/filter/filter.component.d.ts +11 -2
- package/engine/NgxBaseComponent.d.ts +39 -39
- package/engine/NgxCrudFormField.d.ts +2 -1
- package/engine/NgxRenderingEngine.d.ts +44 -16
- package/engine/interfaces.d.ts +10 -0
- package/engine/types.d.ts +8 -0
- package/esm2022/components/crud-field/crud-field.component.mjs +23 -3
- package/esm2022/components/crud-form/crud-form.component.mjs +33 -18
- package/esm2022/components/empty-state/empty-state.component.mjs +11 -10
- package/esm2022/components/fieldset/fieldset.component.mjs +7 -4
- package/esm2022/components/filter/filter.component.mjs +16 -6
- package/esm2022/components/layout/layout.component.mjs +3 -3
- package/esm2022/components/list-item/list-item.component.mjs +4 -4
- package/esm2022/components/pagination/pagination.component.mjs +6 -6
- package/esm2022/engine/NgxBaseComponent.mjs +48 -53
- package/esm2022/engine/NgxCrudFormField.mjs +1 -1
- package/esm2022/engine/NgxRenderingEngine.mjs +20 -4
- package/esm2022/engine/interfaces.mjs +1 -1
- package/esm2022/engine/types.mjs +1 -1
- package/esm2022/helpers/utils.mjs +49 -32
- package/esm2022/i18n/Loader.mjs +82 -0
- package/fesm2022/decaf-ts-for-angular.mjs +288 -134
- package/fesm2022/decaf-ts-for-angular.mjs.map +1 -1
- package/helpers/utils.d.ts +42 -17
- package/i18n/Loader.d.ts +48 -0
- package/package.json +10 -1
package/assets/i18n/en.json
CHANGED
|
@@ -24,78 +24,6 @@
|
|
|
24
24
|
"greaterThan": "This field must be greater than field {0}",
|
|
25
25
|
"greaterThanOrEqual": "This field must be greater than or equal to field {0}"
|
|
26
26
|
},
|
|
27
|
-
"login": {
|
|
28
|
-
"username": {
|
|
29
|
-
"label": "Username",
|
|
30
|
-
"placeholder": "Type your username"
|
|
31
|
-
},
|
|
32
|
-
"password": {
|
|
33
|
-
"label": "Password",
|
|
34
|
-
"placeholder": "Type your password"
|
|
35
|
-
}
|
|
36
|
-
},
|
|
37
|
-
"demo": {
|
|
38
|
-
"id": {
|
|
39
|
-
"label": "id",
|
|
40
|
-
"placeholder": "Type a number"
|
|
41
|
-
},
|
|
42
|
-
"name": {
|
|
43
|
-
"label": "Name",
|
|
44
|
-
"placeholder": "Type your name"
|
|
45
|
-
},
|
|
46
|
-
"birthdate": {
|
|
47
|
-
"label": "Birthdate"
|
|
48
|
-
},
|
|
49
|
-
"email": {
|
|
50
|
-
"label": "E-mail",
|
|
51
|
-
"placeholder": "Type your e-mail address"
|
|
52
|
-
},
|
|
53
|
-
"website": {
|
|
54
|
-
"label": "Website",
|
|
55
|
-
"placeholder": "Type your favorite website"
|
|
56
|
-
},
|
|
57
|
-
"password": {
|
|
58
|
-
"label": "Password",
|
|
59
|
-
"placeholder": "Type your password"
|
|
60
|
-
},
|
|
61
|
-
"gender": {
|
|
62
|
-
"label": "Select your gender"
|
|
63
|
-
},
|
|
64
|
-
"agree": {
|
|
65
|
-
"label": "I accept the terms and conditions."
|
|
66
|
-
}
|
|
67
|
-
},
|
|
68
|
-
"category": {
|
|
69
|
-
"name": {
|
|
70
|
-
"label": "Category name",
|
|
71
|
-
"placeholder": "Type the category"
|
|
72
|
-
},
|
|
73
|
-
"description": {
|
|
74
|
-
"label": "Category Description",
|
|
75
|
-
"placeholder": "Describe the category (optional)"
|
|
76
|
-
},
|
|
77
|
-
"created": {
|
|
78
|
-
"label": "Creation date",
|
|
79
|
-
"placeholder": "Select the creation date"
|
|
80
|
-
}
|
|
81
|
-
},
|
|
82
|
-
"employee": {
|
|
83
|
-
"name": {
|
|
84
|
-
"label": "Employee name",
|
|
85
|
-
"placeholder": "Type the employee name"
|
|
86
|
-
},
|
|
87
|
-
"occupation": {
|
|
88
|
-
"label": "Employee occupation"
|
|
89
|
-
}
|
|
90
|
-
},
|
|
91
|
-
"user": {
|
|
92
|
-
"secret": {
|
|
93
|
-
"label": "Password"
|
|
94
|
-
},
|
|
95
|
-
"username": {
|
|
96
|
-
"label": "Username"
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
27
|
"component": {
|
|
100
28
|
"fieldset": {
|
|
101
29
|
"add": "Add another",
|
|
@@ -144,7 +72,9 @@
|
|
|
144
72
|
"select": "Filter selection",
|
|
145
73
|
"step1": "Select an index",
|
|
146
74
|
"step2": "Select a condition",
|
|
147
|
-
"step3": "Type a value"
|
|
75
|
+
"step3": "Type a value",
|
|
76
|
+
"no_suggestions": "No suggestions",
|
|
77
|
+
"sort": "Sort by"
|
|
148
78
|
}
|
|
149
79
|
}
|
|
150
80
|
}
|
package/assets/i18n/pt.json
CHANGED
|
@@ -24,83 +24,12 @@
|
|
|
24
24
|
"greaterThan": "Este campo deve ser superior ao campo {0}",
|
|
25
25
|
"greaterThanOrEqual": "Este campo deve ser superior ou igual ao campo {0}"
|
|
26
26
|
},
|
|
27
|
-
"login": {
|
|
28
|
-
"username": {
|
|
29
|
-
"label": "Nome de utilizador",
|
|
30
|
-
"placeholder": "Escreva o seu nome de utilizador"
|
|
31
|
-
},
|
|
32
|
-
"password": {
|
|
33
|
-
"label": "Palavra-passe",
|
|
34
|
-
"placeholder": "Escreva a sua palavra-passe"
|
|
35
|
-
}
|
|
36
|
-
},
|
|
37
|
-
"demo": {
|
|
38
|
-
"id": {
|
|
39
|
-
"label": "ID",
|
|
40
|
-
"placeholder": "Escreva um número"
|
|
41
|
-
},
|
|
42
|
-
"name": {
|
|
43
|
-
"label": "Nome",
|
|
44
|
-
"placeholder": "Escreva o seu nome"
|
|
45
|
-
},
|
|
46
|
-
"birthdate": {
|
|
47
|
-
"label": "Data de nascimento"
|
|
48
|
-
},
|
|
49
|
-
"email": {
|
|
50
|
-
"label": "E-mail",
|
|
51
|
-
"placeholder": "Escreva o seu endereço de e-mail"
|
|
52
|
-
},
|
|
53
|
-
"website": {
|
|
54
|
-
"label": "Website",
|
|
55
|
-
"placeholder": "Escreva o seu website favorito"
|
|
56
|
-
},
|
|
57
|
-
"password": {
|
|
58
|
-
"label": "Palavra-passe",
|
|
59
|
-
"placeholder": "Escreva a sua palavra-passe"
|
|
60
|
-
},
|
|
61
|
-
"gender": {
|
|
62
|
-
"label": "Selecione o seu género"
|
|
63
|
-
},
|
|
64
|
-
"agree": {
|
|
65
|
-
"label": "Aceito os termos e condições."
|
|
66
|
-
}
|
|
67
|
-
},
|
|
68
|
-
"category": {
|
|
69
|
-
"name": {
|
|
70
|
-
"label": "Nome da categoria",
|
|
71
|
-
"placeholder": "Escreva a categoria"
|
|
72
|
-
},
|
|
73
|
-
"description": {
|
|
74
|
-
"label": "Descrição da categoria",
|
|
75
|
-
"placeholder": "Descreva a categoria (opcional)"
|
|
76
|
-
},
|
|
77
|
-
"created": {
|
|
78
|
-
"label": "Data de criação",
|
|
79
|
-
"placeholder": "Selecione a data de criação"
|
|
80
|
-
}
|
|
81
|
-
},
|
|
82
|
-
"employee": {
|
|
83
|
-
"name": {
|
|
84
|
-
"label": "Nome do funcionário",
|
|
85
|
-
"placeholder": "Escreva o nome do funcionário"
|
|
86
|
-
},
|
|
87
|
-
"occupation": {
|
|
88
|
-
"label": "Função do funcionário"
|
|
89
|
-
}
|
|
90
|
-
},
|
|
91
|
-
"user": {
|
|
92
|
-
"secret": {
|
|
93
|
-
"label": "Palavra-passe"
|
|
94
|
-
},
|
|
95
|
-
"username": {
|
|
96
|
-
"label": "Nome de utilizador"
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
27
|
"component": {
|
|
100
28
|
"fieldset": {
|
|
101
29
|
"add": "Adicionar outro",
|
|
102
30
|
"update": "Atualizar item",
|
|
103
|
-
"not_unique": "O valor introduzido já existe. Valor \"{{value}}\""
|
|
31
|
+
"not_unique": "O valor introduzido já existe. Valor \"{{value}}\".",
|
|
32
|
+
"cancel": "Cancelar"
|
|
104
33
|
},
|
|
105
34
|
"list": {
|
|
106
35
|
"pagination": "A mostrar a página <span class=\"text-bold\">{{value0}} de {{value1}}</span>",
|
|
@@ -143,7 +72,9 @@
|
|
|
143
72
|
"select": "Seleção de filtro",
|
|
144
73
|
"step1": "Selecione um índice",
|
|
145
74
|
"step2": "Selecione uma condição",
|
|
146
|
-
"step3": "Escreva um valor"
|
|
75
|
+
"step3": "Escreva um valor",
|
|
76
|
+
"no_suggestions": "Sem sugestões",
|
|
77
|
+
"sort": "Ordenar por"
|
|
147
78
|
}
|
|
148
79
|
}
|
|
149
80
|
}
|
|
@@ -3,7 +3,7 @@ import { FormArray, FormControl, FormGroup } from '@angular/forms';
|
|
|
3
3
|
import { AutocompleteTypes, SelectInterface } from '@ionic/core';
|
|
4
4
|
import { CrudOperations } from '@decaf-ts/db-decorators';
|
|
5
5
|
import { NgxCrudFormField } from '../../engine/NgxCrudFormField';
|
|
6
|
-
import { FieldUpdateMode, PossibleInputTypes,
|
|
6
|
+
import { CrudFieldOption, FieldUpdateMode, PossibleInputTypes, StringOrBoolean } from '../../engine/types';
|
|
7
7
|
import * as i0 from "@angular/core";
|
|
8
8
|
/**
|
|
9
9
|
* @description A dynamic form field component for CRUD operations.
|
|
@@ -360,10 +360,10 @@ export declare class CrudFieldComponent extends NgxCrudFormField implements OnIn
|
|
|
360
360
|
* @summary Provides the list of options for select or radio inputs. Each option can have a value and a label.
|
|
361
361
|
* This is used to populate the dropdown or radio group with choices.
|
|
362
362
|
*
|
|
363
|
-
* @type {
|
|
363
|
+
* @type {CrudFieldOption[]}
|
|
364
364
|
* @memberOf CrudFieldComponent
|
|
365
365
|
*/
|
|
366
|
-
options:
|
|
366
|
+
options: CrudFieldOption[];
|
|
367
367
|
/**
|
|
368
368
|
* @description Mode of the field.
|
|
369
369
|
* @summary Specifies the visual mode of the field, such as 'ios' or 'md'.
|
|
@@ -530,6 +530,15 @@ export declare class CrudFieldComponent extends NgxCrudFormField implements OnIn
|
|
|
530
530
|
* @memberOf CrudFieldComponent
|
|
531
531
|
*/
|
|
532
532
|
get getActiveFormGroup(): FormGroup;
|
|
533
|
+
/**
|
|
534
|
+
* Returns a list of options for select or radio inputs, with their `text` property
|
|
535
|
+
* localized if it does not already include the word 'options'. The localization key
|
|
536
|
+
* is generated from the component's label, replacing 'label' with 'options'.
|
|
537
|
+
*
|
|
538
|
+
* @returns {CrudFieldOption[]} The array of parsed and localized options.
|
|
539
|
+
* @memberOf CrudFieldComponent
|
|
540
|
+
*/
|
|
541
|
+
get parsedOptions(): CrudFieldOption[];
|
|
533
542
|
/**
|
|
534
543
|
* @description Component initialization lifecycle method.
|
|
535
544
|
* @summary Initializes the field component based on the operation type and field configuration.
|
|
@@ -36,6 +36,17 @@ export declare class CrudFormComponent implements OnInit, IFormElement, OnDestro
|
|
|
36
36
|
* @memberOf CrudFormComponent
|
|
37
37
|
*/
|
|
38
38
|
model: Model | undefined;
|
|
39
|
+
/**
|
|
40
|
+
* @description The primary data model used for CRUD operations.
|
|
41
|
+
* @summary This input provides the main Model instance that the form interacts with for
|
|
42
|
+
* creating, reading, updating, or deleting records. It serves as the source of schema
|
|
43
|
+
* and validation rules for the form fields, and is required for most operations except
|
|
44
|
+
* for certain read or delete scenarios.
|
|
45
|
+
*
|
|
46
|
+
* @type {Model | undefined}
|
|
47
|
+
* @memberOf CrudFormComponent
|
|
48
|
+
*/
|
|
49
|
+
modelId: Model | undefined;
|
|
39
50
|
/**
|
|
40
51
|
* @description Field update trigger mode for form validation.
|
|
41
52
|
* @summary Determines when form field validation should be triggered. Options include
|
|
@@ -157,6 +168,30 @@ export declare class CrudFormComponent implements OnInit, IFormElement, OnDestro
|
|
|
157
168
|
* @memberOf CrudFormComponent
|
|
158
169
|
*/
|
|
159
170
|
uid: string;
|
|
171
|
+
/**
|
|
172
|
+
* @description Unique identifier for the current record instance.
|
|
173
|
+
* @summary This property holds a unique string value that identifies the specific record being managed by the form.
|
|
174
|
+
* It is automatically generated if not provided, ensuring each form instance has a distinct identifier.
|
|
175
|
+
* The uid is used for tracking, referencing, and emitting events related to the current record, and may be used
|
|
176
|
+
* in conjunction with the primary key for CRUD operations.
|
|
177
|
+
*
|
|
178
|
+
* @type {string}
|
|
179
|
+
* @default Randomly generated 12-character string
|
|
180
|
+
* @memberOf CrudFormComponent
|
|
181
|
+
*/
|
|
182
|
+
allowClear: boolean;
|
|
183
|
+
/**
|
|
184
|
+
* @description Reference to CRUD operation constants for template usage.
|
|
185
|
+
* @summary Exposes the OperationKeys enum to the component template, enabling
|
|
186
|
+
* conditional rendering and behavior based on operation types. This protected
|
|
187
|
+
* readonly property ensures that template logic can access operation constants
|
|
188
|
+
* while maintaining encapsulation and preventing accidental modification.
|
|
189
|
+
*
|
|
190
|
+
* @protected
|
|
191
|
+
* @readonly
|
|
192
|
+
* @memberOf CrudFormComponent
|
|
193
|
+
*/
|
|
194
|
+
protected readonly OperationKeys: typeof OperationKeys;
|
|
160
195
|
/**
|
|
161
196
|
* @description Event emitter for form submission events.
|
|
162
197
|
* @summary Emits CrudFormEvent objects when the form is submitted, providing
|
|
@@ -248,19 +283,6 @@ export declare class CrudFormComponent implements OnInit, IFormElement, OnDestro
|
|
|
248
283
|
* @memberOf CrudFormComponent
|
|
249
284
|
*/
|
|
250
285
|
handleDelete(): void;
|
|
251
|
-
/**
|
|
252
|
-
* @description Reference to CRUD operation constants for template usage.
|
|
253
|
-
* @summary Exposes the OperationKeys enum to the component template, enabling
|
|
254
|
-
* conditional rendering and behavior based on operation types. This protected
|
|
255
|
-
* readonly property ensures that template logic can access operation constants
|
|
256
|
-
* while maintaining encapsulation and preventing accidental modification.
|
|
257
|
-
*
|
|
258
|
-
* @type {CrudOperations}
|
|
259
|
-
* @protected
|
|
260
|
-
* @readonly
|
|
261
|
-
* @memberOf CrudFormComponent
|
|
262
|
-
*/
|
|
263
|
-
protected readonly OperationKeys: typeof OperationKeys;
|
|
264
286
|
static ɵfac: i0.ɵɵFactoryDeclaration<CrudFormComponent, never>;
|
|
265
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<CrudFormComponent, "ngx-decaf-crud-form", never, { "model": { "alias": "model"; "required": false; }; "updateOn": { "alias": "updateOn"; "required": false; }; "target": { "alias": "target"; "required": false; }; "method": { "alias": "method"; "required": false; }; "options": { "alias": "options"; "required": false; }; "action": { "alias": "action"; "required": false; }; "operation": { "alias": "operation"; "required": true; }; "handlers": { "alias": "handlers"; "required": false; }; "formGroup": { "alias": "formGroup"; "required": false; }; "childOf": { "alias": "childOf"; "required": false; }; "rendererId": { "alias": "rendererId"; "required": false; }; "uid": { "alias": "uid"; "required": false; }; }, { "submitEvent": "submitEvent"; }, never, ["*"], true, never>;
|
|
287
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CrudFormComponent, "ngx-decaf-crud-form", never, { "model": { "alias": "model"; "required": false; }; "modelId": { "alias": "modelId"; "required": false; }; "updateOn": { "alias": "updateOn"; "required": false; }; "target": { "alias": "target"; "required": false; }; "method": { "alias": "method"; "required": false; }; "options": { "alias": "options"; "required": false; }; "action": { "alias": "action"; "required": false; }; "operation": { "alias": "operation"; "required": true; }; "handlers": { "alias": "handlers"; "required": false; }; "formGroup": { "alias": "formGroup"; "required": false; }; "childOf": { "alias": "childOf"; "required": false; }; "rendererId": { "alias": "rendererId"; "required": false; }; "uid": { "alias": "uid"; "required": false; }; "allowClear": { "alias": "allowClear"; "required": false; }; }, { "submitEvent": "submitEvent"; }, never, ["*"], true, never>;
|
|
266
288
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { OnInit } from '@angular/core';
|
|
2
|
-
import { Color, PredefinedColors } from '@ionic/core';
|
|
3
2
|
import { StringOrBoolean } from '../../engine';
|
|
4
3
|
import { NgxBaseComponent } from '../../engine/NgxBaseComponent';
|
|
5
4
|
import { SafeHtml } from '@angular/platform-browser';
|
|
@@ -23,14 +22,14 @@ import * as i0 from "@angular/core";
|
|
|
23
22
|
* +StringOrBoolean showIcon
|
|
24
23
|
* +string icon
|
|
25
24
|
* +string iconSize
|
|
26
|
-
* +
|
|
25
|
+
* +string iconColor
|
|
27
26
|
* +string|Function buttonLink
|
|
28
27
|
* +string buttonText
|
|
29
28
|
* +string buttonFill
|
|
30
|
-
* +
|
|
29
|
+
* +string buttonColor
|
|
31
30
|
* +string buttonSize
|
|
32
31
|
* +string searchValue
|
|
33
|
-
* -
|
|
32
|
+
* -Router Router
|
|
34
33
|
* +ngOnInit()
|
|
35
34
|
* +handleClick()
|
|
36
35
|
* }
|
|
@@ -125,7 +124,7 @@ export declare class EmptyStateComponent extends NgxBaseComponent implements OnI
|
|
|
125
124
|
* @default 'medium'
|
|
126
125
|
* @memberOf EmptyStateComponent
|
|
127
126
|
*/
|
|
128
|
-
iconColor?:
|
|
127
|
+
iconColor?: string;
|
|
129
128
|
/**
|
|
130
129
|
* @description The navigation target or action for the button.
|
|
131
130
|
* @summary Specifies where the button should navigate to when clicked or what function
|
|
@@ -162,11 +161,11 @@ export declare class EmptyStateComponent extends NgxBaseComponent implements OnI
|
|
|
162
161
|
* @summary Specifies the color for the button using Ionic's color system.
|
|
163
162
|
* This allows the button to match the application's color scheme.
|
|
164
163
|
*
|
|
165
|
-
* @type {
|
|
164
|
+
* @type {string}
|
|
166
165
|
* @default 'primary'
|
|
167
166
|
* @memberOf EmptyStateComponent
|
|
168
167
|
*/
|
|
169
|
-
buttonColor:
|
|
168
|
+
buttonColor: string;
|
|
170
169
|
/**
|
|
171
170
|
* @description The size of the action button.
|
|
172
171
|
* @summary Controls the size of the button shown in the empty state.
|
|
@@ -193,10 +192,10 @@ export declare class EmptyStateComponent extends NgxBaseComponent implements OnI
|
|
|
193
192
|
* This service is used when the buttonLink is a string URL to navigate to that location.
|
|
194
193
|
*
|
|
195
194
|
* @private
|
|
196
|
-
* @type {
|
|
195
|
+
* @type {Router}
|
|
197
196
|
* @memberOf EmptyStateComponent
|
|
198
197
|
*/
|
|
199
|
-
private
|
|
198
|
+
private router;
|
|
200
199
|
private sanitizer;
|
|
201
200
|
private translate;
|
|
202
201
|
searchSubtitle: SafeHtml;
|
|
@@ -249,7 +248,7 @@ export declare class EmptyStateComponent extends NgxBaseComponent implements OnI
|
|
|
249
248
|
* sequenceDiagram
|
|
250
249
|
* participant U as User
|
|
251
250
|
* participant E as EmptyStateComponent
|
|
252
|
-
* participant N as
|
|
251
|
+
* participant N as Router
|
|
253
252
|
*
|
|
254
253
|
* U->>E: Click action button
|
|
255
254
|
* E->>E: handleClick()
|
|
@@ -324,6 +324,15 @@ export declare class FieldsetComponent extends NgxBaseComponent implements OnIni
|
|
|
324
324
|
* @memberOf FieldsetComponent
|
|
325
325
|
*/
|
|
326
326
|
buttonLabel: string;
|
|
327
|
+
/**
|
|
328
|
+
* @description Localized label text for action buttons.
|
|
329
|
+
* @summary Dynamic button label that changes based on the current operation mode.
|
|
330
|
+
* Shows "Cancel" for update operations
|
|
331
|
+
*
|
|
332
|
+
* @type {string}
|
|
333
|
+
* @memberOf FieldsetComponent
|
|
334
|
+
*/
|
|
335
|
+
buttonCancelLabel: string;
|
|
327
336
|
/**
|
|
328
337
|
* @description Component constructor that initializes the fieldset with icons and component name.
|
|
329
338
|
* @summary Calls the parent NgxBaseComponent constructor with the component name and
|
|
@@ -213,6 +213,15 @@ export declare class FilterComponent extends NgxBaseComponent implements OnInit,
|
|
|
213
213
|
* @memberOf FilterComponent
|
|
214
214
|
*/
|
|
215
215
|
windowResizeSubscription: Subscription;
|
|
216
|
+
/**
|
|
217
|
+
* @description Browsing mode (dark or light).
|
|
218
|
+
* @summary Indicates whether the dark mode theme is currently enabled.
|
|
219
|
+
* Defaults to `false`.
|
|
220
|
+
*
|
|
221
|
+
* @type {boolean}
|
|
222
|
+
* @memberOf FilterComponent
|
|
223
|
+
*/
|
|
224
|
+
isDarkMode: boolean;
|
|
216
225
|
/**
|
|
217
226
|
* @description Event emitter for filter changes.
|
|
218
227
|
* @summary Emits filter events when the user creates, modifies, or clears filters.
|
|
@@ -262,10 +271,10 @@ export declare class FilterComponent extends NgxBaseComponent implements OnInit,
|
|
|
262
271
|
* end
|
|
263
272
|
* F->>F: Call initialize()
|
|
264
273
|
*
|
|
265
|
-
* @returns {void}
|
|
274
|
+
* @returns {Promise<void>}
|
|
266
275
|
* @memberOf FilterComponent
|
|
267
276
|
*/
|
|
268
|
-
ngOnInit(): void
|
|
277
|
+
ngOnInit(): Promise<void>;
|
|
269
278
|
/**
|
|
270
279
|
* @description Retrieves and configures available indexes for filtering and sorting.
|
|
271
280
|
* @summary Extracts field indexes from the model if available and merges them with
|
|
@@ -260,7 +260,7 @@ export declare abstract class NgxBaseComponent implements OnChanges {
|
|
|
260
260
|
* @summary Stores the automatically derived locale based on the component's class name.
|
|
261
261
|
* This is determined during component initialization and serves as a fallback when no
|
|
262
262
|
* explicit locale is provided via the locale input property. The derivation is handled
|
|
263
|
-
* by the
|
|
263
|
+
* by the getLocaleContext utility function, which extracts a locale identifier
|
|
264
264
|
* from the component's class name.
|
|
265
265
|
*
|
|
266
266
|
* @type {string}
|
|
@@ -349,7 +349,7 @@ export declare abstract class NgxBaseComponent implements OnChanges {
|
|
|
349
349
|
* A->>C: new Component(instance)
|
|
350
350
|
* C->>B: super(instance)
|
|
351
351
|
* B->>B: Set componentName = instance
|
|
352
|
-
* B->>U:
|
|
352
|
+
* B->>U: getLocaleContext(instance)
|
|
353
353
|
* U-->>B: Return derived locale
|
|
354
354
|
* B->>B: Set componentLocale
|
|
355
355
|
* B->>L: getLogger(this)
|
|
@@ -358,7 +358,7 @@ export declare abstract class NgxBaseComponent implements OnChanges {
|
|
|
358
358
|
*
|
|
359
359
|
* @memberOf NgxBaseComponent
|
|
360
360
|
*/
|
|
361
|
-
protected constructor(instance: string
|
|
361
|
+
protected constructor(instance: string);
|
|
362
362
|
/**
|
|
363
363
|
* @description Getter for the repository instance.
|
|
364
364
|
* @summary Provides a connection to the data layer for retrieving and manipulating data.
|
|
@@ -374,42 +374,6 @@ export declare abstract class NgxBaseComponent implements OnChanges {
|
|
|
374
374
|
* @memberOf NgxBaseComponent
|
|
375
375
|
*/
|
|
376
376
|
protected get repository(): DecafRepository<Model>;
|
|
377
|
-
/**
|
|
378
|
-
* @description Parses and applies properties from the props object to the component instance.
|
|
379
|
-
* @summary This method iterates through the properties of the provided instance object
|
|
380
|
-
* and applies any matching properties from the component's props configuration to the
|
|
381
|
-
* component instance. This allows for dynamic property assignment based on configuration
|
|
382
|
-
* stored in the props object, enabling flexible component customization without requiring
|
|
383
|
-
* explicit property binding for every possible configuration option.
|
|
384
|
-
*
|
|
385
|
-
* The method performs a safe property assignment by checking if each key from the instance
|
|
386
|
-
* exists in the props object before applying it. This prevents accidental property
|
|
387
|
-
* overwriting and ensures only intended properties are modified.
|
|
388
|
-
*
|
|
389
|
-
* @param {KeyValue} instance - The component instance object to process
|
|
390
|
-
* @return {void}
|
|
391
|
-
*
|
|
392
|
-
* @mermaid
|
|
393
|
-
* sequenceDiagram
|
|
394
|
-
* participant C as Component
|
|
395
|
-
* participant B as NgxBaseComponent
|
|
396
|
-
* participant P as Props Object
|
|
397
|
-
*
|
|
398
|
-
* C->>B: parseProps(instance)
|
|
399
|
-
* B->>B: Get Object.keys(instance)
|
|
400
|
-
* loop For each key in instance
|
|
401
|
-
* B->>P: Check if key exists in this.props
|
|
402
|
-
* alt Key exists in props
|
|
403
|
-
* B->>B: Set this[key] = this.props[key]
|
|
404
|
-
* else Key not in props
|
|
405
|
-
* Note over B: Skip this key
|
|
406
|
-
* end
|
|
407
|
-
* end
|
|
408
|
-
*
|
|
409
|
-
* @protected
|
|
410
|
-
* @memberOf NgxBaseComponent
|
|
411
|
-
*/
|
|
412
|
-
protected parseProps(instance: KeyValue): void;
|
|
413
377
|
/**
|
|
414
378
|
* @description Handles changes to component inputs
|
|
415
379
|
* @summary This Angular lifecycle hook is called when input properties change.
|
|
@@ -536,6 +500,42 @@ export declare abstract class NgxBaseComponent implements OnChanges {
|
|
|
536
500
|
* @memberOf NgxBaseComponent
|
|
537
501
|
*/
|
|
538
502
|
trackItemFn(index: number, item: KeyValue | string | number): string | number;
|
|
503
|
+
/**
|
|
504
|
+
* @description Parses and applies properties from the props object to the component instance.
|
|
505
|
+
* @summary This method iterates through the properties of the provided instance object
|
|
506
|
+
* and applies any matching properties from the component's props configuration to the
|
|
507
|
+
* component instance. This allows for dynamic property assignment based on configuration
|
|
508
|
+
* stored in the props object, enabling flexible component customization without requiring
|
|
509
|
+
* explicit property binding for every possible configuration option.
|
|
510
|
+
*
|
|
511
|
+
* The method performs a safe property assignment by checking if each key from the instance
|
|
512
|
+
* exists in the props object before applying it. This prevents accidental property
|
|
513
|
+
* overwriting and ensures only intended properties are modified.
|
|
514
|
+
*
|
|
515
|
+
* @param {KeyValue} instance - The component instance object to process
|
|
516
|
+
* @return {void}
|
|
517
|
+
*
|
|
518
|
+
* @mermaid
|
|
519
|
+
* sequenceDiagram
|
|
520
|
+
* participant C as Component
|
|
521
|
+
* participant B as NgxBaseComponent
|
|
522
|
+
* participant P as Props Object
|
|
523
|
+
*
|
|
524
|
+
* C->>B: parseProps(instance)
|
|
525
|
+
* B->>B: Get Object.keys(instance)
|
|
526
|
+
* loop For each key in instance
|
|
527
|
+
* B->>P: Check if key exists in this.props
|
|
528
|
+
* alt Key exists in props
|
|
529
|
+
* B->>B: Set this[key] = this.props[key]
|
|
530
|
+
* else Key not in props
|
|
531
|
+
* Note over B: Skip this key
|
|
532
|
+
* end
|
|
533
|
+
* end
|
|
534
|
+
*
|
|
535
|
+
* @protected
|
|
536
|
+
* @memberOf NgxBaseComponent
|
|
537
|
+
*/
|
|
538
|
+
protected parseProps(instance: KeyValue): void;
|
|
539
539
|
static ɵfac: i0.ɵɵFactoryDeclaration<NgxBaseComponent, never>;
|
|
540
540
|
static ɵcmp: i0.ɵɵComponentDeclaration<NgxBaseComponent, "ng-component", never, { "rendererId": { "alias": "rendererId"; "required": false; }; "model": { "alias": "model"; "required": false; }; "props": { "alias": "props"; "required": false; }; "item": { "alias": "item"; "required": false; }; "pk": { "alias": "pk"; "required": false; }; "route": { "alias": "route"; "required": false; }; "operations": { "alias": "operations"; "required": false; }; "uid": { "alias": "uid"; "required": false; }; "mapper": { "alias": "mapper"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "translatable": { "alias": "translatable"; "required": false; }; "className": { "alias": "className"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "renderChild": { "alias": "renderChild"; "required": false; }; }, { "listenEvent": "listenEvent"; }, never, never, true, never>;
|
|
541
541
|
}
|
|
@@ -3,6 +3,7 @@ import { PossibleInputTypes } from './types';
|
|
|
3
3
|
import { CrudOperations } from '@decaf-ts/db-decorators';
|
|
4
4
|
import { ControlValueAccessor, FormControl, FormGroup } from '@angular/forms';
|
|
5
5
|
import { ElementRef } from '@angular/core';
|
|
6
|
+
import { TranslateService } from '@ngx-translate/core';
|
|
6
7
|
/**
|
|
7
8
|
* @class NgxCrudFormField
|
|
8
9
|
* @implements {FieldProperties}
|
|
@@ -52,7 +53,7 @@ export declare abstract class NgxCrudFormField implements ControlValueAccessor,
|
|
|
52
53
|
greaterThanOrEqual?: string;
|
|
53
54
|
value: string | number | Date;
|
|
54
55
|
multiple: boolean;
|
|
55
|
-
|
|
56
|
+
protected translateService: TranslateService;
|
|
56
57
|
private validationErrorEventDispateched;
|
|
57
58
|
/**
|
|
58
59
|
* @summary Parent HTML element
|
|
@@ -39,35 +39,63 @@ import { ComponentMirror, ComponentRef, Injector, TemplateRef, Type, ViewContain
|
|
|
39
39
|
*/
|
|
40
40
|
export declare class NgxRenderingEngine extends RenderingEngine<AngularFieldDefinition, AngularDynamicOutput> {
|
|
41
41
|
/**
|
|
42
|
-
* @description Registry of
|
|
43
|
-
* @summary Static registry that
|
|
44
|
-
*
|
|
42
|
+
* @description Registry of components available for rendering
|
|
43
|
+
* @summary Static registry that stores all registered components indexed by their selector name.
|
|
44
|
+
* Each component entry contains a constructor reference that can be used to instantiate
|
|
45
|
+
* the component during the rendering process. This registry is shared across all instances
|
|
46
|
+
* of the rendering engine and is populated through the registerComponent method.
|
|
47
|
+
*
|
|
48
|
+
* @private
|
|
49
|
+
* @static
|
|
45
50
|
* @type {Record<string, { constructor: Constructor<unknown> }>}
|
|
46
51
|
*/
|
|
47
52
|
private static _components;
|
|
48
53
|
/**
|
|
49
|
-
* @description
|
|
50
|
-
* @summary Stores the
|
|
51
|
-
*
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
*
|
|
56
|
-
* @
|
|
54
|
+
* @description Currently active model being rendered
|
|
55
|
+
* @summary Stores a reference to the model instance that is currently being processed
|
|
56
|
+
* by the rendering engine. This property is set during the render method execution
|
|
57
|
+
* and is used throughout the rendering lifecycle to access model data and metadata.
|
|
58
|
+
* The definite assignment assertion (!) is used because this property is always
|
|
59
|
+
* initialized before use within the render method.
|
|
60
|
+
*
|
|
61
|
+
* @private
|
|
57
62
|
* @type {Model}
|
|
58
63
|
*/
|
|
59
64
|
private _model;
|
|
65
|
+
/**
|
|
66
|
+
* @description Current operation context for component visibility control
|
|
67
|
+
* @summary Static property that stores the current operation being performed,
|
|
68
|
+
* which is used to determine component visibility through the 'hidden' property.
|
|
69
|
+
* Components can specify operations where they should be hidden, and this property
|
|
70
|
+
* provides the context for those visibility checks. The value is typically extracted
|
|
71
|
+
* from the global properties during the rendering process.
|
|
72
|
+
*
|
|
73
|
+
* @private
|
|
74
|
+
* @static
|
|
75
|
+
* @type {string | undefined}
|
|
76
|
+
*/
|
|
60
77
|
private static _operation;
|
|
61
78
|
/**
|
|
62
|
-
* @description
|
|
63
|
-
* @summary
|
|
79
|
+
* @description Reference to the currently active component instance
|
|
80
|
+
* @summary Static property that maintains a reference to the most recently created
|
|
81
|
+
* component instance. This is used internally for component lifecycle management
|
|
82
|
+
* and can be cleared through the destroy method. The reference allows access to
|
|
83
|
+
* the active component instance for operations that need to interact with the
|
|
84
|
+
* currently rendered component.
|
|
85
|
+
*
|
|
86
|
+
* @private
|
|
87
|
+
* @static
|
|
64
88
|
* @type {Type<unknown> | undefined}
|
|
65
89
|
*/
|
|
66
90
|
private static _instance;
|
|
67
91
|
/**
|
|
68
|
-
* @description
|
|
69
|
-
* @summary Initializes the rendering engine
|
|
70
|
-
* This constructor sets up the base
|
|
92
|
+
* @description Constructs a new NgxRenderingEngine instance
|
|
93
|
+
* @summary Initializes a new instance of the Angular rendering engine by calling the parent
|
|
94
|
+
* constructor with the 'angular' engine type identifier. This constructor sets up the base
|
|
95
|
+
* rendering engine functionality with Angular-specific configurations and prepares the
|
|
96
|
+
* instance for component registration and rendering operations.
|
|
97
|
+
*
|
|
98
|
+
* @constructor
|
|
71
99
|
*/
|
|
72
100
|
constructor();
|
|
73
101
|
/**
|
package/engine/interfaces.d.ts
CHANGED
|
@@ -259,3 +259,13 @@ export interface BaseCustomEvent {
|
|
|
259
259
|
data?: unknown;
|
|
260
260
|
target?: HTMLElement;
|
|
261
261
|
}
|
|
262
|
+
/**
|
|
263
|
+
* Configuration for internationalization (i18n) resource file paths.
|
|
264
|
+
*
|
|
265
|
+
* @property prefix - The prefix to be used for the resource file path.
|
|
266
|
+
* @property suffix - The suffix to be appended to the resource file path.
|
|
267
|
+
*/
|
|
268
|
+
export interface I18nResourceConfig {
|
|
269
|
+
prefix: string;
|
|
270
|
+
suffix: string;
|
|
271
|
+
}
|
package/engine/types.d.ts
CHANGED
|
@@ -106,6 +106,14 @@ export type AngularFieldDefinition = Omit<IonInput, 'ionInput' | 'ionFocus' | 'i
|
|
|
106
106
|
* @memberOf module:engine
|
|
107
107
|
*/
|
|
108
108
|
export type StringOrBoolean = 'true' | 'false' | boolean;
|
|
109
|
+
/**
|
|
110
|
+
* @description Option type for CRUD field inputs
|
|
111
|
+
* @summary Represents a union type that can be either a SelectOption or RadioOption.
|
|
112
|
+
* This is used for defining options in form fields that support both select and radio input types.
|
|
113
|
+
* @typedef {(SelectOption|RadioOption)} CrudFieldOption
|
|
114
|
+
* @memberOf module:engine
|
|
115
|
+
*/
|
|
116
|
+
export type CrudFieldOption = SelectOption | RadioOption;
|
|
109
117
|
/**
|
|
110
118
|
* @description Option type for select inputs
|
|
111
119
|
* @summary Extends the InputOption interface with a selected property to indicate
|