@eternalcodestudio/primeng-table 20.0.4 → 20.0.6

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/index.d.ts CHANGED
@@ -20,32 +20,69 @@ declare abstract class ECSPrimengTableNotificationService {
20
20
  }
21
21
 
22
22
  /**
23
- * Interface representing the configuration for action buttons in a PrimeNG table.
23
+ * Interface representing a table action button, applicable for both header and row buttons.
24
24
  */
25
25
  interface ITableButton {
26
26
  /**
27
- * Gets or sets the icon to be displayed on the button.
28
- * The value should be a string representing the PrimeIcons class name.
27
+ * Optional. The icon to display on the button.
28
+ * Should be a valid icon name from PrimeNG, Material Icons, Font Awesome, or similar libraries.
29
29
  */
30
30
  icon?: string;
31
+ /**
32
+ * Optional. The position of the icon relative to the button label.
33
+ * Defaults to "left". Possible values are:
34
+ * - "left"
35
+ * - "right"
36
+ * - "top"
37
+ * - "bottom"
38
+ */
39
+ iconPos?: string;
40
+ /**
41
+ * Optional. The text label displayed on the button.
42
+ */
31
43
  label?: string;
32
44
  /**
33
- * Gets or sets the color style class to be applied to the button.
34
- * The value should be a string representing a CSS class for styling the button.
45
+ * Optional. If true, the button will be round. Defaults to false.
46
+ */
47
+ rounded?: boolean;
48
+ /**
49
+ * Optional. If true, adds a shadow to indicate elevation. Defaults to false.
50
+ */
51
+ raised?: boolean;
52
+ /**
53
+ * Optional. Specifies the variant of the button.
54
+ * Can be null (default), "text", or "outlined".
55
+ */
56
+ variant?: string;
57
+ /**
58
+ * Optional. The CSS class to apply for button styling.
59
+ * Example: "p-button-success" or "custom-class".
35
60
  */
36
61
  color?: string;
37
62
  /**
38
- * Gets or sets the condition for displaying the button.
39
- * It is a function that takes row data as input and returns a boolean indicating
40
- * whether the button should be displayed for that row.
63
+ * Optional. Additional inline CSS styles for the button.
64
+ */
65
+ style?: string;
66
+ /**
67
+ * Optional. Function that determines whether the button should be displayed for a given row.
68
+ * @param rowData The row data object. Null for header buttons.
69
+ * @returns True if the button should be visible; false otherwise.
41
70
  */
42
71
  condition?: (rowData: any) => boolean;
43
72
  /**
44
- * Represents the action to be executed when the button is clicked.
45
- * This function takes the row data of the clicked row as input and performs
46
- * specific actions based on that data.
73
+ * Optional. Controls behavior when `condition` returns false.
74
+ * - If `true`, the button will be hidden when the condition is not met.
75
+ * - If `false` or `undefined`, the button will remain visible but disabled.
76
+ */
77
+ conditionFailHide?: boolean;
78
+ /**
79
+ * Optional. The action to execute when the button is clicked.
80
+ * @param rowData The row data object of the clicked row. Null for header buttons.
47
81
  */
48
82
  action?: (rowData: any) => void;
83
+ /**
84
+ * Optional. Tooltip text to display when the user hovers over the button.
85
+ */
49
86
  tooltip?: string;
50
87
  }
51
88
 
@@ -201,39 +238,79 @@ interface IColumnMetadata {
201
238
  initialWidth: number;
202
239
  }
203
240
 
