Refactor #1030

primefaces · Oct 15, 2019 · 8bbf51c · 8bbf51c
1 parent a559615
commit 8bbf51c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/src/components/carousel/Carousel.css b/src/components/carousel/Carousel.css
@@ -80,4 +80,13 @@
 
 .p-carousel-vertical .p-carousel-dots-container {
     margin: .75em 0;
+}
+
+/* Keyboard Support */
+.p-items-hidden .p-carousel-item {
+    visibility: hidden;
+}
+
+.p-items-hidden .p-carousel-item.p-carousel-item-active {
+    visibility: visible;
 }
diff --git a/src/components/carousel/Carousel.js b/src/components/carousel/Carousel.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import UniqueComponentId from '../utils/UniqueComponentId';
+import DomHandler from '../utils/DomHandler';
 
 class CarouselItem extends Component {
 
@@ -153,6 +154,7 @@ export class Carousel extends Component {
         }
 
         if (this.itemsContainer) {
+            DomHandler.removeClass(this.itemsContainer, 'p-items-hidden');
             this.itemsContainer.style.transform = this.isVertical() ? `translate3d(0, ${totalShiftedItems * (100/ this.state.numVisible)}%, 0)` : `translate3d(${totalShiftedItems * (100/ this.state.numVisible)}%, 0, 0)`;
             this.itemsContainer.style.transition = 'transform 500ms ease 0s';
         }
@@ -267,6 +269,7 @@ export class Carousel extends Component {
 
     onTransitionEnd() {
         if (this.itemsContainer) {
+            DomHandler.addClass(this.itemsContainer, 'p-items-hidden');
             this.itemsContainer.style.transition = '';
 
             if ((this.state.page === 0 || this.state.page === (this.totalDots - 1)) && this.isCircular()) {