Skip to main content
An advanced grid component that displays data objects for a specific group taxon with support for headers, collapsing, adding data objects, and data object movement between different taxon groups. This is a full-featured grid with extensive configuration options for complex data management workflows.

​
Type

type: "taxonGrid"

​
Properties

​
Required Properties

PropertyTypeDescription
groupTaxongroupTaxonThe data element group to display

​
Optional Properties

PropertyTypeDescriptionDefault
showHeaderbooleanWhether to display the header sectiontrue
titlestringHeader title to display-
subtitlestringSubtitle to display below the title-
hideAddbooleanHide the add buttonfalse
hideExceptionsbooleanHide exceptions displayfalse
hideCollapsebooleanHide the collapse/expand buttonfalse
rowSpannumberHeight of each row in 24px units1

​
Advanced Properties

​
taxonMovement (object)

Configure data object movement between different taxon groups.
Sub-PropertyTypeDescription
enabledbooleanEnable taxon movement functionality
ruleslistDefine movement rules between taxons
Movement Rule Properties:
PropertyTypeDescriptionDefault
sourceTaxongroupTaxonData element that can be moved-
allowedDestinationslistList of destinations with optional attribute mappings-
buttonLabelstringCustom label for move button”Move to…“
buttonIconstringCustom icon for move button”arrow-up-down-bold-outline”
confirmationMessagestringCustom confirmation message-
Destination Configuration:
PropertyTypeDescription
destinationgroupTaxonTarget data element group
attributeMappingslistMap source attributes to destination attributes
Attribute Mapping:
PropertyTypeDescription
sourcetaxonName of the source attribute
destinationtaxonName of the destination attribute

​
filters (list)

Filter the displayed data objects based on specific criteria.
PropertyTypeDescription
typestringFilter type (e.g., “hasExceptionMessage”)
valuestringFilter value to match

​
Layout

  • Default Width: 12 columns
  • Default Height: 10 rows
  • Supports Children: No

​
Configuration Examples

​
Basic Grid

- type: taxonGrid
  id: lineItemsGrid
  properties:
    showHeader: true
    title: "Line Items"
    subtitle: "Invoice line items"
    groupTaxon: "lineItem"
  layout:
    x: 0
    y: 0
    w: 12
    h: 8

​
Grid with Data Movement

- type: taxonGrid
  id: itemsGrid
  properties:
    title: "Items"
    groupTaxon: "lineItem"
    taxonMovement:
      enabled: true
      rules:
        - sourceTaxon: "lineItem"
          allowedDestinations:
            - destination: "rejectedItem"
              attributeMappings:
                - source: "lineItem/description"
                  destination: "rejectedItem/reason"
          buttonLabel: "Reject"
          buttonIcon: "close-circle"
  layout:
    x: 0
    y: 0
    w: 12
    h: 10

​
Grid with Exception Filtering

- type: taxonGrid
  id: errorGrid
  properties:
    title: "Items with Errors"
    groupTaxon: "lineItem"
    filters:
      - type: "hasExceptionMessage"
        value: "Validation Failed"
  layout:
    x: 0
    y: 0
    w: 12
    h: 6

​
Grid with Custom Row Height

- type: taxonGrid
  id: tallGrid
  properties:
    groupTaxon: "customer"
    rowSpan: 3
  layout:
    x: 0
    y: 0
    w: 12
    h: 10

​
Advanced Usage

​
Collapsible Grid

The grid supports collapse/expand functionality:
  • Click the collapse button to hide the grid content
  • Click again to show it
  • Useful for conserving screen space in large forms

​
Add Data Objects

The grid provides multiple ways to add data objects:
  • Add button: Adds a new data object as a child of the parent
  • Add above: Add a new object above a specific row (via grid row menu)
  • Add below: Add a new object below a specific row (via grid row menu)

​
Data Object Movement

When movement is enabled:
  1. A move button appears in each row
  2. Users can select from allowed destination taxons
  3. Attribute mappings automatically transfer data
  4. Source data object is moved or copied based on mode

​
Sorting

Data objects are automatically sorted by:
  1. Source ordering (if available)
  2. Alphabetically by a fallback field

​
Parent Data Object Scoping

When a parent data object is provided:
  • Grid shows only child objects of that parent
  • Handles both saved objects (by parentId) and unsaved objects (by parent.uuid)
  • Maintains parent-child relationships during add operations

​
Notes

  • The grid integrates with the workspace store for data management
  • Movement functionality uses centralized moveDataObject function for consistency
  • The grid is editable by default when rendered
  • Header can be hidden while still showing add/collapse buttons
  • Collapse state is managed locally (not persisted)
  • Exception filtering supports multiple filter types
  • The component handles complex parent-child relationships
  • Row height is calculated as rowSpan * 24px
  • Empty objects are filtered at the store level
  • The grid supports grouping functionality when enabled