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

package/dist/package.json

@@ -0,0 +1,87 @@
+{
+    "name": "@maestro_io/maestro-web-sdk",
+    "private": false,
+    "version": "3.3.1",
+    "type": "commonjs",
+    "license": "MIT",
+    "main": "dist/maestro-web-sdk.umd.js",
+    "module": "dist/maestro-web-sdk.esm.js",
+    "types": "dist/index.d.ts",
+    "files": [
+        "dist"
+    ],
+    "exports": {
+        ".": {
+            "import": "./dist/maestro-web-sdk.esm.js",
+            "require": "./dist/maestro-web-sdk.umd.js",
+            "types": "./dist/index.d.ts"
+        }
+    },
+    "sideEffects": [
+        "*.css"
+    ],
+    "engines": {
+        "node": ">=10"
+    },
+    "scripts": {
+        "dev": "nodemon",
+        "sdk-only": "webpack-dev-server --config webpack/webpack.dev.js",
+        "lint": "eslint src --ext .ts,.tsx --ignore-pattern '**/*.test.*'",
+        "test": "jest",
+        "build": "tsc --emitDeclarationOnly --outDir dist/types & webpack --config webpack/webpack.prod.js",
+        "types": "tsc -b"
+    },
+    "devDependencies": {
+        "@babel/core": "7.12.3",
+        "@babel/plugin-proposal-class-properties": "7.12.1",
+        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
+        "@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/jest": "24.0.25",
+        "@types/node": "10",
+        "@types/prop-types": "^15.7.10",
+        "@types/react": "15",
+        "@types/react-dom": "15",
+        "@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",
+        "eslint": "6.8.0",
+        "eslint-config-prettier": "6.0.0",
+        "eslint-plugin-react": "7.20.0",
+        "file-loader": "^6.2.0",
+        "globals": "^10",
+        "html-webpack-plugin": "4",
+        "husky": "^6.0.0",
+        "identity-obj-proxy": "^3.0.0",
+        "jest": "26.6.3",
+        "nodemon": "^3.1.9",
+        "prettier": "2.0.5",
+        "react-test-renderer": "15",
+        "style-loader": "2",
+        "tsconfig-paths-webpack-plugin": "^4.2.0",
+        "typescript": "^4",
+        "webpack": "4",
+        "webpack-cli": "3.3.12",
+        "webpack-dev-server": "3.11.2"
+    },
+    "dependencies": {
+        "@rive-app/canvas": "^2.27.3",
+        "@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"
+    },
+    "resolutions": {
+        "sockjs-client": "1.5.1",
+        "cheerio": "0.22.0",
+        "@sentry/replay": "0.6.14"
+    }
+}

package/dist/src/__mocks__/sentry.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="jest" />
+export declare const captureException: jest.Mock<any, any>;
+declare const initSentry: jest.Mock<any, any>;
+export default initSentry;

package/dist/src/components/atoms/BaseButton/BaseButton.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import './BaseButton.styles.css';
+import FocusableItem from '@/components/core/ScrollableContainer/FocusableItem';
+class BaseButton extends React.Component {
+    render() {
+        const className = ['base-button', this.props.className].join(' ');
+        return (React.createElement(FocusableItem, null,
+            React.createElement("button", { ...this.props, className: className }, this.props.children)));
+    }
+}
+export default BaseButton;

package/dist/src/components/atoms/BaseButton/index.js

@@ -0,0 +1,2 @@
+import BaseButton from './BaseButton';
+export default BaseButton;

package/dist/src/components/atoms/Image/index.js

@@ -0,0 +1,34 @@
+import React from 'react';
+class Image extends React.Component {
+    constructor(props) {
+        super(props);
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {
+                failed: false,
+            }
+        });
+        Object.defineProperty(this, "handleError", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                this.setState({ failed: true });
+            }
+        });
+    }
+    render() {
+        if (this.state.failed) {
+            console.warn('Image failed to load:', this.props.src);
+            return null;
+        }
+        if (!this.props.src) {
+            console.warn('Image source is empty');
+            return null;
+        }
+        return (React.createElement("img", { alt: this.props.alt || 'Image', ...this.props, onError: this.handleError }));
+    }
+}
+export default Image;

