@enact/sandstone
Version:
Large-screen/TV support library for Enact, containing a variety of UI components.
524 lines (500 loc) • 26.4 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useScroll = exports["default"] = exports.dataIndexAttribute = exports.affordanceSize = void 0;
var _handle = require("@enact/core/handle");
var _platform = _interopRequireDefault(require("@enact/core/platform"));
var _spotlight = _interopRequireWildcard(require("@enact/spotlight"));
var _Spottable = require("@enact/spotlight/Spottable");
var _container = require("@enact/spotlight/src/container");
var _target = require("@enact/spotlight/src/target");
var _utils = require("@enact/spotlight/src/utils");
var _useScroll = require("@enact/ui/useScroll");
var _utilDOM = _interopRequireDefault(require("@enact/ui/useScroll/utilDOM"));
var _utilEvent = _interopRequireDefault(require("@enact/ui/useScroll/utilEvent"));
var _react = require("react");
var _$L = _interopRequireDefault(require("../internal/$L"));
var _SharedStateDecorator = require("../internal/SharedStateDecorator");
var _useThemeScrollContentHandle = require("./useThemeScrollContentHandle");
var _useEvent = require("./useEvent");
var _useOverscrollEffect2 = _interopRequireDefault(require("./useOverscrollEffect"));
var _useSpotlight = require("./useSpotlight");
var _OverscrollEffectModule = _interopRequireDefault(require("./OverscrollEffect.module.css"));
var _useScrollModule = _interopRequireDefault(require("./useScroll.module.css"));
var _excluded = ["className", "data-spotlight-container", "data-spotlight-container-disabled", "data-spotlight-id", "data-webos-voice-disabled", "data-webos-voice-focused", "data-webos-voice-group-label", "editable", "focusableScrollbar", "fadeOut", "horizontalScrollThumbAriaLabel", "noAffordance", "scrollMode", "snapToCenter", "style", "verticalScrollThumbAriaLabel"];
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
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; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /**
* Sandstone-themed scrollable hook and behaviors.
*
* @module sandstone/useScroll
* @exports affordanceSize
* @exports dataIndexAttribute
* @exports useScroll
* @private
*/
var arrowKeyMultiplier = 0.2,
affordanceSize = exports.affordanceSize = 48,
paginationPageMultiplier = _useScroll.constants.paginationPageMultiplier,
reverseDirections = {
down: 'up',
up: 'down'
};
/**
* The name of a custom attribute which indicates the index of an item in
* {@link sandstone/VirtualList.VirtualList|VirtualList} or
* {@link sandstone/VirtualList.VirtualGridList|VirtualGridList}.
*
* @constant dataIndexAttribute
* @memberof sandstone/useScroll
* @type {String}
* @private
*/
var dataIndexAttribute = exports.dataIndexAttribute = 'data-index';
var isIntersecting = function isIntersecting(elem, container) {
return elem && (0, _utils.intersects)((0, _utils.getRect)(container), (0, _utils.getRect)(elem));
};
var getIntersectingElement = function getIntersectingElement(elem, container) {
return isIntersecting(elem, container) && elem;
};
var getTargetInViewByDirectionFromPosition = function getTargetInViewByDirectionFromPosition(direction, position, container) {
var target = (0, _target.getTargetByDirectionFromPosition)(direction, position, (0, _container.getContainerId)(container));
return getIntersectingElement(target, container);
};
var useThemeScroll = function useThemeScroll(props, instances) {
var scrollbarTrackCss = props.scrollbarTrackCss,
scrollMode = props.scrollMode;
var themeScrollContentHandle = instances.themeScrollContentHandle,
scrollContentRef = instances.scrollContentRef,
scrollContainerHandle = instances.scrollContainerHandle,
scrollContainerRef = instances.scrollContainerRef;
var contextSharedState = (0, _react.useContext)(_SharedStateDecorator.SharedState);
// Mutable value
var mutableRef = (0, _react.useRef)({
animateOnFocus: true,
indexToFocus: null,
isWheeling: false,
lastScrollPositionOnFocus: null,
nodeToFocus: null,
pointToFocus: null
});
// Hooks
(0, _useSpotlight.useSpotlightRestore)(props, instances);
var _useOverscrollEffect = (0, _useOverscrollEffect2["default"])({}, instances),
applyOverscrollEffect = _useOverscrollEffect.applyOverscrollEffect,
checkAndApplyOverscrollEffectByDirection = _useOverscrollEffect.checkAndApplyOverscrollEffectByDirection,
clearOverscrollEffect = _useOverscrollEffect.clearOverscrollEffect;
var _useEventWheel = (0, _useEvent.useEventWheel)(props, _objectSpread(_objectSpread({}, instances), {}, {
spottable: mutableRef
})),
handleWheel = _useEventWheel.handleWheel;
var _useEventFocus = (0, _useEvent.useEventFocus)(props, _objectSpread(_objectSpread({}, instances), {}, {
spottable: mutableRef
})),
calculateAndScrollTo = _useEventFocus.calculateAndScrollTo,
handleFocus = _useEventFocus.handleFocus,
hasFocus = _useEventFocus.hasFocus;
var _useEventKey = (0, _useEvent.useEventKey)(props, _objectSpread(_objectSpread({}, instances), {}, {
spottable: mutableRef
}), {
checkAndApplyOverscrollEffectByDirection: checkAndApplyOverscrollEffectByDirection,
hasFocus: hasFocus,
isContent: isContent
}),
handleKeyDown = _useEventKey.handleKeyDown,
lastPointer = _useEventKey.lastPointer,
scrollByPageOnPointerMode = _useEventKey.scrollByPageOnPointerMode;
(0, _useEvent.useEventMonitor)({}, instances, {
lastPointer: lastPointer,
scrollByPageOnPointerMode: scrollByPageOnPointerMode
});
var _useEventMouse = (0, _useEvent.useEventMouse)({}, instances),
handleFlick = _useEventMouse.handleFlick,
handleMouseDown = _useEventMouse.handleMouseDown;
var _useEventTouch = (0, _useEvent.useEventTouch)(),
handleTouchStart = _useEventTouch.handleTouchStart;
var _useEventVoice = (0, _useEvent.useEventVoice)(props, instances),
addVoiceEventListener = _useEventVoice.addVoiceEventListener,
removeVoiceEventListener = _useEventVoice.removeVoiceEventListener,
stopVoice = _useEventVoice.stopVoice;
var scrollbarProps = {
cbAlertScrollbarTrack: alertScrollbarTrack,
onInteractionForScroll: onInteractionForScroll,
scrollbarTrackCss: scrollbarTrackCss
};
// Functions
function isContent(element) {
return element && _utilDOM["default"].containsDangerously(scrollContentRef, element);
}
function scrollTo(opt) {
mutableRef.current.indexToFocus = opt.focus && typeof opt.index === 'number' ? opt.index : null;
mutableRef.current.nodeToFocus = opt.focus && opt.node instanceof Object && opt.node.nodeType === 1 ? opt.node : null;
}
function start(animate) {
if (scrollMode === 'native' && !animate) {
focusOnItem();
}
}
function stop() {
if (!props['data-spotlight-container-disabled']) {
themeScrollContentHandle.current.setContainerDisabled(false);
}
if (themeScrollContentHandle.current.pauseSpotlight) {
themeScrollContentHandle.current.pauseSpotlight(false);
}
focusOnItem();
mutableRef.current.lastScrollPositionOnFocus = null;
mutableRef.current.isWheeling = false;
stopVoice();
}
function scrollStopOnScroll() {
stop();
}
function onInteractionForScroll(_ref) {
var inputType = _ref.inputType,
isForward = _ref.isForward,
isPagination = _ref.isPagination,
isVerticalScrollBar = _ref.isVerticalScrollBar;
var wheelDirection = scrollContainerHandle.current.wheelDirection,
bounds = scrollContainerHandle.current.getScrollBounds(),
direction = isForward ? 1 : -1,
pageSize = isVerticalScrollBar ? bounds.clientHeight : bounds.clientWidth,
distance = pageSize * (isPagination ? paginationPageMultiplier : arrowKeyMultiplier);
scrollContainerHandle.current.lastInputType = inputType;
if (direction !== wheelDirection) {
scrollContainerHandle.current.isScrollAnimationTargetAccumulated = false;
scrollContainerHandle.current.wheelDirection = direction;
}
scrollContainerHandle.current.scrollToAccumulatedTarget(direction * distance, isVerticalScrollBar, props.overscrollEffectOn[inputType]);
}
function alertScrollbarTrack() {
var bounds = scrollContainerHandle.current.getScrollBounds();
scrollContainerHandle.current.showScrollbarTrack(bounds);
scrollContainerHandle.current.startHidingScrollbarTrack();
}
function focusOnItem() {
var isItemFocused = false;
if (mutableRef.current.indexToFocus !== null && typeof themeScrollContentHandle.current.focusByIndex === 'function') {
themeScrollContentHandle.current.focusByIndex(mutableRef.current.indexToFocus);
mutableRef.current.indexToFocus = null;
isItemFocused = true;
}
if (mutableRef.current.nodeToFocus !== null && typeof themeScrollContentHandle.current.focusOnNode === 'function') {
themeScrollContentHandle.current.focusOnNode(mutableRef.current.nodeToFocus);
mutableRef.current.nodeToFocus = null;
isItemFocused = true;
}
if (mutableRef.current.pointToFocus !== null) {
// no need to focus on pointer mode
if (!_spotlight["default"].getPointerMode()) {
var _mutableRef$current$p = mutableRef.current.pointToFocus,
direction = _mutableRef$current$p.direction,
x = _mutableRef$current$p.x,
y = _mutableRef$current$p.y,
position = {
x: x,
y: y
},
elemFromPoint = document.elementFromPoint(x, y),
target = elemFromPoint && elemFromPoint.closest && getIntersectingElement(elemFromPoint.closest(".".concat(_Spottable.spottableClass)), scrollContainerRef.current) || getTargetInViewByDirectionFromPosition(direction, position, scrollContainerRef.current) || getTargetInViewByDirectionFromPosition(reverseDirections[direction], position, scrollContainerRef.current);
if (target) {
_spotlight["default"].focus(target);
isItemFocused = true;
}
}
mutableRef.current.pointToFocus = null;
}
if (_spotlight["default"].getPointerMode() && !isItemFocused) {
_spotlight["default"].focus(scrollContainerRef.current, {
enterTo: 'topmost'
});
}
}
function handleScroll(ev) {
var x = ev.scrollLeft,
y = ev.scrollTop,
id = props.id;
(0, _handle.forward)('onScroll', ev, props);
if (id && contextSharedState && contextSharedState.set) {
contextSharedState.set(ev, props);
contextSharedState.set("".concat(id, ".scrollPosition"), {
x: x,
y: y
});
}
}
// Callback for scroller updates; calculate and, if needed, scroll to new position based on focused item.
function handleScrollerUpdate() {
if (scrollContainerHandle.current.scrollToInfo === null) {
var scrollHeight = scrollContainerHandle.current.getScrollBounds().scrollHeight;
if (scrollHeight !== scrollContainerHandle.current.bounds.scrollHeight) {
calculateAndScrollTo();
}
}
// oddly, Scroller manages scrollContainerHandle.current.bounds so if we don't update it here (it is also
// updated in calculateAndScrollTo but we might not have made it to that point), it will be
// out of date when we land back in this method next time.
scrollContainerHandle.current.bounds.scrollHeight = scrollContainerHandle.current.getScrollBounds().scrollHeight;
}
function handleResizeWindow() {
var focusedItem = _spotlight["default"].getCurrent();
if (focusedItem) {
focusedItem.scrollIntoView(true);
return false;
}
return true;
}
// FIXME setting event handlers directly to work on the V8 snapshot.
function addEventListeners(ref) {
// `ref` is always `scrollContentRef`.
(0, _utilEvent["default"])('focusin').addEventListener(ref, handleFocus);
if (ref.current) {
addVoiceEventListener(ref);
}
}
// FIXME setting event handlers directly to work on the V8 snapshot.
function removeEventListeners(ref) {
// `ref` is always `scrollContentRef`.
(0, _utilEvent["default"])('focusin').removeEventListener(ref, handleFocus);
if (ref.current) {
removeVoiceEventListener(ref);
}
}
function preventScroll(ev) {
if (_spotlight["default"].isPaused() && (0, _spotlight.getDirection)(ev.keyCode)) {
ev.preventDefault();
ev.stopPropagation();
}
}
// Return
return {
addEventListeners: addEventListeners,
applyOverscrollEffect: applyOverscrollEffect,
clearOverscrollEffect: clearOverscrollEffect,
handleFlick: handleFlick,
handleKeyDown: handleKeyDown,
handleMouseDown: handleMouseDown,
handleResizeWindow: handleResizeWindow,
handleScroll: handleScroll,
handleScrollerUpdate: handleScrollerUpdate,
handleTouchStart: handleTouchStart,
handleWheel: handleWheel,
removeEventListeners: removeEventListeners,
preventScroll: preventScroll,
scrollbarProps: scrollbarProps,
scrollStopOnScroll: scrollStopOnScroll,
scrollTo: scrollTo,
start: start,
stop: stop
};
};
/**
* A custom hook that passes Sandstone-themed scrollable behavior information as its render prop.
*
* @class
* @memberof sandstone/useScroll
* @ui
* @private
*/
var useScroll = exports.useScroll = function useScroll(props) {
var className = props.className,
spotlightContainer = props['data-spotlight-container'],
spotlightContainerDisabled = props['data-spotlight-container-disabled'],
spotlightId = props['data-spotlight-id'],
voiceDisabled = props['data-webos-voice-disabled'],
voiceFocused = props['data-webos-voice-focused'],
voiceGroupLabel = props['data-webos-voice-group-label'],
editable = props.editable,
focusableScrollbar = props.focusableScrollbar,
fadeOut = props.fadeOut,
horizontalScrollThumbAriaLabel = props.horizontalScrollThumbAriaLabel,
noAffordance = props.noAffordance,
scrollMode = props.scrollMode,
snapToCenter = props.snapToCenter,
style = props.style,
verticalScrollThumbAriaLabel = props.verticalScrollThumbAriaLabel,
rest = _objectWithoutProperties(props, _excluded);
delete rest.scrollbarTrackCss;
delete rest.scrollToContentContainerOnFocus;
// Mutable value
var scrollContainerRef = (0, _react.useRef)();
var scrollContentHandle = (0, _react.useRef)();
var scrollContentRef = (0, _react.useRef)();
var itemRefs = (0, _react.useRef)([]);
var horizontalScrollbarHandle = (0, _react.useRef)();
var verticalScrollbarHandle = (0, _react.useRef)();
// Handles
var _useThemeScrollConten = (0, _useThemeScrollContentHandle.useThemeScrollContentHandle)(),
_useThemeScrollConten2 = _slicedToArray(_useThemeScrollConten, 2),
themeScrollContentHandle = _useThemeScrollConten2[0],
setThemeScrollContentHandle = _useThemeScrollConten2[1];
var scrollContainerHandle = (0, _react.useRef)({}); // To prevent referencing errors before calling `setScrollContainerHandle`, an empty object is provided as a default.
/* Properties in `scrollContainerHandle` provided by `setScrollContainerHandle`
animator
applyOverscrollEffect
bounds
calculateDistanceByWheel
canScrollHorizontally
canScrollVertically
checkAndApplyOverscrollEffect
getScrollBounds
isDragging
isScrollAnimationTargetAccumulated
lastInputType
rtl
scrollBounds
scrollHeight
scrolling
scrollLeft
scrollTo
scrollToAccumulatedTarget
scrollToInfo
scrollTop
setOverscrollStatus
showScrollbarTrack
start
startHidingScrollbarTrack
stop
wheelDirection
*/
var setScrollContainerHandle = function setScrollContainerHandle(handle) {
scrollContainerHandle.current = handle;
};
// Hooks
var instance = {
// Ref
scrollContainerRef: scrollContainerRef,
scrollContentRef: scrollContentRef,
// Adapter
themeScrollContentHandle: themeScrollContentHandle,
scrollContainerHandle: scrollContainerHandle,
scrollContentHandle: scrollContentHandle
};
var collectionOfProperties = {},
assignProperties = (0, _useScroll.assignPropertiesOf)(collectionOfProperties),
scrollProps = {};
var _useThemeScroll = useThemeScroll(props, instance),
addEventListeners = _useThemeScroll.addEventListeners,
applyOverscrollEffect = _useThemeScroll.applyOverscrollEffect,
clearOverscrollEffect = _useThemeScroll.clearOverscrollEffect,
handleFlick = _useThemeScroll.handleFlick,
handleKeyDown = _useThemeScroll.handleKeyDown,
handleMouseDown = _useThemeScroll.handleMouseDown,
handleResizeWindow = _useThemeScroll.handleResizeWindow,
handleScroll = _useThemeScroll.handleScroll,
handleScrollerUpdate = _useThemeScroll.handleScrollerUpdate,
handleTouchStart = _useThemeScroll.handleTouchStart,
handleWheel = _useThemeScroll.handleWheel,
removeEventListeners = _useThemeScroll.removeEventListeners,
preventScroll = _useThemeScroll.preventScroll,
scrollbarProps = _useThemeScroll.scrollbarProps,
scrollStopOnScroll = _useThemeScroll.scrollStopOnScroll,
scrollTo = _useThemeScroll.scrollTo,
start = _useThemeScroll.start,
stop = _useThemeScroll.stop;
// Render
if (scrollMode === 'translate') {
scrollProps.stop = stop;
} else {
scrollProps.preventScroll = preventScroll;
scrollProps.scrollStopOnScroll = scrollStopOnScroll;
scrollProps.start = start;
}
var _useScrollBase = (0, _useScroll.useScrollBase)(_objectSpread(_objectSpread(_objectSpread({}, rest), scrollProps), {}, {
assignProperties: assignProperties,
noScrollByDrag: !_platform["default"].touchScreen,
addEventListeners: addEventListeners,
applyOverscrollEffect: applyOverscrollEffect,
clearOverscrollEffect: clearOverscrollEffect,
handleResizeWindow: handleResizeWindow,
horizontalScrollbarHandle: horizontalScrollbarHandle,
onFlick: handleFlick,
onKeyDown: handleKeyDown,
onMouseDown: handleMouseDown,
onScroll: handleScroll,
onWheel: handleWheel,
removeEventListeners: removeEventListeners,
scrollTo: scrollTo,
setScrollContainerHandle: setScrollContainerHandle,
scrollMode: scrollMode,
scrollContentHandle: scrollContentHandle,
scrollContentRef: scrollContentRef,
scrollContainerRef: scrollContainerRef,
snapToCenter: snapToCenter,
spotlightContainerDisabled: spotlightContainerDisabled,
verticalScrollbarHandle: verticalScrollbarHandle
})),
isHorizontalScrollbarVisible = _useScrollBase.isHorizontalScrollbarVisible,
isVerticalScrollbarVisible = _useScrollBase.isVerticalScrollbarVisible,
scrollContentWrapper = _useScrollBase.scrollContentWrapper,
scrollObserver = _useScrollBase.scrollObserver;
assignProperties('scrollContainerProps', {
className: [className, _useScrollModule["default"].scroll, _OverscrollEffectModule["default"].scroll, focusableScrollbar ? _useScrollModule["default"].focusableScrollbar : null, focusableScrollbar && isVerticalScrollbarVisible ? _useScrollModule["default"].verticalPadding : null, isVerticalScrollbarVisible && isHorizontalScrollbarVisible ? _useScrollModule["default"].bidirectional : null],
style: style,
'data-spotlight-container': spotlightContainer,
'data-spotlight-container-disabled': spotlightContainerDisabled,
'data-spotlight-id': spotlightId,
onTouchStart: handleTouchStart,
ref: scrollContainerRef
});
var voiceProps = {
'data-webos-voice-disabled': voiceDisabled,
'data-webos-voice-focused': voiceFocused,
'data-webos-voice-group-label': voiceGroupLabel
};
assignProperties('scrollContentProps', _objectSpread(_objectSpread(_objectSpread({}, props.itemRenderer ? {
itemRefs: itemRefs,
noAffordance: noAffordance,
snapToCenter: snapToCenter
} : {
editable: editable,
fadeOut: fadeOut
}), voiceProps), {}, {
className: [props.direction === 'both' || props.direction === 'vertical' ? _OverscrollEffectModule["default"].vertical : _OverscrollEffectModule["default"].horizontal, _useScrollModule["default"].scrollContent],
onUpdate: handleScrollerUpdate,
scrollContainerRef: scrollContainerRef,
setThemeScrollContentHandle: setThemeScrollContentHandle,
spotlightId: spotlightId,
scrollContainerHandle: scrollContainerHandle,
scrollContentHandle: scrollContentHandle,
scrollContentRef: scrollContentRef
}));
var scrollThumbAriaLabelForByEnter = focusableScrollbar === 'byEnter' ? ' ' + (0, _$L["default"])('press ok button to read text') : '';
assignProperties('horizontalScrollbarProps', _objectSpread(_objectSpread({}, scrollbarProps), {}, {
'aria-label': horizontalScrollThumbAriaLabel == null ? (0, _$L["default"])('scroll left or right with left right button') + scrollThumbAriaLabelForByEnter : horizontalScrollThumbAriaLabel,
className: [_useScrollModule["default"].horizontalScrollbar],
focusableScrollbar: focusableScrollbar,
scrollbarHandle: horizontalScrollbarHandle
}));
assignProperties('verticalScrollbarProps', _objectSpread(_objectSpread({}, scrollbarProps), {}, {
'aria-label': verticalScrollThumbAriaLabel == null ? (0, _$L["default"])('scroll up or down with up down button') + scrollThumbAriaLabelForByEnter : verticalScrollThumbAriaLabel,
className: [_useScrollModule["default"].verticalScrollbar],
focusableScrollbar: focusableScrollbar,
scrollbarHandle: verticalScrollbarHandle
}));
assignProperties('hoverToScrollProps', {
scrollContainerHandle: scrollContainerHandle,
scrollObserver: scrollObserver
});
return _objectSpread(_objectSpread({}, collectionOfProperties), {}, {
scrollContentWrapper: scrollContentWrapper,
scrollContentHandle: scrollContentHandle,
isHorizontalScrollbarVisible: isHorizontalScrollbarVisible,
isVerticalScrollbarVisible: isVerticalScrollbarVisible
});
};
var _default = exports["default"] = useScroll;