Plus Minus

Summary

Plus / Minus increments / decrements numeric cells when the + or - keys are pressed
Users can set the amount by which the Cell will change
And specify a Nudge Rule which defines whether the Nudge should be applied

Plus / Minus updates editable, numeric cells quickly and safely in response to a single keyboard input:

Note

This is ideal for situations where data needs to be edited incredibly quickly (e.g. if marking to market)

the + keyboard key will cause an increment of the cell's value
the - keyboard key will cause a decrement of the cell's value

Hint

It is possible to configure different keyboard keys that will trigger the Nudge (see below)

Plus Minus uses Nudge Rules - provided by users - which specify:

where to apply the Nudge
the amount by which to increment or decrement the cell
when to apply the Nudge - by providing an optional Rule

Caution

Ensure that the CellSelectionModule has been provided in AG Grid Modules
Additionally make sure that the cellSelection property in AG Grid GridOptions is not set to false or null

Applying Plus Minus

Plus / Minus is applied when the user presses the + or - keys in numeric cells which are in a Nude Rule Scope.

AdapTable will automatically increment or decrement the cell by the Rule's Nudge Value.

Using Plus/Minus

Fork Fork

This demo has 2 Plus / Minus Rules defined
- Nudges in the GitHub Stars column change the value by 100
- Nudges in the GitHub Watchers column change the value by 200

Try It Out

Select a cell in the the GitHub Stars or Github Watchers Columns and press the + or - key on your Keyboard

Loading demo…

Plus Minus Rules

It is possible to add a Rule to a Plus / Minus Definition.

Note

The Rule is a standard Boolean Expression evaluated by AdapTableQL

This sets that the Plus / Minus is only applied by AdapTable if the Rule is evaluated as true.

Hint

It is also possible to set 2 (or more) Nudge Definitions one with a Rule, and another without a Rule
The default Nudge Definition will be applied only if all Rules have been evalated and returned false

Using Plus/Minus Rules

Fork Fork

This demo has 3 Plus / Minus Rules defined, all for the GitHub Stars column:
- Nudge by 500 if the value for the Language column in the Row is TypeScript
- Nudge by 250 if the value for the Language column in the Row is HTML
- Nudge by 10 in all other cases (the default value - when no Rule is applied)

Try It Out

Select a cell in the the GitHub Stars column and press the + or - key on your Keyboard
If Language column in the Row is TypeScript it will nudge by 500; otherwise it will nude by 10

Loading demo…

Custom Plus Minus Keys

By default Plus Minus Nudges are triggered when the user clicks "+" or "-" keys in the keyboard.

However its possible to override these default keys and specify different trigger keys.

This can be provided in 2 ways:

Scope	Configuration
Global	Using `incrementKey` and `decrementKey` props in `plusMinusOptions` (in Edit Options)
Per Nudge	Configuring specific `IncrementKey` and `DecrementKey` values on the Plus Minus object

Hint

It is also possible to provide combinations of key strokes e.g Ctrl + I or Shift, Alt + D

The order of evaluation, when checking whether a Nudge Rule has been invoked, is:

first, any specific keys provided in a Nudge Rule
next any bespoke global PlusMinusOptions values provided at design time
finally the default AdapTable Options values specified by AdapTable

Note

This allows you to provide 2 Plus Minus Nudges for all columns (without needing to specify a Rule)
For instance you configure "x" and "y" to increment all numeric columns by 10 and 20 respectively

Custom Plus/Minus Keys

Fork Fork

In this example we have changed the defaults keys to increment and decrement in 3 ways:
- We globally set default keys of 'u' and 'd' in Plus Minus Options - we see this work if we nudge Github Watchers column
- We provide bespoke keys of 'f' and 'j' - which we apply to the Nudge Rule in the Github Stars column
- We provide bespoke keys of 'Ctrl + I' and 'Ctrl + D' - which we apply to the Nudge Rule in the Issue Change column

Try It Out

Type 'u' or 'd' in Github Watchers column and see the cell value change
Type 'f' or 'j' in Github Stars column and see the cell value change
Type 'Ctrl + I' or 'Ctrl + D' in Issue Change column and see the cell value change

import {AdaptableOptions} from '@adaptabletools/adaptable';
import {WebFramework} from './rowData';

