@enact/spotlight

@enact/spotlight

An extensible library for 5-way navigation and focus control.

An extensible utility that enables users to navigate applications using a keyboard or television remote control. Responding to input from the UP, DOWN, LEFT, RIGHT, and RETURN keys, Spotlight provides a navigation experience that compares favorably to that of a computer-with-mouse.

Usage

import kind from '@enact/core/kind';
import {SpotlightRootDecorator, Spottable} from '@enact/spotlight';

const MySpottableComponent = Spottable('div');

const MyApp = kind({
    name: 'MyApp',
    render: () => (<MySpottableComponent>Hello, Enact!</MySpottableComponent>)
});
const MySpotlightApp = SpotlightRootDecorator(MyApp);

See the docs for more information.

Additional Information

When using @enact/moonstone, the SpotlightRootDecorator is applied automatically by MoonstoneDecorator.

Acknowledgments

Spotlight is based on a fork of JavaScript SpatialNavigation (c) 2016 Luke Chang, under the terms of the Mozilla Public License.

Copyright and License Information

Unless otherwise specified, all content, including all source code files and documentation files in this repository are:

Copyright (c) 2012-2018 LG Electronics

Unless otherwise specified or set forth in the NOTICE file, all content, including all source code files and documentation files in this repository are: Licensed under the Apache License, Version 2.0 (the "License"); you may not use this content except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Changelog

[2.1.0] - 2018-08-20

Added

• moonstone/VideoPlayer property noMediaSliderFeedback
• moonstone/VideoPlayer.MediaControls property playPauseButtonDisabled

Changed

• i18n to use the latest version of the ilib
• moonstone/Picker key down hold threshold to 800ms before firing the onChange event

Fixed

• moonstone/GridListImageItem to properly vertically align when the content varies in size
• moonstone/Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList to not scroll by dragging
• moonstone/Slider to not emit onChange event when value has not changed
• moonstone/VideoPlayer to focus on available media buttons if the default spotlight component is disabled
• moonstone/VideoPlayer to keep media controls visible when interacting with popups
• moonstone/VideoPlayer to read out infoComponents accessibility value when moreButtonColor is pressed
• moonstone/VideoPlayer to round the time displayed down to the nearest second
• moonstone/VirtualList to restore last focused item correctly
• ui/VirtualList sampler to use ui/Item instead of moonstone/Item
• ui/FloatingLayer to apply keys to prevent React warnings