@decaf-ts/for-angular 0.0.11 → 0.0.13

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 (85) hide show
  1. package/package.json +19 -91
  2. package/LICENSE.md +0 -659
  3. package/dist/lib/README.md +0 -92
  4. package/dist/lib/assets/i18n/en.json +0 -140
  5. package/dist/lib/assets/images/angular-logo.svg +0 -45
  6. package/dist/lib/assets/images/decaf-logo-black.svg +0 -22
  7. package/dist/lib/assets/images/decaf-logo-lw.svg +0 -50
  8. package/dist/lib/assets/images/decaf-logo-white.svg +0 -22
  9. package/dist/lib/assets/images/decaf-logo.svg +0 -54
  10. package/dist/lib/components/component-renderer/component-renderer.component.d.ts +0 -276
  11. package/dist/lib/components/crud-field/crud-field.component.d.ts +0 -445
  12. package/dist/lib/components/crud-form/constants.d.ts +0 -5
  13. package/dist/lib/components/crud-form/crud-form.component.d.ts +0 -102
  14. package/dist/lib/components/crud-form/types.d.ts +0 -17
  15. package/dist/lib/components/empty-state/empty-state.component.d.ts +0 -301
  16. package/dist/lib/components/fieldset/fieldset.component.d.ts +0 -199
  17. package/dist/lib/components/filter/filter.component.d.ts +0 -505
  18. package/dist/lib/components/for-angular-components.module.d.ts +0 -20
  19. package/dist/lib/components/index.d.ts +0 -16
  20. package/dist/lib/components/layout/layout.component.d.ts +0 -133
  21. package/dist/lib/components/list/constants.d.ts +0 -29
  22. package/dist/lib/components/list/list.component.d.ts +0 -849
  23. package/dist/lib/components/list-item/list-item.component.d.ts +0 -390
  24. package/dist/lib/components/model-renderer/model-renderer.component.d.ts +0 -96
  25. package/dist/lib/components/pagination/constants.d.ts +0 -7
  26. package/dist/lib/components/pagination/pagination.component.d.ts +0 -264
  27. package/dist/lib/components/searchbar/searchbar.component.d.ts +0 -407
  28. package/dist/lib/directives/collapsable.directive.d.ts +0 -8
  29. package/dist/lib/directives/index.d.ts +0 -1
  30. package/dist/lib/engine/DynamicModule.d.ts +0 -17
  31. package/dist/lib/engine/NgxBaseComponent.d.ts +0 -541
  32. package/dist/lib/engine/NgxCrudFormField.d.ts +0 -118
  33. package/dist/lib/engine/NgxFormService.d.ts +0 -167
  34. package/dist/lib/engine/NgxRenderingEngine.d.ts +0 -127
  35. package/dist/lib/engine/NgxRenderingEngine2.d.ts +0 -250
  36. package/dist/lib/engine/ValidatorFactory.d.ts +0 -15
  37. package/dist/lib/engine/constants.d.ts +0 -151
  38. package/dist/lib/engine/decorators.d.ts +0 -25
  39. package/dist/lib/engine/index.d.ts +0 -16
  40. package/dist/lib/engine/types.d.ts +0 -381
  41. package/dist/lib/esm2022/components/component-renderer/component-renderer.component.mjs +0 -313
  42. package/dist/lib/esm2022/components/crud-field/crud-field.component.mjs +0 -301
  43. package/dist/lib/esm2022/components/crud-form/constants.mjs +0 -14
  44. package/dist/lib/esm2022/components/crud-form/crud-form.component.mjs +0 -139
  45. package/dist/lib/esm2022/components/crud-form/types.mjs +0 -2
  46. package/dist/lib/esm2022/components/empty-state/empty-state.component.mjs +0 -348
  47. package/dist/lib/esm2022/components/fieldset/fieldset.component.mjs +0 -225
  48. package/dist/lib/esm2022/components/filter/filter.component.mjs +0 -689
  49. package/dist/lib/esm2022/components/for-angular-components.module.mjs +0 -71
  50. package/dist/lib/esm2022/components/index.mjs +0 -20
  51. package/dist/lib/esm2022/components/layout/layout.component.mjs +0 -176
  52. package/dist/lib/esm2022/components/list/constants.mjs +0 -6
  53. package/dist/lib/esm2022/components/list/list.component.mjs +0 -1236
  54. package/dist/lib/esm2022/components/list-item/list-item.component.mjs +0 -408
  55. package/dist/lib/esm2022/components/model-renderer/model-renderer.component.mjs +0 -138
  56. package/dist/lib/esm2022/components/pagination/constants.mjs +0 -2
  57. package/dist/lib/esm2022/components/pagination/pagination.component.mjs +0 -323
  58. package/dist/lib/esm2022/components/searchbar/searchbar.component.mjs +0 -493
  59. package/dist/lib/esm2022/decaf-ts-for-angular.mjs +0 -5
  60. package/dist/lib/esm2022/directives/collapsable.directive.mjs +0 -28
  61. package/dist/lib/esm2022/directives/index.mjs +0 -2
  62. package/dist/lib/esm2022/engine/DynamicModule.mjs +0 -18
  63. package/dist/lib/esm2022/engine/NgxBaseComponent.mjs +0 -539
  64. package/dist/lib/esm2022/engine/NgxCrudFormField.mjs +0 -125
  65. package/dist/lib/esm2022/engine/NgxFormService.mjs +0 -315
  66. package/dist/lib/esm2022/engine/NgxRenderingEngine.mjs +0 -192
  67. package/dist/lib/esm2022/engine/NgxRenderingEngine2.mjs +0 -332
  68. package/dist/lib/esm2022/engine/ValidatorFactory.mjs +0 -102
  69. package/dist/lib/esm2022/engine/constants.mjs +0 -160
  70. package/dist/lib/esm2022/engine/decorators.mjs +0 -38
  71. package/dist/lib/esm2022/engine/index.mjs +0 -17
  72. package/dist/lib/esm2022/engine/types.mjs +0 -4
  73. package/dist/lib/esm2022/for-angular.module.mjs +0 -118
  74. package/dist/lib/esm2022/helpers/index.mjs +0 -13
  75. package/dist/lib/esm2022/helpers/utils.mjs +0 -415
  76. package/dist/lib/esm2022/interfaces.mjs +0 -2
  77. package/dist/lib/esm2022/public-apis.mjs +0 -14
  78. package/dist/lib/fesm2022/decaf-ts-for-angular.mjs +0 -7109
  79. package/dist/lib/fesm2022/decaf-ts-for-angular.mjs.map +0 -1
  80. package/dist/lib/for-angular.module.d.ts +0 -45
  81. package/dist/lib/helpers/index.d.ts +0 -12
  82. package/dist/lib/helpers/utils.d.ts +0 -253
  83. package/dist/lib/index.d.ts +0 -5
  84. package/dist/lib/interfaces.d.ts +0 -28
  85. package/dist/lib/public-apis.d.ts +0 -13
