ISBAT use Gallery Carousel block that is not Flickity based

[AnthonyLedesma]

Describe the bug:

Gallery Carousel block is using 3rd party library Flickity. We have a number of open issues related to the Gallery Carousel block and its UX concerns. Due to the way in which Flickity works we have had trouble resolving some of these issues.

One library that might be a possibility is the Tiny Swiper Library.

All of the following criteria should be met with the refactor of Carousel Gallery.

• ISBAT have a caption per image within the carousel - Link 2 - I consider this a priority as the community as expressed much interest in this feature.
• ISBAT transform from Image block to Carousel block - with and without Gutenberg
• ISBAT control wrap-around/endless carousel
• ISBAT transform into/from other blocks that use gutter controls
• ISBAT control image sizing - Previous behavior would be to force crop images to fit the desired sizing. Users do not prefer this experience and seem to want scaling images or user crop only. Link 1, Link 2, Link 3, Link 4
• ISBAT deprecate from the following markup

<!-- wp:coblocks/gallery-carousel {"align":"full","gutter":0,"gutterMobile":0,"gridSize":"xlrg","height":475,"pageDots":true,"prevNextButtons":false,"autoPlay":true,"alignCells":true} -->
<div class="wp-block-coblocks-gallery-carousel alignfull"><div class="is-cropped coblocks-gallery has-caption-style-dark"><div class="has-carousel has-carousel-xlrg has-aligned-cells" style="height:520px" data-flickity="{&quot;autoPlay&quot;:3000,&quot;draggable&quot;:true,&quot;pageDots&quot;:true,&quot;prevNextButtons&quot;:false,&quot;wrapAround&quot;:true,&quot;cellAlign&quot;:&quot;left&quot;,&quot;pauseAutoPlayOnHover&quot;:false,&quot;freeScroll&quot;:false,&quot;arrowShape&quot;:{&quot;x0&quot;:10,&quot;x1&quot;:60,&quot;y1&quot;:50,&quot;x2&quot;:65,&quot;y2&quot;:45,&quot;x3&quot;:20},&quot;thumbnails&quot;:false,&quot;responsiveHeight&quot;:false}"><div class="coblocks-gallery--item"><figure class="coblocks-gallery--figure"><img src="https://wordpress.test/wp-content/uploads/2020/08/image-4.jpg" alt="Image description" data-id="4" data-link="https://wordpress.test/image-4/" class="wp-image-4"/></figure></div><div class="coblocks-gallery--item"><figure class="coblocks-gallery--figure"><img src="https://wordpress.test/wp-content/uploads/2020/08/image-5.jpg" alt="Image description" data-id="5" data-link="https://wordpress.test/image-5/" class="wp-image-5"/></figure></div><div class="coblocks-gallery--item"><figure class="coblocks-gallery--figure"><img src="https://wordpress.test/wp-content/uploads/2020/08/image-6.jpg" alt="Image description" data-id="6" data-link="https://wordpress.test/image-6/" class="wp-image-6"/></figure></div></div></div></div>
<!-- /wp:coblocks/gallery-carousel -->

• ISBAT align carousel thumbnails left, right, center - Should have thumbnail navigation ideally.
• ISBAT have consistent UX between thumbnail navigation on the front-end and back-end
• ISN use jQuery in this Carousel block refactor
• ISBAT use image links as well as Lightbox with new Carousel gallery
• IS have an expected UX with gallery captions. We had a UX concern where the captions would focus first.
• ISBAT use the newer size controls with the Carousel gallery block and refactor the old controls

[Robertght]

Hi there! We're still encountering issues with this one at the moment.

Here are some reports:

Automattic/wp-calypso#59093
Automattic/wp-calypso#56559

cc @snovosel

[Greatdane]

Hi there! There still seems to be an issue with this. We have had a recent report here;

Automattic/wp-calypso#56559 (comment)

Included is a video of what is now happening. @snovosel is it possible to check this issue is fully resolved?