@lowdefy/blocks-aggrid 5.6.0 → 6.0.0

package/dist/blocks/AgGridInputAlpine/gallery.yaml

@@ -0,0 +1,362 @@
+# Copyright 2020-2026 Lowdefy, Inc
+
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+
+#     http://www.apache.org/licenses/LICENSE-2.0
+
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+- title: Input Alpine - Basic Editable Table
+  fullWidth: true
+  blocks:
+    - id: input_alpine_basic_editable
+      type: AgGridInputAlpine
+      properties:
+        height: 300
+        defaultColDef:
+          editable: true
+          flex: 1
+        columnDefs:
+          - field: name
+            headerName: Name
+          - field: age
+            headerName: Age
+          - field: email
+            headerName: Email
+          - field: country
+            headerName: Country
+        rowData:
+          - name: Alice Johnson
+            age: 28
+            email: alice@example.com
+            country: United States
+          - name: Bob Smith
+            age: 35
+            email: bob@example.com
+            country: United Kingdom
+          - name: Charlie Lee
+            age: 42
+            email: charlie@example.com
+            country: Japan
+          - name: Diana Patel
+            age: 31
+            email: diana@example.com
+            country: India
+          - name: Erik Johansson
+            age: 26
+            email: erik@example.com
+            country: Sweden
+
+- title: Input Alpine - Mixed Editable Columns
+  fullWidth: true
+  blocks:
+    - id: input_alpine_mixed_editable
+      type: AgGridInputAlpine
+      properties:
+        height: 300
+        columnDefs:
+          - field: id
+            headerName: ID
+            width: 80
+            editable: false
+            pinned: left
+          - field: product
+            headerName: Product Name
+            flex: 2
+            editable: true
+          - field: category
+            headerName: Category
+            flex: 1
+            editable: true
+          - field: price
+            headerName: Price ($)
+            width: 120
+            editable: true
+          - field: stock
+            headerName: Stock
+            width: 100
+            editable: true
+          - field: rating
+            headerName: Rating
+            width: 100
+            editable: false
+        rowData:
+          - id: 1
+            product: Wireless Keyboard
+            category: Electronics
+            price: 49.99
+            stock: 230
+            rating: 4.5
+          - id: 2
+            product: Standing Desk
+            category: Furniture
+            price: 399.00
+            stock: 45
+            rating: 4.8
+          - id: 3
+            product: USB-C Hub
+            category: Electronics
+            price: 29.99
+            stock: 520
+            rating: 4.2
+          - id: 4
+            product: Ergonomic Chair
+            category: Furniture
+            price: 289.00
+            stock: 78
+            rating: 4.6
+          - id: 5
+            product: Webcam HD
+            category: Electronics
+            price: 79.99
+            stock: 310
+            rating: 4.0
+
+- title: Input Alpine - Default Column Definitions
+  fullWidth: true
+  blocks:
+    - id: input_alpine_default_col_def
+      type: AgGridInputAlpine
+      properties:
+        height: 300
+        defaultColDef:
+          sortable: true
+          filter: true
+          resizable: true
+          editable: true
+          flex: 1
+        columnDefs:
+          - field: employee
+            headerName: Employee
+          - field: department
+            headerName: Department
+          - field: title
+            headerName: Job Title
+          - field: location
+            headerName: Office
+          - field: startDate
+            headerName: Start Date
+        rowData:
+          - employee: Sarah Chen
+            department: Engineering
+            title: Senior Developer
+            location: San Francisco
+            startDate: '2019-03-15'
+          - employee: James Wilson
+            department: Marketing
+            title: Campaign Manager
+            location: New York
+            startDate: '2020-07-01'
+          - employee: Maria Garcia
+            department: Engineering
+            title: Tech Lead
+            location: Austin
+            startDate: '2018-11-20'
+          - employee: David Kim
+            department: Sales
+            title: Account Executive
+            location: Chicago
+            startDate: '2021-01-10'
+          - employee: Emily Brown
+            department: Design
+            title: UX Designer
+            location: San Francisco
+            startDate: '2020-09-05'
+
+- title: Input Alpine - Row Selection
+  fullWidth: true
+  blocks:
+    - id: input_alpine_row_selection
+      type: AgGridInputAlpine
+      properties:
+        height: 300
+        rowSelection:
+          mode: multiRow
+          checkboxes: false
+          headerCheckbox: false
+          enableClickSelection: true
+        defaultColDef:
+          sortable: true
+          editable: true
+          flex: 1
+        columnDefs:
+          - field: task
+            headerName: Task
+            flex: 2
+          - field: assignee
+            headerName: Assignee
+          - field: priority
+            headerName: Priority
+            width: 120
+          - field: status
+            headerName: Status
+            width: 120
+        rowData:
+          - task: Design login page
+            assignee: Alice
+            priority: High
+            status: Done
+          - task: Implement API endpoints
+            assignee: Bob
+            priority: High
+            status: In Progress
+          - task: Write unit tests
+            assignee: Charlie
+            priority: Medium
+            status: To Do
+          - task: Update documentation
+            assignee: Diana
+            priority: Low
+            status: To Do
+          - task: Code review PR #42
+            assignee: Erik
+            priority: Medium
+            status: In Progress
+
+- title: Input Alpine - Pagination
+  fullWidth: true
+  blocks:
+    - id: input_alpine_pagination
+      type: AgGridInputAlpine
+      properties:
+        height: 350
+        pagination: true
+        paginationPageSize: 5
+        defaultColDef:
+          sortable: true
+          filter: true
+          editable: true
+          flex: 1
+        columnDefs:
+          - field: orderId
+            headerName: Order ID
+            editable: false
+            width: 120
+          - field: customer
+            headerName: Customer
+          - field: product
+            headerName: Product
+          - field: quantity
+            headerName: Qty
+            width: 80
+          - field: total
+            headerName: Total ($)
+            width: 110
+          - field: status
+            headerName: Status
+            width: 120
+        rowData:
+          - orderId: ORD-501
+            customer: Acme Corp
+            product: Widget Pro
+            quantity: 50
+            total: 2499.50
+            status: Shipped
+          - orderId: ORD-502
+            customer: Globex Inc
+            product: Gadget X
+            quantity: 25
+            total: 1249.75
+            status: Processing
+          - orderId: ORD-503
+            customer: Initech
+            product: Widget Pro
+            quantity: 100
+            total: 4999.00
+            status: Delivered
+          - orderId: ORD-504
+            customer: Umbrella Ltd
+            product: Connector A
+            quantity: 200
+            total: 1998.00
+            status: Shipped
+          - orderId: ORD-505
+            customer: Stark Ind
+            product: Gadget X
+            quantity: 10
+            total: 499.90
+            status: Processing
+          - orderId: ORD-506
+            customer: Wayne Ent
+            product: Widget Pro
+            quantity: 75
+            total: 3749.25
+            status: Delivered
+          - orderId: ORD-507
+            customer: Oscorp
+            product: Connector A
+            quantity: 150
+            total: 1498.50
+            status: Shipped
+          - orderId: ORD-508
+            customer: LexCorp
+            product: Gadget X
+            quantity: 30
+            total: 1499.70
+            status: Processing
+
+- title: Input Alpine - Column Styling
+  fullWidth: true
+  blocks:
+    - id: input_alpine_styled_columns
+      type: AgGridInputAlpine
+      properties:
+        height: 300
+        defaultColDef:
+          sortable: true
+          editable: true
+          flex: 1
+        columnDefs:
+          - field: metric
+            headerName: Metric
+            flex: 2
+            editable: false
+            cellStyle:
+              fontWeight: bold
+          - field: q1
+            headerName: Q1
+            cellStyle:
+              backgroundColor: '#e6f7ff'
+              textAlign: right
+          - field: q2
+            headerName: Q2
+            cellStyle:
+              backgroundColor: '#f6ffed'
+              textAlign: right
+          - field: q3
+            headerName: Q3
+            cellStyle:
+              backgroundColor: '#fff7e6'
+              textAlign: right
+          - field: q4
+            headerName: Q4
+            cellStyle:
+              backgroundColor: '#fff1f0'
+              textAlign: right
+        rowData:
+          - metric: Revenue ($K)
+            q1: 1250
+            q2: 1380
+            q3: 1520
+            q4: 1690
+          - metric: New Customers
+            q1: 145
+            q2: 162
+            q3: 178
+            q4: 201
+          - metric: Churn Rate (%)
+            q1: 3.2
+            q2: 2.8
+            q3: 2.5
+            q4: 2.1
+          - metric: NPS Score
+            q1: 42
+            q2: 45
+            q3: 48
+            q4: 52

