@cdmx/wappler_ag_grid 0.4.9 → 0.5.1
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/README.md +26 -28
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -7,12 +7,11 @@ The AG Grid module allows you to create a flexible and customizable data grid wi
|
|
|
7
7
|
|
|
8
8
|
1. **ID**: Unique ID for the grid. (Required)
|
|
9
9
|
2. **Data Source**: Data source for the grid. Enter the data source to populate the grid. (Required)
|
|
10
|
-
3. **No Auto Load**: Set to true to disable auto-load of the grid. (Default:
|
|
10
|
+
3. **No Auto Load**: Set to true to disable auto-load of the grid. (Default: false)
|
|
11
11
|
4. **Theme**: Select a theme for the grid.
|
|
12
|
-
- "Alpine"
|
|
12
|
+
- "Alpine" (Default)
|
|
13
13
|
- "Balham"
|
|
14
14
|
- "Material"
|
|
15
|
-
- "Base" (Default)
|
|
16
15
|
5. **Locale**: Select the locale for the grid. Currently supported locales: English (EN) and Hebrew (HE). (Default: EN)
|
|
17
16
|
|
|
18
17
|
## AG Grid Options
|
|
@@ -30,7 +29,7 @@ The AG Grid module allows you to create a flexible and customizable data grid wi
|
|
|
30
29
|
17. **Row Selection**: Row Selection (single or multiple).
|
|
31
30
|
- "Single"
|
|
32
31
|
- "Multiple" (Default)
|
|
33
|
-
18. **Timezone**: Timezone for Date Fields. Select the appropriate timezone from the dropdown list.
|
|
32
|
+
18. **Timezone**: Timezone for Date Fields. Select the appropriate timezone from the dropdown list. (Default: Local)
|
|
34
33
|
19. **Date Format**: Date Format for displaying date values. (Default: "dd/MM/yyyy hh:mm A")
|
|
35
34
|
20. **Sticky Header**: Enable sticky header. Optionally specify the header offset and topbar class.
|
|
36
35
|
- Header Offset: Specifies offset from the top of the viewport area (Optional). (Default: 100)
|
|
@@ -58,8 +57,8 @@ The AG Grid module allows you to create a flexible and customizable data grid wi
|
|
|
58
57
|
The Data Type Overrides feature allows you to configure type overrides for specific attributes in the data. This allows you to override the auto-detected data types.
|
|
59
58
|
This grid allows you to define custom type overrides for specific fields in the data. The grid has the following columns:
|
|
60
59
|
|
|
61
|
-
1. **Field**: The field name for which you want to override the data type.
|
|
62
|
-
2. **Type**: The new data type you want to assign to the field. Choose from "number," "text," or "date."
|
|
60
|
+
1. **Field**: The field name for which you want to override the data type.
|
|
61
|
+
2. **Type**: The new data type you want to assign to the field. Choose from "number," "text," or "date."
|
|
63
62
|
|
|
64
63
|
---
|
|
65
64
|
|
|
@@ -68,11 +67,11 @@ This grid allows you to define custom type overrides for specific fields in the
|
|
|
68
67
|
The Style Formatting feature allows you to configure custom colors and fonts for column data based on certain conditions.
|
|
69
68
|
This grid allows you to define custom color and font settings based on specific conditions. The grid has the following columns:
|
|
70
69
|
|
|
71
|
-
1. **Field**: The field name for which you want to apply the custom color and font settings. (
|
|
72
|
-
2. **Condition**: The condition to check for applying the custom color and font settings. (
|
|
73
|
-
3. **Color**: The custom color to apply when the condition is met. Enter the color in HEX format (e.g., "#FF0000") or use named colors (e.g., "red").
|
|
74
|
-
4. **Area**: Choose where to apply the color: "text" (cell text) or "cell" (cell background).
|
|
75
|
-
5. **Font**: Choose the font style: "normal," "italic," or "bold."
|
|
70
|
+
1. **Field**: The field name for which you want to apply the custom color and font settings. (eg. first_name or status)
|
|
71
|
+
2. **Condition**: The condition to check for applying the custom color and font settings. (eg. status=false or name=K den)
|
|
72
|
+
3. **Color**: The custom color to apply when the condition is met. Enter the color in HEX format (e.g., "#FF0000") or use named colors (e.g., "red").
|
|
73
|
+
4. **Area**: Choose where to apply the color: "text" (cell text) or "cell" (cell background).
|
|
74
|
+
5. **Font**: Choose the font style: "normal," "italic," or "bold."
|
|
76
75
|
---
|
|
77
76
|
|
|
78
77
|
# Tooltip Settings
|
|
@@ -82,8 +81,8 @@ The Tooltip Settings feature allows you to configure custom tooltips for specifi
|
|
|
82
81
|
To set a custom tooltip text, enter the desired text for the tooltip in the field.
|
|
83
82
|
This grid allows you to configure custom tooltips for specific fields. The grid has the following columns:
|
|
84
83
|
|
|
85
|
-
1. **Field**: The field name for which you want to set a custom tooltip.
|
|
86
|
-
2. **Tooltip**: Choose whether to enable ("yes") or disable ("no") the tooltip for the field.
|
|
84
|
+
1. **Field**: The field name for which you want to set a custom tooltip.
|
|
85
|
+
2. **Tooltip**: Choose whether to enable ("yes") or disable ("no") the tooltip for the field.
|
|
87
86
|
---
|
|
88
87
|
|
|
89
88
|
# Advanced Data Manipulation
|
|
@@ -91,11 +90,11 @@ This grid allows you to configure custom tooltips for specific fields. The grid
|
|
|
91
90
|
The Advanced Data Manipulation feature allows you to add custom values to the field data based on specific conditions.
|
|
92
91
|
This grid allows you to define custom data changes for specific fields. The grid has the following columns:
|
|
93
92
|
|
|
94
|
-
1. **Field**: The field name for which you want to apply the custom data changes. (
|
|
95
|
-
2. **Data**: The new data source or value to be used for the field. (
|
|
96
|
-
3. **Property**: The property within the data source to use as the new value for the field. (
|
|
97
|
-
4. **Output**: The output value for the field. (
|
|
98
|
-
5. **Area**: Choose where to apply the data changes: "cell" (cell text) or "tooltip" (tooltip text).
|
|
93
|
+
1. **Field**: The field name for which you want to apply the custom data changes. (field name)
|
|
94
|
+
2. **Data**: The new data source or value to be used for the field. (Eg. SC data source array or JSON Data source)
|
|
95
|
+
3. **Property**: The property within the data source to use as the new value for the field. (Input parameter array)
|
|
96
|
+
4. **Output**: The output value for the field. (Output parameter, similar to where clause)
|
|
97
|
+
5. **Area**: Choose where to apply the data changes: "cell" (cell text) or "tooltip" (tooltip text).
|
|
99
98
|
|
|
100
99
|
|
|
101
100
|
---
|
|
@@ -105,17 +104,17 @@ This grid allows you to define custom data changes for specific fields. The grid
|
|
|
105
104
|
The Data Manipulation feature allows you to add custom values to the field data based on specific conditions.
|
|
106
105
|
This grid allows you to define custom data changes for specific fields. The grid has the following columns:
|
|
107
106
|
|
|
108
|
-
1. **Field**: The field name for which you want to apply the custom data changes.
|
|
109
|
-
2. **Value**: The value to be replaced in the field data.
|
|
110
|
-
3. **New Value**: The new value to replace the original value in the field data.
|
|
111
|
-
4. **Area**: Choose where to apply the data changes: "cell" (cell text) or "tooltip" (tooltip text).
|
|
107
|
+
1. **Field**: The field name for which you want to apply the custom data changes.
|
|
108
|
+
2. **Value**: The value to be replaced in the field data.
|
|
109
|
+
3. **New Value**: The new value to replace the original value in the field data.
|
|
110
|
+
4. **Area**: Choose where to apply the data changes: "cell" (cell text) or "tooltip" (tooltip text).
|
|
112
111
|
|
|
113
112
|
---
|
|
114
113
|
**Configure Header Names**
|
|
115
114
|
This grid allows you to define custom header names for specific columns. The grid has the following columns:
|
|
116
115
|
|
|
117
|
-
1. **Field**: The field name for which you want to set a custom header name.
|
|
118
|
-
2. **Name**: The custom header name to be displayed for the column.
|
|
116
|
+
1. **Field**: The field name for which you want to set a custom header name.
|
|
117
|
+
2. **Name**: The custom header name to be displayed for the column.
|
|
119
118
|
|
|
120
119
|
Please note that these changes will only take effect when the `cnames` attribute is set to `true`.
|
|
121
120
|
|
|
@@ -128,9 +127,9 @@ The Custom Widths feature allows you to configure custom column widths for colum
|
|
|
128
127
|
**Configure Custom Widths**
|
|
129
128
|
This grid allows you to define custom column widths for specific columns. The grid has the following columns:
|
|
130
129
|
|
|
131
|
-
1. **Field**: The field name for which you want to set a custom column width.
|
|
132
|
-
2. **Min Width**: The minimum width for the column.
|
|
133
|
-
3. **Max Width**: The maximum width for the column.
|
|
130
|
+
1. **Field**: The field name for which you want to set a custom column width.
|
|
131
|
+
2. **Min Width**: The minimum width for the column.
|
|
132
|
+
3. **Max Width**: The maximum width for the column.
|
|
134
133
|
|
|
135
134
|
# Hide Fields and Filters
|
|
136
135
|
|
|
@@ -205,4 +204,3 @@ Specify the CSS class for styling the icon of the Delete Action button.
|
|
|
205
204
|
The AG Grid module is licensed under the MIT License. Please refer to the license file for more details.
|
|
206
205
|
|
|
207
206
|
For any issues or further assistance, please contact our support team.
|
|
208
|
-
|