@unifylib/ui-lib 1.2.16 → 1.2.17

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.
Files changed (84) hide show
  1. package/cli/client-app-component-guide.md +166 -166
  2. package/cli/generators/dashboard.js +147 -147
  3. package/cli/generators/form-screen.js +95 -95
  4. package/cli/generators/line-editor.js +110 -110
  5. package/cli/generators/permission-matrix.js +115 -115
  6. package/cli/generators/section-form.js +103 -103
  7. package/cli/generators/table-screen.js +181 -181
  8. package/cli/index.js +185 -185
  9. package/cli/utils.js +228 -228
  10. package/esm2022/iq-ui-lib.mjs +5 -0
  11. package/esm2022/lib/base-model/SearchStrConfig.mjs +1 -1
  12. package/esm2022/lib/base-model/api-response.mjs +1 -1
  13. package/esm2022/lib/base-model/audit-log-entry.mjs +1 -1
  14. package/esm2022/lib/base-model/button-action-settings.mjs +1 -1
  15. package/esm2022/lib/base-model/column-def.model.mjs +1 -1
  16. package/esm2022/lib/base-model/do-action-request.mjs +1 -1
  17. package/esm2022/lib/base-model/field-action.mjs +1 -1
  18. package/esm2022/lib/base-model/field-filter.model.mjs +1 -1
  19. package/esm2022/lib/base-model/field-info.mjs +1 -1
  20. package/esm2022/lib/base-model/field-predicate.model.mjs +1 -1
  21. package/esm2022/lib/base-model/filter-request.mjs +1 -1
  22. package/esm2022/lib/base-model/filter.model.mjs +1 -1
  23. package/esm2022/lib/base-model/get-items-list.mjs +1 -1
  24. package/esm2022/lib/base-model/index.mjs +1 -1
  25. package/esm2022/lib/base-model/items-total.model.mjs +1 -1
  26. package/esm2022/lib/base-model/line-item.model.mjs +1 -1
  27. package/esm2022/lib/base-model/lookupItem.mjs +1 -1
  28. package/esm2022/lib/base-model/page-info.mjs +1 -1
  29. package/esm2022/lib/base-model/permission-matrix.model.mjs +1 -1
  30. package/esm2022/lib/base-model/report-request.model.mjs +1 -1
  31. package/esm2022/lib/base-model/response-envelop.model.mjs +1 -1
  32. package/esm2022/lib/base-model/snack-message.model.mjs +1 -1
  33. package/esm2022/lib/base-model/table-column.interface.mjs +1 -1
  34. package/esm2022/lib/base-model/table-page-user-action.interface.mjs +1 -1
  35. package/esm2022/lib/base-model/workflow/workflow-steps.model.mjs +1 -1
  36. package/esm2022/lib/base-model/workflow/workflow.model.mjs +1 -1
  37. package/esm2022/lib/components/action-comment/action-comment.component.mjs +3 -3
  38. package/esm2022/lib/components/action-confirmation/action-confirmation.component.mjs +3 -3
  39. package/esm2022/lib/components/activity-report-form/activity-report-form.component.mjs +3 -3
  40. package/esm2022/lib/components/advanced-filter/field-filter/field-filter.component.mjs +3 -3
  41. package/esm2022/lib/components/advanced-filter/filter-builder/filter-builder.component.mjs +3 -3
  42. package/esm2022/lib/components/audit-log-details-dialog/audit-log-details-dialog.component.mjs +3 -3
  43. package/esm2022/lib/components/auto-complete/auto-complete.component.mjs +3 -3
  44. package/esm2022/lib/components/base-form/base-form.component.mjs +3 -3
  45. package/esm2022/lib/components/base-form-canvas/MaxDigitsDirective.mjs +1 -1
  46. package/esm2022/lib/components/base-form-canvas/NumbersOnlyDirective.mjs +1 -1
  47. package/esm2022/lib/components/base-form-canvas/base-form-canvas.component.mjs +3 -3
  48. package/esm2022/lib/components/base-input-dialog/base-input-dialog.component.mjs +3 -3
  49. package/esm2022/lib/components/base-table/base-table.component.mjs +3 -3
  50. package/esm2022/lib/components/button-actions/button-actions.component.mjs +3 -3
  51. package/esm2022/lib/components/editable-base-table/editable-base-table.component.mjs +3 -3
  52. package/esm2022/lib/components/equation-builder/equation-builder.component.mjs +3 -3
  53. package/esm2022/lib/components/item-line-editor/item-line-editor.component.mjs +3 -3
  54. package/esm2022/lib/components/multi-auto-complete/multi-auto-complete.component.mjs +3 -3
  55. package/esm2022/lib/components/paginator/paginator.component.mjs +3 -3
  56. package/esm2022/lib/components/permission-matrix/permission-matrix.component.mjs +3 -3
  57. package/esm2022/lib/components/report-details-dialog/report-details-dialog.component.mjs +3 -3
  58. package/esm2022/lib/components/report-form/report-form.component.mjs +3 -3
  59. package/esm2022/lib/components/search-bar/search-bar.component.mjs +3 -3
  60. package/esm2022/lib/components/section-form-canvas/section-form-canvas.component.mjs +3 -3
  61. package/esm2022/lib/components/shared/action-button/action-button.component.mjs +3 -3
  62. package/esm2022/lib/components/shared/action-card/action-card.component.mjs +3 -3
  63. package/esm2022/lib/components/shared/attachment-uploader/attachment-uploader.component.mjs +3 -3
  64. package/esm2022/lib/components/shared-list/shared-list.component.mjs +3 -3
  65. package/esm2022/lib/components/snackbar-static/snackbar-static.component.mjs +3 -3
  66. package/esm2022/lib/components/title-bar/title-bar.component.mjs +3 -3
  67. package/esm2022/lib/directives/phone-number-only.directive.mjs +1 -1
  68. package/esm2022/lib/services/backend-service.mjs +1 -1
  69. package/esm2022/lib/services/index.mjs +1 -1
  70. package/esm2022/lib/services/top-panel.mjs +1 -1
  71. package/esm2022/lib/services/trigger-form.service.mjs +1 -1
  72. package/esm2022/lib/utils/base-utils.mjs +1 -1
  73. package/esm2022/lib/validators/date-range-validator.mjs +1 -1
  74. package/esm2022/lib/validators/index.mjs +1 -1
  75. package/esm2022/lib/validators/match-list.validator.mjs +1 -1
  76. package/esm2022/lib/validators/multi-email-validator.mjs +1 -1
  77. package/esm2022/public-api.mjs +1 -1
  78. package/fesm2022/iq-ui-lib.mjs +7059 -0
  79. package/fesm2022/iq-ui-lib.mjs.map +1 -0
  80. package/index.d.ts +1 -1
  81. package/package.json +14 -6
  82. package/esm2022/unifylib-ui-lib.mjs +0 -5
  83. package/fesm2022/unifylib-ui-lib.mjs +0 -7059
  84. package/fesm2022/unifylib-ui-lib.mjs.map +0 -1