package/dist/blocks/AgGridInputAlpine/tests/AgGridInputAlpine.e2e.yaml

@@ -0,0 +1,365 @@
+# Copyright 2020-2026 Lowdefy, Inc
+
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+
+#     http://www.apache.org/licenses/LICENSE-2.0
+
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+id: aggridinputalpine
+type: Box
+
+events:
+  onInit:
+    - id: set_defaults
+      type: SetState
+      params:
+        aggridinputalpine_basic:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+          - name: Charlie
+            age: 35
+        aggridinputalpine_height:
+          - name: Alice
+          - name: Bob
+        aggridinputalpine_default_col_def:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_onrowclick:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_oncellclick:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_onrowselected:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_sortable:
+          - name: Charlie
+            age: 35
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_filterable:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+          - name: Charlie
+            age: 35
+        aggridinputalpine_editable:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+        aggridinputalpine_rowdrag:
+          - name: Alice
+            age: 25
+          - name: Bob
+            age: 30
+          - name: Charlie
+            age: 35
+
+blocks:
+  # ============================================
+  # BASIC RENDERING
+  # ============================================
+
+  - id: aggridinputalpine_basic
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+        - headerName: Age
+          field: age
+
+  # ============================================
+  # PROPERTY TESTS
+  # ============================================
+
+  - id: aggridinputalpine_height
+    type: AgGridInputAlpine
+    properties:
+      height: 300
+      columnDefs:
+        - headerName: Name
+          field: name
+
+  - id: aggridinputalpine_default_col_def
+    type: AgGridInputAlpine
+    properties:
+      defaultColDef:
+        sortable: true
+        resizable: true
+        filter: true
+      columnDefs:
+        - headerName: Name
+          field: name
+        - headerName: Age
+          field: age
+
+  # ============================================
+  # EVENT TESTS
+  # ============================================
+
+  - id: aggridinputalpine_onrowclick
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+        - headerName: Age
+          field: age
+    events:
+      onRowClick:
+        - id: set_row_click
+          type: SetState
+          params:
+            aggridinputalpine_row_clicked:
+              _event: row.name
+
+  - id: aggridinputalpine_row_click_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _ne:
+              - _state: aggridinputalpine_row_clicked
+              - null
+          then:
+            _string.concat:
+              - 'Row: '
+              - _state: aggridinputalpine_row_clicked
+          else: ''
+
+  - id: aggridinputalpine_oncellclick
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+        - headerName: Age
+          field: age
+    events:
+      onCellClick:
+        - id: set_cell_click
+          type: SetState
+          params:
+            aggridinputalpine_cell_clicked:
+              _event: cell.value
+
+  - id: aggridinputalpine_cell_click_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _ne:
+              - _state: aggridinputalpine_cell_clicked
+              - null
+          then:
+            _string.concat:
+              - 'Cell: '
+              - _state: aggridinputalpine_cell_clicked
+          else: ''
+
+  - id: aggridinputalpine_onrowselected
+    type: AgGridInputAlpine
+    properties:
+      rowSelection:
+        mode: singleRow
+        checkboxes: false
+        enableClickSelection: true
+      columnDefs:
+        - headerName: Name
+          field: name
+        - headerName: Age
+          field: age
+    events:
+      onRowSelected:
+        - id: set_row_selected
+          type: SetState
+          params:
+            aggridinputalpine_row_selected:
+              _event: row.name
+
+  - id: aggridinputalpine_row_selected_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _ne:
+              - _state: aggridinputalpine_row_selected
+              - null
+          then:
+            _string.concat:
+              - 'Selected: '
+              - _state: aggridinputalpine_row_selected
+          else: ''
+
+  # ============================================
+  # SORTING & FILTERING
+  # ============================================
+
+  - id: aggridinputalpine_sortable
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+          sortable: true
+        - headerName: Age
+          field: age
+          sortable: true
+    events:
+      onSortChanged:
+        - id: set_sort_changed
+          type: SetState
+          params:
+            aggridinputalpine_sort_changed: true
+
+  - id: aggridinputalpine_sort_changed_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _eq:
+              - _state: aggridinputalpine_sort_changed
+              - true
+          then: Sort changed
+          else: ''
+
+  - id: aggridinputalpine_filterable
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+          filter: true
+        - headerName: Age
+          field: age
+          filter: true
+    events:
+      onFilterChanged:
+        - id: set_filter_changed
+          type: SetState
+          params:
+            aggridinputalpine_filter_changed: true
+
+  - id: aggridinputalpine_filter_changed_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _eq:
+              - _state: aggridinputalpine_filter_changed
+              - true
+          then: Filter changed
+          else: ''
+
+  # ============================================
+  # INPUT-SPECIFIC: EDITABLE CELLS
+  # ============================================
+
+  - id: aggridinputalpine_editable
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+          editable: true
+        - headerName: Age
+          field: age
+    events:
+      onCellValueChanged:
+        - id: set_cell_value_changed
+          type: SetState
+          params:
+            aggridinputalpine_cell_new_value:
+              _event: newValue
+            aggridinputalpine_cell_old_value:
+              _event: oldValue
+
+  - id: aggridinputalpine_cell_value_changed_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _ne:
+              - _state: aggridinputalpine_cell_new_value
+              - null
+          then:
+            _string.concat:
+              - 'New: '
+              - _state: aggridinputalpine_cell_new_value
+          else: ''
+
+  - id: aggridinputalpine_old_value_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _ne:
+              - _state: aggridinputalpine_cell_old_value
+              - null
+          then:
+            _string.concat:
+              - 'Old: '
+              - _state: aggridinputalpine_cell_old_value
+          else: ''
+
+  # ============================================
+  # INPUT-SPECIFIC: ROW DRAGGING
+  # ============================================
+
+  - id: aggridinputalpine_rowdrag
+    type: AgGridInputAlpine
+    properties:
+      columnDefs:
+        - headerName: Name
+          field: name
+          rowDrag: true
+        - headerName: Age
+          field: age
+    events:
+      onRowDragEnd:
+        - id: set_row_drag_end
+          type: SetState
+          params:
+            aggridinputalpine_drag_ended: true
+
+  - id: aggridinputalpine_row_drag_display
+    type: Span
+    properties:
+      content:
+        _if:
+          test:
+            _eq:
+              - _state: aggridinputalpine_drag_ended
+              - true
+          then: Drag ended
+          else: ''