@maestro_io/maestro-web-sdk 4.0.0-beta.2 → 4.0.0-beta.4

package/dist/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@maestro_io/maestro-web-sdk",
     "private": false,
-    "version": "3.3.1",
+    "version": "3.3.2",
     "type": "commonjs",
     "license": "MIT",
     "main": "dist/maestro-web-sdk.umd.js",
@@ -38,19 +38,19 @@
         "@babel/preset-env": "7.12.1",
         "@babel/preset-react": "7.12.1",
         "@babel/preset-typescript": "7.12.1",
-        "@types/enzyme-adapter-react-15": "^1.0.9",
+        "@types/enzyme-adapter-react-16": "^1.0.6",
         "@types/jest": "24.0.25",
         "@types/node": "10",
         "@types/prop-types": "^15.7.10",
-        "@types/react": "15",
-        "@types/react-dom": "15",
+        "@types/react": "16.14.34",
+        "@types/react-dom": "16.9.18",
         "@typescript-eslint/eslint-plugin": "2.34.0",
         "@typescript-eslint/parser": "2.34.0",
         "babel-jest": "26.6.3",
         "babel-loader": "8",
         "css-loader": "5",
         "enzyme": "3.11.0",
-        "enzyme-adapter-react-15": "1.0.6",
+        "enzyme-adapter-react-16": "1.15.7",
         "eslint": "6.8.0",
         "eslint-config-prettier": "6.0.0",
         "eslint-plugin-react": "7.20.0",
@@ -62,7 +62,7 @@
         "jest": "26.6.3",
         "nodemon": "^3.1.9",
         "prettier": "2.0.5",
-        "react-test-renderer": "15",
+        "react-test-renderer": "16.14.0",
         "style-loader": "2",
         "tsconfig-paths-webpack-plugin": "^4.2.0",
         "typescript": "^4",
@@ -75,9 +75,13 @@
         "@sentry/browser": "7.68.0",
         "axios": "^0.27.2",
         "flexibility": "^2.0.1",
-        "prop-types": "15",
-        "react": "^15.0.0",
-        "react-dom": "^15.0.0"
+        "prop-types": "15.8.1",
+        "react": "16.14.0",
+        "react-dom": "16.14.0"
+    },
+    "peerDependencies": {
+        "react": "^16.0.0",
+        "react-dom": "^16.0.0"
     },
     "resolutions": {
         "sockjs-client": "1.5.1",

package/dist/src/components/atoms/BaseButton/BaseButton.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { ButtonHTMLAttributes } from 'react';
 import './BaseButton.styles.css';
 declare class BaseButton extends React.Component<ButtonHTMLAttributes<HTMLButtonElement>> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default BaseButton;

package/dist/src/components/atoms/Image/index.d.ts

@@ -8,6 +8,6 @@ declare class Image extends React.Component<ImageProps> {
     };
     constructor(props: ImageProps);
     handleError: () => void;
-    render(): React.JSX.Element | null;
+    render(): JSX.Element | null;
 }
 export default Image;

package/dist/src/components/atoms/Rive/index.d.ts

@@ -2,13 +2,19 @@
 import React from 'react';
 import { WithFocusableProps } from '@/external/spatial-navigation';
 declare const _default: {
-    new (props?: (React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+    new (props: (React.CanvasHTMLAttributes<HTMLCanvasElement> & {
         id: string;
         autoFocus: boolean;
         autoPlay: boolean;
         src: string;
         onLoadRiveInstance: (riveInstance: any) => void;
-    } & WithFocusableProps) | undefined, context?: any): {
+    } & WithFocusableProps) | Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+        id: string;
+        autoFocus: boolean;
+        autoPlay: boolean;
+        src: string;
+        onLoadRiveInstance: (riveInstance: any) => void;
+    } & WithFocusableProps>): {
         state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState;
         navigation: import("../../../external/spatial-navigation/spatialNavigation").default;
         getChildContext(): {
@@ -34,29 +40,45 @@ declare const _default: {
             autoPlay: boolean;
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
-        } & WithFocusableProps>;
-        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+        } & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
             id: string;
             autoFocus: boolean;
             autoPlay: boolean;
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
-        } & WithFocusableProps) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K>) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K>, callback?: (() => any) | undefined): void;
-        forceUpdate(callBack?: (() => any) | undefined): void;
-        props: Readonly<{
-            children?: React.ReactNode;
-        }> & Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+        } & WithFocusableProps>) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
             id: string;
             autoFocus: boolean;
             autoPlay: boolean;
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
-        } & WithFocusableProps>;
-        context: any;
+        } & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
         refs: {
             [key: string]: React.ReactInstance;
         };
