Update docs

Author: kurkle

docs/docs/configuration/animations.mdx

@@ -107,10 +107,28 @@ function example() {
 </TabItem>
 </Tabs>
 
-## Animation Configuration
+## Animation configuration
 
-The following animation options are available. The global options are defined in `Chart.defaults.animation`.
-The default configuration is defined here: <a href="https://github.com/chartjs/Chart.js/blob/master/src/core/core.animations.js#L6-L55" target="_blank">core.animations.js</a>
+Animation configuration consists of 3 keys.
+
+| Name | Type | Details
+| ---- | ---- | -------
+| animation | `object` | [animation](#animation)
+| animations | `object` | [animations](#animations)
+| transitions | `object` | [transitions](#transitions)
+
+These keys can be configured in following paths:
+
+* `` - chart options
+* `controllers[type]` - controller type options
+* `controllers[type].datasets` - dataset type options
+* `datasets[type]` - dataset type options
+
+These paths are valid under `defaults` for global confuguration and `options` for instance configuration.
+
+## animation
+
+The default configuration is defined here: <a href="https://github.com/chartjs/Chart.js/blob/master/src/core/core.animations.js#L9-L56" target="_blank">core.animations.js</a>
 
 | Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
@@ -119,32 +137,13 @@ The default configuration is defined here: <a href="https://github.com/chartjs/C
 | `debug` | `boolean` | `undefined` | Running animation count + FPS display in upper left corner of the chart.
 | `delay` | `number` | `undefined` | Delay before starting the animations.
 | `loop` | `boolean` | `undefined` | If set to `true`, the animations loop endlessly.
-| `modes` | `object` | [defaults...](#default-modes) |  Option overrides for update modes. Core modes: `'active'`, `'hide'`, `'reset'`, `'resize'`, `'show'`. See **Hide and show [mode]** example above.
-| `properties` | `object` | [defaults...](#default-properties) | Option overrides for properties, identified by `properties` array which defaults to the key.
 
 These defaults can be overridden in `options.animation` or `dataset.animation` and `tooltip.animation`. These keys are also [Scriptable](../general/options.md#scriptable-options).
 
-## Transition configuration
-
-The core transitions are `'active'`, `'hide'`, `'reset'`, `'resize'`, `'show'`.
-A custom transtion can be used by passing a custom `mode` to [update](../developers/api.md#updatemode).
-Transition consists from the same animation options of the main [animation configuration](#animation-configuration).
-
-### Default transitions
-
-| Mode | Option | Value | Description
-| -----| ------ | ----- | -----
-| `'active'` | duration | 400 | Override default duration to 400ms for hover animations
-| `'resize'` | duration | 0 | Override default duration to 0ms (= no animation) for resize
-| `'show'` | colors | `{ type: 'color', properties: ['borderColor', 'backgroundColor'], from: 'transparent' }` | Colors are faded in from transparent when dataset is shown using legend / [api](../developers/api.md#showdatasetIndex).
-| `'show'` | visible | `{ type: 'boolean', duration: 0 }` | Dataset visiblity is immediately changed to true so the color transition from transparent is visible.
-| `'hide'` | colors | `{ type: 'color', properties: ['borderColor', 'backgroundColor'], to: 'transparent' }` | Colors are faded to transparent when dataset id hidden using legend / [api](../developers/api.md#hidedatasetIndex).
-| `'hide'` | visible | `{ type: 'boolean', easing: 'easeInExpo' }` | Visibility is changed to false at a very late phase of animation
-
-## Animation properties configuration
+## animations
 
-Property option configures which element property to use to animate the chart and its starting and ending values.
-A property option is defined by the same options of the main [animation configuration](#animation-configuration), adding the following ones:
+Animations options configures which element properties are animated and how.
+In addition to the main [animation configuration](#animation-configuration), the following options are available:
 
 | Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
@@ -154,7 +153,7 @@ A property option is defined by the same options of the main [animation configur
 | `to`  | `number`\|`Color`\|`boolean` | `undefined` | End value for the animation. Updated value is used when `undefined`
 | `fn` | <code>&lt;T&gt;(from: T, to: T, factor: number) => T;</code> | `undefined` | Optional custom interpolator, instead of using a predefined interpolator from `type` |
 
-### Default properties
+### Default animations
 
 | Name | Option | Value
 | ---- | ------ | -----
@@ -164,18 +163,35 @@ A property option is defined by the same options of the main [animation configur
 | `colors` | `type` | `'color'`
 
 :::note
-These default collections are overridden by most dataset controllers.
+These default animations are overridden by most of the dataset controllers.
 :::
 
+## transitions
+
+The core transitions are `'active'`, `'hide'`, `'reset'`, `'resize'`, `'show'`.
+A custom transtion can be used by passing a custom `mode` to [update](../developers/api.md#updatemode).
+Transition extends the main [animation configuration](#animation-configuration) and [animations configuration](#animations-configuration).
+
+### Default transitions
+
+| Mode | Option | Value | Description
+| -----| ------ | ----- | -----
+| `'active'` | animation.duration | 400 | Override default duration to 400ms for hover animations
+| `'resize'` | animation.duration | 0 | Override default duration to 0ms (= no animation) for resize
+| `'show'` | animations.colors | `{ type: 'color', properties: ['borderColor', 'backgroundColor'], from: 'transparent' }` | Colors are faded in from transparent when dataset is shown using legend / [api](../developers/api.md#showdatasetIndex).
+| `'show'` | animations.visible | `{ type: 'boolean', duration: 0 }` | Dataset visiblity is immediately changed to true so the color transition from transparent is visible.
+| `'hide'` | animations.colors | `{ type: 'color', properties: ['borderColor', 'backgroundColor'], to: 'transparent' }` | Colors are faded to transparent when dataset id hidden using legend / [api](../developers/api.md#hidedatasetIndex).
+| `'hide'` | animations.visible | `{ type: 'boolean', easing: 'easeInExpo' }` | Visibility is changed to false at a very late phase of animation
+
 ## Disabling animation
 
 To disable an animation configuration, the animation node must be set to `false`, with the exception for animation modes which can be disabled by setting the `duration` to `0`.
 
 ```javascript
-chart.options.animation = false; // disables the whole animation
-chart.options.animation.modes.active.duration = 0; // disables the animation for 'active' mode
-chart.options.animation.properties.colors = false; // disables animation defined by the collection of 'colors' properties
-chart.options.animation.properties.x = false; // disables animation defined by the 'x' property
+chart.options.animation = false; // disables all animations
+chart.options.animations.colors = false; // disables animation defined by the collection of 'colors' properties
+chart.options.animations.x = false; // disables animation defined by the 'x' property
+chart.options.transitions.active.animation.duration = 0; // disables the animation for 'active' mode
 ```
 
 ## Easing