{"id":20461169,"url":"https://github.com/moroboxai/moroboxai-player-react","last_synced_at":"2026-04-20T14:33:12.229Z","repository":{"id":42079581,"uuid":"481156764","full_name":"moroboxai/moroboxai-player-react","owner":"moroboxai","description":"Embeddable player for running MoroboxAI games in React","archived":false,"fork":false,"pushed_at":"2023-11-02T07:32:44.000Z","size":3320,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-26T22:08:04.161Z","etag":null,"topics":["artificial-intelligence","library","moroboxai","react","reactjs","sandbox","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/moroboxai.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-04-13T09:41:08.000Z","updated_at":"2023-11-01T17:37:20.000Z","dependencies_parsed_at":"2024-09-24T01:01:11.692Z","dependency_job_id":null,"html_url":"https://github.com/moroboxai/moroboxai-player-react","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moroboxai%2Fmoroboxai-player-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moroboxai%2Fmoroboxai-player-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moroboxai%2Fmoroboxai-player-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/moroboxai%2Fmoroboxai-player-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/moroboxai","download_url":"https://codeload.github.com/moroboxai/moroboxai-player-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242017576,"owners_count":20058459,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["artificial-intelligence","library","moroboxai","react","reactjs","sandbox","typescript"],"created_at":"2024-11-15T12:23:52.987Z","updated_at":"2026-04-20T14:33:07.182Z","avatar_url":"https://github.com/moroboxai.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# moroboxai-player-react\n\n[![NPM version](https://img.shields.io/npm/v/moroboxai-player-react.svg)](https://www.npmjs.com/package/moroboxai-player-react)\n![Node.js CI](https://github.com/moroboxai/moroboxai-player-react/workflows/Node.js%20CI/badge.svg)\n[![gitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/moroboxai/moroboxai-player-react/blob/master/LICENSE)\n[![Code Quality: Javascript](https://img.shields.io/lgtm/grade/javascript/g/moroboxai/moroboxai-player-react.svg?logo=lgtm\u0026logoWidth=18)](https://lgtm.com/projects/g/moroboxai/moroboxai-player-react/context:javascript)\n[![Total Alerts](https://img.shields.io/lgtm/alerts/g/moroboxai/moroboxai-player-react.svg?logo=lgtm\u0026logoWidth=18)](https://lgtm.com/projects/g/moroboxai/moroboxai-player-react/alerts)\n\nEmbeddable player for running [MoroboxAI](https://github.com/moroboxai) games in [React](https://reactjs.org/).\n\n## Installation\n\nUsing npm:\n\n```bash\nnpm install moroboxai-player-react --save\n```\n\nOr:\n\n```bash\ngit clone https://github.com/moroboxai/moroboxai-player-react.git\ncd moroboxai-player-react\nnpm i\nnpm run build\n```\n\n## Usage\n\nSetup a simple React app with:\n\n```bash\nnpx create-react-app my-app --template typescript\n```\n\nAdd `moroboxai-player-react` as a dependency:\n\n```bash\ncd my-app\nnpm install moroboxai-player-react --save\n```\n\nReplace `src/App.tsx` with:\n\n```javascript\nimport \"./App.css\";\nimport Player from \"moroboxai-player-react\";\n\nfunction App() {\n    return (\n        \u003cdiv className=\"App\"\u003e\n            \u003cheader className=\"App-header\"\u003e\n                \u003cPlayer\n                    url=\"https://raw.githubusercontent.com/moroboxai/moroboxai-games/master/games/pong/\"\n                    splashart=\"https://raw.githubusercontent.com/moroboxai/moroboxai-games/master/games/pong/assets/splashart.png\"\n                    width={256}\n                    height={256}\n                /\u003e\n            \u003c/header\u003e\n        \u003c/div\u003e\n    );\n}\n\nexport default App;\n```\n\nBuild and start a local server to see the result:\n\n```bash\nnpm run build\nnpm run start\n```\n\n## Props\n\n| Name      | Type    | Default | Description                                                                                          |\n| :-------- | :------ | :------ | :--------------------------------------------------------------------------------------------------- |\n| url       | string  |         | URL of the game                                                                                      |\n| splashart | string  |         | URL of the placeholder image displayed before the game is loaded                                     |\n| width     | number  |         | Width of the `div` element                                                                           |\n| height    | number  |         | Height of the `div` element                                                                          |\n| resizable | boolean | true    | If the game can resize the player                                                                    |\n| className | string  |         | Class name for the `div` container                                                                   |\n| autoPlay  | boolean | false   | Auto play the game after the player is initialized                                                   |\n| speed     | number  | 1       | Speed of the game                                                                                    |\n| onReady   | func    | noop    | **Signature: function() =\u003e void** \u003cbr/\u003e Function called when the game is loaded and ready            |\n| onMount   | func    | noop    | **Signature: function(player: IPlayer) =\u003e void** \u003cbr/\u003e Function called when the component is mounted |\n\n## License\n\nThis content is released under the [MIT](http://opensource.org/licenses/MIT) License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoroboxai%2Fmoroboxai-player-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmoroboxai%2Fmoroboxai-player-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoroboxai%2Fmoroboxai-player-react/lists"}