package/dist/src/components/atoms/Rive/index.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { withFocusable, } from '@/external/spatial-navigation';
+import SDK from '@/index';
+class Rive extends React.Component {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "riveInstance", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+    }
+    componentDidMount() {
+        const canvas = document.getElementById(this.props.id);
+        if (!canvas) {
+            console.error('Canvas element not found with id:', this.props.id);
+            throw new Error('canvas not found');
+        }
+        try {
+            // Temporarily commented out due to issues with RiveCanvas import
+            // this.riveInstance = new RiveCanvas({
+            //   src: this.props.src,
+            //   canvas,
+            //   autoplay: this.props.autoPlay,
+            //   stateMachines: 'stateMachine',
+            //   onLoad: () => {
+            //     this.props.onLoadRiveInstance(this.riveInstance);
+            //   },
+            //   onLoadError: (error: any) => {
+            //     console.error('RiveCanvas load error:', error);
+            //   },
+            // });
+        }
+        catch (error) {
+            console.error('Error creating RiveCanvas:', error);
+        }
+        setTimeout(() => {
+            if (this.props.focusKey && this.props.autoFocus) {
+                SDK.getMaestroEventViewModel().navigation.setFocus(this.props.focusKey);
+            }
+        }, 0);
+    }
+    componentWillUnmount() {
+        if (this.riveInstance) {
+            this.riveInstance.cleanup();
+        }
+    }
+    render() {
+        return (React.createElement("canvas", { style: this.props.style, id: this.props.id, "data-focused": this.props.focused }));
+    }
+}
+export default withFocusable()(Rive);

package/dist/src/components/atoms/SvgIcon/BetGeneralIcon.js

@@ -0,0 +1,9 @@
+import React from 'react';
+const BetGeneralIcon = (props) => {
+    return (React.createElement("svg", { width: props.width, height: props.height, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("rect", { x: "1", y: "1", width: "46", height: "46", rx: "23", fill: "#101113" }),
+        React.createElement("rect", { x: "1", y: "1", width: "46", height: "46", rx: "23", stroke: "#A1A2A3", strokeWidth: "2" }),
+        React.createElement("path", { d: "M23.9994 25.2964L22.9624 26.3334L23.9624 27.3334L22.6661 28.6298L21.6661 27.6298L20.6476 28.6482L19.3512 27.3519L20.3697 26.3334L19.3697 25.3334L20.6661 24.037L21.6661 25.037L22.7031 24.0001L21.7031 23.0001L22.9994 21.7037L23.9994 22.7037L25.0364 21.6667L24.0364 20.6667L25.3328 19.3704L26.3328 20.3704L27.3512 19.3519L28.6476 20.6482L27.6291 21.6667L28.6291 22.6667L27.3328 23.9631L26.3328 22.9631L25.2958 24.0001L26.2958 25.0001L24.9994 26.2964L23.9994 25.2964Z", fill: "#A1A2A3" }),
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M36.425 12.9435C36.389 12.7762 36.1471 11.8521 36.1471 11.8521C36.1471 11.8521 35.2231 11.6104 35.0558 11.5744C34.7212 11.5025 34.2407 11.4098 33.6432 11.3229C32.4502 11.1494 30.781 10.9976 28.8705 11.0844C25.0579 11.2578 20.1968 12.3884 16.2923 16.2931C12.3877 20.1978 11.2571 25.0588 11.0838 28.8714C10.9969 30.7818 11.1488 32.4509 11.3223 33.644C11.4092 34.2414 11.5019 34.7218 11.5738 35.0564C11.6097 35.2238 11.8528 36.1466 11.8528 36.1466C11.8528 36.1466 12.7755 36.3896 12.9429 36.4256C13.2774 36.4975 13.7579 36.5902 14.3553 36.6771C15.5484 36.8507 17.2175 37.0026 19.1279 36.9158C22.9405 36.7426 27.8016 35.6121 31.7065 31.7073C35.6113 27.8025 36.7419 22.9414 36.9151 19.1287C37.0019 17.2182 36.85 15.5491 36.6765 14.356C36.5896 13.7586 36.4969 13.2781 36.425 12.9435ZM17.7065 17.7073C21.1351 14.2786 25.4406 13.2424 28.9614 13.0824C30.7175 13.0025 32.2568 13.1423 33.3554 13.3021C33.8244 13.3703 34.2113 13.4419 34.4984 13.501C34.5575 13.7881 34.6291 14.175 34.6973 14.644C34.8571 15.7426 34.997 17.2818 34.9172 19.0379C34.7572 22.5587 33.7211 26.8643 30.2923 30.2931C26.8634 33.7219 22.5578 34.7579 19.0372 34.9179C17.281 34.9977 15.7419 34.8578 14.6433 34.698C14.1743 34.6297 13.7874 34.5581 13.5003 34.4991C13.4413 34.212 13.3697 33.8251 13.3015 33.3561C13.1417 32.2575 13.0019 30.7183 13.0817 28.9622C13.2418 25.4415 14.2779 21.136 17.7065 17.7073Z", fill: "#A1A2A3" })));
+};
+export default BetGeneralIcon;

package/dist/src/components/atoms/SvgIcon/BetsIcon.js

@@ -0,0 +1,11 @@
+import React from 'react';
+class BetsIcon extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { d: "M26.4393 4.5H6.61944L3.34766 31.5C3.34766 31.5 19.7066 31.5 22.7432 31.5C23.3056 31.5 23.8679 31.4591 24.4251 31.3773C26.0406 31.1268 28.7193 30.3445 29.8491 27.6808C30.3501 26.4947 30.7387 23.1919 30.8665 22.3023C31.1783 20.1345 30.0178 18.8819 28.8625 18.1508C28.6069 17.9923 28.6733 17.6038 28.9647 17.5322C30.1814 17.2203 31.3266 16.571 31.6435 15.1906C31.8633 14.2192 32.0781 12.0872 32.2263 10.9011C32.9113 5.92643 29.568 4.5 26.4393 4.5ZM24.1542 19.792H15.8213L15.6117 21.5047H23.9497L23.4589 25.4773H10.1468L11.2715 16.3154H24.5836L24.1593 19.7869L24.1542 19.792ZM24.7779 14.7202H11.4658L11.9821 10.5227H25.2942L24.783 14.7202H24.7779Z", fill: "#9DA0A6" })));
+    }
+}
+export default BetsIcon;

