react-carousel 2.0: Introduce carousel plugins

[RobertHebel]

Deployed to https://beghp.github.io/gh-pages-rc-15

This breaking change introduces carousel plugins a new way to modify and extend react-carousel behavior.
You can find more details about this feature in the new section in docs

Proposed v1 -> v2 migration guide

• Carousel components have been rewritten to hooks
• introduce recoil library to manage carousel state from plugins
• introduce yarn workspaces to simplify installing, building & deploying react-carousel
• introduce pre-commit and pre-push hooks to verify whether lint and tests commands are passing
• Rewrite unit and e2e tests
• Introduce prettier

[brainhub-devops]

	Warnings
⚠️	MODULE : node_modules/valid-url | LICENSE : MIT* | LICENSE_FILE : node_modules/valid-url/LICENSE | REPOSITORY: https://github.com/ogt/valid-url | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/trim | LICENSE : MIT* | LICENSE_FILE : node_modules/trim/Readme.md | REPOSITORY: undefined | PUBLISHER : TJ Holowaychuk | EMAIL : tj@vision-media.ca | URL : undefined
⚠️	MODULE : node_modules/rx-lite | LICENSE : Apache License, Version 2.0 | LICENSE_FILE : node_modules/rx-lite/readme.md | REPOSITORY: https://github.com/Reactive-Extensions/RxJS | PUBLISHER : Cloud Programmability Team | EMAIL : undefined | URL : https://github.com/Reactive-Extensions/RxJS/blob/master/authors.txt
⚠️	MODULE : node_modules/rx-lite-aggregates | LICENSE : Apache License, Version 2.0 | LICENSE_FILE : node_modules/rx-lite-aggregates/readme.md | REPOSITORY: https://github.com/Reactive-Extensions/RxJS | PUBLISHER : Cloud Programmability Team | EMAIL : undefined | URL : https://github.com/Reactive-Extensions/RxJS/blob/master/authors.txt
⚠️	MODULE : node_modules/rc | LICENSE : (BSD-2-Clause OR MIT OR Apache-2.0) | LICENSE_FILE : node_modules/rc/LICENSE.APACHE2 | REPOSITORY: https://github.com/dominictarr/rc | PUBLISHER : Dominic Tarr | EMAIL : dominic.tarr@gmail.com | URL : dominictarr.com
⚠️	MODULE : node_modules/xhr/node_modules/process | LICENSE : MIT* | LICENSE_FILE : node_modules/xhr/node_modules/process/LICENSE | REPOSITORY: https://github.com/shtylman/node-process | PUBLISHER : Roman Shtylman | EMAIL : shtylman@gmail.com | URL : undefined
⚠️	MODULE : node_modules/potrace | LICENSE : GPL-2.0 | LICENSE_FILE : node_modules/potrace/LICENSE | REPOSITORY: https://github.com/tooolbox/node-potrace | PUBLISHER : mattmc | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/object-component | LICENSE : MIT* | LICENSE_FILE : node_modules/object-component/Readme.md | REPOSITORY: undefined | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/node-forge | LICENSE : (BSD-3-Clause OR GPL-2.0) | LICENSE_FILE : node_modules/node-forge/LICENSE | REPOSITORY: https://github.com/digitalbazaar/forge | PUBLISHER : Digital Bazaar, Inc. | EMAIL : support@digitalbazaar.com | URL : http://digitalbazaar.com/
⚠️	MODULE : node_modules/map-stream | LICENSE : Custom: https://github.com/dominictarr/event-stream | LICENSE_FILE : node_modules/map-stream/LICENCE | REPOSITORY: https://github.com/dominictarr/map-stream | PUBLISHER : Dominic Tarr | EMAIL : dominic.tarr@gmail.com | URL : http://dominictarr.com
⚠️	MODULE : node_modules/jsonify | LICENSE : Public Domain | LICENSE_FILE : node_modules/jsonify/README.markdown | REPOSITORY: https://github.com/substack/jsonify | PUBLISHER : Douglas Crockford | EMAIL : undefined | URL : http://crockford.com/
⚠️	MODULE : node_modules/json-schema | LICENSE : AFLv2.1,BSD | LICENSE_FILE : node_modules/json-schema/README.md | REPOSITORY: https://github.com/kriszyp/json-schema | PUBLISHER : Kris Zyp | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/indexof | LICENSE : MIT* | LICENSE_FILE : node_modules/indexof/Readme.md | REPOSITORY: undefined | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/glob-to-regexp | LICENSE : BSD* | LICENSE_FILE : node_modules/glob-to-regexp/README.md | REPOSITORY: https://github.com/fitzgen/glob-to-regexp | PUBLISHER : Nick Fitzgerald | EMAIL : fitzgen@gmail.com | URL : undefined
⚠️	MODULE : node_modules/font-awesome | LICENSE : (OFL-1.1 AND MIT) | LICENSE_FILE : node_modules/font-awesome/README.md | REPOSITORY: https://github.com/FortAwesome/Font-Awesome | PUBLISHER : Dave Gandy | EMAIL : dave@fontawesome.io | URL : http://twitter.com/davegandy
⚠️	MODULE : node_modules/expand-template | LICENSE : (MIT OR WTFPL) | LICENSE_FILE : node_modules/expand-template/LICENSE | REPOSITORY: https://github.com/ralphtheninja/expand-template | PUBLISHER : LM | EMAIL : ralphtheninja@riseup.net | URL : undefined
⚠️	MODULE : node_modules/exif-parser | LICENSE : MIT* | LICENSE_FILE : node_modules/exif-parser/LICENSE.md | REPOSITORY: https://github.com/bwindels/exif-parser | PUBLISHER : Bruno Windels | EMAIL : bruno.windels@gmail.com | URL : undefined
⚠️	MODULE : node_modules/css-select/node_modules/domutils | LICENSE : BSD* | LICENSE_FILE : node_modules/css-select/node_modules/domutils/LICENSE | REPOSITORY: https://github.com/FB55/domutils | PUBLISHER : Felix Boehm | EMAIL : me@feedic.com | URL : undefined
⚠️	MODULE : node_modules/html-dom-parser/node_modules/domhandler | LICENSE : BSD* | LICENSE_FILE : node_modules/html-dom-parser/node_modules/domhandler/LICENSE | REPOSITORY: https://github.com/fb55/DomHandler | PUBLISHER : Felix Boehm | EMAIL : me@feedic.com | URL : undefined
⚠️	MODULE : node_modules/eslint-plugin-import/node_modules/doctrine | LICENSE : BSD | LICENSE_FILE : node_modules/eslint-plugin-import/node_modules/doctrine/LICENSE.BSD | REPOSITORY: https://github.com/eslint/doctrine | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/css-select | LICENSE : BSD* | LICENSE_FILE : node_modules/css-select/LICENSE | REPOSITORY: https://github.com/fb55/css-select | PUBLISHER : Felix Boehm | EMAIL : me@feedic.com | URL : undefined
⚠️	MODULE : node_modules/react-live/node_modules/create-react-context | LICENSE : MIT* | LICENSE_FILE : node_modules/react-live/node_modules/create-react-context/LICENSE | REPOSITORY: https://github.com/thejameskyle/create-react-context | PUBLISHER : James Kyle | EMAIL : me@thejameskyle.com | URL : undefined
⚠️	MODULE : node_modules/component-props | LICENSE : MIT* | LICENSE_FILE : node_modules/component-props/Readme.md | REPOSITORY: https://github.com/component/props | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/component-inherit | LICENSE : MIT* | LICENSE_FILE : node_modules/component-inherit/Readme.md | REPOSITORY: https://github.com/component/inherit | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/component-bind | LICENSE : MIT* | LICENSE_FILE : node_modules/component-bind/Readme.md | REPOSITORY: https://github.com/component/bind | PUBLISHER : undefined | EMAIL : undefined | URL : undefined
⚠️	MODULE : node_modules/callsite | LICENSE : MIT* | LICENSE_FILE : node_modules/callsite/Readme.md | REPOSITORY: undefined | PUBLISHER : TJ Holowaychuk | EMAIL : tj@vision-media.ca | URL : undefined
⚠️	MODULE : node_modules/better-assert | LICENSE : MIT* | LICENSE_FILE : node_modules/better-assert/Readme.md | REPOSITORY: https://github.com/visionmedia/better-assert | PUBLISHER : TJ Holowaychuk | EMAIL : tj@vision-media.ca | URL : undefined
⚠️	MODULE : node_modules/async-foreach | LICENSE : MIT* | LICENSE_FILE : node_modules/async-foreach/LICENSE-MIT | REPOSITORY: https://github.com/cowboy/javascript-sync-async-foreach | PUBLISHER : "Cowboy" Ben Alman | EMAIL : undefined | URL : http://benalman.com/
⚠️	MODULE : node_modules/@mikaelkristiansson/domready | LICENSE : MIT* | LICENSE_FILE : node_modules/@mikaelkristiansson/domready/LICENSE | REPOSITORY: https://github.com/mikaelkristiansson/domready | PUBLISHER : Mikael Kristiansson | EMAIL : undefined | URL : undefined