@@ -1,849 +0,0 @@
1
- import { OnInit, EventEmitter, OnDestroy } from '@angular/core';
2
- import { InfiniteScrollCustomEvent, RefresherCustomEvent, SpinnerTypes } from '@ionic/angular';
3
- import { OperationKeys } from '@decaf-ts/db-decorators';
4
- import { Model } from '@decaf-ts/decorator-validation';
5
- import { Condition, OrderDirection, Paginator } from '@decaf-ts/core';
6
- import { BaseCustomEvent, RendererCustomEvent, StringOrBoolean, KeyValue, ListItemCustomEvent } from '../../engine';
7
- import { NgxBaseComponent } from '../../engine/NgxBaseComponent';
8
- import { PaginationCustomEvent } from '../pagination/constants';
9
- import { IListEmptyResult, ListComponentsTypes } from './constants';
10
- import { FunctionLike, IFilterQuery } from '../../engine/types';
11
- import * as i0 from "@angular/core";
12
- /**
13
- * @description A versatile list component that supports various data display modes.
14
- * @summary This component provides a flexible way to display lists of data with support
15
- * for infinite scrolling, pagination, searching, and custom item rendering. It can fetch
16
- * data from various sources including models, functions, or direct data input.
17
- *
18
- * The component supports two main display types:
19
- * 1. Infinite scrolling - Loads more data as the user scrolls
20
- * 2. Pagination - Displays data in pages with navigation controls
21
- *
22
- * Additional features include:
23
- * - Pull-to-refresh functionality
24
- * - Search filtering
25
- * - Empty state customization
26
- * - Custom item rendering
27
- * - Event emission for interactions
28
- *
29
- * @mermaid
30
- * sequenceDiagram
31
- * participant U as User
32
- * participant L as ListComponent
33
- * participant D as Data Source
34
- * participant E as External Components
35
- *
36
- * U->>L: Initialize component
37
- * L->>L: ngOnInit()
38
- * L->>D: Request initial data
39
- * D-->>L: Return data
40
- * L->>L: Process and display data
41
- *
42
- * alt User scrolls (Infinite mode)
43
- * U->>L: Scroll to bottom
44
- * L->>D: Request more data
45
- * D-->>L: Return additional data
46
- * L->>L: Append to existing data
47
- * else User changes page (Paginated mode)
48
- * U->>L: Click page number
49
- * L->>L: handlePaginate()
50
- * L->>D: Request data for page
51
- * D-->>L: Return page data
52
- * L->>L: Replace displayed data
53
- * end
54
- *
55
- * alt User searches
56
- * U->>L: Enter search term
57
- * L->>L: handleSearch()
58
- * L->>D: Filter data by search term
59
- * D-->>L: Return filtered data
60
- * L->>L: Update displayed data
61
- * end
62
- *
63
- * alt User clicks item
64
- * U->>L: Click list item
65
- * L->>L: handleClick()
66
- * L->>E: Emit clickEvent
67
- * end
68
- *
69
- * @example
70
- * <ngx-decaf-list
71
- * [source]="dataSource"
72
- * [limit]="10"
73
- * [type]="'infinite'"
74
- * [showSearchbar]="true"
75
- * (clickEvent)="handleItemClick($event)"
76
- * (refreshEvent)="handleRefresh($event)">
77
- * </ngx-decaf-list>
78
- *
79
- * @extends {NgxBaseComponent}
80
- * @implements {OnInit}
81
- */
82
- export declare class ListComponent extends NgxBaseComponent implements OnInit, OnDestroy {
83
- /**
84
- * @description The display mode for the list component.
85
- * @summary Determines how the list data is loaded and displayed. Options include:
86
- * - INFINITE: Loads more data as the user scrolls (infinite scrolling)
87
- * - PAGINATED: Displays data in pages with navigation controls
88
- *
89
- * @type {ListComponentsTypes}
90
- * @default ListComponentsTypes.INFINITE
91
- * @memberOf ListComponent
92
- */
93
- type: ListComponentsTypes;
94
- /**
95
- * @description Controls whether the component uses translation services.
96
- * @summary When set to true, the component will attempt to use translation services
97
- * for any text content. This allows for internationalization of the list component.
98
- *
99
- * @type {StringOrBoolean}
100
- * @default true
101
- * @memberOf ListComponent
102
- */
103
- translatable: StringOrBoolean;
104
- /**
105
- * @description Controls the visibility of the search bar.
106
- * @summary When set to true, displays a search bar at the top of the list that allows
107
- * users to filter the list items. The search functionality works by filtering the
108
- * existing data or by triggering a new data fetch with search parameters.
109
- *
110
- * @type {StringOrBoolean}
111
- * @default true
112
- * @memberOf ListComponent
113
- */
114
- showSearchbar: StringOrBoolean;
115
- /**
116
- * @description Direct data input for the list component.
117
- * @summary Provides a way to directly pass data to the list component instead of
118
- * fetching it from a source. When both data and source are provided, the component
119
- * will use the source to fetch data only if the data array is empty.
120
- *
121
- * @type {KeyValue[] | undefined}
122
- * @default undefined
123
- * @memberOf ListComponent
124
- */
125
- data?: KeyValue[] | undefined;
126
- /**
127
- * @description The data source for the list component.
128
- * @summary Specifies where the list should fetch its data from. This can be either:
129
- * - A string URL or endpoint identifier
130
- * - A function that returns data when called
131
- * The component will call this source when it needs to load or refresh data.
132
- *
133
- * @type {string | FunctionLike}
134
- * @required
135
- * @memberOf ListComponent
136
- */
137
- source: string | FunctionLike;
138
- /**
139
- * @description The starting index for data fetching.
140
- * @summary Specifies the index from which to start fetching data. This is used
141
- * for pagination and infinite scrolling to determine which subset of data to load.
142
- *
143
- * @type {number}
144
- * @default 0
145
- * @memberOf ListComponent
146
- */
147
- start: number;
148
- /**
149
- * @description The number of items to fetch per page or load operation.
150
- * @summary Determines how many items are loaded at once during pagination or
151
- * infinite scrolling. This affects the size of data chunks requested from the source.
152
- *
153
- * @type {number}
154
- * @default 10
155
- * @memberOf ListComponent
156
- */
157
- limit: number;
158
- /**
159
- * @description Controls whether more data can be loaded.
160
- * @summary When set to true, the component will allow loading additional data
161
- * through infinite scrolling or pagination. When false, the component will not
162
- * attempt to load more data beyond what is initially displayed.
163
- *
164
- * @type {StringOrBoolean}
165
- * @default true
166
- * @memberOf ListComponent
167
- */
168
- loadMoreData: StringOrBoolean;
169
- /**
170
- * @description The style of dividing lines between list items.
171
- * @summary Determines how dividing lines appear between list items. Options include:
172
- * - "inset": Lines are inset from the edges
173
- * - "full": Lines extend the full width
174
- * - "none": No dividing lines
175
- *
176
- * @type {"inset" | "full" | "none"}
177
- * @default "full"
178
- * @memberOf ListComponent
179
- */
180
- lines: "inset" | "full" | "none";
181
- /**
182
- * @description Controls whether the list has inset styling.
183
- * @summary When set to true, the list will have inset styling with rounded corners
184
- * and margin around the edges. This creates a card-like appearance for the list.
185
- *
186
- * @type {StringOrBoolean}
187
- * @default false
188
- * @memberOf ListComponent
189
- */
190
- inset: StringOrBoolean;
191
- /**
192
- * @description The threshold for triggering infinite scroll loading.
193
- * @summary Specifies how close to the bottom of the list the user must scroll
194
- * before the component triggers loading of additional data. This is expressed
195
- * as a percentage of the list height.
196
- *
197
- * @type {string}
198
- * @default "15%"
199
- * @memberOf ListComponent
200
- */
201
- scrollThreshold: string;
202
- /**
203
- * @description The position where new items are added during infinite scrolling.
204
- * @summary Determines whether new items are added to the top or bottom of the list
205
- * when loading more data through infinite scrolling.
206
- *
207
- * @type {"bottom" | "top"}
208
- * @default "bottom"
209
- * @memberOf ListComponent
210
- */
211
- scrollPosition: "bottom" | "top";
212
- /**
213
- * @description Custom text to display during loading operations.
214
- * @summary Specifies the text shown in the loading indicator when the component
215
- * is fetching data. If not provided, a default loading message will be used.
216
- *
217
- * @type {string | undefined}
218
- * @memberOf ListComponent
219
- */
220
- loadingText?: string;
221
- /**
222
- * @description Controls the visibility of the pull-to-refresh feature.
223
- * @summary When set to true, enables the pull-to-refresh functionality that allows
224
- * users to refresh the list data by pulling down from the top of the list.
225
- *
226
- * @type {StringOrBoolean}
227
- * @default true
228
- * @memberOf ListComponent
229
- */
230
- showRefresher: StringOrBoolean;
231
- /**
232
- * @description The type of spinner to display during loading operations.
233
- * @summary Specifies the visual style of the loading spinner shown during data
234
- * fetching operations. Uses Ionic's predefined spinner types.
235
- *
236
- * @type {SpinnerTypes}
237
- * @default "circular"
238
- * @memberOf ListComponent
239
- */
240
- loadingSpinner: SpinnerTypes;
241
- /**
242
- * @description Controls whether the filtering functionality is enabled.
243
- * @summary When set to true, enables the filter component that allows users to create
244
- * complex search criteria with multiple field filters, conditions, and values.
245
- * When false, disables the filter interface entirely.
246
- *
247
- * @type {StringOrBoolean}
248
- * @default true
249
- * @memberOf ListComponent
250
- */
251
- enableFilter: StringOrBoolean;
252
- /**
253
- * @description Sorting parameters for data fetching.
254
- * @summary Specifies how the fetched data should be sorted. This can be provided
255
- * as a string (field name with optional direction) or a direct object.
256
- *
257
- * @type {string | KeyValue | undefined}
258
- * @memberOf ListComponent
259
- */
260
- sortDirection: OrderDirection;
261
- /**
262
- * @description Sorting parameters for data fetching.
263
- * @summary Specifies how the fetched data should be sorted. This can be provided
264
- * as a string (field name with optional direction) or a direct object.
265
- *
266
- * @type {string | KeyValue | undefined}
267
- * @memberOf ListComponent
268
- */
269
- sortBy: string;
270
- /**
271
- * @description Controls whether sorting functionality is disabled.
272
- * @summary When set to true, disables the sort controls and prevents users from
273
- * changing the sort order or field. The list will maintain its default or
274
- * programmatically set sort configuration without user interaction.
275
- *
276
- * @type {StringOrBoolean}
277
- * @default false
278
- * @memberOf ListComponent
279
- */
280
- disableSort: StringOrBoolean;
281
- /**
282
- * @description Icon to display when the list is empty.
283
- * @summary Specifies the icon shown in the empty state when no data is available.
284
- * This can be any icon name supported by the application's icon system.
285
- *
286
- * @type {string | undefined}
287
- * @default 'ti-database-exclamation'
288
- * @memberOf ListComponent
289
- */
290
- emptyIcon?: string;
291
- /**
292
- * @description Configuration for the empty state display.
293
- * @summary Customizes how the empty state is displayed when no data is available.
294
- * This includes the title, subtitle, button text, icon, and navigation link.
295
- *
296
- * @type {Partial<IListEmptyResult>}
297
- * @default {
298
- * title: 'empty.title',
299
- * subtitle: 'empty.subtitle',
300
- * showButton: false,
301
- * icon: 'alert-circle-outline',
302
- * buttonText: 'locale.empty.button',
303
- * link: ''
304
- * }
305
- * @memberOf ListComponent
306
- */
307
- empty: Partial<IListEmptyResult>;
308
- /**
309
- * @description The current page number in paginated mode.
310
- * @summary Tracks which page is currently being displayed when the component
311
- * is in paginated mode. This is used for pagination controls and data fetching.
312
- *
313
- * @type {number}
314
- * @default 1
315
- * @memberOf ListComponent
316
- */
317
- page: number;
318
- /**
319
- * @description The total number of pages available.
320
- * @summary Stores the calculated total number of pages based on the data size
321
- * and limit. This is used for pagination controls and boundary checking.
322
- *
323
- * @type {number}
324
- * @memberOf ListComponent
325
- */
326
- pages: number;
327
- /**
328
- * @description Indicates whether a refresh operation is in progress.
329
- * @summary When true, the component is currently fetching new data. This is used
330
- * to control loading indicators and prevent duplicate refresh operations from
331
- * being triggered simultaneously.
332
- *
333
- * @type {boolean}
334
- * @default false
335
- * @memberOf ListComponent
336
- */
337
- refreshing: boolean;
338
- /**
339
- * @description Array used for rendering skeleton loading placeholders.
340
- * @summary Contains placeholder items that are displayed during data loading.
341
- * The length of this array determines how many skeleton items are shown.
342
- *
343
- * @type {string[]}
344
- * @default new Array(2)
345
- * @memberOf ListComponent
346
- */
347
- skeletonData: string[];
348
- /**
349
- * @description The processed list items ready for display.
350
- * @summary Stores the current set of items being displayed in the list after
351
- * processing from the raw data source. This may be a subset of the full data
352
- * when using pagination or infinite scrolling.
353
- *
354
- * @type {KeyValue[]}
355
- * @memberOf ListComponent
356
- */
357
- items: KeyValue[];
358
- /**
359
- * @description The current search query value.
360
- * @summary Stores the text entered in the search bar. This is used to filter
361
- * the list data or to send as a search parameter when fetching new data.
362
- *
363
- * @type {string | undefined}
364
- * @memberOf ListComponent
365
- */
366
- searchValue?: string | IFilterQuery | undefined;
367
- /**
368
- * @description A paginator object for handling pagination operations.
369
- * @summary Provides a paginator object that can be used to retrieve and navigate
370
- * through data in chunks, reducing memory usage and improving performance.
371
- *
372
- * The paginator object is initialized in the `ngOnInit` lifecycle hook and is
373
- * used to fetch and display data in the pagination component. It is an instance
374
- * of the `Paginator` class from the `@decaf-ts/core` package, which provides
375
- * methods for querying and manipulating paginated data.
376
- *
377
- * @type {Paginator<Model>}
378
- * @memberOf PaginationComponent
379
- */
380
- paginator: Paginator<Model> | undefined;
381
- /**
382
- * @description The last page number that was displayed.
383
- * @summary Keeps track of the previously displayed page number, which is useful
384
- * for handling navigation and search operations in paginated mode.
385
- *
386
- * @type {number}
387
- * @default 1
388
- * @memberOf ListComponent
389
- */
390
- lastPage: number;
391
- /**
392
- * @description Event emitter for refresh operations.
393
- * @summary Emits an event when the list data is refreshed, either through pull-to-refresh
394
- * or programmatic refresh. The event includes the refreshed data and component information.
395
- *
396
- * @type {EventEmitter<BaseCustomEvent>}
397
- * @memberOf ListComponent
398
- */
399
- refreshEvent: EventEmitter<BaseCustomEvent>;
400
- /**
401
- * @description Event emitter for item click interactions.
402
- * @summary Emits an event when a list item is clicked. The event includes the data
403
- * of the clicked item, allowing parent components to respond to the interaction.
404
- *
405
- * @type {EventEmitter<KeyValue>}
406
- * @memberOf ListComponent
407
- */
408
- clickEvent: EventEmitter<ListItemCustomEvent | RendererCustomEvent>;
409
- /**
410
- * @description Subject for debouncing click events.
411
- * @summary Uses RxJS Subject to collect click events and emit them after a debounce
412
- * period. This prevents multiple rapid clicks from triggering multiple events.
413
- *
414
- * @private
415
- * @type {Subject<CustomEvent | ListItemCustomEvent | RendererCustomEvent>}
416
- * @memberOf ListComponent
417
- */
418
- private clickItemSubject;
419
- /**
420
- * @description Subject for debouncing repository observation events.
421
- * @summary RxJS Subject that collects repository change events and emits them after
422
- * a debounce period. This prevents multiple rapid repository changes from triggering
423
- * multiple list refresh operations, improving performance and user experience.
424
- *
425
- * @private
426
- * @type {Subject<any>}
427
- * @memberOf ListComponent
428
- */
429
- private observerSubjet;
430
- /**
431
- * @description Observer object for repository change notifications.
432
- * @summary Implements the Observer interface to receive notifications when the
433
- * underlying data repository changes. This enables automatic list updates when
434
- * data is created, updated, or deleted through the repository.
435
- *
436
- * @private
437
- * @type {Observer}
438
- * @memberOf ListComponent
439
- */
440
- private observer;
441
- /**
442
- * @description List of available indexes for data querying and filtering.
443
- * @summary Provides a list of index names that can be used to optimize data querying and filtering
444
- * operations, especially in scenarios with large datasets.
445
- *
446
- * Indexes can significantly improve the performance of data retrieval by allowing the database
447
- * to quickly locate and retrieve relevant data based on indexed fields.
448
- *
449
- * @type {string[]}
450
- * @default []
451
- * @memberOf ListComponent
452
- */
453
- indexes: string[];
454
- /**
455
- * @description Initializes a new instance of the ListComponent.
456
- * @summary Creates a new ListComponent and sets up the base component with the appropriate
457
- * component name. This constructor is called when Angular instantiates the component and
458
- * before any input properties are set. It passes the component name to the parent class
459
- * constructor to enable proper localization and component identification.
460
- *
461
- * The constructor is intentionally minimal, with most initialization logic deferred to
462
- * the ngOnInit lifecycle hook. This follows Angular best practices by keeping the constructor
463
- * focused on dependency injection and basic setup, while complex initialization that depends
464
- * on input properties is handled in ngOnInit.
465
- *
466
- * @memberOf ListComponent
467
- */
468
- constructor();
469
- /**
470
- * @description Initializes the component after Angular sets the input properties.
471
- * @summary Sets up the component by initializing event subscriptions, processing boolean
472
- * inputs, and loading the initial data. This method prepares the component for user
473
- * interaction by ensuring all properties are properly initialized and data is loaded.
474
- *
475
- * @returns {Promise<void>}
476
- *
477
- * @mermaid
478
- * sequenceDiagram
479
- * participant A as Angular Lifecycle
480
- * participant L as ListComponent
481
- * participant D as Data Source
482
- *
483
- * A->>L: ngOnInit()
484
- * L->>L: Set up click event debouncing
485
- * L->>L: Process boolean inputs
486
- * L->>L: Configure component based on inputs
487
- * L->>L: refresh()
488
- * L->>D: Request initial data
489
- * D-->>L: Return data
490
- * L->>L: Process and display data
491
- * L->>L: Configure empty state if needed
492
- * L->>L: initialize()
493
- *
494
- * @memberOf ListComponent
495
- */
496
- ngOnInit(): Promise<void>;
497
- /**
498
- * @description Cleans up resources when the component is destroyed.
499
- * @summary Performs cleanup operations when the component is being removed from the DOM.
500
- * This includes clearing references to models and data to prevent memory leaks.
501
- *
502
- * @returns {void}
503
- * @memberOf ListComponent
504
- */
505
- ngOnDestroy(): void;
506
- /**
507
- * @description Handles repository observation events with debouncing.
508
- * @summary Processes repository change notifications and routes them appropriately.
509
- * For CREATE events with a UID, handles them immediately. For other events,
510
- * passes them to the debounced observer subject to prevent excessive updates.
511
- *
512
- * @param {...unknown[]} args - The repository event arguments including table, event type, and UID
513
- * @returns {Promise<void>}
514
- * @memberOf ListComponent
515
- */
516
- observeRepository(...args: unknown[]): Promise<void>;
517
- /**
518
- * @description Handles specific repository events and updates the list accordingly.
519
- * @summary Processes repository change events (CREATE, UPDATE, DELETE) and performs
520
- * the appropriate list operations. This includes adding new items, updating existing
521
- * ones, or removing deleted items from the list display.
522
- *
523
- * @param {string} table - The table/model name that changed
524
- * @param {OperationKeys} event - The type of operation (CREATE, UPDATE, DELETE)
525
- * @param {string | number} uid - The unique identifier of the affected item
526
- * @returns {Promise<void>}
527
- * @memberOf ListComponent
528
- */
529
- handleObserveEvent(table: string, event: OperationKeys, uid: string | number): Promise<void>;
530
- /**
531
- * @description Function for tracking items in the list.
532
- * @summary Provides a tracking function for the `*ngFor` directive in the component template.
533
- * This function is used to identify and control the rendering of items in the list,
534
- * preventing duplicate or unnecessary rendering.
535
- *
536
- * The `trackItemFn` function takes two parameters: `index` (the index of the item in the list)
537
- * and `item` (the actual item from the list). It returns the tracking key, which in this case
538
- * is the union of the `uid` of the item with the model name.
539
- *
540
- * @param {number} index - The index of the item in the list.
541
-
542
- * @param {KeyValue | string | number} item - The actual item from the list.
543
- * @returns {string | number} The tracking key for the item.
544
- * @memberOf ListComponent
545
- */
546
- trackItemFn(index: number, item: KeyValue | string | number): string | number;
547
- /**
548
- * Handles the create event from the repository.
549
- *
550
- * @param {string | number} uid - The ID of the item to create.
551
- * @returns {Promise<void>} A promise that resolves when the item is created and added to the list.
552
- */
553
- handleCreate(uid: string | number): Promise<void>;
554
- /**
555
- * @description Handles the update event from the repository.
556
- * @summary Updates the list item with the specified ID based on the new data.
557
- *
558
- * @param {string | number} uid - The ID of the item to update
559
- * @returns {Promise<void>}
560
- * @private
561
- * @memberOf ListComponent
562
- */
563
- handleUpdate(uid: string | number): Promise<void>;
564
- /**
565
- * @description Removes an item from the list by ID.
566
- * @summary Filters out an item with the specified ID from the data array and
567
- * refreshes the list display. This is typically used after a delete operation.
568
- *
569
- * @param {string} uid - The ID of the item to delete
570
- * @param {string} pk - The primary key field name
571
- * @returns {Promise<void>}
572
- *
573
- * @memberOf ListComponent
574
- */
575
- handleDelete(uid: string | number, pk?: string): void;
576
- /**
577
- * @description Handles click events from list items.
578
- * @summary Listens for global ListItemClickEvent events and passes them to the
579
- * debounced click subject. This allows the component to respond to clicks on
580
- * list items regardless of where they originate from.
581
- *
582
- * @param {ListItemCustomEvent | RendererCustomEvent} event - The click event
583
- * @returns {void}
584
- *
585
- * @memberOf ListComponent
586
- */
587
- handleClick(event: ListItemCustomEvent | RendererCustomEvent): void;
588
- /**
589
- * @description Handles search events from the search bar.
590
- * @summary Processes search queries from the search bar component, updating the
591
- * displayed data based on the search term. The behavior differs between infinite
592
- * and paginated modes to provide the best user experience for each mode.
593
- *
594
- * @param {string | undefined} value - The search term or undefined to clear search
595
- * @returns {Promise<void>}
596
- *
597
- * @mermaid
598
- * flowchart TD
599
- * A[Search Event] --> B{Type is Infinite?}
600
- * B -->|Yes| C[Disable loadMoreData]
601
- * B -->|No| D[Enable loadMoreData]
602
- * C --> E{Search value undefined?}
603
- * E -->|Yes| F[Enable loadMoreData]
604
- * E -->|No| G[Store search value]
605
- * D --> G
606
- * F --> H[Reset page to 1]
607
- * G --> I[Refresh data]
608
- * H --> I
609
- *
610
- * @memberOf ListComponent
611
- */
612
- handleSearch(value: string | IFilterQuery | undefined): Promise<void>;
613
- /**
614
- * @description Handles filter events from the filter component.
615
- * @summary Processes filter queries from the filter component and applies them
616
- * to the list data. This method acts as a bridge between the filter component
617
- * and the search functionality, converting filter queries into search operations.
618
- *
619
- * @param {IFilterQuery | undefined} value - The filter query object or undefined to clear filters
620
- * @returns {Promise<void>}
621
- * @memberOf ListComponent
622
- */
623
- handleFilter(value: IFilterQuery | undefined): Promise<void>;
624
- /**
625
- * @description Clears the current search and resets the list.
626
- * @summary Convenience method that clears the search by calling handleSearch
627
- * with undefined. This resets the list to show all data without filtering.
628
- *
629
- * @returns {Promise<void>}
630
- * @memberOf ListComponent
631
- */
632
- clearSearch(): Promise<void>;
633
- /**
634
- * @description Emits a refresh event with the current data.
635
- * @summary Creates and emits a refresh event containing the current list data.
636
- * This notifies parent components that the list data has been refreshed.
637
- *
638
- * @param {KeyValue[]} [data] - Optional data to include in the event
639
- * @returns {void}
640
- *
641
- * @memberOf ListComponent
642
- */
643
- refreshEventEmit(data?: KeyValue[]): void;
644
- /**
645
- * @description Emits a click event for a list item.
646
- * @summary Processes and emits a click event when a list item is clicked.
647
- * This extracts the relevant data from the event and passes it to parent components.
648
- *
649
- * @private
650
- * @param {ListItemCustomEvent | RendererCustomEvent} event - The click event
651
- * @returns {void}
652
- *
653
- * @memberOf ListComponent
654
- */
655
- private clickEventEmit;
656
- /**
657
- * @description Refreshes the list data from the configured source.
658
- * @summary This method handles both initial data loading and subsequent refresh operations,
659
- * including pull-to-refresh and infinite scrolling. It manages the data fetching process,
660
- * updates the component's state, and handles pagination or infinite scrolling logic based
661
- * on the component's configuration.
662
- *
663
- * The method performs the following steps:
664
- * 1. Sets the refreshing flag to indicate a data fetch is in progress
665
- * 2. Calculates the appropriate start and limit values based on pagination settings
666
- * 3. Fetches data from the appropriate source (model or request)
667
- * 4. Updates the component's data and emits a refresh event
668
- * 5. Handles pagination or infinite scrolling state updates
669
- * 6. Completes any provided event (like InfiniteScrollCustomEvent)
670
- *
671
- * @param {InfiniteScrollCustomEvent | RefresherCustomEvent | boolean} event - The event that triggered the refresh,
672
- * or a boolean flag indicating if this is a forced refresh
673
- * @returns {Promise<void>} A promise that resolves when the refresh operation is complete
674
- *
675
- * @mermaid
676
- * sequenceDiagram
677
- * participant L as ListComponent
678
- * participant D as Data Source
679
- * participant E as Event System
680
- *
681
- * L->>L: refresh(event)
682
- * L->>L: Set refreshing flag
683
- * L->>L: Calculate start and limit
684
- * alt Using model
685
- * L->>D: getFromModel(force, start, limit)
686
- * D-->>L: Return data
687
- * else Using request
688
- * L->>D: getFromRequest(force, start, limit)
689
- * D-->>L: Return data
690
- * end
691
- * L->>E: refreshEventEmit()
692
- * alt Infinite scrolling mode
693
- * L->>L: Check if reached last page
694
- * alt Last page reached
695
- * L->>L: Complete scroll event
696
- * L->>L: Disable loadMoreData
697
- * else More pages available
698
- * L->>L: Increment page number
699
- * L->>L: Complete scroll event after delay
700
- * end
701
- * else Paginated mode
702
- * L->>L: Clear refreshing flag after delay
703
- * end
704
- *
705
- * @memberOf ListComponent
706
- */
707
- refresh(event?: InfiniteScrollCustomEvent | RefresherCustomEvent | boolean): Promise<void>;
708
- /**
709
- * @description Handles pagination events from the pagination component.
710
- * @summary Processes pagination events by updating the current page number and
711
- * refreshing the list data to display the selected page. This method is called
712
- * when a user interacts with the pagination controls to navigate between pages.
713
- *
714
- * @param {PaginationCustomEvent} event - The pagination event containing page information
715
- * @returns {void}
716
- *
717
- * @memberOf ListComponent
718
- */
719
- handlePaginate(event: PaginationCustomEvent): void;
720
- /**
721
- * @description Handles pull-to-refresh events from the refresher component.
722
- * @summary Processes refresh events triggered by the user pulling down on the list
723
- * or by programmatic refresh requests. This method refreshes the list data and
724
- * completes the refresher animation when the data is loaded.
725
- *
726
- * @param {InfiniteScrollCustomEvent | CustomEvent} [event] - The refresh event
727
- * @returns {Promise<void>} A promise that resolves when the refresh operation is complete
728
- *
729
- * @memberOf ListComponent
730
- */
731
- handleRefresh(event?: InfiniteScrollCustomEvent | CustomEvent): Promise<void>;
732
- /**
733
- * @description Filters data based on a search string.
734
- * @summary Processes the current data array to find items that match the provided
735
- * search string. This uses the arrayQueryByString utility to perform the filtering
736
- * across all properties of the items.
737
- *
738
- * @param {KeyValue[]} results - The array of items to search through
739
- * @param {string} search - The search string to filter by
740
- * @returns {KeyValue[]} A promise that resolves to the filtered array of items
741
- *
742
- * @memberOf ListComponent
743
- */
744
- parseSearchResults(results: KeyValue[], search: string): KeyValue[];
745
- /**
746
- * @description Fetches data from a request source.
747
- * @summary Retrieves data from the configured source function or URL, processes it,
748
- * and updates the component's data state. This method handles both initial data loading
749
- * and subsequent refresh operations when using an external data source rather than a model.
750
- *
751
- * @param {boolean} force - Whether to force a refresh even if data already exists
752
- * @param {number} start - The starting index for pagination
753
- * @param {number} limit - The maximum number of items to retrieve
754
- * @returns {Promise<KeyValue[]>} A promise that resolves to the fetched data
755
- *
756
- * @memberOf ListComponent
757
- */
758
- getFromRequest(force: boolean | undefined, start: number, limit: number): Promise<KeyValue[]>;
759
- /**
760
- * @description Fetches data from a model source.
761
- * @summary Retrieves data from the configured model using its pagination or find methods,
762
- * processes it, and updates the component's data state. This method handles both initial
763
- * data loading and subsequent refresh operations when using a model as the data source.
764
- *
765
- * @param {boolean} force - Whether to force a refresh even if data already exists
766
- * @param {number} start - The starting index for pagination
767
- * @param {number} limit - The maximum number of items to retrieve
768
- * @returns {Promise<KeyValue[]>} A promise that resolves to the fetched data
769
- *
770
- * @memberOf ListComponent
771
- */
772
- getFromModel(force?: boolean): Promise<KeyValue[]>;
773
- /**
774
- * @description Converts search values or filter queries into database conditions.
775
- * @summary Transforms search input or complex filter queries into Condition objects
776
- * that can be used for database querying. Handles both simple string/number searches
777
- * across indexed fields and complex filter queries with multiple criteria.
778
- *
779
- * For simple searches (string/number):
780
- * - Creates conditions that search across all indexed fields
781
- * - Uses equality for numeric values and regex for string values
782
- * - Combines conditions with OR logic to search multiple fields
783
- *
784
- * For complex filter queries:
785
- * - Processes each filter item with its specific condition type
786
- * - Supports Equal, Not Equal, Contains, Not Contains, Greater Than, Less Than
787
- * - Updates sort configuration based on the filter query
788
- * - Combines multiple filter conditions with OR logic
789
- *
790
- * @param {string | number | IFilterQuery} value - The search value or filter query object
791
- * @returns {Condition<Model>} A Condition object for database querying
792
- * @memberOf ListComponent
793
- */
794
- parseConditions(value: string | number | IFilterQuery): Condition<Model>;
795
- /**
796
- * @description Processes query results into a standardized format.
797
- * @summary Handles different result formats from various data sources, extracting
798
- * pagination information when available and applying any configured data mapping.
799
- * This ensures consistent data structure regardless of the source.
800
- *
801
- * @protected
802
- * @param {KeyValue[] | Paginator} result - The raw query result
803
- * @returns {KeyValue[]} The processed array of items
804
- *
805
- * @memberOf ListComponent
806
- */
807
- protected parseResult(result: KeyValue[] | Paginator<Model>): Promise<KeyValue[]>;
808
- /**
809
- * @description Updates pagination state based on data length.
810
- * @summary Calculates whether more data is available and how many pages exist
811
- * based on the total number of items and the configured limit per page.
812
- * This information is used to control pagination UI and infinite scrolling behavior.
813
- *
814
- * @param {number} length - The total number of items available
815
- * @returns {void}
816
- *
817
- * @memberOf ListComponent
818
- */
819
- getMoreData(length: number): void;
820
- /**
821
- * @description Maps a single item using the configured mapper.
822
- * @summary Transforms a data item according to the mapping configuration,
823
- * extracting nested properties and formatting values as needed. This allows
824
- * the component to display data in a format different from how it's stored.
825
- *
826
- * @protected
827
- * @param {KeyValue} item - The item to map
828
- * @param {KeyValue} mapper - The mapping configuration
829
- * @param {KeyValue} [props] - Additional properties to include
830
- * @returns {KeyValue} The mapped item
831
- *
832
- * @memberOf ListComponent
833
- */
834
- protected itemMapper(item: KeyValue, mapper: KeyValue, props?: KeyValue): KeyValue;
835
- /**
836
- * @description Maps all result items using the configured mapper.
837
- * @summary Applies the itemMapper to each item in the result set, adding
838
- * common properties like operations and route information. This transforms
839
- * the raw data into the format expected by the list item components.
840
- *
841
- * @param {KeyValue[]} data - The array of items to map
842
- * @returns {KeyValue[]} The array of mapped items
843
- *
844
- * @memberOf ListComponent
845
- */
846
- mapResults(data: KeyValue[]): KeyValue[];
847
- static ɵfac: i0.ɵɵFactoryDeclaration<ListComponent, never>;
848
- static ɵcmp: i0.ɵɵComponentDeclaration<ListComponent, "ngx-decaf-list", never, { "type": { "alias": "type"; "required": false; }; "translatable": { "alias": "translatable"; "required": false; }; "showSearchbar": { "alias": "showSearchbar"; "required": false; }; "data": { "alias": "data"; "required": false; }; "source": { "alias": "source"; "required": false; }; "start": { "alias": "start"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "loadMoreData": { "alias": "loadMoreData"; "required": false; }; "lines": { "alias": "lines"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "scrollThreshold": { "alias": "scrollThreshold"; "required": false; }; "scrollPosition": { "alias": "scrollPosition"; "required": false; }; "loadingText": { "alias": "loadingText"; "required": false; }; "showRefresher": { "alias": "showRefresher"; "required": false; }; "loadingSpinner": { "alias": "loadingSpinner"; "required": false; }; "enableFilter": { "alias": "enableFilter"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "sortBy": { "alias": "sortBy"; "required": false; }; "disableSort": { "alias": "disableSort"; "required": false; }; "emptyIcon": { "alias": "emptyIcon"; "required": false; }; "empty": { "alias": "empty"; "required": false; }; }, { "refreshEvent": "refreshEvent"; "clickEvent": "clickEvent"; }, never, ["*"], true, never>;
849
- }