@lumx/react 4.22.1-next.0 → 4.22.1-next.1

package/index.d.ts

@@ -4910,7 +4910,7 @@ type SlideMode = ValueOf$1<typeof SlideMode>;
 /**
  * Defines the props of the component.
  */
-interface SlideshowProps extends GenericProps$1, Pick<SlidesProps, 'autoPlay' | 'slidesId' | 'id' | 'theme' | 'fillHeight' | 'groupBy' | 'slideGroupLabel'> {
+interface SlideshowProps extends GenericProps$1, Pick<SlidesProps, 'autoPlay' | 'slidesId' | 'id' | 'theme' | 'fillHeight' | 'groupBy' | 'slideGroupLabel' | 'slideGroupRoleDescription'> {
     /** Whether to use CSS transform translate or native scroll snap. */
     slideMode?: SlideMode;
     /** current slide active */
@@ -5085,6 +5085,11 @@ interface SlidesProps extends GenericProps$1, HasTheme$1 {
      * Receives the group position starting from 1 and the total number of groups.
      * */
     slideGroupLabel?: (groupPosition: number, groupTotal: number) => string;
+    /**
+     * Accessible role description to set on every slide group (`aria-roledescription`).
+     * Applies identically to every group.
+     * */
+    slideGroupRoleDescription?: string;
     /** Whether to use CSS transform translate or native scroll snap. */
     slideMode?: SlideMode;
     /** On slide change (only triggered on scroll when slideMode=scroll-snap) */

package/index.js

@@ -20187,6 +20187,7 @@ const SlideshowItemGroup = forwardRef((props, ref) => {
     role = 'group',
     label,
     isDisplayed,
+    'aria-roledescription': ariaRoleDescription,
     ...forwardedProps
   } = props;
   const groupRef = React__default.useRef(null);
@@ -20198,7 +20199,7 @@ const SlideshowItemGroup = forwardRef((props, ref) => {
     ref: mergeRefs(groupRef, ref),
     role: role,
     className: classNames.join(className, CLASSNAME$g),
-    "aria-roledescription": "slide",
+    "aria-roledescription": ariaRoleDescription ?? 'slide',
     "aria-label": label,
     ...forwardedProps,
     children: children
@@ -20238,6 +20239,7 @@ const Slideshow = forwardRef((props, ref) => {
     id,
     slidesId,
     slideGroupLabel,
+    slideGroupRoleDescription,
     slideMode = DEFAULT_PROPS$h.slideMode,
     ...forwardedProps
   } = props;
@@ -20294,6 +20296,7 @@ const Slideshow = forwardRef((props, ref) => {
     ref: mergeRefs(ref, setSlideshow),
     hasControls: showControls,
     slideGroupLabel: slideGroupLabel,
+    slideGroupRoleDescription: slideGroupRoleDescription,
     afterSlides: slideshowControlsProps && slidesCount > 1 ? /*#__PURE__*/jsx("div", {
       className: `${Slides.className}__controls`,
       children: /*#__PURE__*/jsx(SlideshowControls, {
@@ -20726,8 +20729,10 @@ const Slides = forwardRef((props, ref) => {
     afterSlides,
     hasControls,
     slideGroupLabel,
+    slideGroupRoleDescription,
     slideMode = DEFAULT_PROPS$f.slideMode,
     onChange,
+    'aria-roledescription': ariaRoleDescription,
     ...forwardedProps
   } = props;
   const wrapperRef = React__default.useRef(null);
@@ -20769,7 +20774,7 @@ const Slides = forwardRef((props, ref) => {
       'fill-height': fillHeight,
       [`group-by-${groupBy}`]: Boolean(groupBy)
     })),
-    "aria-roledescription": "carousel",
+    "aria-roledescription": ariaRoleDescription ?? 'carousel',
     children: [/*#__PURE__*/jsx("div", {
       id: slidesId,
       className: element$6('slides'),
@@ -20786,6 +20791,7 @@ const Slides = forwardRef((props, ref) => {
           id: slidesId && buildSlideShowGroupId(slidesId, index),
           role: hasControls ? 'tabpanel' : 'group',
           label: slideGroupLabel ? slideGroupLabel(index + 1, groups.length) : undefined,
+          "aria-roledescription": slideGroupRoleDescription,
           isDisplayed: index >= startIndexVisible && index < endIndexVisible,
           children: group
         }, index))