241
+ /**
242
+ * Represents a predefined filter value for a column in **ECS PrimeNG tables**.
243
+ *
244
+ * Allows displaying a value as text, tag, icon or image (from URL or blob) with optional styles and colors.
245
+ */
204
246
  interface IPredefinedFilter {
205
247
  /**
206
- * The value of the PrimeNG icon.
207
- */
208
- icon?: string;
209
- iconURL?: string;
210
- iconBlobSourceEndpoint?: string;
211
- iconBlobSourceEndpointResponseError?: boolean;
212
- /**
213
- * The icon as a blob.
248
+ * The underlying value of the cell. Must match the data returned from the backend for proper filtering and mapping.
249
+ *
250
+ * This is also used by the global filter internally.
251
+ *
252
+ * **IMPORTANT**: For text and tag representations, it is recommended that `value` matches `name`.
214
253
  */
215
- iconBlob?: Blob;
254
+ value: string | number;
216
255
  /**
217
- * A string representing the name to be shown in the UI.
256
+ * The text displayed in the frontend for this filter value.
257
+ *
258
+ * Used when `displayName` is `true` or when displaying a tag.
218
259
  */
219
260
  name?: string;
220
261
  /**
221
- * If the name needs to be shown in the UI
262
+ * Set to `true` to display the `name` as text in the cell.
222
263
  */
223
264
  displayName?: boolean;
224
265
  /**
225
- * The underlying value of the option. The value can be of any type and represents the data managed behind the scenes.
266
+ * Set to `true` to display the `name` as a tag in the cell.
226
267
  */
227
- value: any;
268
+ displayTag?: boolean;
228
269
  /**
229
- * If the value needs to be displayed with a tag
270
+ * Optional CSS style object to apply to the tag.
271
+ *
272
+ * Example: { background: 'rgb(255,0,0)', color: 'white' }
230
273
  */
231
- displayTag?: boolean;
232
274
  tagStyle?: {
233
275
  [key: string]: string;
234
276
  };
277
+ /**
278
+ * The icon to display for this value.
279
+ *
280
+ * Can use icons from PrimeNG, Font Awesome, Material Icons, etc...
281
+ */
282
+ icon?: string;
283
+ /**
284
+ * Optional color to apply to the icon.
285
+ *
286
+ * Example: "red", "#00ff00"
287
+ */
235
288
  iconColor?: string;
289
+ /**
290
+ * Optional CSS style string to apply to the icon.
291
+ *
292
+ * Example: "font-size: 1.5rem" "margin-right: 0.5rem"
293
+ */
236
294
  iconStyle?: string;
295
+ /**
296
+ * The image to display directly from a URL.
297
+ */
298
+ imageURL?: string;
299
+ /**
300
+ * The image to display from a Blob object.
301
+ */
302
+ imageBlob?: Blob;
303
+ /**
304
+ * If using a Blob and it is not provided directly, the backend endpoint to fetch the Blob from.
305
+ */
306
+ imageBlobSourceEndpoint?: string;
307
+ /**
308
+ * @internal
309
+ * Indicates that fetching the Blob from `imageBlobSourceEndpoint` failed.
310
+ *
311
+ * **_Do not modify this property manually._**
312
+ */
313
+ imageBlobFetchError?: boolean;
237
314
  }
238
315
 
