Skip to main content
The transposed grid rollup component now supports configuration-driven movement of data objects and cell background color customization. Each rollup column can define its own movement rules and visual styling, allowing flexible data reorganization without hardcoding.

​
Configuration Structure

Movement configuration is defined on each rollup column child within a card definition. You can also configure background colors for empty vs non-empty rollup cells: 
{
  type: 'rollupColumn',
  id: 'BalanceSheet/Assets',
  properties: {
    title: 'Assets',
    // Background color configuration
    emptyRollupBackgroundColor?: string,      // Color for cells with no value
    notEmptyRollupBackgroundColor?: string,   // Color for cells with values
    // ... other properties
    movement: {
      enabled: boolean,
      showOnRows: 'parent' | 'child' | 'both',
      rule: {
        sourceTaxon?: string,  // Optional, defaults to rollup taxonPath
        allowedDestinations: string[] | 'siblings' | 'same-prefix',
        buttonLabel?: string,
        buttonIcon?: string,
        batchMode?: boolean,
        labelReplace?: {
          find: string,
          replace: string
        }
      }
    }
  }
}

​
Configuration Properties

​
movement.enabled

  • Type: boolean
  • Description: Enables or disables movement functionality for this rollup
  • Default: false

​
movement.showOnRows

  • Type: 'parent' | 'child' | 'both'
  • Description: Controls which row types display the move button
    • 'parent': Shows on summary/title rows only
    • 'child': Shows on detail/description rows only (previous default behavior)
    • 'both': Shows on both parent and child rows

​
movement.rule.sourceTaxon

  • Type: string (optional)
  • Description: The taxon path of objects that can be moved
  • Default: Uses the rollup’s taxonPath

