Skip to main content

v8 Upgrade Guide

Nuka v8 and above are completely rewritten with new props and might not be completely backwards compatable with v7.

New Props​

  • className
  • pageIndicatorProps
  • scrollDistance
  • showButtons
  • showPageIndicators

Changed Props​

afterSlide

beforeSlide - implemented with some changes from v7

Read more about how to use them in the API (v8+) pages.

Removed Props​

adaptiveHeight - The carousel should adapt automatically to the height of the items in the carousel without the need of this prop.

adaptiveHeightAnimation - The carousel should adapt automatically to the height of the items in the carousel without the need of this prop.

carouselId

cellAlign - this should just be controlled through passed CSS (prop className).

cellSpacing - this should just be controlled through passed CSS.

defaultControlsConfig

disableAnimation - should just be controlled through passed CSS.

dragging - this is always on, it defaults to the OS/browser settings.

dragThreshold - this defaults to the OS/browser settings.

easing - should just be controlled through passed CSS.

edgeEasing - should just be controlled through passed CSS.

enableKeyboardControls - this should be native without interference. If the content is focusable through normal tabbing, it will focus.

keyCodeConfig - should be native.

landmark

renderTop{direction}Controls - build your own next/prev controls with the goBack() and goForward() exposed methods.

scrollMode - always on remainder for now.

slideIndex

slidesToScroll - renamed to scrollDistance.

slidesToShow - now based on media queries and how large the slides are.

speed - should be native.

style - pass styles through the className if needed.

tabbed - should be native.

withoutControls - controls are not rendered by default. Use methods to build your own next/prev triggers or style the page controls with showPageIndicators and pageIndicatorProps.

zoomScale - should just be controlled through passed CSS.

Props in consideration​

These v7 and below props are being worked on or are considered for v8.

disableEdgeSwiping - This might just be covered natively by browser/os.

frameAriaLabel - would like to do sweeping functionality and docs update for all accessibility things

onDragStart - in theory should be the same as beforeSlide but the debounce is too late for manual scrolling for this to really be effective.

onDrag - considering the use case for this, this would involve writing a shorter debounce on a useEffect that runs this function every time the scrollIndex changes.

onDragEnd - in theory should be the same as afterSlide since dragging with a touch device will trigger afterSlide after the scroll listening debounce ends.

onUserNavigation - would like to do sweeping functionality and docs update for all accessibility things

pauseOnHover - not implemented, not documented.