#49 : Add tappable event handlers

src/components/Carousel/Carousel.svelte

@@ -7,6 +7,7 @@
   import { NEXT, PREV } from '../../direction'
   import { swipeable } from '../../actions/swipeable'
   import { focusable } from '../../actions/focusable'
+  import { tappable } from '../../actions/tappable'
   import {
     addResizeEventListener,
     removeResizeEventListener
@@ -292,9 +293,13 @@
   function handleSwipeEnd() {
     showPage(currentPageIndex)
   }
+
   function handleFocused(event) {
     focused = event.detail.value
   }
+  function handleTapped() {
+    focused = !focused
+  }
 </script>
 
 <div class="sc-carousel__carousel-container">
@@ -315,6 +320,9 @@
       bind:this={pageWindowElement}
       use:focusable
       on:focused={handleFocused}
+
+      use:tappable
+      on:tapped={handleTapped}
     >
       <div
         class="sc-carousel__pages-container"