react-native-web-tv 0.21.2-tv.3 → 0.21.2-tv.4

package/README.md

@@ -2,10 +2,33 @@
 
 [![npm version][package-badge]][package-url] [![Build Status][ci-badge]][ci-url] [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://reactjs.org/docs/how-to-contribute.html#your-first-pull-request)
 
-"React Native Web for TV" makes it possible to run [React Native][react-native-url] components and APIs on the web based TVs using React Native Web.
+"React Native Web for TV" makes it possible to run [React Native][react-native-url] components and APIs on the web based TVs using React Native Web with spatial navigation enabled by default.
 
 It is derived from [React Native Web](https://github.com/necolas/react-native-web), and this fork remains intentionally close to that project while extending it for browser-based TV platforms. Thanks to the RNW project for the foundation this fork builds on 🙏.
 
+---
+
+## 🚀 Out-of-the-box Spatial Navigation for Web-based TV
+
+
+**Built-in LRUD spatial navigation and remote focus for web-based TV platforms (e.g., Samsung Tizen TV, LG webOS TV, and other browser-based TV environments).**
+
+> **ℹ️ Note:** This package provides built-in spatial navigation logic (LRUD) and remote focus, but your app must ensure that platform-specific remote keys (such as arrow, OK, Back, Menu) are registered and delivered to the browser. On some TV platforms, this requires a one-time setup in your app or hosting environment. Once keys are registered, no extra libraries are needed for spatial navigation.
+
+The spatial navigation layer is integrated and enabled by default once remote key events reach the browser.
+
+### Configurability
+
+Spatial navigation and remote key handling can be customized for your app or platform. See the [Spatial navigation configuration](#spatial-navigation-configuration) section below for details and examples.
+
+For advanced use cases, you can:
+- Remap remote keys for different TV platforms
+- Adjust focus and scroll behavior
+
+See the [TV Navigation documentation](https://hps1978.github.io/react-native-web-tv/docs/tv-navigation/) for more platform-specific tips, best practices, and migration notes.
+
+---
+
 ## Documentation
 
 The documentation site is hosted at [https://hps1978.github.io/react-native-web-tv/](https://hps1978.github.io/react-native-web-tv/). Documentation source lives in `packages/react-native-web-docs` and can also be built locally from the monorepo.
@@ -42,7 +65,7 @@ This fork keeps the broader React Native Web example surface and adds TV-specifi
 
 Some inherited examples are still general RNW demos and are not yet adapted for LRUD or remote-focus behavior. The TV-focused routes, along with the examples already updated for focus handling, can be exercised directly in a browser for testing and debugging.
 
-Useful TV-oriented routes include:
+Useful TV-oriented examples include:
 
 * `/tv-event-handler`
 * `/tv-focus-guide-view`
@@ -54,7 +77,7 @@ Useful TV-oriented routes include:
 This fork adds Web TV spatial navigation and TV-specific APIs.
 
 Highlights:
-* TV spatial navigation via a forked `@bbc/tv-lrud-spatial` implementation from [hps1978/lrud-spatial-rnw](https://github.com/hps1978/lrud-spatial-rnw). It's wired into React Native Web through SpatialManager.
+* TV spatial navigation via a forked `@hps1978/tv-lrud-spatial` implementation from [hps1978/lrud-spatial-rnw](https://github.com/hps1978/lrud-spatial-rnw). It's wired into React Native Web through SpatialManager.
 * New TV exports: `TVEventHandler`, `TVEventControl`, `TVFocusGuideView`, `TVTextScrollView`, `useTVEventHandler`, and `TVRemoteEvent`.
 * TV focus props include `tvFocusable`, `isTVSelectable`, `hasTVPreferredFocus`, `autoFocus`, `trapFocusUp/Down/Left/Right`, `destinations`, and directional focus routing (`nextFocusUp/Down/Left/Right/Forward`).
 * RecyclerListView adapter for `VirtualizedList`/`FlatList` (via `recyclerlistview`) to improve large-list performance on TV. NOTE: Disabled at the moment to fix some issues.
@@ -131,7 +154,7 @@ To help you get you familiar with the contribution process, there is a list of [
 
 React Native Web for TV is [MIT licensed](./LICENSE). By contributing to React Native Web for TV, you agree that your contributions will be licensed under its MIT license.
 
-This fork also depends on Apache-2.0 licensed TV navigation code via `@bbc/tv-lrud-spatial`.
+This fork also depends on Apache-2.0 licensed TV navigation code via `@hps1978/tv-lrud-spatial`.
 See [THIRD_PARTY_NOTICES.md](./THIRD_PARTY_NOTICES.md) and [APACHE-2.0.txt](./APACHE-2.0.txt) for redistribution details.
 
 [package-badge]: https://img.shields.io/npm/v/react-native-web-tv.svg?style=flat

package/THIRD_PARTY_NOTICES.md

@@ -4,7 +4,7 @@ This package is primarily distributed under the MIT license.
 
 It also depends on third-party TV spatial navigation code under the Apache License 2.0:
 
-- `@bbc/tv-lrud-spatial`
+- `@hps1978/tv-lrud-spatial`
   - Source used by this fork is resolved from `github:hps1978/lrud-spatial-rnw`
   - Package version in the current dependency tree: `0.0.16`
   - Original upstream project: `https://github.com/bbc/lrud-spatial`

package/dist/cjs/modules/SpatialManager/index.js

@@ -6,7 +6,7 @@ exports.teardownSpatialNavigation = exports.takeKeyHandlerControl = exports.setu
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _classPrivateFieldLooseBase2 = _interopRequireDefault(require("@babel/runtime/helpers/classPrivateFieldLooseBase"));
 var _classPrivateFieldLooseKey2 = _interopRequireDefault(require("@babel/runtime/helpers/classPrivateFieldLooseKey"));
-var _tvLrudSpatial = require("@bbc/tv-lrud-spatial");
+var _tvLrudSpatial = require("@hps1978/tv-lrud-spatial");
 var _addEventListener = require("../addEventListener");
 var _utils = require("../../exports/TV/utils");
 var _mutationObserver = require("./mutationObserver");
@@ -25,7 +25,7 @@ var _SpatialManager;
 var _instance = /*#__PURE__*/(0, _classPrivateFieldLooseKey2.default)("_instance");
 /**
  * SpatialManager
- * Manages spatial navigation for TV platforms using the @bbc/tv-lrud-spatial library.
+ * Manages spatial navigation for TV platforms using the @hps1978/tv-lrud-spatial library.
  * Implements singleton pattern to ensure only one instance exists across the app.
  */
 class SpatialManager {

package/dist/modules/SpatialManager/index.js

@@ -12,7 +12,7 @@ var _SpatialManager;
  * @format
  */
 
-import { setConfig as setLrudConfig, getNextFocus, getParentContainer, updateAncestorsAutoFocus, findDestinationOrAutofocus, getNextFocusInViewport } from '@bbc/tv-lrud-spatial';
+import { setConfig as setLrudConfig, getNextFocus, getParentContainer, updateAncestorsAutoFocus, findDestinationOrAutofocus, getNextFocusInViewport } from '@hps1978/tv-lrud-spatial';
 import { addEventListener } from '../addEventListener';
 import { setupNodeId } from '../../exports/TV/utils';
 import { startObserving, stopObserving } from './mutationObserver';
@@ -20,7 +20,7 @@ import { scrollContainer, scrollToElement, setupAppInitiatedScrollHandler, isEle
 var _instance = /*#__PURE__*/_classPrivateFieldLooseKey("_instance");
 /**
  * SpatialManager
- * Manages spatial navigation for TV platforms using the @bbc/tv-lrud-spatial library.
+ * Manages spatial navigation for TV platforms using the @hps1978/tv-lrud-spatial library.
  * Implements singleton pattern to ensure only one instance exists across the app.
  */
 class SpatialManager {

package/dist/modules/SpatialManager/index.js.flow

@@ -8,7 +8,7 @@
  * @format
  */
 
-import { setConfig as setLrudConfig, getNextFocus, getParentContainer, updateAncestorsAutoFocus, findDestinationOrAutofocus, getNextFocusInViewport } from '@bbc/tv-lrud-spatial';
+import { setConfig as setLrudConfig, getNextFocus, getParentContainer, updateAncestorsAutoFocus, findDestinationOrAutofocus, getNextFocusInViewport } from '@hps1978/tv-lrud-spatial';
 import { addEventListener } from '../addEventListener';
 import { setupNodeId } from '../../exports/TV/utils';
 import type { ElemData } from './utils';
@@ -27,7 +27,7 @@ type SpatialNavigationConfigType = {
 
 /**
  * SpatialManager
- * Manages spatial navigation for TV platforms using the @bbc/tv-lrud-spatial library.
+ * Manages spatial navigation for TV platforms using the @hps1978/tv-lrud-spatial library.
  * Implements singleton pattern to ensure only one instance exists across the app.
  */
 declare class SpatialManager {

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "name": "react-native-web-tv",
-  "version": "0.21.2-tv.3",
+  "version": "0.21.2-tv.4",
   "description": "React Native Web for TV",
   "module": "dist/index.js",
   "main": "dist/cjs/index.js",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.6",
-    "@bbc/tv-lrud-spatial": "github:hps1978/lrud-spatial-rnw",
+    "@hps1978/tv-lrud-spatial": "^0.0.17",
     "@react-native/normalize-colors": "^0.74.1",
     "fbjs": "^3.0.4",
     "inline-style-prefixer": "^7.0.1",

package/src/modules/SpatialManager/index.js

@@ -15,7 +15,7 @@ import {
   updateAncestorsAutoFocus,
   findDestinationOrAutofocus,
   getNextFocusInViewport
-} from '@bbc/tv-lrud-spatial';
+} from '@hps1978/tv-lrud-spatial';
 import { addEventListener } from '../addEventListener';
 import { setupNodeId } from '../../exports/TV/utils';
 import type { ElemData } from './utils';
@@ -47,7 +47,7 @@ type SpatialNavigationConfigType = {
 
 /**
  * SpatialManager
- * Manages spatial navigation for TV platforms using the @bbc/tv-lrud-spatial library.
+ * Manages spatial navigation for TV platforms using the @hps1978/tv-lrud-spatial library.
  * Implements singleton pattern to ensure only one instance exists across the app.
  */
 class SpatialManager {