Merge pull request #1084 from davidjerleke/feature/#1083

[Feat]: Refactor events to lowercase
davidjerleke · Dec 13, 2024 · 59cbc18 · 59cbc18
2 parents 9b4fd54 + e193f79
commit 59cbc18
Show file tree

Hide file tree

Showing 117 changed files with 359 additions and 359 deletions.
diff --git a/packages/embla-carousel-auto-height/src/components/AutoHeight.ts b/packages/embla-carousel-auto-height/src/components/AutoHeight.ts
@@ -18,7 +18,7 @@ export type AutoHeightOptionsType = AutoHeightType['options']
 function AutoHeight(userOptions: AutoHeightOptionsType = {}): AutoHeightType {
   let emblaApi: EmblaCarouselType
   let slideHeights: number[] = []
-  const heightEvents: EmblaEventType[] = ['select', 'slideFocus']
+  const heightEvents: EmblaEventType[] = ['select', 'slidefocus']
 
   function init(emblaApiInstance: EmblaCarouselType): void {
     emblaApi = emblaApiInstance

diff --git a/packages/embla-carousel-auto-scroll/src/components/AutoScroll.ts b/packages/embla-carousel-auto-scroll/src/components/AutoScroll.ts
@@ -14,13 +14,13 @@ declare module 'embla-carousel' {
   }
 
   interface EmblaEventListType {
-    'autoScroll:play': 'autoScroll:play'
-    'autoScroll:stop': 'autoScroll:stop'
+    'autoscroll:play': 'autoscroll:play'
+    'autoscroll:stop': 'autoscroll:stop'
   }
 
   interface EmblaEventDetailType {
-    'autoScroll:play': null
-    'autoScroll:stop': null
+    'autoscroll:play': null
+    'autoscroll:stop': null
   }
 }
 
@@ -68,11 +68,11 @@ function AutoScroll(userOptions: AutoScrollOptionsType = {}): AutoScrollType {
     const root = getAutoScrollRootNode(emblaApi, options.rootNode)
 
     if (isDraggable) {
-      emblaApi.on('pointerDown', onPointerDown)
+      emblaApi.on('pointerdown', onPointerDown)
     }
 
     if (isDraggable && !options.stopOnInteraction) {
-      emblaApi.on('pointerUp', onPointerUp)
+      emblaApi.on('pointerup', onPointerUp)
     }
 
     if (options.stopOnMouseEnter) {
@@ -84,7 +84,7 @@ function AutoScroll(userOptions: AutoScrollOptionsType = {}): AutoScrollType {
     }
 
     if (options.stopOnFocusIn) {
-      emblaApi.on('slideFocusStart', stopAutoScroll)
+      emblaApi.on('slidefocusstart', stopAutoScroll)
     }
 
     if (options.stopOnFocusIn && !options.stopOnInteraction) {
@@ -96,9 +96,9 @@ function AutoScroll(userOptions: AutoScrollOptionsType = {}): AutoScrollType {
 
   function destroy(): void {
     emblaApi
-      .off('pointerDown', onPointerDown)
-      .off('pointerUp', onPointerUp)
-      .off('slideFocusStart', stopAutoScroll)
+      .off('pointerdown', onPointerDown)
+      .off('pointerup', onPointerUp)
+      .off('slidefocusstart', stopAutoScroll)
       .off('settle', settle)
 
     stopAutoScroll()
@@ -109,7 +109,7 @@ function AutoScroll(userOptions: AutoScrollOptionsType = {}): AutoScrollType {
   function startAutoScroll(): void {
     if (destroyed) return
     if (autoScrollActive) return
-    emblaApi.emit('autoScroll:play', null)
+    emblaApi.emit('autoscroll:play', null)
 
     const engine = emblaApi.internalEngine()
     const { ownerWindow } = engine
@@ -125,7 +125,7 @@ function AutoScroll(userOptions: AutoScrollOptionsType = {}): AutoScrollType {
   function stopAutoScroll(): void {
     if (destroyed) return
     if (!autoScrollActive) return
-    emblaApi.emit('autoScroll:stop', null)
+    emblaApi.emit('autoscroll:stop', null)
 
     const engine = emblaApi.internalEngine()
     const { ownerWindow } = engine

diff --git a/packages/embla-carousel-autoplay/src/components/Autoplay.ts b/packages/embla-carousel-autoplay/src/components/Autoplay.ts
@@ -77,11 +77,11 @@ function Autoplay(userOptions: AutoplayOptionsType = {}): AutoplayType {
     eventStore.add(ownerDocument, 'visibilitychange', onVisibilityChange)
 
     if (isDraggable) {
-      emblaApi.on('pointerDown', onPointerDown)
+      emblaApi.on('pointerdown', onPointerDown)
     }
 
     if (isDraggable && !options.stopOnInteraction) {
-      emblaApi.on('pointerUp', onPointerUp)
+      emblaApi.on('pointerup', onPointerUp)
     }
 
     if (options.stopOnMouseEnter) {
@@ -93,7 +93,7 @@ function Autoplay(userOptions: AutoplayOptionsType = {}): AutoplayType {
     }
 
     if (options.stopOnFocusIn) {
-      emblaApi.on('slideFocusStart', stopAutoplay)
+      emblaApi.on('slidefocusstart', stopAutoplay)
     }
 
     if (options.stopOnFocusIn && !options.stopOnInteraction) {
@@ -105,9 +105,9 @@ function Autoplay(userOptions: AutoplayOptionsType = {}): AutoplayType {
 
   function destroy(): void {
     emblaApi
-      .off('pointerDown', onPointerDown)
-      .off('pointerUp', onPointerUp)
-      .off('slideFocusStart', stopAutoplay)
+      .off('pointerdown', onPointerDown)
+      .off('pointerup', onPointerUp)
+      .off('slidefocusstart', stopAutoplay)
 
     stopAutoplay()
     destroyed = true

diff --git a/packages/embla-carousel-class-names/src/components/ClassNames.ts b/packages/embla-carousel-class-names/src/components/ClassNames.ts
@@ -26,8 +26,8 @@ function ClassNames(userOptions: ClassNamesOptionsType = {}): ClassNamesType {
   let inViewIndexes: number[] = []
 
   const selectedEvents: EmblaEventType[] = ['select']
-  const draggingEvents: EmblaEventType[] = ['pointerDown', 'pointerUp']
-  const inViewEvents: EmblaEventType[] = ['slidesInView']
+  const draggingEvents: EmblaEventType[] = ['pointerdown', 'pointerup']
+  const inViewEvents: EmblaEventType[] = ['slidesinview']
   const classNames: ClassNamesListType = {
     snapped: [],
     inView: [],
@@ -101,7 +101,7 @@ function ClassNames(userOptions: ClassNamesOptionsType = {}): ClassNamesType {
     _: EmblaCarouselType,
     evt: EmblaEventType
   ): void {
-    const toggleClass = evt === 'pointerDown' ? addClass : removeClass
+    const toggleClass = evt === 'pointerdown' ? addClass : removeClass
     toggleClass(root, classNames.dragging)
   }
 

diff --git a/...-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/AutoScroll/EmblaCarousel.jsx b/...-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/AutoScroll/EmblaCarousel.jsx
@@ -53,9 +53,9 @@ const EmblaCarousel = (props) => {
 
     setIsPlaying(autoScroll.isPlaying())
     emblaApi
-      .on('autoScroll:play', () => setIsPlaying(true))
-      .on('autoScroll:stop', () => setIsPlaying(false))
-      .on('reInit', () => setIsPlaying(autoScroll.isPlaying()))
+      .on('autoscroll:play', () => setIsPlaying(true))
+      .on('autoscroll:stop', () => setIsPlaying(false))
+      .on('reinit', () => setIsPlaying(autoScroll.isPlaying()))
   }, [emblaApi])
 
   return (

diff --git a/...-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/AutoScroll/EmblaCarousel.tsx b/...-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/AutoScroll/EmblaCarousel.tsx
@@ -59,9 +59,9 @@ const EmblaCarousel: React.FC<PropType> = (props) => {
 
     setIsPlaying(autoScroll.isPlaying())
     emblaApi
-      .on('autoScroll:play', () => setIsPlaying(true))
-      .on('autoScroll:stop', () => setIsPlaying(false))
-      .on('reInit', () => setIsPlaying(autoScroll.isPlaying()))
+      .on('autoscroll:play', () => setIsPlaying(true))
+      .on('autoscroll:stop', () => setIsPlaying(false))
+      .on('reinit', () => setIsPlaying(autoScroll.isPlaying()))
   }, [emblaApi])
 
   return (

diff --git a/...sel-docs/src/components/Sandbox/React/SandboxFilesDist/Autoplay/EmblaCarouselAutoplay.jsx b/...sel-docs/src/components/Sandbox/React/SandboxFilesDist/Autoplay/EmblaCarouselAutoplay.jsx
@@ -35,7 +35,7 @@ export const useAutoplay = (emblaApi) => {
     emblaApi
       .on('autoplay:play', () => setAutoplayIsPlaying(true))
       .on('autoplay:stop', () => setAutoplayIsPlaying(false))
-      .on('reInit', () => setAutoplayIsPlaying(autoplay.isPlaying()))
+      .on('reinit', () => setAutoplayIsPlaying(autoplay.isPlaying()))
   }, [emblaApi])
 
   return {

diff --git a/...sel-docs/src/components/Sandbox/React/SandboxFilesDist/Autoplay/EmblaCarouselAutoplay.tsx b/...sel-docs/src/components/Sandbox/React/SandboxFilesDist/Autoplay/EmblaCarouselAutoplay.tsx
@@ -44,7 +44,7 @@ export const useAutoplay = (
     emblaApi
       .on('autoplay:play', () => setAutoplayIsPlaying(true))
       .on('autoplay:stop', () => setAutoplayIsPlaying(false))
-      .on('reInit', () => setAutoplayIsPlaying(autoplay.isPlaying()))
+      .on('reinit', () => setAutoplayIsPlaying(autoplay.isPlaying()))
   }, [emblaApi])
 
   return {

diff --git a/...components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselArrowButtons.jsx b/...components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselArrowButtons.jsx
@@ -40,7 +40,7 @@ export const usePrevNextButtons = (
     if (!emblaApi) return
 
     onSelect(emblaApi)
-    emblaApi.on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onSelect])
 
   return {

diff --git a/...components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselArrowButtons.tsx b/...components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselArrowButtons.tsx
@@ -53,7 +53,7 @@ export const usePrevNextButtons = (
     if (!emblaApi) return
 
     onSelect(emblaApi)
-    emblaApi.on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onSelect])
 
   return {

diff --git a/...rc/components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselDotButton.jsx b/...rc/components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselDotButton.jsx
@@ -36,7 +36,7 @@ export const useDotButton = (
 
     onInit(emblaApi)
     onSelect(emblaApi)
-    emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onInit).on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onInit, onSelect])
 
   return {

diff --git a/...rc/components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselDotButton.tsx b/...rc/components/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselDotButton.tsx
@@ -48,7 +48,7 @@ export const useDotButton = (
 
     onInit(emblaApi)
     onSelect(emblaApi)
-    emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onInit).on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onInit, onSelect])
 
   return {

diff --git a/...nts/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselSelectedSnapDisplay.jsx b/...nts/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselSelectedSnapDisplay.jsx
@@ -14,7 +14,7 @@ export const useSelectedSnapDisplay = (emblaApi) => {
 
     updateScrollSnapState(emblaApi)
     emblaApi.on('select', updateScrollSnapState)
-    emblaApi.on('reInit', updateScrollSnapState)
+    emblaApi.on('reinit', updateScrollSnapState)
   }, [emblaApi, updateScrollSnapState])
 
   return {

diff --git a/...nts/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselSelectedSnapDisplay.tsx b/...nts/Sandbox/React/SandboxFilesDist/CarouselGenerator/EmblaCarouselSelectedSnapDisplay.tsx
@@ -22,7 +22,7 @@ export const useSelectedSnapDisplay = (
 
     updateScrollSnapState(emblaApi)
     emblaApi.on('select', updateScrollSnapState)
-    emblaApi.on('reInit', updateScrollSnapState)
+    emblaApi.on('reinit', updateScrollSnapState)
   }, [emblaApi, updateScrollSnapState])
 
   return {

diff --git a/...carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselArrowButtons.jsx b/...carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselArrowButtons.jsx
@@ -25,7 +25,7 @@ export const usePrevNextButtons = (emblaApi, onButtonClick) => {
     if (!emblaApi) return
 
     onSelect(emblaApi)
-    emblaApi.on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onSelect])
 
   return {

diff --git a/...carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselArrowButtons.tsx b/...carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselArrowButtons.tsx
@@ -41,7 +41,7 @@ export const usePrevNextButtons = (
     if (!emblaApi) return
 
     onSelect(emblaApi)
-    emblaApi.on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onSelect])
 
   return {

diff --git a/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselDotButton.jsx b/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselDotButton.jsx
@@ -27,7 +27,7 @@ export const useDotButton = (emblaApi, onButtonClick) => {
     onInit(emblaApi)
     onSelect(emblaApi)
 
-    emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onInit).on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onInit, onSelect])
 
   return {

diff --git a/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselDotButton.tsx b/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselDotButton.tsx
@@ -42,7 +42,7 @@ export const useDotButton = (
     onInit(emblaApi)
     onSelect(emblaApi)
 
-    emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect)
+    emblaApi.on('reinit', onInit).on('reinit', onSelect).on('select', onSelect)
   }, [emblaApi, onInit, onSelect])
 
   return {

diff --git a/...l-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselSelectedSnapDisplay.jsx b/...l-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselSelectedSnapDisplay.jsx
@@ -14,7 +14,7 @@ export const useSelectedSnapDisplay = (emblaApi) => {
 
     updateScrollSnapState(emblaApi)
     emblaApi.on('select', updateScrollSnapState)
-    emblaApi.on('reInit', updateScrollSnapState)
+    emblaApi.on('reinit', updateScrollSnapState)
   }, [emblaApi, updateScrollSnapState])
 
   return {

diff --git a/...l-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselSelectedSnapDisplay.tsx b/...l-docs/src/components/Sandbox/React/SandboxFilesDist/EmblaCarouselSelectedSnapDisplay.tsx
@@ -22,7 +22,7 @@ export const useSelectedSnapDisplay = (
 
     updateScrollSnapState(emblaApi)
     emblaApi.on('select', updateScrollSnapState)
-    emblaApi.on('reInit', updateScrollSnapState)
+    emblaApi.on('reinit', updateScrollSnapState)
   }, [emblaApi, updateScrollSnapState])
 
   return {

diff --git a/...ousel-docs/src/components/Sandbox/React/SandboxFilesDist/InfiniteScroll/EmblaCarousel.jsx b/...ousel-docs/src/components/Sandbox/React/SandboxFilesDist/InfiniteScroll/EmblaCarousel.jsx
@@ -51,7 +51,7 @@ const EmblaCarousel = (props) => {
       }
 
       const reloadAfterPointerUp = () => {
-        emblaApi.off('pointerUp', reloadAfterPointerUp)
+        emblaApi.off('pointerup', reloadAfterPointerUp)
         reloadEmbla()
       }
 
@@ -60,7 +60,7 @@ const EmblaCarousel = (props) => {
       if (hasMoreToLoadRef.current && engine.dragHandler.pointerDown()) {
         const boundsActive = engine.limit.reachedMax(engine.target.get())
         engine.scrollBounds.toggleActive(boundsActive)
-        emblaApi.on('pointerUp', reloadAfterPointerUp)
+        emblaApi.on('pointerup', reloadAfterPointerUp)
       } else {
         reloadEmbla()
       }

diff --git a/...ousel-docs/src/components/Sandbox/React/SandboxFilesDist/InfiniteScroll/EmblaCarousel.tsx b/...ousel-docs/src/components/Sandbox/React/SandboxFilesDist/InfiniteScroll/EmblaCarousel.tsx
@@ -62,7 +62,7 @@ const EmblaCarousel: React.FC<PropType> = (props) => {
       }
 
       const reloadAfterPointerUp = (): void => {
-        emblaApi.off('pointerUp', reloadAfterPointerUp)
+        emblaApi.off('pointerup', reloadAfterPointerUp)
         reloadEmbla()
       }
 
@@ -71,7 +71,7 @@ const EmblaCarousel: React.FC<PropType> = (props) => {
       if (hasMoreToLoadRef.current && engine.dragHandler.pointerDown()) {
         const boundsActive = engine.limit.reachedMax(engine.target.get())
         engine.scrollBounds.toggleActive(boundsActive)
-        emblaApi.on('pointerUp', reloadAfterPointerUp)
+        emblaApi.on('pointerup', reloadAfterPointerUp)
       } else {
         reloadEmbla()
       }

diff --git a/...cs/src/components/Sandbox/React/SandboxFilesDist/IosPicker/EmblaCarouselIosPickerItem.jsx b/...cs/src/components/Sandbox/React/SandboxFilesDist/IosPicker/EmblaCarouselIosPickerItem.jsx
@@ -94,7 +94,7 @@ export const IosPickerItem = (props) => {
   useEffect(() => {
     if (!emblaApi) return
 
-    emblaApi.on('pointerUp', (emblaApi) => {
+    emblaApi.on('pointerup', (emblaApi) => {
       const { scrollTo, target, location } = emblaApi.internalEngine()
       const diffToTarget = target.get() - location.get()
       const factor = Math.abs(diffToTarget) < WHEEL_ITEM_SIZE / 2.5 ? 10 : 0.1
@@ -104,7 +104,7 @@ export const IosPickerItem = (props) => {
 
     emblaApi.on('scroll', rotateWheel)
 
-    emblaApi.on('reInit', (emblaApi) => {
+    emblaApi.on('reinit', (emblaApi) => {
       inactivateEmblaTransform(emblaApi)
       rotateWheel(emblaApi)
     })

diff --git a/...cs/src/components/Sandbox/React/SandboxFilesDist/IosPicker/EmblaCarouselIosPickerItem.tsx b/...cs/src/components/Sandbox/React/SandboxFilesDist/IosPicker/EmblaCarouselIosPickerItem.tsx
@@ -114,7 +114,7 @@ export const IosPickerItem: React.FC<PropType> = (props) => {
   useEffect(() => {
     if (!emblaApi) return
 
-    emblaApi.on('pointerUp', (emblaApi) => {
+    emblaApi.on('pointerup', (emblaApi) => {
       const { scrollTo, target, location } = emblaApi.internalEngine()
       const diffToTarget = target.get() - location.get()
       const factor = Math.abs(diffToTarget) < WHEEL_ITEM_SIZE / 2.5 ? 10 : 0.1
@@ -124,7 +124,7 @@ export const IosPickerItem: React.FC<PropType> = (props) => {
 
     emblaApi.on('scroll', rotateWheel)
 
-    emblaApi.on('reInit', (emblaApi) => {
+    emblaApi.on('reinit', (emblaApi) => {
       inactivateEmblaTransform(emblaApi)
       rotateWheel(emblaApi)
     })

diff --git a/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/LazyLoad/EmblaCarousel.jsx b/...la-carousel-docs/src/components/Sandbox/React/SandboxFilesDist/LazyLoad/EmblaCarousel.jsx
@@ -26,7 +26,7 @@ const EmblaCarousel = (props) => {
   const updateSlidesInView = useCallback((emblaApi) => {
     setSlidesInView((slidesInView) => {
       if (slidesInView.length === emblaApi.slideNodes().length) {
-        emblaApi.off('slidesInView', updateSlidesInView)
+        emblaApi.off('slidesinview', updateSlidesInView)
       }
       const inView = emblaApi
         .slidesInView()
@@ -39,8 +39,8 @@ const EmblaCarousel = (props) => {
     if (!emblaApi) return
 
     updateSlidesInView(emblaApi)
-    emblaApi.on('slidesInView', updateSlidesInView)
-    emblaApi.on('reInit', updateSlidesInView)
+    emblaApi.on('slidesinview', updateSlidesInView)
+    emblaApi.on('reinit', updateSlidesInView)
   }, [emblaApi, updateSlidesInView])
 
   return (