Added autoFocus prop to PageViews

Enact-DCO-1.0-Signed-off-by: Hyelyn Kim (myelyn.kim@lge.com)

CHANGELOG.md

@@ -7,6 +7,7 @@ The following is a curated list of changes in the Enact sandstone module, newest
 ### Added
 
 - `sandstone/Alert` public class names `alert`, `content`, `fullscreen`, and `title`
+- `sandstone/PageViews` prop `autoFocus` to set whether focus element automatically or not
 - `sandstone/Steps` prop `highlightCurrentOnly` to highlight and scale only the current step
 
 ### Changed
@@ -15,7 +16,6 @@ The following is a curated list of changes in the Enact sandstone module, newest
 
 ### Fixed
 
-- `sandstone/PageViews` not to focus element automatically when `autoFocus` prop is set `none`
 - `sandstone/Panels.Header` to show title and subtitle properly in `sandstone/WizardPanels`
 - `sandstone/Scroller`, `sandstone/Slider`, and `sandstone/VirtualList` to have default prop when `undefined` prop is passed
 - `sandstone/Scroller` to show scroll indicator when `focusableScrollbar` prop is `true`

PageViews/PageViews.js

@@ -53,6 +53,16 @@ const PageViewsBase = kind({
 		 */
 		arranger: shape,
 
+		/**
+		 * Sets the strategy used to automatically focus an element within the PageViews upon render.
+		 * When set to 'none', focus is not set only on the first render.
+		 *
+		 * @type {('default-element'|'last-focused'|'none'|String)}
+		 * @default 'default-element'
+		 * @public
+		 */
+		autoFocus: PropTypes.string,
+
 		/**
 		 * {@link sandstone/PageViews.Page|Page} to be rendered.
 		 *

PageViews/PageViewsRouter.js

@@ -26,7 +26,7 @@ function useReverseTransition (index, rtl) {
  */
 function PageViewsRouter (Wrapped) {
 	const PageViewsProvider = ({
-		autoFocus = 'default-element',
+		autoFocus,
 		children,
 		componentRef,
 		'data-spotlight-id': spotlightId,
@@ -70,9 +70,11 @@ function PageViewsRouter (Wrapped) {
 	PageViewsProvider.propTypes =  /** @lends sandstone/PageViews.PageViewsRouter.prototype */  {
 		/**
 		 * Sets the strategy used to automatically focus an element within the PageViews upon render.
+		 * When set to 'none', focus is not set only on the first render.
 		 *
 		 * @type {('default-element'|'last-focused'|'none'|String)}
-		 * @public
+		 * @default 'default-element'
+		 * @private
 		 */
 		autoFocus: PropTypes.string,