"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.VirtualList = exports.VirtualGridList = exports["default"] = void 0;

var _jsxRuntime = require("react/jsx-runtime");

var _I18nDecorator = require("@enact/i18n/I18nDecorator");

var _SpotlightContainerDecorator = _interopRequireDefault(require("@enact/spotlight/SpotlightContainerDecorator"));

var _Resizable = require("@enact/ui/Resizable");

var _VirtualList = require("@enact/ui/VirtualList");

var _propTypes = _interopRequireDefault(require("prop-types"));

var _warning = _interopRequireDefault(require("warning"));

var _useScroll3 = _interopRequireDefault(require("../useScroll"));

var _Scrollbar = _interopRequireDefault(require("../useScroll/Scrollbar"));

var _Skinnable = _interopRequireDefault(require("../Skinnable"));

var _useThemeVirtualList = require("./useThemeVirtualList");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var nop = function nop() {};
/**
 * An Agate-styled scrollable and spottable virtual list component.
 *
 * @class VirtualList
 * @memberof agate/VirtualList
 * @extends ui/VirtualList.VirtualListBasic
 * @ui
 * @public
 */


var VirtualList = function VirtualList(_ref) {
  var itemSize = _ref.itemSize,
      role = _ref.role,
      rest = _objectWithoutProperties(_ref, ["itemSize", "role"]);

  var props = itemSize && itemSize.minSize ? {
    itemSize: itemSize.minSize,
    itemSizes: itemSize.size
  } : {
    itemSize: itemSize
  };
  process.env.NODE_ENV !== "production" ? (0, _warning["default"])(!rest.itemSizes || !rest.cbScrollTo, 'VirtualList with `minSize` in `itemSize` prop does not support `cbScrollTo` prop') : void 0; // Hooks

  var _useScroll = (0, _useScroll3["default"])(_objectSpread(_objectSpread({}, rest), props)),
      ScrollContentWrapper = _useScroll.scrollContentWrapper,
      scrollContentHandle = _useScroll.scrollContentHandle,
      isHorizontalScrollbarVisible = _useScroll.isHorizontalScrollbarVisible,
      isVerticalScrollbarVisible = _useScroll.isVerticalScrollbarVisible,
      resizeContextProps = _useScroll.resizeContextProps,
      scrollContainerProps = _useScroll.scrollContainerProps,
      scrollInnerContainerProps = _useScroll.scrollInnerContainerProps,
      scrollContentWrapperProps = _useScroll.scrollContentWrapperProps,
      scrollContentProps = _useScroll.scrollContentProps,
      verticalScrollbarProps = _useScroll.verticalScrollbarProps,
      horizontalScrollbarProps = _useScroll.horizontalScrollbarProps;

  var themeScrollContentProps = (0, _useThemeVirtualList.useThemeVirtualList)(_objectSpread(_objectSpread({}, scrollContentProps), {}, {
    focusableScrollbar: rest.focusableScrollbar,
    role: role
  }));
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Resizable.ResizeContext.Provider, _objectSpread(_objectSpread({}, resizeContextProps), {}, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, scrollContainerProps), {}, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, scrollInnerContainerProps), {}, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ScrollContentWrapper, _objectSpread(_objectSpread({}, scrollContentWrapperProps), {}, {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
            ref: scrollContentHandle
          }))
        })), isVerticalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, verticalScrollbarProps)) : null]
      })), isHorizontalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, horizontalScrollbarProps)) : null]
    }))
  }));
};