export const adaptableOptions: AdaptableOptions<WebFramework> = {
  primaryKey: 'id',
  adaptableId: 'Plus-Minus Custom Keys',
  editOptions: {
    plusMinusOptions: {
      incrementKey: 'u',
      decrementKey: 'd',
    },
  },
  initialState: {
    Theme: {CurrentTheme: 'dark'},
    PlusMinus: {
      PlusMinusNudges: [
        // Nudge week_issue_change by 10 using increment keys 'Ctrl + I' and decrement keys 'Ctrl + D'
        {
          Name: 'week_issue_change-nudge-10',
          Scope: {
            ColumnIds: ['week_issue_change'],
          },
          IncrementKey: 'Ctrl + I', // instead of '+'
          DecrementKey: 'Ctrl + D', // instead of '-'
          NudgeValue: 10,
        },
        // Nudge github_stars by 100 using increment key 'f' and decrement key 'j'
        {
          Name: 'github-stars-nudge-100',
          Scope: {
            ColumnIds: ['github_stars'],
          },
          IncrementKey: 'f', // instead of '+'
          DecrementKey: 'j', // instead of '-'
          NudgeValue: 100,
        },
        // Nudge github_watchers by 200 using increment keys defined in PlusMinusOptions
        {
          Name: 'github-watchers-nudge-200',
          Scope: {
            ColumnIds: ['github_watchers'],
          },
          NudgeValue: 200,
        },
      ],
    },
    Layout: {
      CurrentLayout: 'Standard Layout',
      Layouts: [
        {
          TableColumns: [
            'name',
            'language',
            'github_stars',
            'license',
            'github_watchers',
            'has_projects',
            'week_issue_change',
            'has_pages',
            'created_at',
            'has_wiki',
            'updated_at',
            'pushed_at',
          ],
          Name: 'Standard Layout',
          AutoSizeColumns: true,
        },
      ],
    },
    FlashingCell: {
      FlashingCellDefinitions: [
        {
          Name: 'flashingCell-number',
          Scope: {
            DataTypes: ['number'],
          },
          Rule: {
            BooleanExpression: 'ANY_CHANGE()',
          },
        },
      ],
    },
  },
};

Read-only

Loading demo…

Keyboard Shortcut Combinations

Trigger keys are not limited to single characters: both the global incrementKey / decrementKey and the per-Nudge IncrementKey / DecrementKey also accept keyboard shortcut combinations.

A combination uses + as the glue between its parts, for example shift+Enter or ctrl+ArrowDown. The supported modifiers are:

Modifier	Token
Control	`ctrl`
Command	`cmd`
Alt	`alt`
Shift	`shift`

Hint

The default single keys (+ and -) continue to work exactly as before - a single character is always treated as a literal key, never as a combination.
Because + is the glue between parts, it cannot itself be combined with modifiers (use it as a standalone key instead).

Plus/Minus Key Combinations

Fork Fork

In this example the trigger keys are keyboard shortcut combinations rather than single characters:
- We globally set shift+Enter / shift+Backspace in Plus Minus Options - we see this work if we nudge the Github Watchers column
- We override these per-Nudge with ctrl+ArrowUp / ctrl+ArrowDown - which we apply to the Github Stars column

Try It Out

Select a cell in the Github Watchers column and press Shift+Enter or Shift+Backspace to change the value
Select a cell in the Github Stars column and press Ctrl+ArrowUp or Ctrl+ArrowDown to change the value

import {AdaptableOptions} from '@adaptabletools/adaptable';
import {WebFramework} from './rowData';

