@24i/bigscreen-sdk 1.0.0 → 1.0.1-alpha.2074

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@24i/bigscreen-sdk",
-    "version": "1.0.0",
+    "version": "1.0.1-alpha.2074",
     "description": "SmartApps BIGscreen SDK monorepo",
     "main": "index.js",
     "scripts": {
@@ -38,8 +38,8 @@
     "homepage": "https://github.com/24i/smartapps-bigscreen-sdk#readme",
     "dependencies": {
         "@24i/player-base": "6.10.0",
-        "@24i/smartapps-datalayer": "2.3.0-beta.1",
-        "@sentry/browser": "^7.6.0",
+        "@24i/smartapps-datalayer": "2.3.2",
+        "@sentry/browser": "^7.8.0",
         "@types/prop-types": "^15.7.5",
         "@types/scheduler": "^0.16.1",
         "csstype": "^3.1.0",
@@ -50,13 +50,13 @@
         "@24i/bigscreen-sdk": "file:.",
         "@24i/eslint-config-smartapps-bigscreen-linters": "file:./libs/linters",
         "@24i/smartapps-bigscreen-changelog-generator": "0.17.0",
-        "@babel/core": "^7.18.6",
-        "@babel/preset-env": "^7.18.6",
+        "@babel/core": "^7.18.9",
+        "@babel/preset-env": "^7.18.9",
         "@types/fs-extra": "^9.0.13",
         "@types/inquirer": "^8.2.1",
-        "@types/jest": "^28.1.5",
+        "@types/jest": "^28.1.6",
         "@types/minimist": "^1.2.2",
-        "@types/node": "^17.0.43",
+        "@types/node": "^18.6.3",
         "@types/react": "^18.0.15",
         "babel-jest": "^28.1.2",
         "chalk": "^4.1.2",
@@ -65,15 +65,15 @@
         "fs-extra": "^10.1.0",
         "full-icu": "^1.4.0",
         "identity-obj-proxy": "^3.0.0",
-        "inquirer": "^9.0.0",
+        "inquirer": "^9.0.2",
         "jest": "^28.1.2",
         "jest-canvas-mock": "^2.4.0",
         "jest-environment-jsdom": "^28.1.2",
         "minimist": "^1.2.6",
         "patch-package": "^6.2.1",
-        "sass": "^1.53.0",
+        "sass": "^1.54.0",
         "sass-true": "^6.1.0",
-        "ts-jest": "^28.0.4",
+        "ts-jest": "^28.0.7",
         "ts-node": "^10.8.2",
         "tsconfig-paths-jest": "0.0.1",
         "typescript": "^4.7.2"
@@ -111,6 +111,7 @@
         "./driver-kreatv": "./packages/driver-kreatv/src/index.ts",
         "./driver-saphi": "./packages/driver-saphi/src/index.ts",
         "./driver-tizen": "./packages/driver-tizen/src/index.ts",
+        "./driver-vidaa": "./packages/driver-vidaa/src/index.ts",
         "./driver-webos/scripts/template": "./packages/driver-webos/scripts/template.ts",
         "./driver-webos/scripts/exportWebOSTVjs": "./packages/driver-webos/scripts/exportWebOSTVjs.ts",
         "./driver-webos": "./packages/driver-webos/src/index.ts",
@@ -270,4 +271,4 @@
         "./zapping/interface": "./packages/zapping/src/interface.ts",
         "./zapping": "./packages/zapping/src/index.ts"
     }
-}
+}

package/packages/developer-tools/src/EnvironmentSelection/styles/EnvironmentSelection.scss

@@ -111,7 +111,7 @@
         }
 
         .leading-ellipses-list-item {
-            height: fit-content;
+            height: auto;
         }
     }
 }

package/packages/device/src/driver/index.vidaa.tv.ts

@@ -0,0 +1 @@
+export { DeviceVidaa as Device } from '@24i/bigscreen-sdk/driver-vidaa';

package/packages/device/src/resolver/resolver.ts

@@ -5,6 +5,7 @@ import { DeviceHbbTV } from '@24i/bigscreen-sdk/driver-hbbtv';
 import { DeviceKreaTV } from '@24i/bigscreen-sdk/driver-kreatv';
 import { DeviceSaphi } from '@24i/bigscreen-sdk/driver-saphi';
 import { DeviceTizen } from '@24i/bigscreen-sdk/driver-tizen';