exports.VirtualList = VirtualList;
VirtualList.displayName = 'VirtualList';
VirtualList.propTypes =
/** @lends agate/VirtualList.VirtualList.prototype */
{
  /**
   * Size of an item for the VirtualList; valid value is a number generally.
   * For different item size, value is an object that has `minSize`
   * and `size` as properties.
   * If the direction for the list is vertical, itemSize means the height of an item.
   * For horizontal, it means the width of an item.
   *
   * Usage:
   * ```
   * <VirtualList itemSize={ri.scale(144)} />
   * ```
   *
   * @type {Number|ui/VirtualList.itemSizesShape}
   * @required
   * @public
   */
  itemSize: _propTypes["default"].oneOfType([_propTypes["default"].number, _VirtualList.itemSizesShape]).isRequired,

  /**
   * A callback function that receives a reference to the `scrollTo` feature.
   *
   * Once received, the `scrollTo` method can be called as an imperative interface.
   *
   * The `scrollTo` function accepts the following parameters:
   * - {position: {x, y}} - Pixel value for x and/or y position
   * - {align} - Where the scroll area should be aligned. Values are:
   *   `'left'`, `'right'`, `'top'`, `'bottom'`,
   *   `'topleft'`, `'topright'`, `'bottomleft'`, and `'bottomright'`.
   * - {index} - Index of specific item. (`0` or positive integer)
   *   This option is available for only `VirtualList` kind.
   * - {node} - Node to scroll into view
   * - {animate} - When `true`, scroll occurs with animation. When `false`, no
   *   animation occurs.
   * - {focus} - When `true`, attempts to focus item after scroll. Only valid when scrolling
   *   by `index` or `node`.
   * > Note: Only specify one of: `position`, `align`, `index` or `node`
   *
   * Example:
   * ```
   *	// If you set cbScrollTo prop like below;
   *	cbScrollTo: (fn) => {this.scrollTo = fn;}
   *	// You can simply call like below;
   *	this.scrollTo({align: 'top'}); // scroll to the top
   * ```
   *
   * @type {Function}
   * @public
   */
  cbScrollTo: _propTypes["default"].func,

  /**
   * This is set to `true` by SpotlightContainerDecorator
   *
   * @type {Boolean}
   * @private
   */
  'data-spotlight-container': _propTypes["default"].bool,

  /**
   * `false` if the content of the list could get focus
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  'data-spotlight-container-disabled': _propTypes["default"].bool,

  /**
   * This is passed onto the wrapped component to allow
   * it to customize the spotlight container for its use case.
   *
   * @type {String}
   * @private
   */
  'data-spotlight-id': _propTypes["default"].string,

  /**
   * The layout direction of the list.
   *
   * @type {('horizontal'|'vertical')}
   * @default 'vertical'
   * @public
   */
  direction: _propTypes["default"].oneOf(['horizontal', 'vertical']),

  /**
   * Allows 5-way navigation to the scrollbar controls. By default, 5-way will
   * not move focus to the scrollbar controls.
   *
   * @type {Boolean}
   * @default false
   * @public
   */
  focusableScrollbar: _propTypes["default"].bool,

  /**
   * Specifies how to show horizontal scrollbar.
   *
   * @type {('auto'|'visible'|'hidden')}
   * @default 'auto'
   * @public
   */
  horizontalScrollbar: _propTypes["default"].oneOf(['auto', 'visible', 'hidden']),

  /**
   * Unique identifier for the component.
   *
   * When defined and when the `VirtualList` is within a [Panel]{@link agate/Panels.Panel},
   * the `VirtualList` will store its scroll position and restore that position when returning to
   * the `Panel`.
   *
   * @type {String}
   * @public
   */
  id: _propTypes["default"].string,

  /**
   * Prop to check if horizontal Scrollbar exists or not.
   *
   * @type {Boolean}
   * @private
   */
  isHorizontalScrollbarVisible: _propTypes["default"].bool,

  /**
   * Prop to check if vertical Scrollbar exists or not.
   *
   * @type {Boolean}
   * @private
   */
  isVerticalScrollbarVisible: _propTypes["default"].bool,

  /**
   * The array for individually sized items.
   *
   * @type {Number[]}
   * @private
   */
  itemSizes: _propTypes["default"].arrayOf(_propTypes["default"].number),

  /**
   * Prevents scroll by wheeling on the list.
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  noScrollByWheel: _propTypes["default"].bool,

  /**
   * Called when scrolling.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * It is not recommended to set this prop since it can cause performance degradation.
   * Use `onScrollStart` or `onScrollStop` instead.
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScroll: _propTypes["default"].func,

  /**
   * Called when scroll starts.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * You can get firstVisibleIndex and lastVisibleIndex from VirtualList with `moreInfo`.
   *
   * Example:
   * ```
   * onScrollStart = ({scrollLeft, scrollTop, moreInfo}) => {
   *     const {firstVisibleIndex, lastVisibleIndex} = moreInfo;
   *     // do something with firstVisibleIndex and lastVisibleIndex
   * }
   *
   * render = () => (
   *     <VirtualList
   *         ...
   *         onScrollStart={this.onScrollStart}
   *         ...
   *     />
   * )
   * ```
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScrollStart: _propTypes["default"].func,

  /**
   * Called when scroll stops.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * You can get firstVisibleIndex and lastVisibleIndex from VirtualList with `moreInfo`.
   *
   * Example:
   * ```
   * onScrollStop = ({scrollLeft, scrollTop, moreInfo}) => {
   *     const {firstVisibleIndex, lastVisibleIndex} = moreInfo;
   *     // do something with firstVisibleIndex and lastVisibleIndex
   * }
   *
   * render = () => (
   *     <VirtualList
   *         ...
   *         onScrollStop={this.onScrollStop}
   *         ...
   *     />
   * )
   * ```
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScrollStop: _propTypes["default"].func,

  /**
   * When `true`, the list will scroll by page. Otherwise the list will scroll by item.
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  pageScroll: _propTypes["default"].bool,

  /**
   * Specifies preventing keydown events from bubbling up to applications.
   * Valid values are `'none'`, and `'programmatic'`.
   *
   * When it is `'none'`, every keydown event is bubbled.
   * When it is `'programmatic'`, an event bubbling is not allowed for a keydown input
   * which invokes programmatic spotlight moving.
   *
   * @type {String}
   * @default 'programmatic'
   * @private
   */
  preventBubblingOnKeyDown: _propTypes["default"].oneOf(['none', 'programmatic']),

  /**
   * The ARIA role for the list.
   *
   * @type {String}
   * @default 'list'
   * @public
   */
  role: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the next button in the vertical scroll bar.
   *
   * @type {String}
   * @default $L('scroll down')
   * @public
   */
  scrollDownAriaLabel: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the previous button in the horizontal scroll bar.
   *
   * @type {String}
   * @default $L('scroll left')
   * @public
   */
  scrollLeftAriaLabel: _propTypes["default"].string,

  /**
   * Specifies how to scroll.
   *
   * Valid values are:
   * * `'translate'`,
   * * `'native'`.
   *
   * @type {String}
   * @default 'translate'
   * @public
   */
  scrollMode: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the next button in the horizontal scroll bar.
   *
   * @type {String}
   * @default $L('scroll right')
   * @public
   */
  scrollRightAriaLabel: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the previous button in the vertical scroll bar.
   *
   * @type {String}
   * @default $L('scroll up')
   * @public
   */
  scrollUpAriaLabel: _propTypes["default"].string,

  /**
   * Spotlight Id.
   *
   * @type {String}
   * @private
   */
  spotlightId: _propTypes["default"].string,

  /**
   * Specifies how to show vertical scrollbar.
   *
   * Valid values are:
   * * `'auto'`,
   * * `'visible'`, and
   * * `'hidden'`.
   *
   * @type {('auto'|'visible'|'hidden')}
   * @default 'auto'
   * @public
   */
  verticalScrollbar: _propTypes["default"].oneOf(['auto', 'visible', 'hidden']),

  /**
   * When it's `true` and the spotlight focus cannot move to the given direction anymore by 5-way keys,
   * a list is scrolled with an animation to the other side and the spotlight focus moves in wraparound manner.
   *
   * When it's `'noAnimation'`, the spotlight focus moves in wraparound manner as same as when it's `true`
   * except that a list is scrolled without an animation.
   *
   * Valid values are:
   * * `false`,
   * * `true`, and
   * * `'noAnimation'`
   * @type {Boolean|'noAnimation'}
   * @default false
   * @public
   */
  wrap: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['noAnimation'])])
};
exports.VirtualList = VirtualList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
  overflow: true,
  preserveId: true,
  restrict: 'self-first'
}, (0, _I18nDecorator.I18nContextDecorator)({
  rtlProp: 'rtl'
}, VirtualList)));
VirtualList.defaultProps = {
  'data-spotlight-container-disabled': false,
  cbScrollTo: nop,
  direction: 'vertical',
  focusableScrollbar: false,
  horizontalScrollbar: 'auto',
  noScrollByWheel: false,
  onScroll: nop,
  onScrollStart: nop,
  onScrollStop: nop,
  pageScroll: false,
  preventBubblingOnKeyDown: 'programmatic',
  role: 'list',
  scrollMode: 'translate',
  verticalScrollbar: 'auto',
  wrap: false
};
/**
 * An Agate-styled scrollable and spottable virtual grid list component.
 *
 * @class VirtualGridList
 * @memberof agate/VirtualList
 * @extends ui/VirtualList.VirtualListBasic
 * @ui
 * @public
 */