package/dist/src/components/atoms/SvgIcon/BetsWarningIcon.js

@@ -0,0 +1,11 @@
+import React from 'react';
+class BetsWarningIcon extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3 16C3 8.8203 8.8203 3 16 3C23.1797 3 29 8.8203 29 16C29 23.1797 23.1797 29 16 29C8.8203 29 3 23.1797 3 16ZM14.6001 12.0668H17.4001V9.26676H14.6001V12.0668ZM17.3333 22.6667V14H14.6667V22.6667H17.3333Z", fill: "#FFB759" })));
+    }
+}
+export default BetsWarningIcon;

package/dist/src/components/atoms/SvgIcon/CheckmarkIcon.js

@@ -0,0 +1,6 @@
+import React from 'react';
+const CheckmarkIcon = (props) => {
+    return (React.createElement("svg", { width: props.width, height: props.height, viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M22.0678 6.50019L9.79999 18.768L3.53223 12.5002L5.29999 10.7324L9.79999 15.2324L20.3 4.73242L22.0678 6.50019Z", fill: "#41BA42" })));
+};
+export default CheckmarkIcon;

package/dist/src/components/atoms/SvgIcon/CollapseIcon.js

@@ -0,0 +1,6 @@
+import React from 'react';
+const CollapseIcon = (props) => {
+    return (React.createElement("svg", { width: props.width, height: props.height, viewBox: "0 0 49 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 39L20 28.5L9.5 28.5L9.5 25.5L23 25.5L23 39L20 39ZM39.5 22.5L26 22.5L26 9.00392L29 9.00392L29 19.5L39.5 19.5L39.5 22.5Z", fill: "white" })));
+};
+export default CollapseIcon;

package/dist/src/components/atoms/SvgIcon/ExpandIcon.js

@@ -0,0 +1,6 @@
+import React from 'react';
+const ExpandIcon = (props) => {
+    return (React.createElement("svg", { width: props.width, height: props.height, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.5 34.5L24 34.5L24 37.5L10.5 37.5L10.5 24L13.5 24L13.5 34.5ZM34.5 24L34.5 13.5006L24.0006 13.5045L23.9994 10.5045L37.5 10.4994L37.5 24L34.5 24Z", fill: "white" })));
+};
+export default ExpandIcon;

package/dist/src/components/atoms/SvgIcon/FantasyIcon.js

@@ -0,0 +1,15 @@
+import React from 'react';
+class FantasyIcon extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("g", { clipPath: "url(#clip0_25549_230289)" },
+                React.createElement("path", { d: "M34.2005 2.7002L34.1664 2.99609C33.8501 5.6774 33.5057 8.38303 33.1722 10.999C33.0175 12.2089 32.8635 13.4189 32.7123 14.6357C32.6229 15.3335 32.5467 16.045 32.471 16.7324C32.3026 18.3 32.1272 19.9231 31.8041 21.4941C31.058 25.1414 28.8167 27.7058 25.1419 29.1152C22.495 30.1293 18.1571 31.8342 14.9808 33.082L14.8705 33.127L10.9896 31.1396C10.615 30.9506 10.2435 30.7691 9.87925 30.5869C6.18719 28.7615 2.99695 27.1863 1.96909 22.3633C1.65979 20.923 1.8387 19.4995 2.01401 18.1211L2.06479 17.7197C2.55294 13.7905 3.05907 9.81937 3.54722 5.97949L3.96616 2.7002H34.2005ZM10.9349 14.2236L9.75229 23.8623H23.2728L23.7845 19.6895H15.4349L15.6888 17.6025H24.0423L24.4554 14.2236H10.9349ZM11.6566 8.3623L11.1546 12.4355H24.6751L25.1771 8.3623H11.6566Z", fill: "white" })),
+            React.createElement("defs", null,
+                React.createElement("clipPath", { id: "clip0_25549_230289" },
+                    React.createElement("rect", { width: this.props.width, height: this.props.height, fill: "white" })))));
+    }
+}
+export default FantasyIcon;

package/dist/src/components/atoms/SvgIcon/FlameIcon.js

@@ -0,0 +1,11 @@
+import React from 'react';
+class FlameIcon extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.54183 0.327148L9.39895 0.669996C11.7818 1.62315 13.1252 3.98581 13.1252 7.08363V7.65808L14.6806 6.1026L15.1035 6.73694C15.9332 7.98141 17.2918 10.2078 17.2918 12.5003C17.2918 16.6478 14.0406 19.3753 10.0002 19.3753C5.95971 19.3753 2.7085 16.6478 2.7085 12.5003C2.7085 9.7532 4.31768 8.02946 5.74552 6.49998L5.79325 6.44885C7.27047 4.86611 8.54183 3.47254 8.54183 1.25029V0.327148ZM10.5323 10.5213L10.6145 10.7677C11.0056 11.941 11.4873 12.5422 11.892 13.0473L11.9337 13.0993C12.1409 13.3583 12.338 13.61 12.4799 13.9081C12.6244 14.2115 12.7085 14.5549 12.7085 15.0003C12.7085 16.496 11.4959 17.7086 10.0002 17.7086C8.50439 17.7086 7.29183 16.496 7.29183 15.0003C7.29183 13.5264 8.18282 11.9311 10.3096 10.655L10.5323 10.5213Z", fill: "#F58B00" })));
+    }
+}
+export default FlameIcon;

