Make component completely controllable from the parent (resolves #64)

[nerdyman]

The slider currently takes props like position and moves them to internal states. This is moslty fine but leads to edge cases as shown in https://github.com/nerdyman/react-compare-slider/issues/64.

The state for the main component should be abstracted into it's own hook and exported from the library. The slider component itself should not call the hook, the parent component should instead. This will allow the parent component to manipulate all state and share it with ReactCompareSlider.

E.g.

import { ReactCompareSlider, useSliderState } from 'react-compare-slider';

export const Example = () => {
  const sliderState = useSliderState();

    /** Optional override */
    const onPositionChange = (position) => {
      window.alert(position);
      sliderState.setPosition(position);
    };

  return <ReactCompareSlider {...sliderState} onPositionChange={onPositionChange} itemOne={} itemTwo={} />
};

This should be done alongside #76