239
316
  interface ITableConfiguration {
@@ -257,7 +334,7 @@ interface ITableOptions {
257
334
  *
258
335
  * @default true
259
336
  */
260
- isActive: boolean;
337
+ isActive?: boolean;
261
338
  /**
262
339
  * Endpoint URL to fetch the table configuration.
263
340
  *
@@ -265,22 +342,22 @@ interface ITableOptions {
265
342
  * an `ITableConfiguration` object from the API. This includes data such as column definitions,
266
343
  * the timezone to use, and other settings.
267
344
  *
268
- * If set to `null` or if `isActive` is `false`, the table will **not** fetch configuration automatically.
345
+ * If set to `undefined` or if `isActive` is `false`, the table will **not** fetch configuration automatically.
269
346
  *
270
- * @default null
347
+ * @default undefined
271
348
  */
272
- urlTableConfiguration: string | null;
349
+ urlTableConfiguration?: string;
273
350
  /**
274
351
  * Endpoint URL to fetch the table data.
275
352
  *
276
353
  * This endpoint is called **whenever the user filters, changes pages, or sorts** the table.
277
354
  * It is expected to return an `ITablePagedResponse` object containing the paginated data.
278
355
  *
279
- * If set to `null` or if `isActive` is `false`, the table will **not** fetch or update data automatically.
356
+ * If set to `undefined` or if `isActive` is `false`, the table will **not** fetch or update data automatically.
280
357
  *
281
- * @default null
358
+ * @default undefined
282
359
  */
283
- urlTableData: string | null;
360
+ urlTableData?: string;
284
361
  /**
285
362
  * The array of data to be displayed in the table.
286
363
  *
@@ -288,18 +365,18 @@ interface ITableOptions {
288
365
  *
289
366
  * @default []
290
367
  */
291
- data: any[];
292
- header: {
293
- buttons: ITableButton[];
294
- clearSortsEnabled: boolean;
295
- clearSortsIcon: string;
296
- clearFiltersEnabled: boolean;
297
- clearFiltersIcon: string;
368
+ data?: any[];
369
+ header?: {
370
+ buttons?: ITableButton[];
371
+ clearSortsEnabled?: boolean;
372
+ clearSortsIcon?: string;
373
+ clearFiltersEnabled?: boolean;
374
+ clearFiltersIcon?: string;
298
375
  };
299
376
  /**
300
377
  * Configurations related to the columns of the table.
301
378
  */
302
- columns: {
379
+ columns?: {
303
380
  /**
304
381
  * Enables or disables the column selector feature.
305
382
  *
@@ -313,48 +390,49 @@ interface ITableOptions {
313
390
  *
314
391
  * @default true
315
392
  */
316
- selectorEnabled: boolean;
393
+ selectorEnabled?: boolean;
394
+ selectorIcon?: string;
317
395
  /**
318
396
  * The combination of non-selectable columns and user-selected columns
319
397
  * that must be displayed in the table.
320
398
  *
321
399
  * @default []
322
400
  */
323
- shown: IColumnMetadata[];
401
+ shown?: IColumnMetadata[];
324
402
  };
325
403
  /**
326
404
  * Configurations related to the rows of the table.
327
405
  */
328
- rows: {
329
- class: (rowData: any) => string | string[] | Set<string> | {
406
+ rows?: {
407
+ class?: (rowData: any) => string | string[] | Set<string> | {
330
408
  [klass: string]: any;
331
409
  };
332
- style: (rowData: any) => {
410
+ style?: (rowData: any) => {
333
411
  [klass: string]: any;
334
412
  };
335
- action: {
336
- buttons: ITableButton[];
337
- header: string;
338
- alignmentRight: boolean;
339
- width: number;
340
- frozen: boolean;
341
- resizable: boolean;
413
+ action?: {
414
+ buttons?: ITableButton[];
415
+ header?: string;
416
+ alignmentRight?: boolean;
417
+ width?: number;
418
+ frozen?: boolean;
419
+ resizable?: boolean;
342
420
  };
343
- checkboxSelector: {
344
- enabled: boolean;
345
- header: string;
346
- alignmentRight: boolean;
347
- width: number;
348
- frozen: boolean;
349
- resizable: boolean;
421
+ checkboxSelector?: {
422
+ enabled?: boolean;
423
+ header?: string;
424
+ alignmentRight?: boolean;
425
+ width?: number;
426
+ frozen?: boolean;
427
+ resizable?: boolean;
350
428
  };
351
- singleSelector: {
352
- enabled: boolean;
353
- metakey: boolean;
429
+ singleSelector?: {
430
+ enabled?: boolean;
431
+ metakey?: boolean;
354
432
  };
355
433
  };
356
434
  /** Configurations related to the vertical scroll of the table. */
357
- verticalScroll: {
435
+ verticalScroll?: {
358
436
  /**
359
437
  * Automatically adjust the table's height to fit its container.
360
438
  *
@@ -363,7 +441,7 @@ interface ITableOptions {
363
441
  *
364
442
  * @default true
365
443
  */
366
- fitToContainer: boolean;
444
+ fitToContainer?: boolean;
367
445
  /**
368
446
  * Fixed vertical height for the table when `fitToContainer` is `false`.
369
447
  *
@@ -375,10 +453,10 @@ interface ITableOptions {
375
453
  *
376
454
  * @default 0
377
455
  */
378
- height: number;
456
+ height?: number;
379
457
  };
380
458
  /** Configurations related to the global search functionality of the table. */
381
- globalSearch: {
459
+ globalSearch?: {
382
460
  /**
383
461
  * Enables or disables the global search input.
384
462
  *
@@ -387,7 +465,7 @@ interface ITableOptions {
387
465
  *
388
466
  * @default true
389
467
  */
390
- enabled: boolean;
468
+ enabled?: boolean;
391
469
  /**
392
470
  * Maximum number of characters allowed in the global search input.
393
471
  *
@@ -395,15 +473,15 @@ interface ITableOptions {
395
473
  *
396
474
  * @default 20
397
475
  */
398
- maxLength: number;
476
+ maxLength?: number;
399
477
  };
400
- predefinedFilters: {
478
+ predefinedFilters?: {
401
479
  [key: string]: IPredefinedFilter[];
402
480
  };
403
481
  /**
404
482
  * Configurations related to saved table views.
405
483
  */
406
- views: {
484
+ views?: {
407
485
  /**
408
486
  * Determines how the table views are saved.
409
487
  *
@@ -417,41 +495,41 @@ interface ITableOptions {
417
495
  *
418
496
  * @default TableViewSaveMode.None
419
497
  */
420
- saveMode: TableViewSaveMode;
498
+ saveMode?: TableViewSaveMode;
421
499
  /**
422
500
  * Key used to identify the table when saving and retrieving its views.
423
501
  *
424
502
  * Each table should have a unique `saveKey` so that its saved views (filters, column order, sorting, etc.)
425
503
  * do not conflict with other tables.
426
504
  *
427
- * If set to `null`, the table will not save or load any views.
505
+ * If set to `undefined`, the table will not save or load any views.
428
506
  *
429
- * @default null
507
+ * @default undefined
430
508
  */
431
- saveKey: string | null;
509
+ saveKey?: string;
432
510
  /**
433
511
  * Endpoint URL to fetch saved views from the database.
434
512
  *
435
513
  * Only used if `saveMode` is `TableViewSaveMode.databaseStorage`.
436
514
  * The `saveKey` is sent to identify the correct table views.
437
515
  *
438
- * @default null
516
+ * @default undefined
439
517
  */
440
- urlGet: string | null;
518
+ urlGet?: string;
441
519
  /**
442
520
  * Endpoint URL to save table views to the database.
443
521
  *
444
522
  * Only used if `saveMode` is `TableViewSaveMode.databaseStorage`.
445
523
  * The `saveKey` is sent to identify the correct table views.
446
524
  *
447
- * @default null
525
+ * @default undefined
448
526
  */
449
- urlSave: string | null;
527
+ urlSave?: string;
450
528
  };
451
529
  /**
452
530
  * Configurations for exporting the table data to Excel.
453
531
  */
454
- excelReport: {
532
+ excelReport?: {
455
533
  /**
456
534
  * Endpoint URL of the API to perform the Excel export.
457
535
  *
@@ -459,11 +537,11 @@ interface ITableOptions {
459
537
  * specified by the user, such as selected columns, filters, and sort order, to generate
460
538
  * the export.
461
539
  *
462
- * If set to `null`, Excel export functionality will be disabled.
540
+ * If set to `undefined`, Excel export functionality will be disabled.
463
541
  *
464
- * @default null
542
+ * @default undefined
465
543
  */
466
- url: string | null;
544
+ url?: string;
467
545
  /**
468
546
  * Default title shown in the Excel export modal when preparing the export.
469
547
  *
@@ -472,7 +550,7 @@ interface ITableOptions {
472
550
  *
473
551
  * @default "Report"
474
552
  */
475
- defaultTitle: string;
553
+ defaultTitle?: string;
476
554
  /**
477
555
  * Determines whether the user can edit the title of the Excel file in the export modal.
478
556
  *
@@ -481,9 +559,9 @@ interface ITableOptions {
481
559
  *
482
560
  * @default true
483
561
  */
484
- titleAllowUserEdit: boolean;
562
+ titleAllowUserEdit?: boolean;
485
563
  };
486
- copyToClipboardTime: number;
564
+ copyToClipboardTime?: number;
487
565
  }
488
566
  declare const DEFAULT_TABLE_OPTIONS: ITableOptions;
489
567
 
@@ -627,7 +705,7 @@ declare class ECSPrimengTable implements OnInit, AfterViewInit {
627
705
  calculateScrollHeight(): void;
628
706
  get scrollHeightValue(): string;
629
707
  /**
630
- * Used to update the data of a table externally outside the component. Use this method instead of 'updateData' to force the data updata of a table
708
+ * Used to update the data of a table externally outside the component.
631
709
  *
632
710
  */
633
711
  updateData(): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eternalcodestudio/primeng-table",
3
- "version": "20.0.4",
3
+ "version": "20.0.6",
4
4
  "description": "ECS reusable Angular PrimeNG table component with advanced server-side filters. Designed to offload filtering logic to any backend API.",
5
5
  "author": "ECS (Eternal CODE Studio)",
6
6
  "license": "MIT",
@@ -16,6 +16,7 @@
16
16
  "peerDependencies": {
17
17
  "@angular/common": ">=20.0.0",
18
18
  "@angular/core": ">=20.0.0",
19
+ "@angular/animations": ">=20.0.0",
19
20
  "primeng": ">=20.0.0",
20
21
  "primeicons": ">=7.0.0"
21
22
  },
@@ -28,7 +29,7 @@
28
29
  },
29
30
  "repository": {
30
31
  "type": "git",
31
- "url": "git+https://github.com/AIO1/ECSPrimengTable"
32
+ "url": "git+https://github.com/AIO1/ECSPrimengTable.git"
32
33
  },
33
34
  "bugs": {
34
35
  "url": "https://github.com/AIO1/ECSPrimengTable/issues"