Hyphonating event listeners

Author: Kurt Medley

src/components/filmstrip/CdrFilmstrip.vue

@@ -15,9 +15,9 @@
       :frames-to-show="framesToShow"
       :frames-to-scroll="framesToScroll"
       :focus-selector="focusSelector"
-      @ariaMessage="$emit('ariaMessage', $event)"
-      @arrowClick="onArrowClick"
-      @scrollNavigate="onScrollNavigate"
+      @aria-message="$emit('ariaMessage', $event)"
+      @arrow-click="onArrowClick"
+      @scroll-navigate="onScrollNavigate"
     >
       <template #frame="{ ...frameProps }: Record<string, unknown>">
         <component

src/components/filmstrip/examples/Lifestyle/Example.vue

@@ -4,7 +4,7 @@
     :model="lifestyleModelData"
     :adapter="LifestyleAdapter"
     @frameClick="onFrameClick"
-    @arrowClick="onArrowClick"
+    @arrow-click="onArrowClick"
     @resize="onResize"
   />
 </template>

src/components/filmstrip/examples/ProductRecommendation/Example.vue

@@ -4,9 +4,9 @@
     :model="ProductRecommendationModelData"
     :adapter="ProductRecommendationAdapter"
     @frameClick="onFrameClick"
-    @arrowClick="onArrowClick"
-    @ariaMessage="(msg) => console.log(msg)"
-    @scrollNavigate="onScrollNavigate"
+    @arrow-click="onArrowClick"
+    @aria-message="(msg) => console.log(msg)"
+    @scroll-navigate="onScrollNavigate"
   />
 </template>