@lumx/react 3.9.4-alpha.1 → 3.9.4-alpha.3

package/index.js

@@ -11806,6 +11806,8 @@ const PAGINATION_ITEMS_MAX = 5;
  * Size of a pagination item. Used to translate wrapper.
  */
 const PAGINATION_ITEM_SIZE = 12;
+const NEXT_SLIDE_EVENT = 'lumx-next-slide-event';
+const PREV_SLIDE_EVENT = 'lumx-prev-slide-event';
 
 const DEFAULT_OPTIONS = {
   activeIndex: 0,
@@ -11901,6 +11903,17 @@ const useSlideshowControls = _ref => {
     goTo(-1, loopBack, true);
   }, [goTo, stopAutoPlay]);
 
+  // Listen to custom next/prev slide events
+  useEffect(() => {
+    if (!element) return undefined;
+    element.addEventListener(NEXT_SLIDE_EVENT, onNextClick);
+    element.addEventListener(PREV_SLIDE_EVENT, onPreviousClick);
+    return () => {
+      element.removeEventListener(NEXT_SLIDE_EVENT, onNextClick);
+      element.removeEventListener(PREV_SLIDE_EVENT, onPreviousClick);
+    };
+  }, [element, onNextClick, onPreviousClick]);
+
   // If the activeIndex props changes, update the current slide
   useEffect(() => {
     setActiveIndex(activeIndex);
@@ -12524,6 +12537,10 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
     return groupBy && groupBy > 1 ? chunk(childrenArray, groupBy) : childrenArray;
   }, [children, groupBy]);
   const slidesRef = React__default.useRef(null);
+  const slide = slidesRef.current;
+  const onNextSlide = React__default.useCallback(() => slide === null || slide === void 0 ? void 0 : slide.dispatchEvent(new CustomEvent(NEXT_SLIDE_EVENT)), [slide]);
+  const onPrevSlide = React__default.useCallback(() => slide === null || slide === void 0 ? void 0 : slide.dispatchEvent(new CustomEvent(PREV_SLIDE_EVENT)), [slide]);
+  useKeyNavigate(slide, onNextSlide, onPrevSlide);
   return /*#__PURE__*/React__default.createElement("section", _extends({
     id: id,
     ref: useMergeRefs(slidesRef, ref)
@@ -12548,7 +12565,7 @@ const Slides = /*#__PURE__*/forwardRef((props, ref) => {
   }, groups.map((group, index) => /*#__PURE__*/React__default.createElement(SlideshowItemGroup, {
     key: index,
     id: slidesId && buildSlideShowGroupId(slidesId, index),
-    label: slideGroupLabel ? slideGroupLabel(index + 1, groups.length) : undefined,
+    label: slideGroupLabel === null || slideGroupLabel === void 0 ? void 0 : slideGroupLabel(index + 1, groups.length),
     isDisplayed: index >= startIndexVisible && index < endIndexVisible,
     slidesRef: slidesRef
   }, group)))), afterSlides);