+        shouldComponentUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
         componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
         componentWillReceiveProps?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
             id: string;
             autoFocus: boolean;
@@ -64,6 +86,82 @@ declare const _default: {
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
         } & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+        id: string;
+        autoFocus: boolean;
+        autoPlay: boolean;
+        src: string;
+        onLoadRiveInstance: (riveInstance: any) => void;
+    } & WithFocusableProps, context: any): {
+        state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../external/spatial-navigation/utils").Direction, details?: Record<string, any>) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../external/spatial-navigation/utils").Direction, details: import("../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../external/spatial-navigation/utils").Layout, details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../external/spatial-navigation/utils").Layout, details: import("../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
         shouldComponentUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
             id: string;
             autoFocus: boolean;
@@ -71,6 +169,30 @@ declare const _default: {
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
         } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextContext: any): void;
         componentWillUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
             id: string;
             autoFocus: boolean;
@@ -78,6 +200,13 @@ declare const _default: {
             src: string;
             onLoadRiveInstance: (riveInstance: any) => void;
         } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<React.CanvasHTMLAttributes<HTMLCanvasElement> & {
+            id: string;
+            autoFocus: boolean;
+            autoPlay: boolean;
+            src: string;
+            onLoadRiveInstance: (riveInstance: any) => void;
+        } & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
     };
     contextTypes: {
         parentFocusKey: import("prop-types").Requireable<string>;
@@ -85,5 +214,6 @@ declare const _default: {
     childContextTypes: {
         parentFocusKey: import("prop-types").Requireable<string>;
     };
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;

package/dist/src/components/atoms/SvgIcon/BetGeneralIcon.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { IconProps } from './Icon';
-declare const BetGeneralIcon: (props: IconProps) => React.JSX.Element;
+declare const BetGeneralIcon: (props: IconProps) => JSX.Element;
 export default BetGeneralIcon;

package/dist/src/components/atoms/SvgIcon/BetsIcon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { IconProps } from './Icon';
 declare class BetsIcon extends React.Component<IconProps> {
     constructor(props: IconProps);
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default BetsIcon;

package/dist/src/components/atoms/SvgIcon/BetsWarningIcon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { IconProps } from './Icon';
 declare class BetsWarningIcon extends React.Component<IconProps> {
     constructor(props: IconProps);
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default BetsWarningIcon;

package/dist/src/components/atoms/SvgIcon/ChatIcon.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconProps } from './Icon';
+declare const ChatIcon: (props: IconProps) => React.JSX.Element;
+export default ChatIcon;

package/dist/src/components/atoms/SvgIcon/CheckmarkIcon.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { IconProps } from './Icon';
-declare const CheckmarkIcon: (props: IconProps) => React.JSX.Element;
+declare const CheckmarkIcon: (props: IconProps) => JSX.Element;
 export default CheckmarkIcon;

package/dist/src/components/atoms/SvgIcon/CollapseIcon.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { IconProps } from './Icon';
-declare const CollapseIcon: (props: IconProps) => React.JSX.Element;
+declare const CollapseIcon: (props: IconProps) => JSX.Element;
 export default CollapseIcon;

package/dist/src/components/atoms/SvgIcon/ExpandIcon.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { IconProps } from './Icon';
-declare const ExpandIcon: (props: IconProps) => React.JSX.Element;
+declare const ExpandIcon: (props: IconProps) => JSX.Element;
 export default ExpandIcon;

package/dist/src/components/atoms/SvgIcon/FantasyIcon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { IconProps } from './Icon';
 declare class FantasyIcon extends React.Component<IconProps> {
     constructor(props: IconProps);
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default FantasyIcon;

package/dist/src/components/atoms/SvgIcon/FlameIcon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { IconProps } from './Icon';
 declare class FlameIcon extends React.Component<IconProps> {
     constructor(props: IconProps);
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default FlameIcon;

package/dist/src/components/atoms/SvgIcon/HelloWorldIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const HelloWorldIcon: () => React.JSX.Element;
+export default HelloWorldIcon;

package/dist/src/components/atoms/SvgIcon/Icon.d.ts

@@ -15,10 +15,10 @@ declare const iconImports: {
     bets: typeof BetsIcon;
     stats: typeof StatsIcon;
     warning: typeof WarningIcon;
-    expand: (props: IconProps) => React.JSX.Element;
-    collapse: (props: IconProps) => React.JSX.Element;
-    times: (props: IconProps) => React.JSX.Element;
-    checkmark: (props: IconProps) => React.JSX.Element;
+    expand: (props: IconProps) => JSX.Element;
+    collapse: (props: IconProps) => JSX.Element;
+    times: (props: IconProps) => JSX.Element;
+    checkmark: (props: IconProps) => JSX.Element;
     flame: typeof FlameIcon;
     betsWarning: typeof BetsWarningIcon;
     mobilePhone: typeof MobilePhoneIcon;
@@ -35,6 +35,6 @@ interface IconState {
     loaded: boolean;
 }
 declare class Icon extends React.Component<IconProps, IconState> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default Icon;

package/dist/src/components/atoms/SvgIcon/KeyPlaysIcon.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconProps } from './Icon';
 declare class KeyPlaysIcon extends React.Component<IconProps, {}> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default KeyPlaysIcon;

package/dist/src/components/atoms/SvgIcon/MobilePhoneIcon.d.ts

@@ -2,6 +2,6 @@ import React from 'react';
 import { IconProps } from './Icon';
 declare class MobilePhoneIcon extends React.Component<IconProps> {
     constructor(props: IconProps);
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default MobilePhoneIcon;

package/dist/src/components/atoms/SvgIcon/PlayIcon.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconProps } from './Icon';
 declare class PlayIcon extends React.Component<IconProps, {}> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default PlayIcon;

package/dist/src/components/atoms/SvgIcon/ShopIcon.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { IconProps } from './Icon';
 export default class ShopIcon extends React.Component<IconProps> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }

package/dist/src/components/atoms/SvgIcon/ShopifyIcon.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconProps } from './Icon';
+declare const ShopifyIcon: (props: IconProps) => React.JSX.Element;
+export default ShopifyIcon;

package/dist/src/components/atoms/SvgIcon/StatsIcon.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconProps } from './Icon';
 declare class StatsIcon extends React.Component<IconProps, {}> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default StatsIcon;

package/dist/src/components/atoms/SvgIcon/TimesIcon.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { IconProps } from './Icon';
-declare const TimesIcon: (props: IconProps) => React.JSX.Element;
+declare const TimesIcon: (props: IconProps) => JSX.Element;
 export default TimesIcon;

package/dist/src/components/atoms/SvgIcon/WarningIcon.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconProps } from './Icon';
 declare class WarningIcon extends React.Component<IconProps, {}> {
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default WarningIcon;

package/dist/src/components/core/App/App.d.ts

@@ -6,6 +6,6 @@ declare class App extends React.Component<{
     get colors(): import("@/models/ITheme").IThemeColors;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default App;

package/dist/src/components/core/PanelManager/PanelManager.d.ts

@@ -16,6 +16,6 @@ declare class PanelManager extends React.Component<{}, PanelManagerState> {
     componentDidMount(): void;
     componentWillUnmount(): void;
     goToPanel(panel: MaestroPanelType): () => void;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export default PanelManager;

package/dist/src/components/core/ScrollableContainer/ScrollableContainer.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import './ScrollableContainer.styles.css';
 import { Layout } from '@/external/spatial-navigation/utils';
 export interface ScrollableContainerContextType {
@@ -55,9 +56,9 @@ declare class ScrollableContainer extends React.Component<ScrollableContainerPro
     };
     setRef: (ref: HTMLElement) => void;
     static childContextTypes: {
-        refsMap: React.Requireable<any>;
-        setRef: React.Requireable<any>;
-        scrollToFocusedElement: React.Requireable<any>;
+        refsMap: PropTypes.Requireable<(HTMLElement | null | undefined)[]>;
+        setRef: PropTypes.Requireable<(...args: any[]) => any>;
+        scrollToFocusedElement: PropTypes.Requireable<(...args: any[]) => any>;
     };
     getOrderedRefs: () => HTMLElement[];
     /**
@@ -66,12 +67,12 @@ declare class ScrollableContainer extends React.Component<ScrollableContainerPro
     private scrollToFocusedElement;
     getChildContext(): ScrollableContainerContextType;
     componentWillUnmount(): void;
-    render(): React.JSX.Element;
+    render(): JSX.Element;
 }
 export declare const DEFAULT_SCROLLABLE_CONTAINER_CONTEXT: ScrollableContainerContextType;
 export declare const SCROLLABLE_CONTEXT_TYPE: {
-    refsMap: React.Requireable<any>;
-    setRef: React.Requireable<any>;
-    scrollToFocusedElement: React.Requireable<any>;
+    refsMap: PropTypes.Requireable<(HTMLElement | null | undefined)[]>;
+    setRef: PropTypes.Requireable<(...args: any[]) => any>;
+    scrollToFocusedElement: PropTypes.Requireable<(...args: any[]) => any>;
 };
 export default ScrollableContainer;

package/dist/src/components/core/ScrollableContainer/ScrollableContainer.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import './ScrollableContainer.styles.css';
 const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 /**
@@ -150,9 +151,9 @@ Object.defineProperty(ScrollableContainer, "childContextTypes", {
     configurable: true,
     writable: true,
     value: {
-        refsMap: React.PropTypes.arrayOf(React.PropTypes.instanceOf(HTMLElement)),
-        setRef: React.PropTypes.func,
-        scrollToFocusedElement: React.PropTypes.func,
+        refsMap: PropTypes.arrayOf(PropTypes.instanceOf(HTMLElement)),
+        setRef: PropTypes.func,
+        scrollToFocusedElement: PropTypes.func,
     }
 });
 export const DEFAULT_SCROLLABLE_CONTAINER_CONTEXT = {
@@ -161,8 +162,8 @@ export const DEFAULT_SCROLLABLE_CONTAINER_CONTEXT = {
     refsMap: [],
 };
 export const SCROLLABLE_CONTEXT_TYPE = {
-    refsMap: React.PropTypes.arrayOf(React.PropTypes.instanceOf(HTMLElement)),
-    setRef: React.PropTypes.func,
-    scrollToFocusedElement: React.PropTypes.func,
+    refsMap: PropTypes.arrayOf(PropTypes.instanceOf(HTMLElement)),
+    setRef: PropTypes.func,
+    scrollToFocusedElement: PropTypes.func,
 };
 export default ScrollableContainer;

package/dist/src/components/molecules/ActionButton/ActionButton.d.ts

@@ -3,7 +3,7 @@ import './ActionButton.styles.css';
 import { WithFocusableProps } from '@/external/spatial-navigation';
 import React from 'react';
 declare const _default: {
-    new (props?: (object & WithFocusableProps) | undefined, context?: any): {
+    new (props: (object & WithFocusableProps) | Readonly<object & WithFocusableProps>): {
         state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState;
         navigation: import("../../../external/spatial-navigation/spatialNavigation").default;
         getChildContext(): {
@@ -23,20 +23,65 @@ declare const _default: {
         componentDidMount(): void;
         componentDidUpdate(): void;
         componentWillUnmount(): void;
-        render(): React.ReactElement<object & WithFocusableProps>;
-        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: object & WithFocusableProps) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K>) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K>, callback?: (() => any) | undefined): void;
-        forceUpdate(callBack?: (() => any) | undefined): void;
-        props: Readonly<{
-            children?: React.ReactNode;
-        }> & Readonly<object & WithFocusableProps>;
+        render(): React.ReactElement<object & WithFocusableProps, string | React.JSXElementConstructor<any>>;
         context: any;
+        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<object & WithFocusableProps>) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<object & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
         refs: {
             [key: string]: React.ReactInstance;
         };
+        shouldComponentUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<object & WithFocusableProps>, prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
         componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
         componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: object & WithFocusableProps, context: any): {
+        state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../external/spatial-navigation/utils").Direction, details?: Record<string, any>) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../external/spatial-navigation/utils").Direction, details: import("../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../external/spatial-navigation/utils").Layout, details: import("../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../external/spatial-navigation/utils").Layout, details: import("../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<object & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<object & WithFocusableProps>) => import("../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<object & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
         shouldComponentUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<object & WithFocusableProps>, prevState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<object & WithFocusableProps>, nextContext: any): void;
         componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<object & WithFocusableProps>, nextState: Readonly<import("../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
     };
     contextTypes: {
         parentFocusKey: import("prop-types").Requireable<string>;
@@ -44,5 +89,6 @@ declare const _default: {
     childContextTypes: {
         parentFocusKey: import("prop-types").Requireable<string>;
     };
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;