{"_id":"@agora-rte/rte-controller-react-native","_rev":"1-210bd4d69f26f37f4ae8a1052dd09c6d","name":"@agora-rte/rte-controller-react-native","dist-tags":{"latest":"0.4.0-alpha.4"},"versions":{"0.4.0-alpha.3":{"name":"@agora-rte/rte-controller-react-native","version":"0.4.0-alpha.3","main":"lib/index.js","description":"RTE UI controller is a module to be used in the UI resource itself to facilitate the integration with RTE world.","license":"MIT","private":false,"keywords":["rte-controller-react-native"],"author":{"name":"xiaqin@agora.io"},"dependencies":{"react-native-flex-layout":"^0.1.5","@agora-rte/rte-controller-base":"0.4.0-alpha.4"},"scripts":{"build:debug":"webpack --config ./webpack/webpack.debug.js","build":"webpack --config ./webpack/webpack.prod.js","package":"chmod +x package.sh && ./package.sh"},"publishConfig":{"access":"public"},"devDependencies":{"@babel/core":"^7.19.1","@babel/plugin-proposal-class-properties":"^7.18.6","@babel/plugin-proposal-decorators":"^7.19.1","@babel/preset-env":"^7.19.1","@babel/preset-react":"^7.18.6","@babel/runtime":"^7.19.0","@types/jest":"^29.0.3","@types/lodash":"^4.14.185","@types/react":"^17.0.50","@types/react-native":"^0.67.14","@types/react-test-renderer":"^17.0.2","@typescript-eslint/eslint-plugin":"^5.38.0","@typescript-eslint/parser":"^5.38.0","babel-core":"^6.26.3","babel-jest":"^29.0.3","babel-loader":"^8.2.5","babel-plugin-module-resolver":"^4.1.0","chokidar-cli":"^3.0.0","clean-webpack-plugin":"^4.0.0","eslint":"^8.24.0","http-server":"^14.1.1","jest":"^29.0.3","metro-react-native-babel-preset":"^0.72.3","react":"17.0.2","react-native":"^0.68.3","react-test-renderer":"17.0.2","thread-loader":"^3.0.4","ts-loader":"^9.4.1","typescript":"^4.8.3","webpack":"5.74.0","webpack-cli":"^4.10.0","webpackbar":"^5.0.2"},"peerDependencies":{"react":"*","react-native":"*"},"resolutions":{"@types/react":"^17"},"types":"./lib/index.d.ts","gitHead":"fdbfb7944dd3c7f05e0c03c8bd4fdfba305caa5a","_id":"@agora-rte/rte-controller-react-native@0.4.0-alpha.3","_nodeVersion":"18.9.1","_npmVersion":"8.19.1","dist":{"integrity":"sha512-sG1d1GvVomHii0073zDtnpXPRjADI9lk7ro6vt+d5h7cugErv6kKN9bSg3vc/t742QisfaPO32aC+C5wa4LS6g==","shasum":"89e76476d0e03aaaa7433e4dc083ddc79fce4963","tarball":"https://registry.npmjs.org/@agora-rte/rte-controller-react-native/-/rte-controller-react-native-0.4.0-alpha.3.tgz","fileCount":12,"unpackedSize":195372,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHre0yPPrg9LSAcuoi/WNwEKpl84C5pcmKy74idVcSRmAiEAqZ4LZXkRZDVMeJszYiJZSzYAFH9bezpXPHM8wnptsfY="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjMrTCACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrWbA//R1/eQUK4mNKvEE88BJnqaEeCUGLZ+6LCquQyWoehK5e/Pccz\r\n7/bWX2O6glRgQdfONctSIH89sqgzQ9n44i/QsbrDGIJ5BoaydhJ97i/j7tOp\r\nEZvXstck46a2AwQm+Yr3u2f8fDw57CKeBZq+XGENi4ANeDMNLBwmfHky8qZy\r\n/sI4md3Xz9WGr3KXXmYeEOE8yYPgmhPwfrasdxHrFvJw9ufFDZhHceGkAZ5Q\r\n7J8sxgv2LzV5g/r9IOguhffGcznjYoxAEMLarIgpO1Ynm7N1MXygXfH5ovZx\r\npPY4q28KfumJisxYHmULBBNsvFFCjskCon/5zk5+MMBauAnmiEfAYOCeyLdC\r\nSmrn5qYBQ/TQ4bLn8iL009fPLy4EB3n19/2S1vBeQSShqpNtUz9OWR1d6d6W\r\nATfgQ+zJPDRJxQxE2W3aw1tlZ3Maz6xRGyXKLVm9eGI46ApPWRD3J41BALH9\r\n7/cn10LJYjNDAgQHT4leeKOcyFUAVksfdjbeFATwcqZ7MoJKoF5XYIOP0bHm\r\nxA0WI+Yh0FnuzAWpkleo3MEBmWhujLPWmy0ijIWLPIwwKCxaiZ0DT6OkDRxH\r\nnbjkXaw0VitlSFdjh/kqKYSOXtzL/kgWYlrJVFD32BUQtYd53ihkztXbGQW/\r\nOhk/FWcZ3AGu2uYLKl4tNUtExhxJtYKI7mk=\r\n=RZ3S\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"halajohn","email":"wei.hu.tw@gmail.com"},"directories":{},"maintainers":[{"name":"conqueror123","email":"renjingui@agora.io"},{"name":"adonia12","email":"adonia12@126.com"},{"name":"halajohn","email":"wei.hu.tw@gmail.com"},{"name":"xiaqin","email":"xiaqin@agora.io"},{"name":"deliberatekids","email":"deliberatekids@gmail.com"},{"name":"liziyuanzzz","email":"sunxilin@agora.io"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/rte-controller-react-native_0.4.0-alpha.3_1664267458671_0.6544548808817201"},"_hasShrinkwrap":false},"0.4.0-alpha.4":{"name":"@agora-rte/rte-controller-react-native","version":"0.4.0-alpha.4","main":"lib/index.js","description":"RTE UI controller is a module to be used in the UI resource itself to facilitate the integration with RTE world.","license":"MIT","private":false,"keywords":["rte-controller-react-native"],"author":{"name":"xiaqin@agora.io"},"dependencies":{"react-native-flex-layout":"^0.1.5","@agora-rte/rte-controller-base":"0.4.0-alpha.5"},"scripts":{"build:debug":"webpack --config ./webpack/webpack.debug.js","build":"webpack --config ./webpack/webpack.prod.js","package":"chmod +x package.sh && ./package.sh"},"publishConfig":{"access":"public"},"devDependencies":{"@babel/core":"^7.19.1","@babel/plugin-proposal-class-properties":"^7.18.6","@babel/plugin-proposal-decorators":"^7.19.1","@babel/preset-env":"^7.19.1","@babel/preset-react":"^7.18.6","@babel/runtime":"^7.19.0","@types/jest":"^29.0.3","@types/lodash":"^4.14.185","@types/react":"^17.0.50","@types/react-native":"^0.67.14","@types/react-test-renderer":"^17.0.2","@typescript-eslint/eslint-plugin":"^5.38.1","@typescript-eslint/parser":"^5.38.1","babel-core":"^6.26.3","babel-jest":"^29.0.3","babel-loader":"^8.2.5","babel-plugin-module-resolver":"^4.1.0","chokidar-cli":"^3.0.0","clean-webpack-plugin":"^4.0.0","eslint":"^8.24.0","http-server":"^14.1.1","jest":"^29.0.3","metro-react-native-babel-preset":"^0.72.3","react":"17.0.2","react-native":"^0.68.3","react-test-renderer":"17.0.2","thread-loader":"^3.0.4","ts-loader":"^9.4.1","typescript":"^4.8.3","webpack":"5.74.0","webpack-cli":"^4.10.0","webpackbar":"^5.0.2"},"peerDependencies":{"react":"*","react-native":"*"},"resolutions":{"@types/react":"^17"},"types":"./lib/index.d.ts","gitHead":"68c68443614ad0ce97d69d02f502f3fef2dd2e61","_id":"@agora-rte/rte-controller-react-native@0.4.0-alpha.4","_nodeVersion":"18.7.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-4e6+4FcHbyg44IBLh6j/DaFMMbEKqW+bazpcAco1eVMai+BqSK5DN38Cqi3QkENCK7cBqsn9xcI9ZEH+apWl+w==","shasum":"1437c8a5e96e6dd5a5042822f7333d70692d3505","tarball":"https://registry.npmjs.org/@agora-rte/rte-controller-react-native/-/rte-controller-react-native-0.4.0-alpha.4.tgz","fileCount":16,"unpackedSize":1228422,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHMDqF1shEF21x2lb/PpMR3LLV8TzyRXGKjKMZie4V5aAiEA7z8AQg1ut8eJdWjMSbVrlLVS8WgAdycGbewxwsM4YzE="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjNRjoACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo2gw//ZNd/S+3Z3bZj9hiIy/rZSUKfKiG9VOZdYImZOu+p9LslBaIn\r\nHD+rNGq+VN3zpS5lnokHlbx11LXATW+/ymfkYWgtRZ0F7Rt3kMqvlg6nZ4BR\r\ngM2frt4ofaEF+AOeyzelHFJLCfbKpHw9+QRFGFwY4SPCo5VzGDYx868JP1K5\r\nhGVHCN6PxWqxgjuYxB13ljiRNWgWCcl1790uXeEdidCx22nBv+Q1AgO2M/tz\r\nEwLRWkgH6X8Cc44gEzB3KqKDefEdYPF+abffHs4fCXl+RFvKCyjQYQpE4J1R\r\nZRoWuZ0gbQXsdJKeFjmQAoRp1V8CxmE3OSInQgc+d9sBGkr9J/i9iU+s8WMT\r\nzosO9yhmu4KLxdpoPeJIcshZnzcXUu5lvgWc2UF4sSlq+MrywAE1IbJLxZlm\r\n0uKZ9Vjxn2n95c9XNDmf3reLPGvHDfzdX0KzhAK+1QgBhvwd2dLaKRfXw2kg\r\n1J7WPBfiz8VwGAN7LtlHWCtgEaByAPGGkAt6ZgrL//6l/t6slQ1L+9oSIkoY\r\nF4sR+bZRtC3COLySURsBt+HQZT5koPEG5uq3OdxOWZsMGl5IyLUwHSBgBoLC\r\nzmQElGokoOrRGTNU3YmYC6mKhcYTxUJTFY6KyHo6Z4ihgArfSelYn3mL10/M\r\nDmnSsckiKZ0WwrnZ7HgVgmk4c1KOhzrPczk=\r\n=U+PN\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"adonia12","email":"adonia12@126.com"},"directories":{},"maintainers":[{"name":"conqueror123","email":"renjingui@agora.io"},{"name":"adonia12","email":"adonia12@126.com"},{"name":"halajohn","email":"wei.hu.tw@gmail.com"},{"name":"xiaqin","email":"xiaqin@agora.io"},{"name":"deliberatekids","email":"deliberatekids@gmail.com"},{"name":"liziyuanzzz","email":"sunxilin@agora.io"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/rte-controller-react-native_0.4.0-alpha.4_1664424168566_0.12647667002035345"},"_hasShrinkwrap":false}},"time":{"created":"2022-09-27T08:30:58.570Z","0.4.0-alpha.3":"2022-09-27T08:30:58.866Z","modified":"2022-09-29T04:02:48.889Z","0.4.0-alpha.4":"2022-09-29T04:02:48.776Z"},"maintainers":[{"name":"conqueror123","email":"renjingui@agora.io"},{"name":"adonia12","email":"adonia12@126.com"},{"name":"halajohn","email":"wei.hu.tw@gmail.com"},{"name":"xiaqin","email":"xiaqin@agora.io"},{"name":"deliberatekids","email":"deliberatekids@gmail.com"},{"name":"liziyuanzzz","email":"sunxilin@agora.io"}],"description":"RTE UI controller is a module to be used in the UI resource itself to facilitate the integration with RTE world.","keywords":["rte-controller-react-native"],"author":{"name":"xiaqin@agora.io"},"license":"MIT","readme":"# rte-controller-react-native\n\nRTE UI controller is a module to be used in the UI resource itself to facilitate the integration with RTE world.\n\n## How to Use?\n\n### Install\n\n```bash\ncd path/to/your project\nnpm i @agora-rte/rte-controller-react-native --save-dev\n```\n\n### Use\n\n#### Create RteContext instance\n\n```typescript\nimport { createDefaultRteContext } from \"@agora-rte/rte-controller-base\";\n\n// We need to init RteContext before rendering any widget.\nconst rteContext = await createDefaultRteContext({\n  uri: \"http://192.168.0.104:8001/\",\n  graph_id: \"0\",\n  extension_group: \"default_ui_gateway_extension_ts_group\",\n  extension: \"default_ui_gateway_extension_ts\",\n});\n```\n\n#### Use with RTE layout template\n\n```react\nimport { RteLayoutComp } from \"@agora-rte/rte-controller-react-native\";\n\nreturn (\n  <RteLayoutComp rteContext={rteContext} />\n);\n```\n\n#### Use with your own layouts\n\n```React\nimport {\n  RteLayoutRenderOptions,\n  ExtensionContainer,\n} from \"@agora-rte/rte-controller-react-native\";\n\nreturn (\n  <View\n    style={{\n      width: \"200px\",\n    }}\n  >\n    <ExtensionContainer\n      extension=\"default_ui_extension_ts\"\n      rteContext={rteContext}\n      options={options}\n    />\n  </View>\n);\n```\n\nYou can use `widgetProps` in `ExtensionContainer` to define any props, which will be passed to the widget component directly.\n\n#### Customize the timing of receiving message\n\nBy default, rte-controller will start to receive message when all the widgets are mounted.\n\nYou can customize with `setWidgetMountedListener()` in `RteContext`. For example:\n\n```typescript\nimport {\n  RteContext,\n  RteUiWidgetInfo,\n} from '@agora-rte/rte-controller';\n\nrteContext.setWidgetMountedListener(\n  (\n    rteContext: RteContext,\n    widget: RteUiWidgetInfo,\n    error?: Error,\n  ): void => {\n    console.log(\n      `The widget is ready, ${JSON.stringify(widget)}, error: ${error}`,\n    );\n\n    // Calling 'readyToReceiveExtensionMessage()' to open the message channel between the App and RTE Extension, and will receive events from RTE Extension if any.\n    setTimeout(() => {\n      rteContext.readyToReceiveExtensionMessage();\n    }, 5000);\n  },\n);\n```\n\n> Keep in mind that you have to call `readyToReceiveExtensionMessage()` yourself when the App is ready to receive messages from RTE Extension.\n\n#### Subscribe events\n\nYou can subscribe event from RTE Extension like the UI Widget with `subscribeEvent()` in `RteContext`. For example:\n\n```typescript\nrteContext.subscribeEvent({\n  extension: 'default_ui_extension_ts',\n  handler: (msg: RteUiWidgetMsg) => {\n    console.log(\n      `Receive message from default_ui_extension_ts: ${JSON.stringify(\n        msg,\n      )}`,\n    );\n  },\n});\n```\n\nThe `extension` and `type` are used to filter the events, you have to specify at least one. And of course, you can specify both of them.\n\nAnd you can use `unsubscribeEvent()` to cancel the subscription.\n","readmeFilename":"readme.md"}