Slide

Sets height in px on an element to allow for smooth CSS transitions (that do not work from/to
auto).

Example

```javascript
import slide from '@joinbox/slide';

const element = document.querySelector('.js-sliding-element');

// Sets height on element to current offsetHeight (in px), then to its scrollHeight; as soon as
// the transition is done, sets it to 'auto'
slide({ element });

// Sets width of element to its current offsetWidth (in px), then to 200px.
slide({ element, targetSize: 200, dimension: 'x' });
``

Details

1. Sets height/width of the element to its current offset height/width
2. Afterwards sets height/width of element to the desired target height/width; if no targetSize
is specified, uses scroll height/width instead.
3. If the final (offset) height/width (on transitionend) corresponds to the element's scroll
height/width, its height/width is reset to 'auto' (to stay responsive)

$3

- element (required, HTMLElement): The HTML element whose height/width should be updated
- dimension (optional, String): Either 'x' (to update the element's width) or 'y' (to
update the element's height). Defaults to 'y'.
- targetSize (optional, Number): A number; will be used to set the element's height/width to the
provided size. If argument is not passed, the element's scroll width/height will be used.
- onEnd (optional, Function`): Function that will be called once the transition ends.