package/dist/src/components/atoms/SvgIcon/Icon.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import KeyPlaysIcon from './KeyPlaysIcon';
+import PlayIcon from './PlayIcon';
+import BetsIcon from './BetsIcon';
+import StatsIcon from './StatsIcon';
+import WarningIcon from './WarningIcon';
+import ExpandIcon from './ExpandIcon';
+import CollapseIcon from './CollapseIcon';
+import TimesIcon from './TimesIcon';
+import CheckmarkIcon from './CheckmarkIcon';
+import FlameIcon from './FlameIcon';
+import BetsWarningIcon from './BetsWarningIcon';
+import MobilePhoneIcon from './MobilePhoneIcon';
+import FantasyIcon from './FantasyIcon';
+import ShopIcon from './ShopIcon';
+const iconImports = {
+    keyPlays: KeyPlaysIcon,
+    play: PlayIcon,
+    bets: BetsIcon,
+    stats: StatsIcon,
+    warning: WarningIcon,
+    expand: ExpandIcon,
+    collapse: CollapseIcon,
+    times: TimesIcon,
+    checkmark: CheckmarkIcon,
+    flame: FlameIcon,
+    betsWarning: BetsWarningIcon,
+    mobilePhone: MobilePhoneIcon,
+    fantasy: FantasyIcon,
+    shop: ShopIcon,
+};
+// Skeleton component for loading state
+const Skeleton = (props) => (React.createElement("div", { style: { width: props.width, height: props.height } }));
+class Icon extends React.Component {
+    render() {
+        const { iconName, width, height } = this.props;
+        const IconComponent = iconImports[iconName];
+        if (!IconComponent) {
+            return React.createElement(Skeleton, { width: width, height: height });
+        }
+        return React.createElement(IconComponent, { iconName: iconName, width: width, height: height });
+    }
+}
+export default Icon;