var VirtualGridList = function VirtualGridList(_ref2) {
  var role = _ref2.role,
      rest = _objectWithoutProperties(_ref2, ["role"]);

  var _useScroll2 = (0, _useScroll3["default"])(rest),
      ScrollContentWrapper = _useScroll2.scrollContentWrapper,
      scrollContentHandle = _useScroll2.scrollContentHandle,
      isHorizontalScrollbarVisible = _useScroll2.isHorizontalScrollbarVisible,
      isVerticalScrollbarVisible = _useScroll2.isVerticalScrollbarVisible,
      resizeContextProps = _useScroll2.resizeContextProps,
      scrollContainerProps = _useScroll2.scrollContainerProps,
      scrollInnerContainerProps = _useScroll2.scrollInnerContainerProps,
      scrollContentWrapperProps = _useScroll2.scrollContentWrapperProps,
      scrollContentProps = _useScroll2.scrollContentProps,
      verticalScrollbarProps = _useScroll2.verticalScrollbarProps,
      horizontalScrollbarProps = _useScroll2.horizontalScrollbarProps;

  var themeScrollContentProps = (0, _useThemeVirtualList.useThemeVirtualList)(_objectSpread(_objectSpread({}, scrollContentProps), {}, {
    focusableScrollbar: rest.focusableScrollbar,
    role: role
  }));
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Resizable.ResizeContext.Provider, _objectSpread(_objectSpread({}, resizeContextProps), {}, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, scrollContainerProps), {}, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, scrollInnerContainerProps), {}, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ScrollContentWrapper, _objectSpread(_objectSpread({}, scrollContentWrapperProps), {}, {
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_VirtualList.VirtualListBasic, _objectSpread(_objectSpread({}, themeScrollContentProps), {}, {
            ref: scrollContentHandle
          }))
        })), isVerticalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, verticalScrollbarProps)) : null]
      })), isHorizontalScrollbarVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scrollbar["default"], _objectSpread({}, horizontalScrollbarProps)) : null]
    }))
  }));
};