​
movement.rule.allowedDestinations

  • Type: string[] | 'siblings' | 'same-prefix'
  • Description: Defines where objects can be moved to
    • string[]: List of destination taxon paths or regex patterns
      • Literal paths: Exact taxon paths (e.g., 'BalanceSheet/Assets')
      • Regex patterns: Pattern strings that match multiple taxons (e.g., 'Group_.*', '.*_Total$')
      • When a regex pattern matches multiple taxons, all matching group taxons are included as destinations
    • 'siblings': Allow moving to any sibling rollup (different taxon, same level)
    • 'same-prefix': Allow moving to rollups with the same prefix (e.g., BS/* can move to other BS/* rollups)

​
movement.rule.buttonLabel

  • Type: string (optional)
  • Description: Custom label for the move button
  • Default: 'Move' or 'Move (n periods)' for batch moves

​
movement.rule.buttonIcon

  • Type: string (optional)
  • Description: Icon class for the move button
  • Default: 'arrow-up-down-bold-outline'

​
movement.rule.batchMode

  • Type: boolean (optional)
  • Description: Enable batch moving of multiple periods at once
  • Default: true when multiple single-contributor objects are found

​
movement.rule.labelReplace

  • Type: Object (optional)
  • Description: Configure label replacement for destination names in the move dialog
  • Properties:
    • find: string - The text to find in destination labels
    • replace: string - The replacement text (use empty string to remove)
  • Example: { find: 'Income Statement - ', replace: '' } removes the prefix from labels

​
movement.quickMoves

  • Type: Array<QuickMove> (optional)
  • Description: Configure quick move icon buttons that move directly to a target taxon without opening the move dialog
  • QuickMove Properties:
    • targetTaxon: string - The taxon path to move the data object to
    • label: string - Tooltip label for the button
    • icon: string (optional) - Icon name (e.g., Material Design Icons)
    • color: string (optional) - CSS color classes for the icon
    • confirmationMessage: string (optional) - Message to display for confirmation before moving

​
Examples

​
1. Background Color Configuration

Configure different background colors for empty and populated cells on each rollup column: 
{
  type: 'transposedGridRollup',
  properties: {
    groupTaxon: 'FinancialStatement',
    groupBy: 'FinancialPeriod/Year',
  },
  children: [
    {
      type: 'rollupColumn',
      id: 'BalanceSheet/Assets',
      properties: {
        title: 'Assets',
        emptyRollupBackgroundColor: '#fef3c7',      // Light amber for empty cells
        notEmptyRollupBackgroundColor: '#dbeafe',   // Light blue for populated cells
      }
    },
    {
      type: 'rollupColumn',
      id: 'BalanceSheet/Liabilities',
      properties: {
        title: 'Liabilities',
        emptyRollupBackgroundColor: '#fee2e2',      // Light red for empty cells
        notEmptyRollupBackgroundColor: '#dcfce7',   // Light green for populated cells
      }
    }
  ]
}

​
1. Enable Movement Within Same Prefix with Label Cleanup

{
  type: 'rollupColumn',
  id: 'BalanceSheet/Assets',
  properties: {
    title: 'Balance Sheet - Assets',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: 'same-prefix',
        labelReplace: {
          find: 'Balance Sheet - ',
          replace: ''
        }
      }
    }
  }
}

​
2. Allow Movement to Specific Destinations

{
  type: 'rollupColumn',
  id: 'BalanceSheet/CurrentAssets',
  properties: {
    title: 'Current Assets',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: [
          'BalanceSheet/NonCurrentAssets',
          'BalanceSheet/CurrentLiabilities'
        ],
        buttonLabel: 'Reclassify'
      }
    }
  }
}

​
3. Enable Movement on Parent Rows

{
  type: 'rollupColumn',
  id: 'IncomeStatement/Revenue',
  properties: {
    title: 'Revenue',
    movement: {
      enabled: true,
      showOnRows: 'parent',
      rule: {
        allowedDestinations: 'siblings',
        buttonLabel: 'Move All'
      }
    }
  }
}

​
4. Movement with Label Replacement

{
  type: 'rollupColumn',
  id: 'IncomeStatement/Revenue',
  properties: {
    title: 'Income Statement - Revenue',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: [
          'IncomeStatement/CostOfSales',
          'IncomeStatement/OperatingExpenses',
          'IncomeStatement/OtherIncome'
        ],
        buttonIcon: 'swap-horizontal',
        labelReplace: {
          find: 'Income Statement - ',
          replace: ''
        }
      }
    }
  }
}

​
5. Disable Batch Mode

{
  type: 'rollupColumn',
  id: 'BalanceSheet/FixedAssets',
  properties: {
    title: 'Fixed Assets',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: 'same-prefix',
        batchMode: false  // Only allow moving one period at a time
      }
    }
  }
}

​
6. Using Regex Patterns for Destinations

{
  type: 'rollupColumn',
  id: 'IncomeStatement/Revenue',
  properties: {
    title: 'Revenue',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: [
          'Group_.*',                    // All taxons starting with "Group_"
          '.*_Total$',                   // All taxons ending with "_Total"
          'IncomeStatement/Expenses',    // Literal path
          '^Revenue_[0-9]+$'            // Revenue_1, Revenue_2, etc.
        ],
        labelReplace: {
          find: 'Group_',
          replace: ''
        }
      }
    }
  }
}
In this example:
  • 'Group_.*' matches all group taxons that start with “Group_”
  • '.*_Total$' matches all group taxons ending with “_Total”
  • 'IncomeStatement/Expenses' is treated as a literal path
  • '^Revenue_[0-9]+$' matches taxons like Revenue_1, Revenue_2, etc.
All matching group taxons are combined into a single list of allowed destinations.

​
7. Quick Moves Configuration

Configure quick move buttons for common movement operations: 
{
  type: 'rollupColumn',
  id: 'BalanceSheet/CurrentAssets',
  properties: {
    title: 'Current Assets',
    movement: {
      enabled: true,
      showOnRows: 'child',
      rule: {
        allowedDestinations: 'siblings',
        buttonLabel: 'Move to...'
      },
      quickMoves: [
        {
          targetTaxon: 'BalanceSheet/NonCurrentAssets',
          label: 'Move to Non-Current Assets',
          icon: 'arrow-right-bold',
          color: 'text-blue-400 hover:text-blue-500'
        },
        {
          targetTaxon: 'BalanceSheet/CurrentLiabilities',
          label: 'Reclassify as Liability',
          icon: 'swap-horizontal',
          color: 'text-orange-400 hover:text-orange-500',
          confirmationMessage: 'Are you sure you want to reclassify this asset as a liability?'
        },
        {
          targetTaxon: 'BalanceSheet/Equity',
          label: 'Move to Equity',
          icon: 'bank-transfer',
          color: 'text-purple-400 hover:text-purple-500'
        }
      ]
    }
  }
}
In this example:
  • Three quick move buttons appear next to the main move button
  • Each button has a distinct icon and color to indicate its purpose
  • The “Reclassify as Liability” button shows a confirmation dialog before moving
  • Quick moves work in both single and batch mode (when multiple periods are selected)

​
Migration from Hardcoded Logic

The previous implementation had hardcoded logic that:
  • Only showed move buttons on child rows (dataPath.length > 1)
  • Only allowed movement within same prefix
  • Always enabled batch mode for multiple contributors
To maintain the same behavior with the new configuration: 
movement: {
  enabled: true,
  showOnRows: 'child',
  rule: {
    allowedDestinations: 'same-prefix',
    batchMode: true
  }
}

​
Notes

  1. Move buttons only appear when there are single-contributor data objects in the row (count = 1)
  2. Batch mode allows moving multiple periods at once when multiple single-contributor objects exist
  3. Label replacement allows cleaning up destination names in the move dialog by removing prefixes or replacing text
  4. No configuration means no move functionality (backward compatible)
  5. Regex patterns in allowedDestinations are evaluated against the full taxon paths, and only group taxons are included in results
  6. Invalid regex patterns are treated as literal paths for backward compatibility
  7. Background colors are applied at the cell level per rollup column and work with both light and dark themes
  8. Color values can be any valid CSS color (hex, rgb, rgba, hsl, named colors, etc.)
  9. Empty cells are those with no value or a value of 0; formula cells are considered non-empty if they have a formula expression
  10. Quick moves appear as additional icon buttons next to the main move button, providing one-click access to common destinations
  11. Quick move confirmation is optional and helps prevent accidental moves