@genesislcap/grid-pro 14.199.1 → 14.199.2-alpha-1ab46f4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/README.md +117 -111
  2. package/dist/custom-elements.json +2742 -840
  3. package/dist/dts/datasource/base.datasource.d.ts +22 -6
  4. package/dist/dts/datasource/base.datasource.d.ts.map +1 -1
  5. package/dist/dts/datasource/base.types.d.ts +22 -0
  6. package/dist/dts/datasource/base.types.d.ts.map +1 -0
  7. package/dist/dts/datasource/server-side.datasource.d.ts +27 -83
  8. package/dist/dts/datasource/server-side.datasource.d.ts.map +1 -1
  9. package/dist/dts/datasource/server-side.grid-definitions.d.ts.map +1 -1
  10. package/dist/dts/datasource/server-side.resource-base.d.ts +55 -0
  11. package/dist/dts/datasource/server-side.resource-base.d.ts.map +1 -0
  12. package/dist/dts/datasource/server-side.resource-dataserver.d.ts +20 -0
  13. package/dist/dts/datasource/server-side.resource-dataserver.d.ts.map +1 -0
  14. package/dist/dts/datasource/server-side.resource-reqrep.d.ts +17 -0
  15. package/dist/dts/datasource/server-side.resource-reqrep.d.ts.map +1 -0
  16. package/dist/dts/grid-pro-genesis-datasource/grid-pro-genesis-datasource.d.ts +13 -13
  17. package/dist/dts/grid-pro-genesis-datasource/grid-pro-genesis-datasource.d.ts.map +1 -1
  18. package/dist/dts/grid-pro.d.ts +16 -2
  19. package/dist/dts/grid-pro.d.ts.map +1 -1
  20. package/dist/esm/datasource/base.datasource.js +79 -9
  21. package/dist/esm/datasource/base.types.js +1 -0
  22. package/dist/esm/datasource/client-side.grid-definitions.js +1 -1
  23. package/dist/esm/datasource/server-side.datasource.js +220 -396
  24. package/dist/esm/datasource/server-side.grid-definitions.js +42 -7
  25. package/dist/esm/datasource/server-side.resource-base.js +285 -0
  26. package/dist/esm/datasource/server-side.resource-dataserver.js +132 -0
  27. package/dist/esm/datasource/server-side.resource-reqrep.js +131 -0
  28. package/dist/esm/grid-pro-genesis-datasource/grid-pro-genesis-datasource.js +54 -60
  29. package/dist/esm/grid-pro.js +7 -4
  30. package/dist/grid-pro.api.json +21 -142
  31. package/dist/grid-pro.d.ts +77 -112
  32. package/docs/api/grid-pro.gridpro.addeventlistener.md +2 -2
  33. package/docs/api/grid-pro.gridpro.md +1 -1
  34. package/docs/api/grid-pro.gridprogenesisdatasource.deinit.md +5 -0
  35. package/docs/api/{grid-pro.gridprogenesisdatasource.auth.md → grid-pro.gridprogenesisdatasource.destroy.md} +9 -3
  36. package/docs/api/grid-pro.gridprogenesisdatasource.handleerrors.md +2 -2
  37. package/docs/api/grid-pro.gridprogenesisdatasource.md +2 -6
  38. package/docs/api/grid-pro.gridprogenesisdatasource.reset.md +1 -1
  39. package/docs/api-report.md +19 -68
  40. package/package.json +13 -13
  41. package/docs/api/grid-pro.gridprogenesisdatasource.datasource.md +0 -11
  42. package/docs/api/grid-pro.gridprogenesisdatasource.disablepolling.md +0 -11
  43. package/docs/api/grid-pro.gridprogenesisdatasource.pollinginterval.md +0 -11
  44. package/docs/api/grid-pro.gridprogenesisdatasource.request.md +0 -11
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  The `@genesislcap/grid-pro` package provides a collection of grid-related components and utilities for Genesis applications.
4
4
 
5
- ### API Documentation
5
+ ## API Documentation
6
6
 
7
7
  For more detailed information on API and configurations, please refer to the [API documentation](docs/api/index.md) in the `docs/api` directory.
8
8
 