export const adaptableOptions: AdaptableOptions<WebFramework> = {
  primaryKey: 'id',
  adaptableId: 'Plus-Minus Combination Keys',
  editOptions: {
    plusMinusOptions: {
      // Global trigger keys can be keyboard shortcut combinations.
      // `+` is the glue between parts; supported modifiers are ctrl, cmd, alt and shift.
      incrementKey: 'shift+Enter',
      decrementKey: 'shift+Backspace',
    },
  },
  initialState: {
    Theme: {CurrentTheme: 'dark'},
    PlusMinus: {
      PlusMinusNudges: [
        // github_stars overrides the global keys with its own combinations
        {
          Name: 'github-stars-nudge-100',
          Scope: {
            ColumnIds: ['github_stars'],
          },
          IncrementKey: 'ctrl+ArrowUp', // instead of the global 'shift+Enter'
          DecrementKey: 'ctrl+ArrowDown', // instead of the global 'shift+Backspace'
          NudgeValue: 100,
        },
        // github_watchers has no keys of its own, so it uses the global combinations
        {
          Name: 'github-watchers-nudge-200',
          Scope: {
            ColumnIds: ['github_watchers'],
          },
          NudgeValue: 200,
        },
      ],
    },
    Layout: {
      CurrentLayout: 'Standard Layout',
      Layouts: [
        {
          TableColumns: [
            'name',
            'language',
            'github_stars',
            'license',
            'github_watchers',
            'has_projects',
            'has_pages',
            'created_at',
            'has_wiki',
            'updated_at',
            'pushed_at',
            'week_issue_change',
          ],
          Name: 'Standard Layout',
          AutoSizeColumns: true,
        },
      ],
    },
    FlashingCell: {
      FlashingCellDefinitions: [
        {
          Name: 'flashingCell-github',
          Scope: {
            ColumnIds: ['github_stars', 'github_watchers'],
          },
          Rule: {
            BooleanExpression: 'ANY_CHANGE()',
          },
        },
      ],
    },
  },
};

Read-only

Loading demo…

Creating Plus Minus Nudges

Plus / Minus Nudges can be managed at runtime via the Plus / Minus section of the Settings Panel.

This lists the details of all existing Nudge Rules in Adaptable State together with options to:

create (via the Shortcut Wizard)
edit (via the Shortcut Wizard)
delete
suspend
share (if Team Sharing is running)

UI Step by Step Guide

Using the Plus / Minus Wizard

Defining Plus Minus Nudges

Plus / Minus Nudges can be provided at design-time through Plus Minus Initial Adaptable State with the following steps:

// Set 3 Plus Minus Rules
// Bid & Ask columns to nudge by 10 on any key press (using default keyboard keys)
// Bid & Ask columns to nudge by 30 when x or y keys are pressed
// Bid column - but only when Currency is Euro
const initialState: InitialState = {
 PlusMinus: {
    PlusMinusNudges: [
      {
        Name: 'bid-ask-10',
        Scope: { ColumnIds: ['bid', 'ask'] },
        NudgeValue: 10,
      },
      {
        Name: 'bid-eur-20',
        Scope: { ColumnIds: ['bid'] },
        Rule: { BooleanExpression: '[currency]="EUR"'},
        NudgeValue: 20,
      },
      {
        Name: 'bid-ask-30',
        Scope: { ColumnIds: ['bid', 'ask'] },
        NudgeValue: 30,
        IncrementKey: 'x',
        DecrementKey: 'y',
      },
    ],
  },
};

Select Plus / Minus Scope

Provide a unique and identifiable name for the Nudge Rule.

Select Plus / Minus Scope

Specify which numeric columns can use the Nudge Rule.

Or set Number DataType to include all numeric columns.

Specify the Nudge Value

Set the numeric value for the Nudge Rule - the amount by which the cell will increment / decrement in response to key press.

Provide an Expression (optional)

Provide an optional Boolean Expression (which will be evaluated by AdapTableQL) specifying when Nudge Value should be applied.

Specify Custom Keyboard Keys (optional)

Provide custom Keyboard keys to override those provided by AdapTable - either single keys or keyboard shortcut combinations (e.g. shift+Enter, ctrl+ArrowUp).

UI Entitlements

Plus / Minus Nudge Rules with ReadOnly Entitlement can be applied but Users cannot manage or suspend them.

FAQ

Can I use Plus/Minus across multiple cells simultaneously? Yes, AdapTable will automatically apply the correct nudge value for each cell in the selection.

PreviousTechnical Reference NextTechnical Reference

Plus Minus

Summary

Note

Hint

Caution

Applying Plus Minus

Plus Minus Rules

Note

Hint

Custom Plus Minus Keys

Hint

Note

Keyboard Shortcut Combinations

Hint

Creating Plus Minus Nudges

UI Step by Step Guide

Using the Plus / Minus Wizard

Find Out More

Defining Plus Minus Nudges

UI Entitlements

FAQ