Generated by 🚫 dangerJS against 385bb56

[piotr-s-brainhub]

in the following example, rtl infinite autoplay works:

<Carousel
    plugins={[
     'infinite',
     'rtl',
    {
      resolve: autoplayPlugin,
      options: {
        interval: 2000,
        direction: 'left',
      }
    },
  ]}   
  animationSpeed={1000}
>
  <img src={imageOne} />
  <img src={imageTwo} />
  <img src={imageThree} />
</Carousel>

so now everything, besides the issues already existent on v1, works on desktop.
However, I found 2 mobile issues (both work on desktop):

• rtl autoplay, after moving all the slides, goes back to the opposite direction instead of keeping moving in the same direction
• custom arrows are so small that it's extremely difficult to click them

Video: https://drive.google.com/file/d/1dOx29cxFRZvMjcrw5wUoGSxZK9AzjRmx/view

[RobertHebel]

in the following example, rtl infinite autoplay works:

<Carousel
    plugins={[
     'infinite',
     'rtl',
    {
      resolve: autoplayPlugin,
      options: {
        interval: 2000,
        direction: 'left',
      }
    },
  ]}   
  animationSpeed={1000}
>
  <img src={imageOne} />
  <img src={imageTwo} />
  <img src={imageThree} />
</Carousel>

so now everything, besides the issues already existent on v1, works on desktop.
However, I found 2 mobile issues (both work on desktop):

• rtl autoplay, after moving all the slides, goes back to the opposite direction instead of keeping moving in the same direction
• custom arrows are so small that it's extremely difficult to click them

Video: https://drive.google.com/file/d/1dOx29cxFRZvMjcrw5wUoGSxZK9AzjRmx/view

The first issue isn't a mobile issue but Safari browser issue. It seems swiping left in infinite mode doesn't work. I can also reproduce it on v1. Fixing it is important but shouldn't be a blocker especially it also occurs in v1 now

Custom arrows page is just an example that shows you can create any item for navigation you want. Changing these icons to be more reachable for mobile users would be a nice addition but in beta release, we should focus on urgent issues only

[piotr-s-brainhub]

besides the issues already occurring on v1, I cannot find now any other issues (desktop & mobile)