@@ -12,13 +12,12 @@ For more detailed information on API and configurations, please refer to the [AP
12
12
  - **Customizable**: support for custom headers, mapping values, text formatting, custom cell-renderers and more (more on grid options later).
13
13
  - **Flexible**: when it comes to **working with data** grid-pro makes it easy by supporting filtering, editing, sorting, pagination (depending on configuration).
14
14
  - **Events** and **callbacks**: There is a large number of events and callbacks provided by the grid, you can find details [here](https://www.ag-grid.com/javascript-data-grid/grid-events/).
15
- - **Simple** or **connected data**: There are two main use cases for our Grid Pro component
16
- - **Simple data**: when you have your own data model and flow (JSON, external/custom REST APIs, etc) but still want to use a rich data grid component with all its features (filtering, sorting, custom cell renderers, etc).
17
- - **Connected data**: when you have a Data Server or Request Server available and ready to use, and you don't want to worry about handling data transformations, updates, deletes and cell renderers in the grid.
15
+ - **Simple Data** or **Connected Data**: There are two main use cases for our Grid Pro component
16
+ - **Simple Data**: when you have your own data model and flow (JSON, external/custom REST APIs, etc) but still want to use a rich data grid component with all its features (filtering, sorting, custom cell renderers, etc).
17
+ - **Connected Data**: when you have a Data Server or Request Server available and ready to use, and you don't want to worry about handling data transformations, updates, deletes and cell renderers in the grid.
18
18
  - **State persistence**: ability to save and restore grid state.
19
19
  - **Row models**: support for both client-side and server-side [row models](https://www.ag-grid.com/javascript-data-grid/row-models/).
20
20
 
21
-
22
21
  ## Project Structure
23
22
 
24
23
  - **`src/`**: Source code for the package, including cell-editors, cell-renderers, datasources and utility functions.
@@ -66,9 +65,11 @@ provideDesignSystem().register(baseComponents, rapidGridComponents);
66
65
  There are many attributes that can be set on a datasource component.
67
66
 
68
67
  #### Resource Attributes
68
+
69
69
  Some **resource** related attributes are `DATASERVER` or `REQUEST_SERVER` specific while others can be used with both.
70
70
 
71
71
  ##### Attributes that are common between DATASERVER and REQUEST_SERVER
72
+
72
73
  |Name|Type|Default|Description|
73
74
  |----|----|-------|-----------|
74
75
  | `resource-name` | `string` | - | The name of the target [Data Server](https://learn.genesis.global/docs/server/data-server/introduction/) `query` or [Request Server](https://learn.genesis.global/docs/server/request-server/introduction/) `requestReply`. |
@@ -78,6 +79,7 @@ Some **resource** related attributes are `DATASERVER` or `REQUEST_SERVER` speci
78
79
  | `view-number` | `number` | - | The desired view/page you want data from. |
79
80
 
80
81
  ##### DATASERVER only attributes
82
+
81
83
  |Name|Type|Default|Description|
82
84
  |----|----|-------|-----------|
83
85
  | `fields` | `string` | - | This optional parameter allows you to select a subset of fields from the query if the client is not interested in receiving all of them. |
@@ -86,33 +88,37 @@ Some **resource** related attributes are `DATASERVER` or `REQUEST_SERVER` speci
86
88
  | `order-by` | `string` | - | This option can be used to select a [Data Server index](https://learn.genesis.global/docs/database/data-types/index-entities/) (defined in the Data Server `query`), which is especially useful if you want the data to be sorted in a specific way. By default, Data Server rows are returned in order of creation (from oldest database record to newest).|
87
89
  | `reverse` | `boolean` | `false` | This option changes the [Data Server index](https://learn.genesis.global/docs/database/data-types/index-entities/) iteration. For example, if you are using the default index, the query will return rows in order from the newest database records to the oldest.|
88
90
 
89
-
90
91
  ##### REQUEST_SERVER only attributes
92
+
91
93
  |Name|Type|Default|Description|
92
94
  |----|----|-------|-----------|
93
95
  | `disable-polling` | `boolean` | `false` | This option disables polling if set to true (data updates for the grid will not be fetched automatically).|
94
96
  | `polling-interval` | `number` | - | This option enables you to set a custom polling frequency (in milliseconds) for a [Request Server](https://learn.genesis.global/docs/server/request-server/introduction/) resource. Note that this option only works with Request Server resources; if your resource is a Data Server `query`, your grid is updated in real time. |
95
97
  |`request`| `string` | - | Similar to `fields` but for [Request Server](https://learn.genesis.global/docs/server/request-server/introduction/) scenarios. This optional parameter enables you to specify request fields, which can include wildcards.|
98
+ |`request-auto-setup`| `boolean` | `false` | This option, if set to true, will automatically set up the `request` based on the datasources's metadata.|
96
99
 
97
100
  #### Component Attributes
98
101
 
99
102
  There are additional attributes that can affect the behavior of a datasource component.
100
103
 
101
104
  ##### `<grid-pro-client-side-datasource>`
105
+
102
106
  |Name|Type|Default|Description|
103
107
  |----|----|-------|-----------|
104
108
  | `restart-on-reconnection` | `boolean` | `false` | This option, if set to true, will force the resource data to be reloaded upon a reconnection event.|
105
109
  | `keep-col-defs-on-clear-row-data` | `boolean` | `false` | This option, if set to true, will retain column definitions upon a `restart` or `clearRowData` event. |
106
110
 
107
111
  ##### `<grid-pro-server-side-datasource>`
112
+
108
113
  |Name|Type|Default|Description|
109
114
  |----|----|-------|-----------|
110
115
  | `pagination` | `boolean` | `false` | This option enables pagination if set to true, otherwise the behavior will be infinite-scroll.|
116
+ | `zero-based-view-number` | `boolean` | `false` | This option, if set to true, will make the starting VIEW_NUMBER zero-based (starting from 0 instead of 1).|
111
117
  | `live-updates` | `boolean` | `false` | This option enables live updates for the grid if set to true.|
112
118
 
113
119
  More details about our datasource implementations [here](#genesis-datasource).
114
120
 
115
- ### Usage (simple data example)
121
+ ### Usage - Simple Data example
116
122
 
117
123
  ```typescript
118
124
  import { ColDef, GridOptions } from '@ag-grid-community/core';
@@ -221,7 +227,7 @@ export class SimpleGridExample extends GenesisElement {
221
227
  }
222
228
  ```
223
229
 
224
- ### Usage - connected data example (client-side row model)
230
+ ### Usage - Connected Data example (client-side datasource)
225
231
 
226
232
  ```typescript
227
233
  @customElement({
@@ -238,7 +244,7 @@ export class SimpleGridExample extends GenesisElement {
238
244
  export class ConnectedGridClientSideExample extends GenesisElement {}
239
245
  ```
240
246
 
241
- ### Usage - connected data example (server-side row model)
247
+ ### Usage - connected data example (server-side datasource)
242
248
 
243
249
  Note: if pagination is set to false the grid will be in infinite scroll mode.
244
250
 
@@ -258,7 +264,7 @@ export class ConnectedGridServerSideExample extends GenesisElement {}
258
264
  ```
259
265
  <!-- page-split -->
260
266
 
261
- # Genesis Datasource
267
+ ## Genesis Datasource
262
268
 
263
269
  This folder contains implementations of Genesis `datasource` components, responsible for fetching data for Genesis [Grid Pro](../../README.md) components.
264
270
 
@@ -266,32 +272,32 @@ This document outlines the available features of our two “Grid Pro” datasour
266
272
 
267
273
  ## \<grid-pro-client-side-datasource\>
268
274
 
269
- ### Features
275
+ ### Client-Side Features
270
276
 
271
277
  - **Sorting**: Order by any column, ASC or DESC.
272
278
  - **Filtering**:
273
- - Filtering options are automatically generated, based on the resource’s metadata.
274
- - String Filters:
275
- - contains
276
- - not contains
277
- - equals
278
- - not equals
279
- - starts with
280
- - ends with
281
- - blank
282
- - not blank
283
- - Number/Date Filters:
284
- - equals
285
- - less than
286
- - less than or equal
287
- - greater than
288
- - greater than or equal
289
- - in range
279
+ - Filtering options are automatically generated, based on the resource’s metadata.
280
+ - String Filters:
281
+ - contains
282
+ - not contains
283
+ - equals
284
+ - not equals
285
+ - starts with
286
+ - ends with
287
+ - blank
288
+ - not blank
289
+ - Number/Date Filters:
290
+ - equals
291
+ - less than
292
+ - less than or equal
293
+ - greater than
294
+ - greater than or equal
295
+ - in range
290
296
  - **Filter Combinations** (Max 2 filters can be combined):
291
- - filter1 AND filter2
292
- - filter1 OR filter2
297
+ - filter1 AND filter2
298
+ - filter1 OR filter2
293
299
 
294
- ### Notes
300
+ ### Client-Side Notes
295
301
 
296
302
  - Works with both `DATASERVER` and `REQUEST_SERVER` resources.
297
303
  - Operations like sorting and filtering are performed on the client-side.
@@ -299,52 +305,52 @@ This document outlines the available features of our two “Grid Pro” datasour
299
305
 
300
306
  ## \<grid-pro-server-side-datasource\>
301
307
 
302
- ### Features
308
+ ### Server-Side Features
303
309
 
304
310
  - **Sorting**: Order by any INDEX column/field, ASC or DESC.
305
- - This is a server limitation. For each column that needs to have “sorting” the developer will need to have an INDEX for it. See more about indexes [here](https://learn.genesis.global/docs/database/data-types/index-entities/).
306
- - By default, sorting is disabled on ALL columns… BUT if we detect valid ‘` indexes” from the metadata those column/fields will be setup to have sorting.
307
- - If the user attempts to force `sortable` we’ll check if it’s really ok to do that + warn in the logs about it + try to mention other available indexes.. if any at all.
311
+ - This is a server limitation. For each column that needs to have “sorting” the developer will need to have an INDEX for it. See more about indexes [here](https://learn.genesis.global/docs/database/data-types/index-entities/).
312
+ - By default, sorting is disabled on ALL columns… BUT if we detect valid ‘` indexes” from the metadata those column/fields will be setup to have sorting.
313
+ - If the user attempts to force `sortable` we’ll check if it’s really ok to do that + warn in the logs about it + try to mention other available indexes.. if any at all.
308
314
  - **Filtering**:
309
- - Filtering options are automatically generated, based on the resource’s metadata.
310
- - String filters
311
- - blank
312
- - contains
313
- - equals
314
- - notBlank
315
- - notEqual
316
- - wordStartsWith
317
- - Number filters
318
- - equals
319
- - notEqual
320
- - greaterThan
321
- - greaterThanOrEqual
322
- - lessThan
323
- - lessThanOrEqual
324
- - inRange
325
- - blank
326
- - notBlank
327
- - Date filters
328
- - equals
329
- - lessThan
330
- - greaterThan
331
- - inRange
332
- - isToday
333
- - blank
334
- - notBlank
335
-
336
- ### Notes
315
+ - Filtering options are automatically generated, based on the resource’s metadata.
316
+ - String filters
317
+ - blank
318
+ - contains
319
+ - equals
320
+ - notBlank
321
+ - notEqual
322
+ - wordStartsWith
323
+ - Number filters
324
+ - equals
325
+ - notEqual
326
+ - greaterThan
327
+ - greaterThanOrEqual
328
+ - lessThan
329
+ - lessThanOrEqual
330
+ - inRange
331
+ - blank
332
+ - notBlank
333
+ - Date filters
334
+ - equals
335
+ - lessThan
336
+ - greaterThan
337
+ - inRange
338
+ - isToday
339
+ - blank
340
+ - notBlank
341
+
342
+ ### Server-Side Notes
337
343
 
338
344
  - Operations like sorting and filtering are pushed to the backend.
339
- - Filtering uses `CRITERIA_MATCH` param
340
- - Sorting uses `ORDERY_BY` param
341
- - Both work the same way, once filtering/sorting is applied the datasource component “resets itself”, basically starting a new stream with the updated params.
345
+ - Filtering uses `CRITERIA_MATCH` param
346
+ - Sorting uses `ORDERY_BY` param
347
+ - Both work the same way, once filtering/sorting is applied the datasource component “resets itself”, basically starting a new stream with the updated params.
342
348
  - **LIMITATIONS**
343
- - Sorting can only be applied to “index” fields/columns. Also mentioned [here](https://www.notion.so/Grid-Pro-Datasource-Inventory-d11ca7570ee94847bbcb3e7362025b0a?pvs=21). More details [here](https://genesisglobal.atlassian.net/jira/polaris/projects/GPR/ideas/view/4721227?selectedIssue=GPR-171&focusedCommentId=143757) and [here](https://genesis-global-talk.slack.com/archives/C0416MFG360/p1696456988606789).
344
- - ROWS_COUNT doesn’t reflect the correct amount when a CRITERIA_MATCH (filtering) is applied. Example: X resource has 100 records. A criteria is specified so it returns only 50 records… the rows count sent from the server is still 100. Because of that we have to manually/locally calculate that.
349
+ - Sorting can only be applied to “index” fields/columns. Also mentioned [here](https://www.notion.so/Grid-Pro-Datasource-Inventory-d11ca7570ee94847bbcb3e7362025b0a?pvs=21). More details [here](https://genesisglobal.atlassian.net/jira/polaris/projects/GPR/ideas/view/4721227?selectedIssue=GPR-171&focusedCommentId=143757) and [here](https://genesis-global-talk.slack.com/archives/C0416MFG360/p1696456988606789).
350
+ - ROWS_COUNT doesn’t reflect the correct amount when a CRITERIA_MATCH (filtering) is applied. Example: X resource has 100 records. A criteria is specified so it returns only 50 records… the rows count sent from the server is still 100. Because of that we have to manually/locally calculate that.
345
351
  - Suitable for large datasets where only a subset of data is loaded into the client based on user interactions.
346
352
 
347
- <hr>
353
+ ---
348
354
 
349
355
  ## Supported Row Models
350
356
 
@@ -356,40 +362,40 @@ It’s important to note that any client app can implement the other Row Models
356
362
 
357
363
  `Infinite` and `Viewport` row models are also supported but not offered "out of the box" (devs will have to create their own component).
358
364
 
359
- | Feature | Client-Side | Server-Side | Notes |
360
- | --- | --- |--- | --- |
361
- | All Data in Client | ✓ | ✗ | Free |
362
- | Fetch Data as User Scrolls | ✗ | ✓ | Free |
363
- | Row Sorting | (client) | (client OR server) our component is server-only | Free |
364
- | Row Filtering | (client) | (client OR server) our component is server-only | Free |
365
- | Quick Filter | ✓ | ✓ | Free |
366
- | Floating Filters | ✓ | ✓ | Free |
367
- | Dynamic Row Height | ✓ | ✓ | Free |
368
- | Row Grouping | (client) | (server) | Paid (Enterprise) |
369
- | Row Pivoting | (client) | (server) | Paid (Enterprise) |
370
- | Lazy Loading Row Groups | ✗ | ✓ | Paid (Enterprise) |
371
- | Value Aggregation (client) (server) ✗ ✗ | Paid (Enterprise) |
372
- | Row Selection | ✓ | ✓ | Free |
373
- | Specify Selectable Rows | ✓ | ✓ | Free |
374
- | Header Checkbox Selection | ✓ | ✓ | Free |
375
- | Range Selection | ✓ | ✓ | Free |
376
- | Column Spanning | ✓ | ✓ | Free |
377
- | Column Pinning | ✓ | ✓ | Free |
378
- | Row Pinning | ✓ | ✓ | Free |
379
- | Pagination | ✓ | ✓ | Free |
380
- | Custom Filters | ✓ | ✓ | Free |
381
- | Cell Editors | ✓ | ✓ | Free |
382
- | Cell Renderers | ✓ | ✓ | Free |
383
- | Value Getter | ✓ | ✓ | Free |
384
- | Value Setter | ✓ | ✓ | Free |
385
- | Value Formatter | ✓ | ✓ | Free |
386
- | Value Parser | ✓ | ✓ | Free |
387
- | Full Width Rows | ✓ | ✓ | Free |
388
- | CSV Export | ✓ | (data on screen) | Free |
389
- | Excel Export | ✓ | (data on screen) | Paid (Enterprise) |
390
- | Clipboard Copy & Paste | ✓ | ✓ | Free |
391
- | Update via Transaction | ✓ | ✓ | Free |
392
- | Update via Async Transactions | ✓ | ✓ | Free |
365
+ | Feature | Client-Side | Server-Side | Notes |
366
+ | --- | --- |--- | --- |
367
+ | All Data in Client | ✓ | ✗ | Free |
368
+ | Fetch Data as User Scrolls | ✗ | ✓ | Free |
369
+ | Row Sorting | (client) | (client OR server) our component is server-only | Free |
370
+ | Row Filtering | (client) | (client OR server) our component is server-only | Free |
371
+ | Quick Filter | ✓ | ✓ | Free |
372
+ | Floating Filters | ✓ | ✓ | Free |
373
+ | Dynamic Row Height | ✓ | ✓ | Free |
374
+ | Row Grouping | (client) | (server) | Paid (Enterprise) |
375
+ | Row Pivoting | (client) | (server) | Paid (Enterprise) |
376
+ | Lazy Loading Row Groups | ✗ | ✓ | Paid (Enterprise) |
377
+ | Value Aggregation | (client) | (server) | Paid (Enterprise) |
378
+ | Row Selection | ✓ | ✓ | Free |
379
+ | Specify Selectable Rows | ✓ | ✓ | Free |
380
+ | Header Checkbox Selection | ✓ | ✓ | Free |
381
+ | Range Selection | ✓ | ✓ | Free |
382
+ | Column Spanning | ✓ | ✓ | Free |
383
+ | Column Pinning | ✓ | ✓ | Free |
384
+ | Row Pinning | ✓ | ✓ | Free |
385
+ | Pagination | ✓ | ✓ | Free |
386
+ | Custom Filters | ✓ | ✓ | Free |
387
+ | Cell Editors | ✓ | ✓ | Free |
388
+ | Cell Renderers | ✓ | ✓ | Free |
389
+ | Value Getter | ✓ | ✓ | Free |
390
+ | Value Setter | ✓ | ✓ | Free |
391
+ | Value Formatter | ✓ | ✓ | Free |
392
+ | Value Parser | ✓ | ✓ | Free |
393
+ | Full Width Rows | ✓ | ✓ | Free |
394
+ | CSV Export | ✓ | (data on screen) | Free |
395
+ | Excel Export | ✓ | (data on screen) | Paid (Enterprise) |
396
+ | Clipboard Copy & Paste | ✓ | ✓ | Free |
397
+ | Update via Transaction | ✓ | ✓ | Free |
398
+ | Update via Async Transactions | ✓ | ✓ | Free |
393
399
 
394
400
  ### Summary
395
401
 
@@ -400,13 +406,13 @@ It’s important to note that any client app can implement the other Row Models
400
406
 
401
407
  ### DOM Virtualisation
402
408
 
403
- DOM Virtualisation is a powerful technique that enhances the performance of grid components by only rendering the rows and columns that are currently visible in the viewport. This approach significantly reduces the memory footprint and improves the rendering speed, enabling all of our “grid components” to handle larger datasets more efficiently.
409
+ DOM Virtualisation is a powerful technique that enhances the performance of grid components by only rendering the rows and columns that are currently visible in the viewport. This approach significantly reduces the memory footprint and improves the rendering speed, enabling all of our “grid components” to handle larger datasets more efficiently.
404
410
 
405
411
  - **How It Works**: Instead of rendering all rows and columns, the grid dynamically generates the DOM elements for only the visible part of the dataset. As the user scrolls, rows and columns are created or destroyed on the fly, ensuring a smooth scrolling experience.
406
412
  - **Benefits**:
407
- - Reduced memory usage since only a subset of rows and columns are in the DOM at any given time.
408
- - Faster initial rendering and improved responsiveness, even with large datasets.
409
- - Enhanced user experience with seamless scrolling and interaction.
413
+ - Reduced memory usage since only a subset of rows and columns are in the DOM at any given time.
414
+ - Faster initial rendering and improved responsiveness, even with large datasets.
415
+ - Enhanced user experience with seamless scrolling and interaction.
410
416
 
411
417
  For more details, visit the [AG Grid DOM Virtualisation documentation](https://www.ag-grid.com/javascript-data-grid/dom-virtualisation/) (also available in [Tabulator Virtual DOM](https://tabulator.info/docs/6.2/virtual-dom))
412
418
 
@@ -416,9 +422,9 @@ Pagination is another effective technique to improve performance in AG Grid by b
416
422
 
417
423
  - **How It Works**: Data is divided into pages, and only the data for the current page is loaded and rendered. Users can navigate through pages using pagination controls.
418
424
  - **Benefits**:
419
- - Minimizes the amount of data loaded into the client at any given time, enhancing performance.
420
- - Provides a structured way to navigate large datasets, improving usability.
421
- - Reduces the risk of browser crashes and memory overflow issues.
425
+ - Minimizes the amount of data loaded into the client at any given time, enhancing performance.
426
+ - Provides a structured way to navigate large datasets, improving usability.
427
+ - Reduces the risk of browser crashes and memory overflow issues.
422
428
 
423
429
  ### Combined Approach
424
430
 
@@ -428,10 +434,10 @@ By leveraging both DOM Virtualisation and Pagination, our “grid components”
428
434
  - **Scrolling**: As users scroll, DOM Virtualisation ensures only the visible rows and columns are rendered, maintaining performance.
429
435
  - **Page Navigation**: Users can navigate through pages to access the full dataset without overwhelming the client.
430
436
 
431
-
432
437
  ## License
433
438
 
434
439
  Note: this project provides front-end dependencies and uses licensed components listed in the next section; thus, licenses for those components are required during development. Contact [Genesis Global](https://genesis.global/contact-us/) for more details.
435
440
 
436
441
  ### Licensed components
442
+
437
443
  Genesis low-code platform