+import { DeviceVidaa } from '@24i/bigscreen-sdk/driver-vidaa';
 import { DeviceWebos } from '@24i/bigscreen-sdk/driver-webos';
 import { DeviceXbox } from '@24i/bigscreen-sdk/driver-xbox';
 
@@ -30,6 +31,10 @@ const getDevice = () => {
         info('Saphi');
         return new DeviceSaphi();
     }
+    if (userAgent.match(/Hisense/)) {
+        info('VIDAA');
+        return new DeviceVidaa();
+    }
     if (userAgent.match(/Ekioh/)) {
         info('KreaTV');
         return new DeviceKreaTV();

package/packages/driver-vidaa/src/DeviceVidaa.ts

@@ -0,0 +1,134 @@
+import {
+    DeviceBase,
+    ConnectionType,
+    ScreenSaverStatus,
+    VolumeRange,
+} from '@24i/bigscreen-sdk/driver-base';
+import { getPlatformInfo } from './formatUserAgent';
+import { HisenseVidaaApi } from './types';
+import { getKeyMap } from './keymap';
+
+declare global {
+    interface Window extends HisenseVidaaApi {}
+}
+
+export class DeviceVidaa extends DeviceBase {
+    keyMap = getKeyMap();
+
+    platformInfo = getPlatformInfo(navigator.userAgent);
+
+    async initDevice(): Promise<void> {
+        this.initNetworkChangeListener();
+    }
+
+    initNetworkChangeListener() {
+        window.addEventListener('online', () => {
+            this.triggerEvent('networkchange', { isConnected: true });
+        });
+        window.addEventListener('offline', () => {
+            this.triggerEvent('networkchange', { isConnected: false });
+        });
+    }
+
+    reboot(): void {
+        let rootPath = '';
+        const splitUrl = window.location.href.split('#');
+        if (splitUrl.length > 1) rootPath = splitUrl[0];
+        window.location.href = rootPath;
+    }
+
+    exit(): void {
+        window.close();
+    }
+
+    async getManufacturerName(): Promise<string> {
+        return 'Hisense';
+    }
+
+    async getPlatformName(): Promise<string> {
+        return 'VIDAA';
+    }
+
+    async getPlatformVersion(): Promise<string> {
+        // platform version of Hisense VIDAA is defined on TV 2020 or later
+        return this.platformInfo.platformVersion || '';
+    }
+
+    async getDeviceName(): Promise<string> {
+        return `Hisense VIDAA ${await this.getModelName()}`.trim();
+    }
+
+    async getModelName(): Promise<string> {
+        return window.Hisense_GetModelName() || '';
+    }
+
+    async getFirmware(): Promise<string> {
+        return window.Hisense_GetFirmWareVersion() || '';
+    }
+
+    async is4KSupported(): Promise<boolean> {
+        return window.Hisense_Get4KSupportState() || false;
+    }
+
+    async is8KSupported(): Promise<boolean> {
+        return false;
+    }
+
+    async getUuid(): Promise<string> {
+        return window.Hisense_GetDeviceID() || '';
+    }
+
+    async getVolume(): Promise<number> {
+        return VolumeRange.UNSUPPORTED;
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setVolume(volumePercentage: number): Promise<void> {
+        // not supported on Hisense VIDAA platform
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async mute(mute: boolean): Promise<void> {
+        // not supported on Hisense VIDAA platform
+    }
+
+    async isMute(): Promise<boolean> {
+        // not supported on Hisense VIDAA platform
+        return false;
+    }
+
+    async getScreenSaver(): Promise<ScreenSaverStatus> {
+        // not supported on Hisense VIDAA platform
+        return { enabled: false };
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setScreenSaver(status: ScreenSaverStatus): Promise<void> {
+        // not supported on Hisense VIDAA platform
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    async setUserAgent(userAgent: string): Promise<boolean> {
+        // not supported on Hisense VIDAA platform
+        return false;
+    }
+
+    async isNetworkConnected(): Promise<boolean> {
+        return window.navigator.onLine;
+    }
+
+    async getConnectionType(): Promise<ConnectionType> {
+        // not supported on Hisense VIDAA platform
+        return 'unknown';
+    }
+
+    async getLocalIP(): Promise<string> {
+        // not supported on Hisense VIDAA platform
+        return '';
+    }
+
+    async getMacAddress(): Promise<string> {
+        // not supported on Hisense VIDAA platform
+        return '';
+    }
+}

package/packages/driver-vidaa/src/__mocks__/vidaa.ts

@@ -0,0 +1,20 @@
+import { HisenseVidaaApi, HisenseVidaaKeys } from '../types';
+
+export const mockHisenseVidaaApi: HisenseVidaaApi = {
+    Hisense_GetBrand: () => 'hisense',
+    Hisense_GetModelName: () => '5U61FQEVS',
+    Hisense_GetFirmWareVersion: () => 'V0000.01.00Q.L0301',
+    Hisense_Get4KSupportState: () => true,
+    Hisense_GetDeviceID: () => '861003009000001000000641123456789012',
+};
+
+// Key constants are set to random number values
+export const mockHisenseVidaaKeys = {
+    VK_LEFT: 0,
+    VK_RIGHT: 1,
+    VK_UP: 2,
+    VK_DOWN: 3,
+    VK_ENTER: 4,
+    VK_BACK_SPACE: 5,
+    // the rest of key constants is not needed for testing
+} as HisenseVidaaKeys;

package/packages/driver-vidaa/src/formatUserAgent.ts

@@ -0,0 +1,16 @@
+/**
+ * Parses platform info of VIDAA from user agent string.
+ * NOTE: Platform info of VIDAA is available in user agent of TVs 2020 or later.
+ *
+ * @param userAgent User agent string
+ * @returns object with platform info like platform name and platform version.
+ * If values are not not available, values of keys are set to undefined.
+ * Ex. for VIDAA platform string like "VIDAA/4.0" in user agent string , it returns
+ * object { platformName: "VIDAA", platformVersion: "4.0" }
+ */
+export const getPlatformInfo = (userAgent: string) => {
+    const [
+        , platformName, platformVersion,
+    ] = userAgent.match(/(VIDAA)\/([\d.]+)/) || [] as Array<undefined>;
+    return { platformName, platformVersion };
+};

package/packages/driver-vidaa/src/index.ts

@@ -0,0 +1 @@
+export { DeviceVidaa } from './DeviceVidaa';

package/packages/driver-vidaa/src/keymap.ts

@@ -0,0 +1,54 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMap } from '@24i/bigscreen-sdk/driver-base';
+import { HisenseVidaaKeys } from './types';
+
+declare const window: Window & HisenseVidaaKeys;
+
+export const getKeyMap = () => {
+    KeyMap.overrideValues({
+        LEFT: { keyCode: window.VK_LEFT },
+        RIGHT: { keyCode: window.VK_RIGHT },
+        UP: { keyCode: window.VK_UP },
+        DOWN: { keyCode: window.VK_DOWN },
+        ENTER: { keyCode: window.VK_ENTER },
+        BACK: { keyCode: window.VK_BACK_SPACE },
+
+        RED: { keyCode: window.VK_RED },
+        GREEN: { keyCode: window.VK_GREEN },
+        YELLOW: { keyCode: window.VK_YELLOW },
+        BLUE: { keyCode: window.VK_BLUE },
+
+        PLAY: { keyCode: window.VK_PLAY },
+        PAUSE: { keyCode: window.VK_PAUSE },
+        PLAYPAUSE: { keyCode: window.VK_PLAY_PAUSE },
+        STOP: { keyCode: window.VK_STOP },
+        FF: { keyCode: window.VK_FAST_FWD },
+        REW: { keyCode: window.VK_REWIND },
+
+        NUM_0: { keyCode: window.VK_0 },
+        NUM_1: { keyCode: window.VK_1 },
+        NUM_2: { keyCode: window.VK_2 },
+        NUM_3: { keyCode: window.VK_3 },
+        NUM_4: { keyCode: window.VK_4 },
+        NUM_5: { keyCode: window.VK_5 },
+        NUM_6: { keyCode: window.VK_6 },
+        NUM_7: { keyCode: window.VK_7 },
+        NUM_8: { keyCode: window.VK_8 },
+        NUM_9: { keyCode: window.VK_9 },
+        KP_0: { keyCode: window.VK_NUMPAD0 },
+        KP_1: { keyCode: window.VK_NUMPAD1 },
+        KP_2: { keyCode: window.VK_NUMPAD2 },
+        KP_3: { keyCode: window.VK_NUMPAD3 },
+        KP_4: { keyCode: window.VK_NUMPAD4 },
+        KP_5: { keyCode: window.VK_NUMPAD5 },
+        KP_6: { keyCode: window.VK_NUMPAD6 },
+        KP_7: { keyCode: window.VK_NUMPAD7 },
+        KP_8: { keyCode: window.VK_NUMPAD8 },
+        KP_9: { keyCode: window.VK_NUMPAD9 },
+
+        CHANNEL_UP: { keyCode: window.VK_CHANNEL_UP || 427 },
+        CHANNEL_DOWN: { keyCode: window.VK_CHANNEL_DOWN || 428 },
+        INFO: { keyCode: window.VK_INFO },
+    });
+    return KeyMap.generateKeyCodeKeyMap();
+};

package/packages/driver-vidaa/src/types.ts

@@ -0,0 +1,82 @@
+export interface HisenseVidaaApi {
+    /**
+     * This interface will retrieve Hisense Unique ID for the device.
+     * @return a 32bytes string that represents the device id.
+     * Example: 861003009000001000000641123456789012
+     */
+    Hisense_GetDeviceID: () => string,
+    /**
+     * This interface will retrieve the firmware version for the device.
+     * @return a string that represents the firmware version.
+     * Example: V00.01.00a.F0116
+     */
+    Hisense_GetFirmWareVersion: () => string,
+    /**
+     * This will retrieve the 4K support status for the device.
+     * @return true if 4K is supported otherwise returns false.
+     */
+    Hisense_Get4KSupportState: () => boolean,
+    /**
+     * This will retrieve the TV brand for the device.
+     * @return a brand full name string that represents the TV brand.
+     * Example: hisense, sharp
+     */
+    Hisense_GetBrand: () => string,
+    /**
+     * This will retrieve the TV model name (hardware version) for the device.
+     * @return a string that represents the TV model name.
+     */
+    Hisense_GetModelName: () => string,
+}
+
+export type HisenseVidaaKeys = {
+    readonly VK_UP: number,
+    readonly VK_RIGHT: number,
+    readonly VK_DOWN: number,
+    readonly VK_LEFT: number,
+    readonly VK_ENTER: number,
+    readonly VK_BACK_SPACE: number,
+
+    readonly VK_BLUE: number,
+    readonly VK_RED: number,
+    readonly VK_GREEN: number,
+    readonly VK_YELLOW: number,
+
+    readonly VK_MENU: number,
+
+    readonly VK_0: number,
+    readonly VK_1: number,
+    readonly VK_2: number,
+    readonly VK_3: number,
+    readonly VK_4: number,
+    readonly VK_5: number,
+    readonly VK_6: number,
+    readonly VK_7: number,
+    readonly VK_8: number,
+    readonly VK_9: number,
+    // keys VK_NUMPAD{X} are not introduced in Hisense VIDAA spec but exist in global scope
+    readonly VK_NUMPAD0: number,
+    readonly VK_NUMPAD1: number,
+    readonly VK_NUMPAD2: number,
+    readonly VK_NUMPAD3: number,
+    readonly VK_NUMPAD4: number,
+    readonly VK_NUMPAD5: number,
+    readonly VK_NUMPAD6: number,
+    readonly VK_NUMPAD7: number,
+    readonly VK_NUMPAD8: number,
+    readonly VK_NUMPAD9: number,
+
+    readonly VK_PLAY: number,
+    readonly VK_PAUSE: number,
+    readonly VK_PLAY_PAUSE: number,
+    readonly VK_STOP: number,
+    readonly VK_TRACK_NEXT: number,
+    readonly VK_TRACK_PREV: number,
+    readonly VK_FAST_FWD: number,
+    readonly VK_REWIND: number,
+    readonly VK_SUBTITLE: number,
+    readonly VK_INFO: number,
+    // VK_CHANNEL_{UP/DOWN} not introduced in Hisense VIDAA spec but exists in global scope
+    readonly VK_CHANNEL_UP: number,
+    readonly VK_CHANNEL_DOWN: number,
+};

package/packages/grid/src/Base/Base.tsx

@@ -1,13 +1,14 @@
 import { createRef, Component, Reference, DeclareProps } from '@24i/bigscreen-sdk/jsx';
 import { device } from '@24i/bigscreen-sdk/device';
-import { MouseNavigation } from '@24i/bigscreen-sdk/mouse-navigation';
 import { Scroller } from '@24i/bigscreen-sdk/scroller';
 import { stopEvent } from '@24i/bigscreen-sdk/utils/stopEvent';
 import { noop } from '@24i/bigscreen-sdk/utils/noop';
 import { forEach } from '@24i/bigscreen-sdk/perf-utils/array';
 import { createTimeout, createCounter, ICounter } from '@24i/bigscreen-sdk/utils';
+import { MouseNavigation } from './MouseNavigation';
 import { FastFocusingOptimizer } from '../FastFocusingOptimizer/FastFocusingOptimizer';
 import { SharedProps, Item } from '../types';
+import { MouseNavigation as IMouseNavigation } from './interface';
 
 export type Props<T extends Item<U>, U> = Omit<SharedProps<T, U>, 'scrollStep'> & {
     forward: () => boolean,
@@ -21,7 +22,6 @@ export type Props<T extends Item<U>, U> = Omit<SharedProps<T, U>, 'scrollStep'>
     adjustFocusFromTarget?: (itemRefIndex: number, groupRefIndex: number) => void,
     horizontal?: boolean,
     limit?: number,
-    mrcuRef?: Reference<MouseNavigation>;
     shouldApplySlowdown?: () => boolean,
 };
 
@@ -55,6 +55,8 @@ export class GridBase<T extends Item<U>, U>
 
     scrollerDom = createRef<HTMLDivElement>();
 
+    mrcuRef = createRef<IMouseNavigation>();
+
     itemRefs: Reference<T>[] = [];
 
     groupRefs: Reference<HTMLDivElement>[] = [];
@@ -151,14 +153,13 @@ export class GridBase<T extends Item<U>, U>
     onWheel = (event: WheelEvent) => {
         const {
             forwardGroup, backwardGroup, shouldApplySlowdown,
-            mrcuRef,
         } = this.props;
         let processed;
         if (event.deltaY > 0) processed = shouldApplySlowdown() || forwardGroup();
         else if (event.deltaY < 0) processed = shouldApplySlowdown() || backwardGroup();
         if (processed) {
             stopEvent(event);
-            mrcuRef?.current?.handleArrowState();
+            this.mrcuRef.current?.handleArrowState();
             if (this.fastScrollingCounter) {
                 this.fastScrollingCounter.add();
                 this.fakeWheelStop();
@@ -434,7 +435,15 @@ export class GridBase<T extends Item<U>, U>
     }
 
     render() {
-        const { horizontal, className } = this.props;
+        const {
+            horizontal,
+            className,
+            forwardGroup,
+            backwardGroup,
+            shouldShowMrcuForward,
+            shouldShowMrcuBackward,
+        } = this.props;
+
         return (
             <Scroller
                 className={className}
@@ -443,7 +452,17 @@ export class GridBase<T extends Item<U>, U>
                 onKeyDown={this.onKeyDown}
                 horizontal={horizontal}
             >
-                {this.renderData()}
+                <>{this.renderData()}</>
+                <MouseNavigation
+                    // @ts-ignore - needed to convert fallback (false) to interface
+                    ref={this.mrcuRef}
+                    getMountingPoint={() => this.scroller.current!.wrapRef}
+                    horizontal={horizontal}
+                    forward={forwardGroup}
+                    backward={backwardGroup}
+                    shouldShowMrcuForward={shouldShowMrcuForward}
+                    shouldShowMrcuBackward={shouldShowMrcuBackward}
+                />
             </Scroller>
         );
     }

package/packages/grid/src/Base/MouseNavigation/MouseNavigation.tsx

@@ -0,0 +1,58 @@
+import { Component, createRef } from '@24i/bigscreen-sdk/jsx';
+import { MouseNavigation as MouseNavigationBase } from '@24i/bigscreen-sdk/mouse-navigation';
+import { device } from '@24i/bigscreen-sdk/device';
+import {
+    MouseNavigationProps as Props,
+    MouseNavigation as IMouseNavigation,
+} from '../interface';
+
+export class MouseNavigation extends Component<Props> implements IMouseNavigation {
+    private readonly div = createRef<HTMLDivElement>();
+
+    private readonly base = createRef<MouseNavigationBase>();
+
+    componentDidMount() {
+        if (device.isMouseUsed()) {
+            this.renderArrows();
+        }
+    }
+
+    handleArrowState() {
+        this.base?.current?.handleArrowState();
+    }
+
+    renderArrows() {
+        const {
+            horizontal,
+            forward,
+            backward,
+            shouldShowMrcuForward,
+            shouldShowMrcuBackward,
+            getMountingPoint,
+        } = this.props;
+
+        const direction = horizontal ? 'horizontal' : 'vertical';
+
+        this.appendMount(
+            <div ref={this.div} className="mouse-navigation">
+                <MouseNavigationBase
+                    // @ts-ignore - needed to convert fallback (false) to interface
+                    ref={this.base}
+                    getMountingPoint={() => this.div}
+                    direction={direction}
+                    forward={forward}
+                    backward={backward}
+                    shouldShowMrcuForward={shouldShowMrcuForward}
+                    shouldShowMrcuBackward={shouldShowMrcuBackward}
+                >
+                    {null as unknown as JSX.Element}
+                </MouseNavigationBase>
+            </div>,
+            getMountingPoint(),
+        );
+    }
+
+    render() {
+        return null;
+    }
+}

package/packages/grid/src/Base/MouseNavigation/MouseNavigationFallback.ts

@@ -0,0 +1,4 @@
+import { MouseNavigationProps as Props } from '../interface';
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export const MouseNavigation = (props: Props) => false as unknown as JSX.Element;

package/packages/grid/src/Base/MouseNavigation/index.tizen.tv.ts

@@ -0,0 +1 @@
+export { MouseNavigation } from './MouseNavigation';

package/packages/grid/src/Base/MouseNavigation/index.ts

@@ -0,0 +1 @@
+export { MouseNavigation } from './MouseNavigationFallback';

package/packages/grid/src/Base/MouseNavigation/index.webos.tv.ts

@@ -0,0 +1 @@
+export { MouseNavigation } from './MouseNavigation';

package/packages/grid/src/Base/MouseNavigation/index.webtv.ts

@@ -0,0 +1 @@
+export { MouseNavigation } from './MouseNavigation';

package/packages/grid/src/Base/interface.ts

@@ -0,0 +1,47 @@
+import { Reference, Component } from '@24i/bigscreen-sdk/jsx';
+
+export type MouseNavigationProps = {
+    /**
+      * Function to call on the press of the right arrow.
+      */
+    forward(): boolean,
+    /**
+     * Function to call on the press of the left arrow.
+     */
+    backward(): boolean,
+    /**
+      * Function to call on the press of the down arrow.
+      */
+    forwardGroup?(): boolean,
+    /**
+      * Function to call on the press of the up arrow.
+      */
+    backwardGroup?(): boolean,
+    /**
+      * Function which determines whether to show the forward arrow.
+      */
+    shouldShowMrcuForward?(): boolean,
+    /**
+      * Function which determines whether to show the backward arrow.
+      */
+    shouldShowMrcuBackward?(): boolean,
+    /**
+     * Returns a reference to the element where your `children` should be rendered.
+     */
+    getMountingPoint(): Reference<HTMLElement>;
+    /**
+     * Property determines whether navigation is horizontal.
+     */
+    horizontal?: boolean,
+};
+
+export interface MouseNavigation extends Component<MouseNavigationProps> {
+    /**
+      * Function to disable showing an arrow in the given direction.
+      */
+    handleArrowState(): void,
+}
+
+export interface MouseNavigationComponent {
+    new (props: MouseNavigationProps): MouseNavigation,
+}

package/packages/grid/src/UnifiedGridController/UnifiedGridController.ts

@@ -295,6 +295,8 @@ export class UnifiedGridController<T> implements IUnifiedGridController<T> {
     }
 
     focusToIndex(dataIndex: number, animate = false) {
+        const { grid } = this;
+        const base = grid.base.current!;
         const targetScrollIndex = this.itemIndexToScrollIndex(dataIndex);
         if (targetScrollIndex > this.scrollIndex) {
             this.adjustGroupsOffsetsForward(targetScrollIndex);
@@ -304,8 +306,9 @@ export class UnifiedGridController<T> implements IUnifiedGridController<T> {
         if (targetScrollIndex !== this.scrollIndex) {
             this.scroll(targetScrollIndex, animate);
         }
-        this.grid.base.current!.index = dataIndex;
+        base.index = dataIndex;
         this.focusCurrentItem();
+        base.mrcuRef.current?.handleArrowState();
     }
 
     protected focusScrollWrap() {