package/dist/src/components/atoms/SvgIcon/KeyPlaysIcon.js

@@ -0,0 +1,10 @@
+import React from 'react';
+class KeyPlaysIcon extends React.Component {
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 30 32", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { d: "M27.375 4.75H2.625V7H27.375V4.75Z", fill: "white" }),
+            React.createElement("path", { d: "M25.125 0.25H4.875V2.5H25.125V0.25Z", fill: "white" }),
+            React.createElement("path", { d: "M0.375 9.25V31.75H29.625V9.25H0.375ZM11.625 26.125V14.875L20.625 20.5L11.625 26.125Z", fill: "white" })));
+    }
+}
+export default KeyPlaysIcon;

package/dist/src/components/atoms/SvgIcon/MobilePhoneIcon.js

@@ -0,0 +1,11 @@
+import React from 'react';
+class MobilePhoneIcon extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.33333 1.66663C8.04467 1.66663 7 2.7113 7 3.99996V28C7 29.2886 8.04467 30.3333 9.33333 30.3333H22.6667C23.9553 30.3333 25 29.2886 25 28V3.99996C25 2.7113 23.9553 1.66663 22.6667 1.66663H9.33333ZM9 7.66663V23H23V7.66663H9ZM18 26H14V27.3333H18V26Z", fill: "#6C6E6F" })));
+    }
+}
+export default MobilePhoneIcon;

package/dist/src/components/atoms/SvgIcon/PlayIcon.js

@@ -0,0 +1,8 @@
+import React from 'react';
+class PlayIcon extends React.Component {
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M18.1891 8.29879C18.6116 8.5331 18.9367 8.80345 19.162 9.10985C19.3873 9.41624 19.5 9.71863 19.5 10.019C19.5 10.3194 19.396 10.6158 19.1837 10.9102C18.9713 11.2026 18.6463 11.4669 18.2108 11.7012L10.9111 15.6724L3.58975 19.6035C3.15207 19.8378 2.74256 19.9679 2.36122 19.994C1.98204 20.02 1.65703 19.9619 1.38836 19.8177C1.12185 19.6735 0.905177 19.4453 0.742673 19.1328C0.582335 18.8204 0.5 18.4419 0.5 17.9994V2.00062C0.5 1.55805 0.573669 1.17956 0.721006 0.867153C0.87051 0.554748 1.09152 0.326452 1.38836 0.182265C1.6852 0.0380777 2.02104 -0.0199976 2.39372 0.00603615C2.76639 0.0340725 3.16507 0.164241 3.58975 0.398545L10.9111 4.36769L18.1891 8.29879Z", fill: "white" })));
+    }
+}
+export default PlayIcon;

package/dist/src/components/atoms/SvgIcon/ShopIcon.js

@@ -0,0 +1,7 @@
+import React from 'react';
+export default class ShopIcon extends React.Component {
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.3745 7.5V9.375H6.45201L4.99216 29.813C4.88362 31.3325 6.08709 32.625 7.61049 32.625H28.3886C29.912 32.625 31.1154 31.3325 31.0069 29.813L29.547 9.375H23.6245V7.5C23.6245 4.3934 21.1061 1.875 17.9995 1.875C14.8929 1.875 12.3745 4.3934 12.3745 7.5ZM17.9995 4.125C16.1356 4.125 14.6245 5.63604 14.6245 7.5V9.375H21.3745V7.5C21.3745 5.63604 19.8635 4.125 17.9995 4.125ZM12.3745 14.25V11.625H14.6245V14.25C14.6245 14.8713 14.1208 15.375 13.4995 15.375C12.8782 15.375 12.3745 14.8713 12.3745 14.25ZM21.3745 14.25V11.625H23.6245V14.25C23.6245 14.8713 23.1208 15.375 22.4995 15.375C21.8782 15.375 21.3745 14.8713 21.3745 14.25Z", fill: "white" })));
+    }
+}

package/dist/src/components/atoms/SvgIcon/StatsIcon.js