exports.VirtualGridList = VirtualGridList;
VirtualGridList.displayName = 'VirtualGridList';
VirtualGridList.propTypes =
/** @lends agate/VirtualList.VirtualGridList.prototype */
{
  /**
   * Size of an item for the VirtualGridList; valid value is an object that has `minWidth`
   * and `minHeight` as properties.
   *
   * Usage:
   * ```
   * <VirtualGridList
   *   itemSize={{
   *     minWidth: ri.scale(360),
   *     minHeight: ri.scale(540)
   *   }}
   * />
   * ```
   *
   * @type {ui/VirtualList.gridListItemSizeShape}
   * @required
   * @public
   */
  itemSize: _VirtualList.gridListItemSizeShape.isRequired,

  /**
   * A callback function that receives a reference to the `scrollTo` feature.
   *
   * Once received, the `scrollTo` method can be called as an imperative interface.
   *
   * The `scrollTo` function accepts the following parameters:
   * - {position: {x, y}} - Pixel value for x and/or y position
   * - {align} - Where the scroll area should be aligned. Values are:
   *   `'left'`, `'right'`, `'top'`, `'bottom'`,
   *   `'topleft'`, `'topright'`, `'bottomleft'`, and `'bottomright'`.
   * - {index} - Index of specific item. (`0` or positive integer)
   *   This option is available for only `VirtualList` kind.
   * - {node} - Node to scroll into view
   * - {animate} - When `true`, scroll occurs with animation. When `false`, no
   *   animation occurs.
   * - {focus} - When `true`, attempts to focus item after scroll. Only valid when scrolling
   *   by `index` or `node`.
   * > Note: Only specify one of: `position`, `align`, `index` or `node`
   *
   * Example:
   * ```
   *	// If you set cbScrollTo prop like below;
   *	cbScrollTo: (fn) => {this.scrollTo = fn;}
   *	// You can simply call like below;
   *	this.scrollTo({align: 'top'}); // scroll to the top
   * ```
   *
   * @type {Function}
   * @public
   */
  cbScrollTo: _propTypes["default"].func,

  /**
   * This is set to `true` by SpotlightContainerDecorator
   *
   * @type {Boolean}
   * @private
   */
  'data-spotlight-container': _propTypes["default"].bool,

  /**
   * `false` if the content of the list could get focus
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  'data-spotlight-container-disabled': _propTypes["default"].bool,

  /**
   * This is passed onto the wrapped component to allow
   * it to customize the spotlight container for its use case.
   *
   * @type {String}
   * @private
   */
  'data-spotlight-id': _propTypes["default"].string,

  /**
   * The layout direction of the list.
   *
   * @type {('horizontal'|'vertical')}
   * @default 'vertical'
   * @public
   */
  direction: _propTypes["default"].oneOf(['horizontal', 'vertical']),

  /**
   * Allows 5-way navigation to the scrollbar controls. By default, 5-way will
   * not move focus to the scrollbar controls.
   *
   * @type {Boolean}
   * @default false
   * @public
   */
  focusableScrollbar: _propTypes["default"].bool,

  /**
   * Specifies how to show horizontal scrollbar.
   *
   * @type {('auto'|'visible'|'hidden')}
   * @default 'auto'
   * @public
   */
  horizontalScrollbar: _propTypes["default"].oneOf(['auto', 'visible', 'hidden']),

  /**
   * Unique identifier for the component.
   *
   * When defined and when the `VirtualGridList` is within a [Panel]{@link agate/Panels.Panel},
   * the `VirtualGridList` will store its scroll position and restore that position when returning to
   * the `Panel`.
   *
   * @type {String}
   * @public
   */
  id: _propTypes["default"].string,

  /**
   * Prop to check if horizontal Scrollbar exists or not.
   *
   * @type {Boolean}
   * @private
   */
  isHorizontalScrollbarVisible: _propTypes["default"].bool,

  /**
   * Prop to check if vertical Scrollbar exists or not.
   *
   * @type {Boolean}
   * @private
   */
  isVerticalScrollbarVisible: _propTypes["default"].bool,

  /**
   * Prevents scroll by wheeling on the list.
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  noScrollByWheel: _propTypes["default"].bool,

  /**
   * Called when scrolling.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * It is not recommended to set this prop since it can cause performance degradation.
   * Use `onScrollStart` or `onScrollStop` instead.
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScroll: _propTypes["default"].func,

  /**
   * Called when scroll starts.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * You can get firstVisibleIndex and lastVisibleIndex from VirtualGridList with `moreInfo`.
   *
   * Example:
   * ```
   * onScrollStart = ({scrollLeft, scrollTop, moreInfo}) => {
   *     const {firstVisibleIndex, lastVisibleIndex} = moreInfo;
   *     // do something with firstVisibleIndex and lastVisibleIndex
   * }
   *
   * render = () => (
   *     <VirtualGridList
   *         ...
   *         onScrollStart={this.onScrollStart}
   *         ...
   *     />
   * )
   * ```
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScrollStart: _propTypes["default"].func,

  /**
   * Called when scroll stops.
   *
   * Passes `scrollLeft`, `scrollTop`, and `moreInfo`.
   * You can get firstVisibleIndex and lastVisibleIndex from VirtualGridList with `moreInfo`.
   *
   * Example:
   * ```
   * onScrollStop = ({scrollLeft, scrollTop, moreInfo}) => {
   *     const {firstVisibleIndex, lastVisibleIndex} = moreInfo;
   *     // do something with firstVisibleIndex and lastVisibleIndex
   * }
   *
   * render = () => (
   *     <VirtualGridList
   *         ...
   *         onScrollStop={this.onScrollStop}
   *         ...
   *     />
   * )
   * ```
   *
   * @type {Function}
   * @param {Object} event
   * @param {Number} event.scrollLeft Scroll left value.
   * @param {Number} event.scrollTop Scroll top value.
   * @param {Object} event.moreInfo The object including `firstVisibleIndex` and `lastVisibleIndex` properties.
   * @public
   */
  onScrollStop: _propTypes["default"].func,

  /**
   * When `true`, the list will scroll by page. Otherwise the list will scroll by item.
   *
   * @type {Boolean}
   * @default false
   * @private
   */
  pageScroll: _propTypes["default"].bool,

  /**
   * Specifies preventing keydown events from bubbling up to applications.
   * Valid values are `'none'`, and `'programmatic'`.
   *
   * When it is `'none'`, every keydown event is bubbled.
   * When it is `'programmatic'`, an event bubbling is not allowed for a keydown input
   * which invokes programmatic spotlight moving.
   *
   * @type {String}
   * @default 'programmatic'
   * @private
   */
  preventBubblingOnKeyDown: _propTypes["default"].oneOf(['none', 'programmatic']),

  /**
   * The ARIA role for the list.
   *
   * @type {String}
   * @default 'list'
   * @public
   */
  role: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the next button in the vertical scroll bar.
   *
   * @type {String}
   * @default $L('scroll down')
   * @public
   */
  scrollDownAriaLabel: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the previous button in the horizontal scroll bar.
   *
   * @type {String}
   * @default $L('scroll left')
   * @public
   */
  scrollLeftAriaLabel: _propTypes["default"].string,

  /**
   * Specifies how to scroll.
   *
   * Valid values are:
   * * `'translate'`,
   * * `'native'`.
   *
   * @type {String}
   * @default 'translate'
   * @public
   */
  scrollMode: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the next button in the horizontal scroll bar.
   *
   * @type {String}
   * @default $L('scroll right')
   * @public
   */
  scrollRightAriaLabel: _propTypes["default"].string,

  /**
   * Sets the hint string read when focusing the previous button in the vertical scroll bar.
   *
   * @type {String}
   * @default $L('scroll up')
   * @public
   */
  scrollUpAriaLabel: _propTypes["default"].string,

  /**
   * Spotlight Id.
   *
   * @type {String}
   * @private
   */
  spotlightId: _propTypes["default"].string,

  /**
   * Specifies how to show vertical scrollbar.
   *
   * Valid values are:
   * * `'auto'`,
   * * `'visible'`, and
   * * `'hidden'`.
   *
   * @type {('auto'|'visible'|'hidden')}
   * @default 'auto'
   * @public
   */
  verticalScrollbar: _propTypes["default"].oneOf(['auto', 'visible', 'hidden']),

  /**
   * When it's `true` and the spotlight focus cannot move to the given direction anymore by 5-way keys,
   * a list is scrolled with an animation to the other side and the spotlight focus moves in wraparound manner.
   *
   * When it's `'noAnimation'`, the spotlight focus moves in wraparound manner as same as when it's `true`
   * except that a list is scrolled without an animation.
   *
   * Valid values are:
   * * `false`,
   * * `true`, and
   * * `'noAnimation'`
   *
   * @type {Boolean|'noAnimation'}
   * @default false
   * @public
   */
  wrap: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['noAnimation'])])
};
exports.VirtualGridList = VirtualGridList = (0, _Skinnable["default"])((0, _SpotlightContainerDecorator["default"])({
  overflow: true,
  preserveId: true,
  restrict: 'self-first'
}, (0, _I18nDecorator.I18nContextDecorator)({
  rtlProp: 'rtl'
}, VirtualGridList)));
VirtualGridList.defaultProps = {
  'data-spotlight-container-disabled': false,
  cbScrollTo: nop,
  direction: 'vertical',
  focusableScrollbar: false,
  horizontalScrollbar: 'auto',
  noScrollByWheel: false,
  onScroll: nop,
  onScrollStart: nop,
  onScrollStop: nop,
  pageScroll: false,
  preventBubblingOnKeyDown: 'programmatic',
  role: 'list',
  scrollMode: 'translate',
  verticalScrollbar: 'auto',
  wrap: false
};
var _default = VirtualList;
exports["default"] = _default;