@@ -1,103 +1,103 @@
1
- "use strict";
2
-
3
- const { buildFieldInfoLines } = require("../utils");
4
-
5
- /**
6
- * @param {{
7
- * kebab: string,
8
- * pascal: string,
9
- * labelsSection: string,
10
- * apiUri: string,
11
- * importPath: string,
12
- * fieldsCount: number,
13
- * }} ctx
14
- */
15
- function generate(ctx) {
16
- const fileBase = ctx.kebab;
17
- const fieldsBlock = buildFieldInfoLines(ctx.fieldsCount, 2, " ");
18
-
19
- const settings = `import { Validators } from "@angular/forms";
20
- import { FieldInfo, PageInfo } from "${ctx.importPath}";
21
-
22
- export const PAGE_INFO: PageInfo = {
23
- id: "${ctx.kebab}",
24
- labelsSection: "${ctx.labelsSection}",
25
- hasAddButton: false,
26
- apiUri: "${ctx.apiUri}",
27
- draftSupported: false,
28
- selfRouting: true,
29
- };
30
-
31
- export const FIELDS: FieldInfo[] = [
32
- ${fieldsBlock}
33
- ];
34
- `;
35
-
36
- const componentTs = `import { ChangeDetectionStrategy, Component } from "@angular/core";
37
- import { FormGroup, ReactiveFormsModule } from "@angular/forms";
38
- import { TranslateModule } from "@ngx-translate/core";
39
- import { SectionFormCanvasComponent } from "${ctx.importPath}";
40
- import { FIELDS, PAGE_INFO } from "./${fileBase}.settings";
41
-
42
- @Component({
43
- selector: "app-${fileBase}",
44
- standalone: true,
45
- imports: [SectionFormCanvasComponent, ReactiveFormsModule, TranslateModule],
46
- templateUrl: "./${fileBase}.component.html",
47
- styleUrls: ["./${fileBase}.component.scss"],
48
- changeDetection: ChangeDetectionStrategy.OnPush,
49
- })
50
- export class ${ctx.pascal}Component {
51
- readonly pageInfo = PAGE_INFO;
52
- readonly fields = FIELDS;
53
- item: Record<string, unknown> = {};
54
- editable = true;
55
- form: FormGroup | null = null;
56
- readonly sectionKey = 1;
57
-
58
- onFormEdit(form: FormGroup): void {
59
- this.form = form;
60
- }
61
- }
62
- `;
63
-
64
- const componentHtml = `<lib-section-form-canvas
65
- [pageInfo]="pageInfo"
66
- [fields]="fields"
67
- [editable]="editable"
68
- [item]="item"
69
- [title]="'sectionTitle'"
70
- [isTranslateTitle]="true"
71
- [key]="sectionKey"
72
- (formEdit)="onFormEdit($event)">
73
- </lib-section-form-canvas>
74
- `;
75
-
76
- const componentScss = `:host {
77
- display: block;
78
- }
79
-
80
- .location-card {
81
- margin-bottom: 1rem;
82
- }
83
- `;
84
-
85
- return [
86
- { relative: `${fileBase}.settings.ts`, content: settings },
87
- { relative: `${fileBase}.component.ts`, content: componentTs },
88
- { relative: `${fileBase}.component.html`, content: componentHtml },
89
- { relative: `${fileBase}.component.scss`, content: componentScss },
90
- ];
91
- }
92
-
93
- function getTranslations(ctx) {
94
- const out = {
95
- [`${ctx.labelsSection}.sectionTitle`]: `${ctx.pascal} Section`,
96
- };
97
- for (let i = 1; i <= ctx.fieldsCount; i++) {
98
- out[`${ctx.labelsSection}.field${i}`] = `Field ${i}`;
99
- }
100
- return out;
101
- }
102
-
103
- module.exports = { generate, getTranslations };
1
+ "use strict";
2
+
3
+ const { buildFieldInfoLines } = require("../utils");
4
+
5
+ /**
6
+ * @param {{
7
+ * kebab: string,
8
+ * pascal: string,
9
+ * labelsSection: string,
10
+ * apiUri: string,
11
+ * importPath: string,
12
+ * fieldsCount: number,
13
+ * }} ctx
14
+ */
15
+ function generate(ctx) {
16
+ const fileBase = ctx.kebab;
17
+ const fieldsBlock = buildFieldInfoLines(ctx.fieldsCount, 2, " ");
18
+
19
+ const settings = `import { Validators } from "@angular/forms";
20
+ import { FieldInfo, PageInfo } from "${ctx.importPath}";
21
+
22
+ export const PAGE_INFO: PageInfo = {
23
+ id: "${ctx.kebab}",
24
+ labelsSection: "${ctx.labelsSection}",
25
+ hasAddButton: false,
26
+ apiUri: "${ctx.apiUri}",
27
+ draftSupported: false,
28
+ selfRouting: true,
29
+ };
30
+
31
+ export const FIELDS: FieldInfo[] = [
32
+ ${fieldsBlock}
33
+ ];
34
+ `;
35
+
36
+ const componentTs = `import { ChangeDetectionStrategy, Component } from "@angular/core";
37
+ import { FormGroup, ReactiveFormsModule } from "@angular/forms";
38
+ import { TranslateModule } from "@ngx-translate/core";
39
+ import { SectionFormCanvasComponent } from "${ctx.importPath}";
40
+ import { FIELDS, PAGE_INFO } from "./${fileBase}.settings";
41
+
42
+ @Component({
43
+ selector: "app-${fileBase}",
44
+ standalone: true,
45
+ imports: [SectionFormCanvasComponent, ReactiveFormsModule, TranslateModule],
46
+ templateUrl: "./${fileBase}.component.html",
47
+ styleUrls: ["./${fileBase}.component.scss"],
48
+ changeDetection: ChangeDetectionStrategy.OnPush,
49
+ })
50
+ export class ${ctx.pascal}Component {
51
+ readonly pageInfo = PAGE_INFO;
52
+ readonly fields = FIELDS;
53
+ item: Record<string, unknown> = {};
54
+ editable = true;
55
+ form: FormGroup | null = null;
56
+ readonly sectionKey = 1;
57
+
58
+ onFormEdit(form: FormGroup): void {
59
+ this.form = form;
60
+ }
61
+ }
62
+ `;
63
+
64
+ const componentHtml = `<lib-section-form-canvas
65
+ [pageInfo]="pageInfo"
66
+ [fields]="fields"
67
+ [editable]="editable"
68
+ [item]="item"
69
+ [title]="'sectionTitle'"
70
+ [isTranslateTitle]="true"
71
+ [key]="sectionKey"
72
+ (formEdit)="onFormEdit($event)">
73
+ </lib-section-form-canvas>
74
+ `;
75
+
76
+ const componentScss = `:host {
77
+ display: block;
78
+ }
79
+
80
+ .location-card {
81
+ margin-bottom: 1rem;
82
+ }
83
+ `;
84
+
85
+ return [
86
+ { relative: `${fileBase}.settings.ts`, content: settings },
87
+ { relative: `${fileBase}.component.ts`, content: componentTs },
88
+ { relative: `${fileBase}.component.html`, content: componentHtml },
89
+ { relative: `${fileBase}.component.scss`, content: componentScss },
90
+ ];
91
+ }
92
+
93
+ function getTranslations(ctx) {
94
+ const out = {
95
+ [`${ctx.labelsSection}.sectionTitle`]: `${ctx.pascal} Section`,
96
+ };
97
+ for (let i = 1; i <= ctx.fieldsCount; i++) {
98
+ out[`${ctx.labelsSection}.field${i}`] = `Field ${i}`;
99
+ }
100
+ return out;
101
+ }
102
+
103
+ module.exports = { generate, getTranslations };
@@ -1,181 +1,181 @@
1
- "use strict";
2
-
3
- /**
4
- * @param {{
5
- * kebab: string,
6
- * pascal: string,
7
- * labelsSection: string,
8
- * apiUri: string,
9
- * importPath: string,
10
- * }} ctx
11
- */
12
- function generate(ctx) {
13
- const fileBase = ctx.kebab;
14
-
15
- const settings = `import { Validators } from "@angular/forms";
16
- import {
17
- ButtonActionSettings,
18
- FieldInfo,
19
- FilterRequest,
20
- PageInfo,
21
- ReportRequest,
22
- TableColumn,
23
- } from "${ctx.importPath}";
24
-
25
- export const PAGE_INFO: PageInfo = {
26
- id: "${ctx.kebab}",
27
- labelsSection: "${ctx.labelsSection}",
28
- hasAddButton: true,
29
- apiUri: "${ctx.apiUri}",
30
- selfRouting: true,
31
- listRoutePath: "/${ctx.kebab}",
32
- draftSupported: true,
33
- pageSize: 10,
34
- };
35
-
36
- export const COLUMNS: TableColumn<Record<string, unknown>>[] = [
37
- { property: "id", type: "text", enableSorting: true, visible: true, label: "id" },
38
- { property: "name", type: "text", enableSorting: true, visible: true, label: "name" },
39
- ];
40
-
41
- export const FILTER_FIELDS: FieldInfo[] = [
42
- new FieldInfo({
43
- property: "name",
44
- row: 1,
45
- type: "text",
46
- label: "name",
47
- advancedFilter: true,
48
- filterOperator: "LIKE",
49
- validators: [Validators.maxLength(30)],
50
- maxLength: 30,
51
- } as FieldInfo),
52
- ];
53
-
54
- function buildReportRequest(): ReportRequest {
55
- const filterRequest = new FilterRequest(PAGE_INFO.pageSize ?? 10);
56
- filterRequest.columns = COLUMNS.filter((c) => c.visible !== false).map((c) => c.property);
57
- return new ReportRequest({ filterRequest });
58
- }
59
-
60
- export const REPORT_REQUEST: ReportRequest = buildReportRequest();
61
-
62
- export const LIST_ACTIONS: ButtonActionSettings[] = [
63
- new ButtonActionSettings({
64
- key: 1,
65
- id: "view",
66
- label: "VIEW",
67
- linkHref: (row: unknown) => {
68
- const id = (row as { id?: number }).id;
69
- return id != null ? \`/${ctx.kebab}/view/\${id}\` : undefined;
70
- },
71
- } as ButtonActionSettings),
72
- ];
73
-
74
- export const TOOLBAR_ACTIONS: ButtonActionSettings[] = [
75
- new ButtonActionSettings({
76
- key: 1,
77
- id: "create",
78
- label: "ADD_NEW",
79
- linkHref: "/${ctx.kebab}/new",
80
- } as ButtonActionSettings),
81
- ];
82
- `;
83
-
84
- const componentTs = `import { ChangeDetectionStrategy, Component, inject } from "@angular/core";
85
- import { Router } from "@angular/router";
86
- import { TranslateModule } from "@ngx-translate/core";
87
- import {
88
- BaseTableComponent,
89
- ButtonActionSettings,
90
- Filter,
91
- } from "${ctx.importPath}";
92
- import {
93
- COLUMNS,
94
- FILTER_FIELDS,
95
- LIST_ACTIONS,
96
- PAGE_INFO,
97
- REPORT_REQUEST,
98
- TOOLBAR_ACTIONS,
99
- } from "./${fileBase}.settings";
100
-
101
- @Component({
102
- selector: "app-${fileBase}",
103
- standalone: true,
104
- imports: [BaseTableComponent, TranslateModule],
105
- templateUrl: "./${fileBase}.component.html",
106
- styleUrls: ["./${fileBase}.component.scss"],
107
- changeDetection: ChangeDetectionStrategy.OnPush,
108
- })
109
- export class ${ctx.pascal}Component {
110
- private readonly router = inject(Router);
111
-
112
- readonly pageInfo = PAGE_INFO;
113
- readonly columnsDefinition = COLUMNS;
114
- readonly filterFieldDefinitions = FILTER_FIELDS;
115
- readonly reportRequest = REPORT_REQUEST;
116
- readonly filters: Filter[] = [];
117
- readonly listActions = LIST_ACTIONS;
118
- readonly toolbarActions = TOOLBAR_ACTIONS;
119
- readonly isPending = false;
120
-
121
- onListActionClicked(event: {
122
- action: ButtonActionSettings;
123
- row: unknown;
124
- isPending: boolean;
125
- }): void {
126
- const href =
127
- typeof event.action.linkHref === "function"
128
- ? event.action.linkHref(event.row)
129
- : event.action.linkHref;
130
- if (href) {
131
- void this.router.navigateByUrl(href);
132
- }
133
- }
134
-
135
- onToolbarButton(action: ButtonActionSettings): void {
136
- if (typeof action.linkHref === "string") {
137
- void this.router.navigateByUrl(action.linkHref);
138
- }
139
- }
140
- }
141
- `;
142
-
143
- const componentHtml = `<app-base-table
144
- [pageInfo]="pageInfo"
145
- [columns]="columnsDefinition"
146
- [reportRequest]="reportRequest"
147
- [filterFields]="filterFieldDefinitions"
148
- [isPending]="isPending"
149
- [filters]="filters"
150
- [listAction]="listActions"
151
- [extraActions]="toolbarActions"
152
- [buttonsDisplayMode]="'list'"
153
- (listActionClicked)="onListActionClicked($event)"
154
- (buttonClicked)="onToolbarButton($event)">
155
- </app-base-table>
156
- `;
157
-
158
- const componentScss = `:host {
159
- display: block;
160
- }
161
- `;
162
-
163
- return [
164
- { relative: `${fileBase}.settings.ts`, content: settings },
165
- { relative: `${fileBase}.component.ts`, content: componentTs },
166
- { relative: `${fileBase}.component.html`, content: componentHtml },
167
- { relative: `${fileBase}.component.scss`, content: componentScss },
168
- ];
169
- }
170
-
171
- function getTranslations(ctx) {
172
- return {
173
- [`${ctx.labelsSection}.list_title`]: `${ctx.pascal} List`,
174
- [`${ctx.labelsSection}.id`]: "ID",
175
- [`${ctx.labelsSection}.name`]: "Name",
176
- VIEW: "View",
177
- ADD_NEW: "Add new",
178
- };
179
- }
180
-
181
- module.exports = { generate, getTranslations };
1
+ "use strict";
2
+
3
+ /**
4
+ * @param {{
5
+ * kebab: string,
6
+ * pascal: string,
7
+ * labelsSection: string,
8
+ * apiUri: string,
9
+ * importPath: string,
10
+ * }} ctx
11
+ */
12
+ function generate(ctx) {
13
+ const fileBase = ctx.kebab;
14
+
15
+ const settings = `import { Validators } from "@angular/forms";
16
+ import {
17
+ ButtonActionSettings,
18
+ FieldInfo,
19
+ FilterRequest,
20
+ PageInfo,
21
+ ReportRequest,
22
+ TableColumn,
23
+ } from "${ctx.importPath}";
24
+
25
+ export const PAGE_INFO: PageInfo = {
26
+ id: "${ctx.kebab}",
27
+ labelsSection: "${ctx.labelsSection}",
28
+ hasAddButton: true,
29
+ apiUri: "${ctx.apiUri}",
30
+ selfRouting: true,
31
+ listRoutePath: "/${ctx.kebab}",
32
+ draftSupported: true,
33
+ pageSize: 10,
34
+ };
35
+
36
+ export const COLUMNS: TableColumn<Record<string, unknown>>[] = [
37
+ { property: "id", type: "text", enableSorting: true, visible: true, label: "id" },
38
+ { property: "name", type: "text", enableSorting: true, visible: true, label: "name" },
39
+ ];
40
+
41
+ export const FILTER_FIELDS: FieldInfo[] = [
42
+ new FieldInfo({
43
+ property: "name",
44
+ row: 1,
45
+ type: "text",
46
+ label: "name",
47
+ advancedFilter: true,
48
+ filterOperator: "LIKE",
49
+ validators: [Validators.maxLength(30)],
50
+ maxLength: 30,
51
+ } as FieldInfo),
52
+ ];
53
+
54
+ function buildReportRequest(): ReportRequest {
55
+ const filterRequest = new FilterRequest(PAGE_INFO.pageSize ?? 10);
56
+ filterRequest.columns = COLUMNS.filter((c) => c.visible !== false).map((c) => c.property);
57
+ return new ReportRequest({ filterRequest });
58
+ }
59
+
60
+ export const REPORT_REQUEST: ReportRequest = buildReportRequest();
61
+
62
+ export const LIST_ACTIONS: ButtonActionSettings[] = [
63
+ new ButtonActionSettings({
64
+ key: 1,
65
+ id: "view",
66
+ label: "VIEW",
67
+ linkHref: (row: unknown) => {
68
+ const id = (row as { id?: number }).id;
69
+ return id != null ? \`/${ctx.kebab}/view/\${id}\` : undefined;
70
+ },
71
+ } as ButtonActionSettings),
72
+ ];
73
+
74
+ export const TOOLBAR_ACTIONS: ButtonActionSettings[] = [
75
+ new ButtonActionSettings({
76
+ key: 1,
77
+ id: "create",
78
+ label: "ADD_NEW",
79
+ linkHref: "/${ctx.kebab}/new",
80
+ } as ButtonActionSettings),
81
+ ];
82
+ `;
83
+
84
+ const componentTs = `import { ChangeDetectionStrategy, Component, inject } from "@angular/core";
85
+ import { Router } from "@angular/router";
86
+ import { TranslateModule } from "@ngx-translate/core";
87
+ import {
88
+ BaseTableComponent,
89
+ ButtonActionSettings,
90
+ Filter,
91
+ } from "${ctx.importPath}";
92
+ import {
93
+ COLUMNS,
94
+ FILTER_FIELDS,
95
+ LIST_ACTIONS,
96
+ PAGE_INFO,
97
+ REPORT_REQUEST,
98
+ TOOLBAR_ACTIONS,
99
+ } from "./${fileBase}.settings";
100
+
101
+ @Component({
102
+ selector: "app-${fileBase}",
103
+ standalone: true,
104
+ imports: [BaseTableComponent, TranslateModule],
105
+ templateUrl: "./${fileBase}.component.html",
106
+ styleUrls: ["./${fileBase}.component.scss"],
107
+ changeDetection: ChangeDetectionStrategy.OnPush,
108
+ })
109
+ export class ${ctx.pascal}Component {
110
+ private readonly router = inject(Router);
111
+
112
+ readonly pageInfo = PAGE_INFO;
113
+ readonly columnsDefinition = COLUMNS;
114
+ readonly filterFieldDefinitions = FILTER_FIELDS;
115
+ readonly reportRequest = REPORT_REQUEST;
116
+ readonly filters: Filter[] = [];
117
+ readonly listActions = LIST_ACTIONS;
118
+ readonly toolbarActions = TOOLBAR_ACTIONS;
119
+ readonly isPending = false;
120
+
121
+ onListActionClicked(event: {
122
+ action: ButtonActionSettings;
123
+ row: unknown;
124
+ isPending: boolean;
125
+ }): void {
126
+ const href =
127
+ typeof event.action.linkHref === "function"
128
+ ? event.action.linkHref(event.row)
129
+ : event.action.linkHref;
130
+ if (href) {
131
+ void this.router.navigateByUrl(href);
132
+ }
133
+ }
134
+
135
+ onToolbarButton(action: ButtonActionSettings): void {
136
+ if (typeof action.linkHref === "string") {
137
+ void this.router.navigateByUrl(action.linkHref);
138
+ }
139
+ }
140
+ }
141
+ `;
142
+
143
+ const componentHtml = `<app-base-table
144
+ [pageInfo]="pageInfo"
145
+ [columns]="columnsDefinition"
146
+ [reportRequest]="reportRequest"
147
+ [filterFields]="filterFieldDefinitions"
148
+ [isPending]="isPending"
149
+ [filters]="filters"
150
+ [listAction]="listActions"
151
+ [extraActions]="toolbarActions"
152
+ [buttonsDisplayMode]="'list'"
153
+ (listActionClicked)="onListActionClicked($event)"
154
+ (buttonClicked)="onToolbarButton($event)">
155
+ </app-base-table>
156
+ `;
157
+
158
+ const componentScss = `:host {
159
+ display: block;
160
+ }
161
+ `;
162
+
163
+ return [
164
+ { relative: `${fileBase}.settings.ts`, content: settings },
165
+ { relative: `${fileBase}.component.ts`, content: componentTs },
166
+ { relative: `${fileBase}.component.html`, content: componentHtml },
167
+ { relative: `${fileBase}.component.scss`, content: componentScss },
168
+ ];
169
+ }
170
+
171
+ function getTranslations(ctx) {
172
+ return {
173
+ [`${ctx.labelsSection}.list_title`]: `${ctx.pascal} List`,
174
+ [`${ctx.labelsSection}.id`]: "ID",
175
+ [`${ctx.labelsSection}.name`]: "Name",
176
+ VIEW: "View",
177
+ ADD_NEW: "Add new",
178
+ };
179
+ }
180
+
181
+ module.exports = { generate, getTranslations };