@@ -0,0 +1,12 @@
+import React from 'react';
+class StatsIcon extends React.Component {
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("g", { clipPath: "url(#clip0_538_5831)" },
+                React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.5925 1.7998V32.6941H10.4849V14.8588H3.671V32.6941H0.899902V34.7641H35.099V32.6941H32.3603V8.0125H25.514V32.6941H21.4397V1.7998H14.5925Z", fill: "#9DA0A6" })),
+            React.createElement("defs", null,
+                React.createElement("clipPath", { id: "clip0_538_5831" },
+                    React.createElement("rect", { width: "36", height: "36", fill: "white" })))));
+    }
+}
+export default StatsIcon;

package/dist/src/components/atoms/SvgIcon/TimesIcon.js

@@ -0,0 +1,6 @@
+import React from 'react';
+const TimesIcon = (props) => {
+    return (React.createElement("svg", { width: props.width, height: props.height, viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.29999 3.73242L12.8 10.2324L19.3 3.73242L21.0678 5.50019L14.5678 12.0002L21.0678 18.5002L19.3 20.268L12.8 13.768L6.29999 20.268L4.53223 18.5002L11.0322 12.0002L4.53223 5.50019L6.29999 3.73242Z", fill: "#FF7F7F" })));
+};
+export default TimesIcon;

package/dist/src/components/atoms/SvgIcon/WarningIcon.js

@@ -0,0 +1,8 @@
+import React from 'react';
+class WarningIcon extends React.Component {
+    render() {
+        return (React.createElement("svg", { width: this.props.width, height: this.props.height, viewBox: "0 0 22 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.0022 0.75L21.8012 19.4545H0.203125L11.0022 0.75ZM11.7522 13.5V7.5H10.2522V13.5H11.7522ZM11.8022 14.95H10.2022V16.55H11.8022V14.95Z", fill: "#F58B00" })));
+    }
+}
+export default WarningIcon;

package/dist/src/components/atoms/SvgIcon/index.js

@@ -0,0 +1,2 @@
+import Icon from './Icon';
+export default Icon;

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

@@ -0,0 +1,35 @@
+import React from 'react';
+import { DARK_THEME } from '@/services/ThemeManager/constants';
+import './App.styles.css';
+import SDK from '@/index';
+const FONT_FAMILY_MAP = {
+    body: 'BentonSans',
+    headline: 'BentonSansBold',
+    title: 'BentonSansMedium',
+};
+class App extends React.Component {
+    get colors() {
+        const config = SDK.getPageConfig();
+        return config?.theme?.colors || DARK_THEME.colors;
+    }
+    componentDidMount() {
+        Object.keys(this.colors).forEach((key) => {
+            document.documentElement.style.setProperty(`--sdk-${key}`, this.colors[key]);
+        });
+        Object.keys(FONT_FAMILY_MAP).forEach((key) => {
+            document.documentElement.style.setProperty(`--sdk-font-${key}`, FONT_FAMILY_MAP[key]);
+        });
+    }
+    componentWillUnmount() {
+        Object.keys(this.colors).forEach((key) => {
+            document.documentElement.style.removeProperty(`--sdk-${key}`);
+        });
+        Object.keys(FONT_FAMILY_MAP).forEach((key) => {
+            document.documentElement.style.removeProperty(`--sdk-font-${key}`);
+        });
+    }
+    render() {
+        return React.createElement("div", { className: "sdk-wrapper" }, this.props.children);
+    }
+}
+export default App;

package/dist/src/components/core/App/index.js

@@ -0,0 +1,2 @@
+import App from './App';
+export default App;

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

@@ -0,0 +1,58 @@
+import React from 'react';
+const OverlayContainer = React.createClass({
+    propTypes: {
+        viewModels: React.PropTypes.object,
+    },
+    getInitialState() {
+        return {
+            isVisible: false,
+            currentOverlay: null,
+        };
+    },
+    componentDidMount() {
+        if (!this.props.viewModels?.overlayViewModel)
+            return;
+        const overlayVM = this.props.viewModels.overlayViewModel;
+        // Subscribe to overlay visibility changes
+        this.unsubscribeVisible = overlayVM.isVisible.subscribe((visible) => {
+            this.setState({ isVisible: visible });
+        });
+        // Subscribe to current overlay changes
+        this.unsubscribeOverlay = overlayVM.currentOverlay.subscribe((overlay) => {
+            this.setState({ currentOverlay: overlay });
+        });
+    },
+    componentWillUnmount() {
+        if (this.unsubscribeVisible)
+            this.unsubscribeVisible();
+        if (this.unsubscribeOverlay)
+            this.unsubscribeOverlay();
+    },
+    render() {
+        if (!this.state.isVisible || !this.state.currentOverlay) {
+            return null;
+        }
+        const overlay = this.state.currentOverlay;
+        const Overlay = require('../molecules/Overlay').default;
+        return React.createElement(Overlay, {
+            key: `overlay-${overlay.type}-${Date.now()}`,
+            id: 'sdk-managed-rive-overlay',
+            overlayType: overlay.type,
+            position: overlay.position,
+            winningBet: overlay.winningBet,
+            fantasy: overlay.fantasy,
+            onOverlayViewed: (overlayType) => {
+                if (this.props.viewModels?.overlayViewModel) {
+                    this.props.viewModels.overlayViewModel.handleOverlayViewed(overlayType);
+                }
+            },
+            onOverlayAction: (overlayType) => {
+                if (this.props.viewModels?.overlayViewModel) {
+                    this.props.viewModels.overlayViewModel.handleOverlayAction(overlayType);
+                    this.props.viewModels.overlayViewModel.hideOverlay();
+                }
+            },
+        });
+    },
+});
+export default OverlayContainer;

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

@@ -0,0 +1,86 @@
+import React from 'react';
+import './PanelManager.styles.css';
+import PanelNavigation from '@/components/organisms/PanelNavigation';
+import KeyPlaysView from '@/modules/key-plays/view/KeyPlaysView';
+import BetsView from '@/modules/bets/view/BetsView';
+import StatsView from '@/modules/stats/view';
+import SDK from '@/index';
+import FantasyView from '@/modules/fantasy/view';
+import ShopView from '@/modules/shop/view';
+const PANELS_MAP = {
+    keyPlays: React.createElement(KeyPlaysView, null),
+    bets: React.createElement(BetsView, null),
+    stats: React.createElement(StatsView, null),
+    fantasy: React.createElement(FantasyView, null),
+    shop: React.createElement(ShopView, null),
+};
+class PanelManager extends React.Component {
+    constructor(props) {
+        super(props);
+        Object.defineProperty(this, "unsubscribe", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "panelsUnsubscribe", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        Object.defineProperty(this, "viewModel", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.viewModel = SDK.getMaestroEventViewModel().panelManagerViewModel;
+        this.state = {
+            activePanel: this.viewModel.currentPanel,
+            visiblePanels: this.viewModel.panelsObservable.value,
+        };
+    }
+    componentDidMount() {
+        // Subscribe to changes in the current panel
+        this.unsubscribe = this.viewModel.currentPanelObservable.subscribe(() => {
+            this.setState({ activePanel: this.viewModel.currentPanel });
+        });
+        // Subscribe to changes in the visible panels
+        this.panelsUnsubscribe = this.viewModel.panelsObservable.subscribe((panels) => {
+            this.setState({ visiblePanels: panels });
+        });
+    }
+    componentWillUnmount() {
+        if (this.unsubscribe) {
+            this.unsubscribe();
+            this.unsubscribe = null;
+        }
+        if (this.panelsUnsubscribe) {
+            this.panelsUnsubscribe();
+            this.panelsUnsubscribe = null;
+        }
+    }
+    goToPanel(panel) {
+        return () => {
+            if (this.viewModel.currentPanel === panel) {
+                return;
+            }
+            this.viewModel.currentPanel = panel;
+        };
+    }
+    render() {
+        const { activePanel, visiblePanels } = this.state;
+        // Create panel items only for visible panels
+        const PANEL_ITEMS = visiblePanels.map((panel) => ({
+            iconName: panel.type,
+            onEnter: this.goToPanel(panel.type),
+            title: panel.title,
+            active: activePanel === panel.type,
+        }));
+        return (React.createElement("div", { className: "sdk--panel-manager" },
+            React.createElement(PanelNavigation, { items: PANEL_ITEMS }),
+            activePanel && (React.createElement("div", { className: "sdk--panel-wrapper" }, PANELS_MAP[activePanel]))));
+    }
+}
+export default PanelManager;

package/dist/src/components/core/PanelManager/index.js

@@ -0,0 +1,2 @@
+import PanelManager from './PanelManager';
+export default PanelManager;