@lowdefy/blocks-aggrid 5.6.0 → 6.0.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.
@@ -0,0 +1,686 @@
1
+ # Copyright 2020-2026 Lowdefy, Inc
2
+
3
+ # Licensed under the Apache License, Version 2.0 (the "License");
4
+ # you may not use this file except in compliance with the License.
5
+ # You may obtain a copy of the License at
6
+
7
+ # http://www.apache.org/licenses/LICENSE-2.0
8
+
9
+ # Unless required by applicable law or agreed to in writing, software
10
+ # distributed under the License is distributed on an "AS IS" BASIS,
11
+ # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
+ # See the License for the specific language governing permissions and
13
+ # limitations under the License.
14
+
15
+ id: aggridlowdefyinput
16
+ type: Box
17
+
18
+ # The input core reads its rows from the block value, so every grid is seeded from state rather
19
+ # than from a rowData property.
20
+ events:
21
+ onInit:
22
+ - id: set_defaults
23
+ type: SetState
24
+ params:
25
+ aggridlowdefyinput_basic:
26
+ - name: Alice
27
+ age: 25
28
+ - name: Bob
29
+ age: 30
30
+ - name: Charlie
31
+ age: 35
32
+ aggridlowdefyinput_height:
33
+ - name: Alice
34
+ - name: Bob
35
+ aggridlowdefyinput_default_col_def:
36
+ - name: Alice
37
+ age: 25
38
+ - name: Bob
39
+ age: 30
40
+ aggridlowdefyinput_empty: []
41
+ aggridlowdefyinput_onrowclick:
42
+ - name: Alice
43
+ age: 25
44
+ - name: Bob
45
+ age: 30
46
+ aggridlowdefyinput_oncellclick:
47
+ - name: Alice
48
+ age: 25
49
+ - name: Bob
50
+ age: 30
51
+ aggridlowdefyinput_onrowselected:
52
+ - name: Alice
53
+ age: 25
54
+ - name: Bob
55
+ age: 30
56
+ aggridlowdefyinput_sortable:
57
+ - name: Charlie
58
+ age: 35
59
+ - name: Alice
60
+ age: 25
61
+ - name: Bob
62
+ age: 30
63
+ aggridlowdefyinput_filterable:
64
+ - name: Alice
65
+ age: 25
66
+ - name: Bob
67
+ age: 30
68
+ - name: Charlie
69
+ age: 35
70
+ aggridlowdefyinput_editable:
71
+ - name: Alice
72
+ age: 25
73
+ - name: Bob
74
+ age: 30
75
+ aggridlowdefyinput_editable_no_events:
76
+ - name: Alice
77
+ age: 25
78
+ - name: Bob
79
+ age: 30
80
+ aggridlowdefyinput_rowdrag:
81
+ - name: Alice
82
+ age: 25
83
+ - name: Bob
84
+ age: 30
85
+ - name: Charlie
86
+ age: 35
87
+ aggridlowdefyinput_cell_tag:
88
+ - status: Active
89
+ - status: Blocked
90
+ - status: null
91
+ aggridlowdefyinput_cell_date:
92
+ - created_at: '2025-01-15T09:30:00Z'
93
+ - created_at: null
94
+ aggridlowdefyinput_cell_boolean:
95
+ - verified: true
96
+ active: true
97
+ - verified: false
98
+ active: false
99
+ aggridlowdefyinput_cell_number:
100
+ - revenue: 1245000
101
+ - revenue: 825500
102
+ aggridlowdefyinput_cell_inputs:
103
+ - id: t1
104
+ name: Alice
105
+ active: false
106
+ notes: Awaiting sign-off.
107
+ aggridlowdefyinput_avatar_small:
108
+ - id: u1
109
+ name: Alice Johnson
110
+ aggridlowdefyinput_avatar_large:
111
+ - id: u1
112
+ name: Alice Johnson
113
+
114
+ blocks:
115
+ # ============================================
116
+ # BASIC RENDERING
117
+ # ============================================
118
+
119
+ - id: aggridlowdefyinput_basic
120
+ type: AgGridLowdefyInput
121
+ properties:
122
+ columnDefs:
123
+ - headerName: Name
124
+ field: name
125
+ - headerName: Age
126
+ field: age
127
+
128
+ # ============================================
129
+ # PROPERTY TESTS
130
+ # ============================================
131
+
132
+ - id: aggridlowdefyinput_height
133
+ type: AgGridLowdefyInput
134
+ properties:
135
+ height: 300
136
+ columnDefs:
137
+ - headerName: Name
138
+ field: name
139
+
140
+ - id: aggridlowdefyinput_default_col_def
141
+ type: AgGridLowdefyInput
142
+ properties:
143
+ defaultColDef:
144
+ sortable: true
145
+ resizable: true
146
+ filter: true
147
+ columnDefs:
148
+ - headerName: Name
149
+ field: name
150
+ - headerName: Age
151
+ field: age
152
+
153
+ - id: aggridlowdefyinput_empty
154
+ type: AgGridLowdefyInput
155
+ properties:
156
+ columnDefs:
157
+ - headerName: Name
158
+ field: name
159
+ - headerName: Age
160
+ field: age
161
+
162
+ # ============================================
163
+ # EVENT TESTS
164
+ # ============================================
165
+
166
+ - id: aggridlowdefyinput_onrowclick
167
+ type: AgGridLowdefyInput
168
+ properties:
169
+ columnDefs:
170
+ - headerName: Name
171
+ field: name
172
+ - headerName: Age
173
+ field: age
174
+ events:
175
+ onRowClick:
176
+ - id: set_row_click
177
+ type: SetState
178
+ params:
179
+ aggridlowdefyinput_row_clicked:
180
+ _event: row.name
181
+
182
+ - id: aggridlowdefyinput_row_click_display
183
+ type: Span
184
+ properties:
185
+ content:
186
+ _if:
187
+ test:
188
+ _ne:
189
+ - _state: aggridlowdefyinput_row_clicked
190
+ - null
191
+ then:
192
+ _string.concat:
193
+ - 'Row: '
194
+ - _state: aggridlowdefyinput_row_clicked
195
+ else: ''
196
+
197
+ - id: aggridlowdefyinput_oncellclick
198
+ type: AgGridLowdefyInput
199
+ properties:
200
+ columnDefs:
201
+ - headerName: Name
202
+ field: name
203
+ - headerName: Age
204
+ field: age
205
+ events:
206
+ onCellClick:
207
+ - id: set_cell_click
208
+ type: SetState
209
+ params:
210
+ aggridlowdefyinput_cell_clicked:
211
+ _event: cell.value
212
+
213
+ - id: aggridlowdefyinput_cell_click_display
214
+ type: Span
215
+ properties:
216
+ content:
217
+ _if:
218
+ test:
219
+ _ne:
220
+ - _state: aggridlowdefyinput_cell_clicked
221
+ - null
222
+ then:
223
+ _string.concat:
224
+ - 'Cell: '
225
+ - _state: aggridlowdefyinput_cell_clicked
226
+ else: ''
227
+
228
+ # enableClickSelection is mandatory in the v33 object form: without it clicking a row selects
229
+ # nothing and onRowSelected never fires.
230
+ - id: aggridlowdefyinput_onrowselected
231
+ type: AgGridLowdefyInput
232
+ properties:
233
+ rowSelection:
234
+ mode: singleRow
235
+ checkboxes: false
236
+ enableClickSelection: true
237
+ columnDefs:
238
+ - headerName: Name
239
+ field: name
240
+ - headerName: Age
241
+ field: age
242
+ events:
243
+ onRowSelected:
244
+ - id: set_row_selected
245
+ type: SetState
246
+ params:
247
+ aggridlowdefyinput_row_selected:
248
+ _event: row.name
249
+
250
+ - id: aggridlowdefyinput_row_selected_display
251
+ type: Span
252
+ properties:
253
+ content:
254
+ _if:
255
+ test:
256
+ _ne:
257
+ - _state: aggridlowdefyinput_row_selected
258
+ - null
259
+ then:
260
+ _string.concat:
261
+ - 'Selected: '
262
+ - _state: aggridlowdefyinput_row_selected
263
+ else: ''
264
+
265
+ # ============================================
266
+ # SORTING & FILTERING
267
+ # ============================================
268
+
269
+ - id: aggridlowdefyinput_sortable
270
+ type: AgGridLowdefyInput
271
+ properties:
272
+ columnDefs:
273
+ - headerName: Name
274
+ field: name
275
+ sortable: true
276
+ - headerName: Age
277
+ field: age
278
+ sortable: true
279
+ events:
280
+ onSortChanged:
281
+ - id: set_sort_changed
282
+ type: SetState
283
+ params:
284
+ aggridlowdefyinput_sort_changed: true
285
+
286
+ - id: aggridlowdefyinput_sort_changed_display
287
+ type: Span
288
+ properties:
289
+ content:
290
+ _if:
291
+ test:
292
+ _eq:
293
+ - _state: aggridlowdefyinput_sort_changed
294
+ - true
295
+ then: Sort changed
296
+ else: ''
297
+
298
+ - id: aggridlowdefyinput_filterable
299
+ type: AgGridLowdefyInput
300
+ properties:
301
+ columnDefs:
302
+ - headerName: Name
303
+ field: name
304
+ filter: true
305
+ - headerName: Age
306
+ field: age
307
+ filter: true
308
+ events:
309
+ onFilterChanged:
310
+ - id: set_filter_changed
311
+ type: SetState
312
+ params:
313
+ aggridlowdefyinput_filter_changed: true
314
+
315
+ - id: aggridlowdefyinput_filter_changed_display
316
+ type: Span
317
+ properties:
318
+ content:
319
+ _if:
320
+ test:
321
+ _eq:
322
+ - _state: aggridlowdefyinput_filter_changed
323
+ - true
324
+ then: Filter changed
325
+ else: ''
326
+
327
+ # ============================================
328
+ # INPUT-SPECIFIC: EDITABLE CELLS
329
+ # ============================================
330
+
331
+ - id: aggridlowdefyinput_editable
332
+ type: AgGridLowdefyInput
333
+ properties:
334
+ columnDefs:
335
+ - headerName: Name
336
+ field: name
337
+ editable: true
338
+ - headerName: Age
339
+ field: age
340
+ events:
341
+ onCellValueChanged:
342
+ - id: set_cell_value_changed
343
+ type: SetState
344
+ params:
345
+ aggridlowdefyinput_cell_new_value:
346
+ _event: newValue
347
+ aggridlowdefyinput_cell_old_value:
348
+ _event: oldValue
349
+
350
+ - id: aggridlowdefyinput_cell_value_changed_display
351
+ type: Span
352
+ properties:
353
+ content:
354
+ _if:
355
+ test:
356
+ _ne:
357
+ - _state: aggridlowdefyinput_cell_new_value
358
+ - null
359
+ then:
360
+ _string.concat:
361
+ - 'New: '
362
+ - _state: aggridlowdefyinput_cell_new_value
363
+ else: ''
364
+
365
+ - id: aggridlowdefyinput_old_value_display
366
+ type: Span
367
+ properties:
368
+ content:
369
+ _if:
370
+ test:
371
+ _ne:
372
+ - _state: aggridlowdefyinput_cell_old_value
373
+ - null
374
+ then:
375
+ _string.concat:
376
+ - 'Old: '
377
+ - _state: aggridlowdefyinput_cell_old_value
378
+ else: ''
379
+
380
+ # Reads the grid's own state key. The core mutates the edited row object in place before calling
381
+ # methods.setValue, and that row object is the same reference the engine already holds in state,
382
+ # so this display follows the edit whether or not setValue ran. It shows the edit reaches the
383
+ # engine's state — it does not isolate the setValue call. aggridlowdefyinput_editable_no_events
384
+ # below is the grid that does isolate it.
385
+ - id: aggridlowdefyinput_value_display
386
+ type: Span
387
+ properties:
388
+ content:
389
+ _if:
390
+ test:
391
+ _ne:
392
+ - _state: aggridlowdefyinput_editable.0.name
393
+ - null
394
+ then:
395
+ _string.concat:
396
+ - 'Value: '
397
+ - _state: aggridlowdefyinput_editable.0.name
398
+ else: ''
399
+
400
+ # Unrelated to any grid — toggling it re-renders the page, which is how the value's survival
401
+ # across a re-render is checked.
402
+ - id: aggridlowdefyinput_rerender_toggle
403
+ type: Switch
404
+ properties:
405
+ title: Rerender
406
+
407
+ # No events are configured on this grid, so the core's triggerEvent call returns without asking
408
+ # the engine to re-render. methods.setValue is then the only thing an edit can do that re-renders
409
+ # the display below, which makes this pair the one place the setValue call itself is observable.
410
+ - id: aggridlowdefyinput_editable_no_events
411
+ type: AgGridLowdefyInput
412
+ properties:
413
+ columnDefs:
414
+ - headerName: Name
415
+ field: name
416
+ editable: true
417
+ - headerName: Age
418
+ field: age
419
+
420
+ - id: aggridlowdefyinput_no_events_value_display
421
+ type: Span
422
+ properties:
423
+ content:
424
+ _if:
425
+ test:
426
+ _ne:
427
+ - _state: aggridlowdefyinput_editable_no_events.0.name
428
+ - null
429
+ then:
430
+ _string.concat:
431
+ - 'No events value: '
432
+ - _state: aggridlowdefyinput_editable_no_events.0.name
433
+ else: ''
434
+
435
+ # ============================================
436
+ # INPUT-SPECIFIC: ROW DRAGGING
437
+ # ============================================
438
+
439
+ - id: aggridlowdefyinput_rowdrag
440
+ type: AgGridLowdefyInput
441
+ properties:
442
+ columnDefs:
443
+ - headerName: Name
444
+ field: name
445
+ rowDrag: true
446
+ - headerName: Age
447
+ field: age
448
+ events:
449
+ onRowDragEnd:
450
+ - id: set_row_drag_end
451
+ type: SetState
452
+ params:
453
+ aggridlowdefyinput_drag_from_index:
454
+ _event: fromIndex
455
+ aggridlowdefyinput_drag_to_index:
456
+ _event: toIndex
457
+ aggridlowdefyinput_drag_from_name:
458
+ _event: fromData.name
459
+ aggridlowdefyinput_drag_to_name:
460
+ _event: toData.name
461
+ aggridlowdefyinput_drag_new_order:
462
+ _event: newRowData
463
+
464
+ - id: aggridlowdefyinput_row_drag_display
465
+ type: Span
466
+ properties:
467
+ content:
468
+ _if:
469
+ test:
470
+ _ne:
471
+ - _state: aggridlowdefyinput_drag_to_index
472
+ - null
473
+ then:
474
+ _string.concat:
475
+ - 'Drag: '
476
+ - _state: aggridlowdefyinput_drag_from_name
477
+ - ' ('
478
+ - _state: aggridlowdefyinput_drag_from_index
479
+ - ') -> '
480
+ - _state: aggridlowdefyinput_drag_to_name
481
+ - ' ('
482
+ - _state: aggridlowdefyinput_drag_to_index
483
+ - ')'
484
+ else: ''
485
+
486
+ - id: aggridlowdefyinput_row_drag_order_display
487
+ type: Span
488
+ properties:
489
+ content:
490
+ _if:
491
+ test:
492
+ _ne:
493
+ - _state: aggridlowdefyinput_drag_new_order
494
+ - null
495
+ then:
496
+ _string.concat:
497
+ - 'Event order: '
498
+ - _state: aggridlowdefyinput_drag_new_order.0.name
499
+ - ', '
500
+ - _state: aggridlowdefyinput_drag_new_order.1.name
501
+ - ', '
502
+ - _state: aggridlowdefyinput_drag_new_order.2.name
503
+ else: ''
504
+
505
+ # onRowDragEnd builds a new array rather than mutating the rows, so unlike the cell-edit case the
506
+ # grid's state key only takes the new order if methods.setValue ran with it.
507
+ - id: aggridlowdefyinput_row_drag_value_display
508
+ type: Span
509
+ properties:
510
+ content:
511
+ _if:
512
+ test:
513
+ _ne:
514
+ - _state: aggridlowdefyinput_rowdrag.0.name
515
+ - null
516
+ then:
517
+ _string.concat:
518
+ - 'Value order: '
519
+ - _state: aggridlowdefyinput_rowdrag.0.name
520
+ - ', '
521
+ - _state: aggridlowdefyinput_rowdrag.1.name
522
+ - ', '
523
+ - _state: aggridlowdefyinput_rowdrag.2.name
524
+ else: ''
525
+
526
+ # ============================================
527
+ # BUILT-IN CELL RENDERERS — cell.type
528
+ # ============================================
529
+
530
+ - id: aggridlowdefyinput_cell_tag
531
+ type: AgGridLowdefyInput
532
+ properties:
533
+ columnDefs:
534
+ - headerName: Status
535
+ field: status
536
+ cell:
537
+ type: tag
538
+ colorMap:
539
+ Active: green
540
+ Blocked: red
541
+
542
+ - id: aggridlowdefyinput_cell_date
543
+ type: AgGridLowdefyInput
544
+ properties:
545
+ columnDefs:
546
+ - headerName: Created
547
+ field: created_at
548
+ cell:
549
+ type: date
550
+ - headerName: Custom
551
+ field: created_at
552
+ cell:
553
+ type: date
554
+ format: YYYY/MM/DD
555
+
556
+ - id: aggridlowdefyinput_cell_boolean
557
+ type: AgGridLowdefyInput
558
+ properties:
559
+ columnDefs:
560
+ - headerName: Verified
561
+ field: verified
562
+ cell:
563
+ type: boolean
564
+ - headerName: Active
565
+ field: active
566
+ cell:
567
+ type: boolean
568
+ trueLabel: Yes!
569
+ falseLabel: Nope
570
+
571
+ - id: aggridlowdefyinput_cell_number
572
+ type: AgGridLowdefyInput
573
+ properties:
574
+ columnDefs:
575
+ - headerName: Revenue
576
+ field: revenue
577
+ cell:
578
+ type: number
579
+ format: currency
580
+ currency: USD
581
+ decimals: 0
582
+
583
+ # The input-flavoured cells write through node.setDataValue, so the block value follows without
584
+ # the app persisting anything — unlike on a display block, where the app owns the write-back.
585
+ - id: aggridlowdefyinput_cell_inputs
586
+ type: AgGridLowdefyInput
587
+ properties:
588
+ columnDefs:
589
+ - headerName: Name
590
+ field: name
591
+ cell:
592
+ type: textInput
593
+ eventName: onNameInput
594
+ - headerName: Active
595
+ field: active
596
+ cell:
597
+ type: switch
598
+ eventName: onActiveToggle
599
+ - headerName: Notes
600
+ field: notes
601
+ cell:
602
+ type: paragraphInput
603
+ eventName: onNotesInput
604
+ events:
605
+ onNameInput:
606
+ - id: set_name_input
607
+ type: SetState
608
+ params:
609
+ aggridlowdefyinput_name_input:
610
+ _event: newValue
611
+ onActiveToggle:
612
+ - id: set_active_toggle
613
+ type: SetState
614
+ params:
615
+ aggridlowdefyinput_active_toggle:
616
+ _event: newValue
617
+
618
+ - id: aggridlowdefyinput_name_input_display
619
+ type: Span
620
+ properties:
621
+ content:
622
+ _if:
623
+ test:
624
+ _ne:
625
+ - _state: aggridlowdefyinput_name_input
626
+ - null
627
+ then:
628
+ _string.concat:
629
+ - 'Name: '
630
+ - _state: aggridlowdefyinput_name_input
631
+ else: ''
632
+
633
+ - id: aggridlowdefyinput_active_toggle_display
634
+ type: Span
635
+ properties:
636
+ content:
637
+ _if:
638
+ test:
639
+ _eq:
640
+ - _state: aggridlowdefyinput_active_toggle
641
+ - true
642
+ then: 'Active: true'
643
+ else: ''
644
+
645
+ - id: aggridlowdefyinput_inputs_value_display
646
+ type: Span
647
+ properties:
648
+ content:
649
+ _if:
650
+ test:
651
+ _ne:
652
+ - _state: aggridlowdefyinput_cell_inputs.0.name
653
+ - null
654
+ then:
655
+ _string.concat:
656
+ - 'Row name: '
657
+ - _state: aggridlowdefyinput_cell_inputs.0.name
658
+ else: ''
659
+
660
+ # ============================================
661
+ # SIZE — avatar CSS custom properties
662
+ # ============================================
663
+
664
+ - id: aggridlowdefyinput_avatar_small
665
+ type: AgGridLowdefyInput
666
+ properties:
667
+ size: small
668
+ columnDefs:
669
+ - headerName: Assignee
670
+ field: name
671
+ cell:
672
+ type: avatar
673
+ nameField: name
674
+ idField: id
675
+
676
+ - id: aggridlowdefyinput_avatar_large
677
+ type: AgGridLowdefyInput
678
+ properties:
679
+ size: large
680
+ columnDefs:
681
+ - headerName: Assignee
682
+ field: name
683
+ cell:
684
+ type: avatar
685
+ nameField: name
686
+ idField: id