@100mslive/roomkit-react 0.1.6-alpha.3 → 0.1.7-alpha.0

package/dist/index.cjs.js

@@ -105,7 +105,7 @@ var __async = (__this, __arguments, generator) => {
 var define_process_env_default;
 var init_define_process_env = __esm({
   "<define:process.env>"() {
-    define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_webpack_cli: "^4.9.2", npm_package_devDependencies_webpack_bundle_analyzer: "^4.5.0", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.19 npm/? node/v16.20.2 linux x64", npm_config_always_auth: "", NX_WORKSPACE_ROOT: "/home/runner/work/web-sdks/web-sdks", npm_package_devDependencies__rollup_plugin_node_resolve: "^13.1.3", npm_package_scripts_babel: "npx storybook@latest babelrc", CI: "true", npm_package_devDependencies__size_limit_file: "^5.0.3", npm_config_bin_links: "true", npm_config_wrap_output: "", npm_package_dependencies__radix_ui_react_tabs: "1.0.0", npm_package_dependencies__100mslive_react_sdk: "0.8.15-alpha.3", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", npm_config_init_version: "1.0.0", npm_package_dependencies__emoji_mart_react: "^1.0.1", npm_package_dependencies__emoji_mart_data: "^1.0.6", npm_package_dependencies__100mslive_hms_virtual_background: "1.11.15-alpha.3", JAVA_HOME_8_X64: "/usr/lib/jvm/temurin-8-jdk-amd64", NODE_AUTH_TOKEN: "XXXXX-XXXXX-XXXXX-XXXXX", SHLVL: "1", npm_package_dependencies__radix_ui_react_tooltip: "1.0.6", npm_package_dependencies__radix_ui_react_popover: "1.0.6", npm_package_dependencies__100mslive_types_prebuilt: "0.12.0", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_webpack_manifest_plugin: "^4.1.1", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.3", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "663", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.7", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_dependencies_react_router_dom: "^6.3.0", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.7/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.0/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20230903.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:17188", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_scripts_app: "cd apps/100ms-web && yarn start", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_sdk: "cd packages/hms-video-web && yarn start", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.1.15-alpha.3", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", GITHUB_RUN_ID: "6168539635", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "1724f0ddfffa3cd09487ab41c065c426c70c2bc3", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "apps/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "c67220c7f325baf560839d83195ee95941437fbb226869951f813b8aca3fdcfc", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/main", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GOROOT_1_18_X64: "/opt/hostedtoolcache/go/1.18.10/x64", GITHUB_ACTION_REPOSITORY: "", npm_package_workspaces_2: "playwright/*", npm_package_devDependencies_postcss_loader: "^6.2.1", PATH: "/tmp/yarn--1694584759586-0.4054495577248629:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584759378-0.1806739657761589:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584717715-0.032552056606420354:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584717521-0.3709286938947527:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/snap/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_d9c702be-997e-4033-8626-ad85b8def8e1", INVOCATION_ID: "94d3b65fbfbb4008ab59c642387a4b27", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.12/x64", npm_package_husky_hooks_pre_push: "lint-staged", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "369", GITHUB_TRIGGERING_ACTOR: "raviteja83", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies_pusher_js: "^7.0.3", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "80 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "80 KB", npm_package_lint_staged__: "format && lint:fix", npm_package_devDependencies_webpack: "^5.76.0", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 2", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "main", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "20 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-web/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_webpack_dev_server: "^4.7.4", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.8.15-alpha.3", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", STATS_NM: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.1.6-alpha.3", npm_package_size_limit_4_limit: "400 KB", npm_package_size_limit_1_path: "packages/hms-video-web/dist/index.js", npm_package_husky_hooks_pre_commit: "lint-staged", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "20 KB", npm_package_size_limit_3_path: "packages/hms-video-store/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "1724f0ddfffa3cd09487ab41c065c426c70c2bc3", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "20 KB", npm_package_size_limit_4_path: "packages/roomkit-react/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/main", GITHUB_ACTOR: "raviteja83", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_size_limit_8_limit: "100 KB", npm_package_size_limit_5_path: "packages/roomkit-react/dist/index.js", npm_config_strict_ssl: "true", npm_package_license: "MIT", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_9_limit: "100 KB", npm_package_size_limit_6_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "6763261", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/hms-virtual-background/dist/index.js", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.10.0-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", npm_package_size_limit_8_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_size_limit_9_path: "packages/react-icons/dist/index.js", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.154/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_scripts_app_custom: "cd apps/100ms-custom-app && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_98258c95-4c6a-4d26-99ac-b24d0c9f2eab" };
+    define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_8f8a0291-7787-40d4-befb-0019c24b8a38", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_webpack_cli: "^4.9.2", npm_package_devDependencies_webpack_bundle_analyzer: "^4.5.0", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.19 npm/? node/v16.20.2 linux x64", npm_config_always_auth: "", NX_WORKSPACE_ROOT: "/home/runner/work/web-sdks/web-sdks", npm_package_devDependencies__rollup_plugin_node_resolve: "^13.1.3", npm_package_scripts_babel: "npx storybook@latest babelrc", CI: "true", npm_package_devDependencies__size_limit_file: "^5.0.3", npm_config_bin_links: "true", npm_config_wrap_output: "", npm_package_dependencies__radix_ui_react_tabs: "1.0.0", npm_package_dependencies__100mslive_react_sdk: "0.8.16-alpha.0", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_8f8a0291-7787-40d4-befb-0019c24b8a38", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", npm_config_init_version: "1.0.0", npm_package_dependencies__emoji_mart_react: "^1.0.1", npm_package_dependencies__emoji_mart_data: "^1.0.6", npm_package_dependencies__100mslive_hms_virtual_background: "1.11.16-alpha.0", JAVA_HOME_8_X64: "/usr/lib/jvm/temurin-8-jdk-amd64", NODE_AUTH_TOKEN: "XXXXX-XXXXX-XXXXX-XXXXX", SHLVL: "1", npm_package_dependencies__radix_ui_react_tooltip: "1.0.6", npm_package_dependencies__radix_ui_react_popover: "1.0.6", npm_package_dependencies__100mslive_types_prebuilt: "0.12.0", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_webpack_manifest_plugin: "^4.1.1", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.3", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "574", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.7", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_dependencies_react_router_dom: "^6.3.0", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.8/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.1/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20230911.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:18506", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_scripts_app: "cd apps/100ms-web && yarn start", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_sdk: "cd packages/hms-video-web && yarn start", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.1.16-alpha.0", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", GITHUB_RUN_ID: "6198915575", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "02a796684045c2468c14db4cb894c56a17c6c2ba", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "apps/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "8a4484713b154f3742de308ef3744078cdc8cc6e16292ef890f36d3e4d15b9d8", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/main", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GOROOT_1_18_X64: "/opt/hostedtoolcache/go/1.18.10/x64", GITHUB_ACTION_REPOSITORY: "", npm_package_workspaces_2: "playwright/*", npm_package_devDependencies_postcss_loader: "^6.2.1", PATH: "/tmp/yarn--1694786016419-0.6818104641303016:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694786016213-0.12270191559192756:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694785976000-0.6614035614405027:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694785975797-0.26100102923431345:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/snap/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_ebe58d16-d54e-40ee-9a20-f8cf86e54702", INVOCATION_ID: "c5fa857d24e84556a121754af31fdaec", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.13/x64", npm_package_husky_hooks_pre_push: "lint-staged", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "372", GITHUB_TRIGGERING_ACTOR: "eswarclynn", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies_pusher_js: "^7.0.3", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "80 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "80 KB", npm_package_lint_staged__: "format && lint:fix", npm_package_devDependencies_webpack: "^5.76.0", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 3", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "main", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "20 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-web/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_webpack_dev_server: "^4.7.4", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.8.16-alpha.0", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", STATS_NM: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.1.7-alpha.0", npm_package_size_limit_4_limit: "400 KB", npm_package_size_limit_1_path: "packages/hms-video-web/dist/index.js", npm_package_husky_hooks_pre_commit: "lint-staged", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "20 KB", npm_package_size_limit_3_path: "packages/hms-video-store/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "02a796684045c2468c14db4cb894c56a17c6c2ba", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "20 KB", npm_package_size_limit_4_path: "packages/roomkit-react/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/main", GITHUB_ACTOR: "eswarclynn", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_size_limit_8_limit: "100 KB", npm_package_size_limit_5_path: "packages/roomkit-react/dist/index.js", npm_config_strict_ssl: "true", npm_package_license: "MIT", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_9_limit: "100 KB", npm_package_size_limit_6_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_8f8a0291-7787-40d4-befb-0019c24b8a38", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "64120992", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/hms-virtual-background/dist/index.js", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.10.0-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_8f8a0291-7787-40d4-befb-0019c24b8a38", npm_package_size_limit_8_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_size_limit_9_path: "packages/react-icons/dist/index.js", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.154/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_scripts_app_custom: "cd apps/100ms-custom-app && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_8f8a0291-7787-40d4-befb-0019c24b8a38" };
   }
 });
 
@@ -1461,6 +1461,7 @@ var init_Tooltip = __esm({
       borderRadius: "$2",
       padding: "$2 $4",
       fontSize: "$xs",
+      zIndex: 11,
       color: "$on_surface_high",
       backgroundColor: "$surface_bright",
       "@media (prefers-reduced-motion: no-preference)": {
@@ -5024,39 +5025,6 @@ var init_InitErrorModal = __esm({
   }
 });
 
-// src/Prebuilt/common/utils.js
-var getMetadata, isScreenshareSupported, isInternalRole, getFormattedCount, formatTime;
-var init_utils2 = __esm({
-  "src/Prebuilt/common/utils.js"() {
-    "use strict";
-    init_define_process_env();
-    getMetadata = (metadataString) => {
-      try {
-        return !metadataString ? {} : JSON.parse(metadataString);
-      } catch (error) {
-        return {};
-      }
-    };
-    isScreenshareSupported = () => {
-      return typeof navigator.mediaDevices.getDisplayMedia !== "undefined";
-    };
-    isInternalRole = (role) => role && role.startsWith("__internal");
-    getFormattedCount = (num) => {
-      const formatter = new Intl.NumberFormat("en", { notation: "compact", maximumFractionDigits: 2 });
-      const formattedNum = formatter.format(num);
-      return formattedNum;
-    };
-    formatTime = (timeInSeconds) => {
-      timeInSeconds = Math.floor(timeInSeconds / 1e3);
-      const hours = Math.floor(timeInSeconds / 3600);
-      const minutes = Math.floor(timeInSeconds % 3600 / 60);
-      const seconds = timeInSeconds % 60;
-      const hour = hours !== 0 ? `${hours < 10 ? "0" : ""}${hours}:` : "";
-      return `${hour}${minutes < 10 ? "0" : ""}${minutes}:${seconds < 10 ? "0" : ""}${seconds}`;
-    };
-  }
-});
-
 // src/Prebuilt/components/Notifications/PeerNotifications.jsx
 var import_react39, import_react_sdk13, notificationTypes, PeerNotifications;
 var init_PeerNotifications = __esm({
@@ -5067,7 +5035,6 @@ var init_PeerNotifications = __esm({
     import_react_sdk13 = require("@100mslive/react-sdk");
     init_ToastBatcher();
     init_useUISettings();
-    init_utils2();
     init_constants();
     notificationTypes = [
       import_react_sdk13.HMSNotificationTypes.PEER_LIST,
@@ -5078,19 +5045,14 @@ var init_PeerNotifications = __esm({
       const notification = (0, import_react_sdk13.useHMSNotifications)(notificationTypes);
       const isPeerJoinSubscribed = useSubscribedNotifications(SUBSCRIBED_NOTIFICATIONS.PEER_JOINED);
       const isPeerLeftSubscribed = useSubscribedNotifications(SUBSCRIBED_NOTIFICATIONS.PEER_LEFT);
-      const roomState = (0, import_react_sdk13.useHMSStore)(import_react_sdk13.selectRoomState);
       (0, import_react39.useEffect)(() => {
-        var _a7, _b7;
-        if (roomState !== import_react_sdk13.HMSRoomState.Connected) {
-          return;
-        }
-        if (!notification || ((_a7 = notification == null ? void 0 : notification.data) == null ? void 0 : _a7.roleName) && isInternalRole(notification.data.roleName)) {
+        if (!(notification == null ? void 0 : notification.data)) {
           return;
         }
         console.debug(`[${notification.type}]`, notification);
         switch (notification.type) {
           case import_react_sdk13.HMSNotificationTypes.PEER_LIST:
-            if (!isPeerJoinSubscribed || ((_b7 = notification.data) == null ? void 0 : _b7.length) === 0) {
+            if (!isPeerJoinSubscribed || notification.data.length === 0) {
               return;
             }
             break;
@@ -5108,7 +5070,7 @@ var init_PeerNotifications = __esm({
             return;
         }
         ToastBatcher.showToast({ notification });
-      }, [notification, isPeerJoinSubscribed, isPeerLeftSubscribed, roomState]);
+      }, [notification, isPeerJoinSubscribed, isPeerLeftSubscribed]);
       return null;
     };
   }
@@ -5881,6 +5843,38 @@ var init_useRedirectToLeave = __esm({
   }
 });
 
+// src/Prebuilt/common/utils.js
+var getMetadata, isScreenshareSupported, getFormattedCount, formatTime;
+var init_utils2 = __esm({
+  "src/Prebuilt/common/utils.js"() {
+    "use strict";
+    init_define_process_env();
+    getMetadata = (metadataString) => {
+      try {
+        return !metadataString ? {} : JSON.parse(metadataString);
+      } catch (error) {
+        return {};
+      }
+    };
+    isScreenshareSupported = () => {
+      return typeof navigator.mediaDevices.getDisplayMedia !== "undefined";
+    };
+    getFormattedCount = (num) => {
+      const formatter = new Intl.NumberFormat("en", { notation: "compact", maximumFractionDigits: 2 });
+      const formattedNum = formatter.format(num);
+      return formattedNum;
+    };
+    formatTime = (timeInSeconds) => {
+      timeInSeconds = Math.floor(timeInSeconds / 1e3);
+      const hours = Math.floor(timeInSeconds / 3600);
+      const minutes = Math.floor(timeInSeconds % 3600 / 60);
+      const seconds = timeInSeconds % 60;
+      const hour = hours !== 0 ? `${hours < 10 ? "0" : ""}${hours}:` : "";
+      return `${hour}${minutes < 10 ? "0" : ""}${minutes}:${seconds < 10 ? "0" : ""}${seconds}`;
+    };
+  }
+});
+
 // src/Prebuilt/components/Notifications/Notifications.jsx
 function Notifications() {
   const notification = (0, import_react_sdk19.useHMSNotifications)();
@@ -5891,6 +5885,7 @@ function Notifications() {
   const updateRoomLayoutForRole = useUpdateRoomLayout();
   const isNotificationDisabled = useIsNotificationDisabled();
   const { redirectToLeave } = useRedirectToLeave();
+  const vanillaStore = (0, import_react_sdk19.useHMSVanillaStore)();
   const handleRoleChangeDenied = (0, import_react46.useCallback)((request) => {
     ToastManager.addToast({
       title: `${request.peerName} denied your request to join the ${request.role.name} role`,
@@ -5904,6 +5899,16 @@ function Notifications() {
       return;
     }
     switch (notification.type) {
+      case import_react_sdk19.HMSNotificationTypes.HAND_RAISE_CHANGED: {
+        if (roomState !== import_react_sdk19.HMSRoomState.Connected || notification.data.isLocal) {
+          return;
+        }
+        const hasPeerHandRaised = vanillaStore.getState((0, import_react_sdk19.selectHasPeerHandRaised)(notification.data.id));
+        if (hasPeerHandRaised) {
+          ToastBatcher.showToast({ notification, type: "RAISE_HAND" });
+        }
+        break;
+      }
       case import_react_sdk19.HMSNotificationTypes.METADATA_UPDATED:
         if (roomState !== import_react_sdk19.HMSRoomState.Connected) {
           return;
@@ -5995,7 +6000,7 @@ function Notifications() {
   if (isNotificationDisabled) {
     return null;
   }
-  return /* @__PURE__ */ import_react46.default.createElement(import_react46.default.Fragment, null, /* @__PURE__ */ import_react46.default.createElement(TrackUnmuteModal, null), /* @__PURE__ */ import_react46.default.createElement(TrackBulkUnmuteModal, null), /* @__PURE__ */ import_react46.default.createElement(TrackNotifications, null), /* @__PURE__ */ import_react46.default.createElement(PeerNotifications, null), /* @__PURE__ */ import_react46.default.createElement(ReconnectNotifications, null), /* @__PURE__ */ import_react46.default.createElement(AutoplayBlockedModal, null), /* @__PURE__ */ import_react46.default.createElement(PermissionErrorModal, null), /* @__PURE__ */ import_react46.default.createElement(InitErrorModal, { notification }));
+  return /* @__PURE__ */ import_react46.default.createElement(import_react46.default.Fragment, null, /* @__PURE__ */ import_react46.default.createElement(TrackUnmuteModal, null), /* @__PURE__ */ import_react46.default.createElement(TrackBulkUnmuteModal, null), /* @__PURE__ */ import_react46.default.createElement(TrackNotifications, null), roomState === import_react_sdk19.HMSRoomState.Connected ? /* @__PURE__ */ import_react46.default.createElement(PeerNotifications, null) : null, /* @__PURE__ */ import_react46.default.createElement(ReconnectNotifications, null), /* @__PURE__ */ import_react46.default.createElement(AutoplayBlockedModal, null), /* @__PURE__ */ import_react46.default.createElement(PermissionErrorModal, null), /* @__PURE__ */ import_react46.default.createElement(InitErrorModal, { notification }));
 }
 var import_react46, import_react_router_dom2, import_react_sdk19;
 var init_Notifications = __esm({
@@ -6220,6 +6225,7 @@ var init_useMetadata = __esm({
       const localPeerId = (0, import_react_sdk21.useHMSStore)(import_react_sdk21.selectLocalPeerID);
       const vanillaStore = (0, import_react_sdk21.useHMSVanillaStore)();
       const metaData = (0, import_react_sdk21.useHMSStore)((0, import_react_sdk21.selectPeerMetadata)(localPeerId));
+      const isHandRaised = (0, import_react_sdk21.useHMSStore)((0, import_react_sdk21.selectHasPeerHandRaised)(localPeerId));
       const update = (updatedFields) => __async(void 0, null, function* () {
         try {
           const currentMetadata = vanillaStore.getState((0, import_react_sdk21.selectPeerMetadata)(localPeerId));
@@ -6230,10 +6236,18 @@ var init_useMetadata = __esm({
         }
       });
       const toggleHandRaise = (0, import_react49.useCallback)(() => __async(void 0, null, function* () {
-        yield update({ isHandRaised: !(metaData == null ? void 0 : metaData.isHandRaised), isBRBOn: false });
-      }), [metaData == null ? void 0 : metaData.isHandRaised]);
+        if (isHandRaised) {
+          yield hmsActions.lowerLocalPeerHand();
+        } else {
+          yield hmsActions.raiseLocalPeerHand();
+        }
+      }), [isHandRaised]);
       const toggleBRB = (0, import_react49.useCallback)(() => __async(void 0, null, function* () {
-        yield update({ isBRBOn: !(metaData == null ? void 0 : metaData.isBRBOn), isHandRaised: false });
+        const newValue = !(metaData == null ? void 0 : metaData.isBRBOn);
+        yield update({ isBRBOn: !(metaData == null ? void 0 : metaData.isBRBOn) });
+        if (newValue) {
+          yield hmsActions.lowerLocalPeerHand();
+        }
       }), [metaData == null ? void 0 : metaData.isBRBOn]);
       const setPrevRole = (role) => __async(void 0, null, function* () {
         yield update({
@@ -6241,7 +6255,7 @@ var init_useMetadata = __esm({
         });
       });
       return {
-        isHandRaised: !!(metaData == null ? void 0 : metaData.isHandRaised),
+        isHandRaised,
         isBRBOn: !!(metaData == null ? void 0 : metaData.isBRBOn),
         metaData,
         updateMetaData: update,
@@ -8640,12 +8654,13 @@ var init_peerTileUtils = __esm({
 });
 
 // src/Prebuilt/components/VideoTile.jsx
-var import_react74, import_react_sdk36, import_react_icons29, Tile, metaStyles, heightAnimation, AudioLevelIndicator, AudioLevel, PeerMetadata, VideoTile, VideoTile_default;
+var import_react74, import_react_use9, import_react_sdk36, import_react_icons29, Tile, metaStyles, heightAnimation, AudioLevelIndicator, AudioLevel, PeerMetadata, VideoTile, VideoTile_default;
 var init_VideoTile2 = __esm({
   "src/Prebuilt/components/VideoTile.jsx"() {
     "use strict";
     init_define_process_env();
     import_react74 = __toESM(require("react"));
+    import_react_use9 = require("react-use");
     import_react_sdk36 = require("@100mslive/react-sdk");
     import_react_icons29 = require("@100mslive/react-icons");
     init_TileConnection();
@@ -8677,6 +8692,7 @@ var init_VideoTile2 = __esm({
     }) => {
       const trackSelector = trackId ? (0, import_react_sdk36.selectVideoTrackByID)(trackId) : (0, import_react_sdk36.selectVideoTrackByPeerID)(peerId);
       const track = (0, import_react_sdk36.useHMSStore)(trackSelector);
+      const isMobile = (0, import_react_use9.useMedia)(config.media.md);
       const peerName = (0, import_react_sdk36.useHMSStore)((0, import_react_sdk36.selectPeerNameByID)(peerId));
       const audioTrack = (0, import_react_sdk36.useHMSStore)((0, import_react_sdk36.selectAudioTrackByPeerID)(peerId));
       const localPeerID = (0, import_react_sdk36.useHMSStore)(import_react_sdk36.selectLocalPeerID);
@@ -8757,7 +8773,7 @@ var init_VideoTile2 = __esm({
             },
             /* @__PURE__ */ import_react74.default.createElement(import_react_icons29.MicOffIcon, null)
           ) : /* @__PURE__ */ import_react74.default.createElement(AudioLevel, { trackId: audioTrack == null ? void 0 : audioTrack.id }) : null,
-          isMouseHovered || isDragabble ? /* @__PURE__ */ import_react74.default.createElement(
+          isMouseHovered || isDragabble && isMobile ? /* @__PURE__ */ import_react74.default.createElement(
             TileMenu_default,
             {
               peerID: peerId,
@@ -8823,8 +8839,8 @@ var init_VideoTile2 = __esm({
     };
     PeerMetadata = ({ peerId }) => {
       const metaData = (0, import_react_sdk36.useHMSStore)((0, import_react_sdk36.selectPeerMetadata)(peerId));
-      const isHandRaised = (metaData == null ? void 0 : metaData.isHandRaised) || false;
       const isBRB = (metaData == null ? void 0 : metaData.isBRBOn) || false;
+      const isHandRaised = (0, import_react_sdk36.useHMSStore)((0, import_react_sdk36.selectHasPeerHandRaised)(peerId));
       return /* @__PURE__ */ import_react74.default.createElement(import_react74.Fragment, null, isHandRaised ? /* @__PURE__ */ import_react74.default.createElement(StyledVideoTile.AttributeBox, { css: metaStyles, "data-testid": "raiseHand_icon_onTile" }, /* @__PURE__ */ import_react74.default.createElement(import_react_icons29.HandIcon, { width: 24, height: 24 })) : null, isBRB ? /* @__PURE__ */ import_react74.default.createElement(StyledVideoTile.AttributeBox, { css: metaStyles, "data-testid": "brb_icon_onTile" }, /* @__PURE__ */ import_react74.default.createElement(import_react_icons29.BrbTileIcon, { width: 22, height: 22 })) : null);
     };
     VideoTile = import_react74.default.memo(Tile);
@@ -8833,13 +8849,13 @@ var init_VideoTile2 = __esm({
 });
 
 // src/Prebuilt/components/Preview/PreviewForm.tsx
-var import_react75, import_react_use9, import_join_form2, import_react_sdk37, import_react_icons30, PreviewForm, Form, PreviewForm_default;
+var import_react75, import_react_use10, import_join_form2, import_react_sdk37, import_react_icons30, PreviewForm, Form, PreviewForm_default;
 var init_PreviewForm = __esm({
   "src/Prebuilt/components/Preview/PreviewForm.tsx"() {
     "use strict";
     init_define_process_env();
     import_react75 = __toESM(require("react"));
-    import_react_use9 = require("react-use");
+    import_react_use10 = require("react-use");
     import_join_form2 = require("@100mslive/types-prebuilt/elements/join_form");
     import_react_sdk37 = require("@100mslive/react-sdk");
     import_react_icons30 = require("@100mslive/react-icons");
@@ -8858,7 +8874,7 @@ var init_PreviewForm = __esm({
       const formSubmit = (e) => {
         e.preventDefault();
       };
-      const isMobile = (0, import_react_use9.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use10.useMedia)(config.media.md);
       const { isHLSRunning } = (0, import_react_sdk37.useRecordingStreaming)();
       const layout = useRoomLayout();
       const { join_form: joinForm = {} } = ((_c = (_b7 = (_a7 = layout == null ? void 0 : layout.screens) == null ? void 0 : _a7.preview) == null ? void 0 : _b7.default) == null ? void 0 : _c.elements) || {};
@@ -9155,13 +9171,13 @@ var init_VirtualBackground = __esm({
 });
 
 // src/Prebuilt/components/Preview/PreviewJoin.tsx
-var import_react78, import_react_use10, import_react_sdk39, import_react_icons32, VirtualBackground2, getParticipantChipContent, PreviewJoin, Container3, PreviewTile, PreviewControls, PreviewSettings, PreviewJoin_default;
+var import_react78, import_react_use11, import_react_sdk39, import_react_icons32, VirtualBackground2, getParticipantChipContent, PreviewJoin, Container3, PreviewTile, PreviewControls, PreviewSettings, PreviewJoin_default;
 var init_PreviewJoin = __esm({
   "src/Prebuilt/components/Preview/PreviewJoin.tsx"() {
     "use strict";
     init_define_process_env();
     import_react78 = __toESM(require("react"));
-    import_react_use10 = require("react-use");
+    import_react_use11 = require("react-use");
     import_react_sdk39 = require("@100mslive/react-sdk");
     import_react_icons32 = require("@100mslive/react-icons");
     init_src();
@@ -9233,6 +9249,10 @@ var init_PreviewJoin = __esm({
       }, [join, name, setPreviewPreference, onJoin]);
       const roomLayout = useRoomLayout();
       const { preview_header: previewHeader = {} } = ((_c = (_b7 = (_a7 = roomLayout == null ? void 0 : roomLayout.screens) == null ? void 0 : _a7.preview) == null ? void 0 : _b7.default) == null ? void 0 : _c.elements) || {};
+      const localPeer = (0, import_react_sdk39.useHMSStore)(import_react_sdk39.selectLocalPeer);
+      const videoTrack = (0, import_react_sdk39.useHMSStore)((0, import_react_sdk39.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
+      const isMobile = (0, import_react_use11.useMedia)(config.media.md);
+      const aspectRatio = (videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) ? videoTrack.width / videoTrack.height : isMobile ? 9 / 16 : 16 / 9;
       (0, import_react78.useEffect)(() => {
         if (authToken) {
           if (skipPreview) {
@@ -9282,7 +9302,7 @@ var init_PreviewJoin = __esm({
           }
         },
         /* @__PURE__ */ import_react78.default.createElement(PreviewTile, { name, error: previewError })
-      ) : null, /* @__PURE__ */ import_react78.default.createElement(Box, { css: { w: "100%", maxWidth: "640px" } }, /* @__PURE__ */ import_react78.default.createElement(PreviewControls, { hideSettings: !toggleVideo && !toggleAudio }), /* @__PURE__ */ import_react78.default.createElement(
+      ) : null, /* @__PURE__ */ import_react78.default.createElement(Box, { css: { w: "100%", maxWidth: `${aspectRatio * 360}px` } }, /* @__PURE__ */ import_react78.default.createElement(PreviewControls, { hideSettings: !toggleVideo && !toggleAudio }), /* @__PURE__ */ import_react78.default.createElement(
         PreviewForm_default,
         {
           name,
@@ -9309,7 +9329,7 @@ var init_PreviewJoin = __esm({
       const track = (0, import_react_sdk39.useHMSStore)(trackSelector);
       const showMuteIcon = !isLocalAudioEnabled || !toggleAudio;
       const videoTrack = (0, import_react_sdk39.useHMSStore)((0, import_react_sdk39.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
-      const isMobile = (0, import_react_use10.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use11.useMedia)(config.media.md);
       const aspectRatio = (videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) ? videoTrack.width / videoTrack.height : isMobile ? 9 / 16 : 16 / 9;
       return /* @__PURE__ */ import_react78.default.createElement(
         StyledVideoTile.Container,
@@ -9317,7 +9337,7 @@ var init_PreviewJoin = __esm({
           css: {
             bg: "$surface_default",
             aspectRatio,
-            height: "min(640px, 40vh)",
+            height: "min(360px, 70vh)",
             maxWidth: "640px",
             overflow: "clip",
             "@md": {
@@ -9339,7 +9359,7 @@ var init_PreviewJoin = __esm({
       );
     };
     PreviewControls = ({ hideSettings }) => {
-      const isMobile = (0, import_react_use10.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use11.useMedia)(config.media.md);
       return /* @__PURE__ */ import_react78.default.createElement(
         Flex,
         {
@@ -9362,14 +9382,14 @@ var init_PreviewJoin = __esm({
 });
 
 // src/Prebuilt/components/Preview/PreviewContainer.tsx
-var import_react79, import_react_router_dom4, import_react_use11, PreviewContainer, PreviewContainer_default;
+var import_react79, import_react_router_dom4, import_react_use12, PreviewContainer, PreviewContainer_default;
 var init_PreviewContainer = __esm({
   "src/Prebuilt/components/Preview/PreviewContainer.tsx"() {
     "use strict";
     init_define_process_env();
     import_react79 = __toESM(require("react"));
     import_react_router_dom4 = require("react-router-dom");
-    import_react_use11 = require("react-use");
+    import_react_use12 = require("react-use");
     init_src();
     init_AppContext();
     init_roomLayoutProvider();
@@ -9383,7 +9403,7 @@ var init_PreviewContainer = __esm({
       const navigate = (0, import_react_router_dom4.useNavigate)();
       const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
       const skipPreview = !isPreviewScreenEnabled;
-      const previewAsRole = (0, import_react_use11.useSearchParam)(QUERY_PARAM_PREVIEW_AS_ROLE);
+      const previewAsRole = (0, import_react_use12.useSearchParam)(QUERY_PARAM_PREVIEW_AS_ROLE);
       const { userName } = useHMSPrebuiltContext();
       const initialName = userName || (skipPreview ? "Beam" : "");
       const { roomId: urlRoomId, role: userRole } = (0, import_react_router_dom4.useParams)();
@@ -9485,7 +9505,7 @@ function FlyingEmoji() {
   const localPeerId = (0, import_react_sdk41.useHMSStore)(import_react_sdk41.selectLocalPeerID);
   const vanillaStore = (0, import_react_sdk41.useHMSVanillaStore)();
   const [emojis, setEmojis] = (0, import_react82.useState)([]);
-  const isMobile = (0, import_react_use12.useMedia)(config.media.md);
+  const isMobile = (0, import_react_use13.useMedia)(config.media.md);
   const startingPoints = (0, import_react82.useMemo)(() => getStartingPoints(isMobile), [isMobile]);
   const showFlyingEmoji = (0, import_react82.useCallback)(
     ({ emojiId, senderId }) => {
@@ -9577,13 +9597,13 @@ function FlyingEmoji() {
     })
   );
 }
-var import_react82, import_react_use12, import_react_sdk41, emojiCount, flyAndFade, wiggleLeftRight, wiggleRightLeft, getStartingPoints;
+var import_react82, import_react_use13, import_react_sdk41, emojiCount, flyAndFade, wiggleLeftRight, wiggleRightLeft, getStartingPoints;
 var init_FlyingEmoji = __esm({
   "src/Prebuilt/plugins/FlyingEmoji.jsx"() {
     "use strict";
     init_define_process_env();
     import_react82 = __toESM(require("react"));
-    import_react_use12 = require("react-use");
+    import_react_use13 = require("react-use");
     import_react_sdk41 = require("@100mslive/react-sdk");
     init_Layout();
     init_Text2();
@@ -9648,9 +9668,8 @@ var init_hooks = __esm({
     import_join_form3 = require("@100mslive/types-prebuilt/elements/join_form");
     import_react_sdk43 = require("@100mslive/react-sdk");
     init_roomLayoutProvider();
-    init_utils2();
     useFilteredRoles = () => {
-      const roles = (0, import_react_sdk43.useHMSStore)(import_react_sdk43.selectAvailableRoleNames).filter((role) => !isInternalRole(role));
+      const roles = (0, import_react_sdk43.useHMSStore)(import_react_sdk43.selectAvailableRoleNames);
       return roles;
     };
     useShowStreamingUI = () => {
@@ -9767,13 +9786,13 @@ var init_EmojiCard = __esm({
 });
 
 // src/Prebuilt/components/EmojiReaction.jsx
-var import_react87, import_react_use13, import_apple, import_emoji_mart, import_react_sdk45, import_react_icons33, EmojiReaction;
+var import_react87, import_react_use14, import_apple, import_emoji_mart, import_react_sdk45, import_react_icons33, EmojiReaction;
 var init_EmojiReaction = __esm({
   "src/Prebuilt/components/EmojiReaction.jsx"() {
     "use strict";
     init_define_process_env();
     import_react87 = __toESM(require("react"));
-    import_react_use13 = require("react-use");
+    import_react_use14 = require("react-use");
     import_apple = __toESM(require("@emoji-mart/data/sets/14/apple.json"));
     import_emoji_mart = require("emoji-mart");
     import_react_sdk45 = require("@100mslive/react-sdk");
@@ -9793,7 +9812,7 @@ var init_EmojiReaction = __esm({
       useDropdownList({ open, name: "EmojiReaction" });
       const roles = (0, import_react_sdk45.useHMSStore)(import_react_sdk45.selectAvailableRoleNames);
       const localPeerId = (0, import_react_sdk45.useHMSStore)(import_react_sdk45.selectLocalPeerID);
-      const isMobile = (0, import_react_use13.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use14.useMedia)(config.media.md);
       const { sendEvent } = (0, import_react_sdk45.useCustomEvent)({
         type: EMOJI_REACTION_TYPE
       });
@@ -10210,13 +10229,13 @@ var init_MwebLeaveRoom = __esm({
 });
 
 // src/Prebuilt/components/Leave/LeaveRoom.tsx
-var import_react93, import_react_use14, import_react_sdk48, LeaveRoom;
+var import_react93, import_react_use15, import_react_sdk48, LeaveRoom;
 var init_LeaveRoom = __esm({
   "src/Prebuilt/components/Leave/LeaveRoom.tsx"() {
     "use strict";
     init_define_process_env();
     import_react93 = __toESM(require("react"));
-    import_react_use14 = require("react-use");
+    import_react_use15 = require("react-use");
     import_react_sdk48 = require("@100mslive/react-sdk");
     init_Theme();
     init_ToastManager();
@@ -10226,7 +10245,7 @@ var init_LeaveRoom = __esm({
     LeaveRoom = ({ screenType }) => {
       const isConnected = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectIsConnectedToRoom);
       const permissions = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectPermissions);
-      const isMobile = (0, import_react_use14.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use15.useMedia)(config.media.md);
       const rolesMap = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectRolesMap);
       const streamingPermissionRoles = Object.keys(rolesMap).filter((roleName) => {
         const roleObj = rolesMap[roleName];
@@ -11728,13 +11747,13 @@ var init_DesktopOptions = __esm({
 });
 
 // src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx
-var import_react108, import_react_use15, import_react_sdk59, import_react_icons48, MODALS2, MwebOptions;
+var import_react108, import_react_use16, import_react_sdk59, import_react_icons48, MODALS2, MwebOptions;
 var init_MwebOptions = __esm({
   "src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx"() {
     "use strict";
     init_define_process_env();
     import_react108 = __toESM(require("react"));
-    import_react_use15 = require("react-use");
+    import_react_use16 = require("react-use");
     import_react_sdk59 = require("@100mslive/react-sdk");
     import_react_icons48 = require("@100mslive/react-icons");
     init_src();
@@ -11781,6 +11800,8 @@ var init_MwebOptions = __esm({
       const peerCount = (0, import_react_sdk59.useHMSStore)(import_react_sdk59.selectPeerCount);
       const emojiCardRef = (0, import_react108.useRef)(null);
       const { isBRBOn, toggleBRB, isHandRaised, toggleHandRaise } = useMyMetadata();
+      const { toggleAudio, toggleVideo } = (0, import_react_sdk59.useAVToggle)();
+      const noAVPermissions = !(toggleAudio || toggleVideo);
       useDropdownList({ open: openModals.size > 0 || openOptionsSheet || openSettingsSheet, name: "MoreSettings" });
       const updateState = (modalName, value) => {
         setOpenModals((modals) => {
@@ -11793,7 +11814,7 @@ var init_MwebOptions = __esm({
           return copy;
         });
       };
-      (0, import_react_use15.useClickAway)(emojiCardRef, () => setShowEmojiCard(false));
+      (0, import_react_use16.useClickAway)(emojiCardRef, () => setShowEmojiCard(false));
       return /* @__PURE__ */ import_react108.default.createElement(import_react108.default.Fragment, null, /* @__PURE__ */ import_react108.default.createElement(Sheet.Root, { open: openOptionsSheet, onOpenChange: setOpenOptionsSheet }, /* @__PURE__ */ import_react108.default.createElement(Tooltip, { title: "More options" }, /* @__PURE__ */ import_react108.default.createElement(Sheet.Trigger, { asChild: true, "data-testid": "more_settings_btn" }, /* @__PURE__ */ import_react108.default.createElement(IconButton_default, null, /* @__PURE__ */ import_react108.default.createElement(import_react_icons48.DragHandleIcon, null)))), /* @__PURE__ */ import_react108.default.createElement(Sheet.Content, { css: { bg: "$surface_dim", pb: "$14" } }, /* @__PURE__ */ import_react108.default.createElement(
         Sheet.Title,
         {
@@ -11837,7 +11858,7 @@ var init_MwebOptions = __esm({
           /* @__PURE__ */ import_react108.default.createElement(import_react_icons48.PeopleIcon, null),
           /* @__PURE__ */ import_react108.default.createElement(ActionTile.Title, null, "Participants")
         ),
-        screenType !== "hls_live_streaming" ? /* @__PURE__ */ import_react108.default.createElement(
+        !noAVPermissions ? /* @__PURE__ */ import_react108.default.createElement(
           ActionTile.Root,
           {
             active: isHandRaised,
@@ -11935,7 +11956,6 @@ var init_MwebOptions = __esm({
       ), showEmojiCard && /* @__PURE__ */ import_react108.default.createElement(
         Box,
         {
-          onClick: () => setShowEmojiCard(false),
           ref: emojiCardRef,
           css: {
             maxWidth: "100%",
@@ -11976,13 +11996,13 @@ var init_MwebOptions = __esm({
 });
 
 // src/Prebuilt/components/MoreSettings/MoreSettings.tsx
-var import_react109, import_react_use16, MoreSettings;
+var import_react109, import_react_use17, MoreSettings;
 var init_MoreSettings = __esm({
   "src/Prebuilt/components/MoreSettings/MoreSettings.tsx"() {
     "use strict";
     init_define_process_env();
     import_react109 = __toESM(require("react"));
-    import_react_use16 = require("react-use");
+    import_react_use17 = require("react-use");
     init_DesktopOptions();
     init_MwebOptions();
     init_src();
@@ -11990,7 +12010,7 @@ var init_MoreSettings = __esm({
       elements,
       screenType
     }) => {
-      const isMobile = (0, import_react_use16.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use17.useMedia)(config.media.md);
       return isMobile ? /* @__PURE__ */ import_react109.default.createElement(MwebOptions, { elements, screenType }) : /* @__PURE__ */ import_react109.default.createElement(DesktopOptions, { elements, screenType });
     };
   }
@@ -12007,13 +12027,20 @@ var init_RaiseHand = __esm({
     import_react_icons49 = require("@100mslive/react-icons");
     init_Tooltip2();
     init_IconButton3();
-    init_useMetadata();
     RaiseHand = () => {
-      var _a7;
-      const { toggleHandRaise } = useMyMetadata();
-      const localPeer = (0, import_react_sdk60.useHMSStore)(import_react_sdk60.selectLocalPeer);
-      const isHandRaised = ((_a7 = (0, import_react_sdk60.useHMSStore)((0, import_react_sdk60.selectPeerMetadata)(localPeer.id))) == null ? void 0 : _a7.isHandRaised) || false;
-      return /* @__PURE__ */ import_react110.default.createElement(Tooltip, { title: isHandRaised ? "Lower hand" : "Raise hand" }, /* @__PURE__ */ import_react110.default.createElement(IconButton_default, { active: !isHandRaised, onClick: toggleHandRaise }, /* @__PURE__ */ import_react110.default.createElement(import_react_icons49.HandIcon, null)));
+      const localPeerId = (0, import_react_sdk60.useHMSStore)(import_react_sdk60.selectLocalPeerID);
+      const isHandRaised = (0, import_react_sdk60.useHMSStore)((0, import_react_sdk60.selectHasPeerHandRaised)(localPeerId));
+      const actions = (0, import_react_sdk60.useHMSActions)();
+      return /* @__PURE__ */ import_react110.default.createElement(Tooltip, { title: isHandRaised ? "Lower hand" : "Raise hand" }, /* @__PURE__ */ import_react110.default.createElement(
+        IconButton_default,
+        {
+          active: !isHandRaised,
+          onClick: () => {
+            isHandRaised ? actions.lowerLocalPeerHand() : actions.raiseLocalPeerHand();
+          }
+        },
+        /* @__PURE__ */ import_react110.default.createElement(import_react_icons49.HandIcon, null)
+      ));
     };
   }
 });
@@ -12762,13 +12789,13 @@ var init_RoleOptions = __esm({
 function itemKey(index, data3) {
   return data3.peerList[index].id;
 }
-var import_react120, import_react_use17, import_react_window, ROW_HEIGHT, VirtualizedParticipantItem, RoleAccordion;
+var import_react120, import_react_use18, import_react_window, ROW_HEIGHT, VirtualizedParticipantItem, RoleAccordion;
 var init_RoleAccordion = __esm({
   "src/Prebuilt/components/Footer/RoleAccordion.tsx"() {
     "use strict";
     init_define_process_env();
     import_react120 = __toESM(require("react"));
-    import_react_use17 = require("react-use");
+    import_react_use18 = require("react-use");
     import_react_window = require("react-window");
     init_Accordion2();
     init_Layout();
@@ -12787,7 +12814,7 @@ var init_RoleAccordion = __esm({
       filter,
       isHandRaisedAccordion = false
     }) => {
-      const [ref, { width }] = (0, import_react_use17.useMeasure)();
+      const [ref, { width }] = (0, import_react_use18.useMeasure)();
       const showAcordion = (filter == null ? void 0 : filter.search) ? peerList.some((peer) => peer.name.toLowerCase().includes(filter.search)) : true;
       if (!showAcordion || isHandRaisedAccordion && (filter == null ? void 0 : filter.search) || peerList.length === 0) {
         return null;
@@ -12841,13 +12868,13 @@ var init_RoleAccordion = __esm({
 });
 
 // src/Prebuilt/components/Footer/ParticipantList.jsx
-var import_react121, import_react_use18, import_react_sdk65, import_react_icons56, ParticipantList, ParticipantCount, VirtualizedParticipants, Participant, ParticipantActions, ParticipantMoreActions, ParticipantSearch;
+var import_react121, import_react_use19, import_react_sdk65, import_react_icons56, ParticipantList, ParticipantCount, VirtualizedParticipants, Participant, ParticipantActions, ParticipantMoreActions, ParticipantSearch;
 var init_ParticipantList = __esm({
   "src/Prebuilt/components/Footer/ParticipantList.jsx"() {
     "use strict";
     init_define_process_env();
     import_react121 = __toESM(require("react"));
-    import_react_use18 = require("react-use");
+    import_react_use19 = require("react-use");
     import_react_sdk65 = require("@100mslive/react-sdk");
     import_react_icons56 = require("@100mslive/react-icons");
     init_src();
@@ -12864,10 +12891,7 @@ var init_ParticipantList = __esm({
       const [filter, setFilter] = (0, import_react121.useState)();
       const { participants, isConnected, peerCount } = useParticipants2(filter);
       const peersOrderedByRoles = {};
-      const handRaisedPeers = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeersByCondition)((peer) => {
-        var _a7;
-        return (_a7 = JSON.parse(peer.metadata || "{}")) == null ? void 0 : _a7.isHandRaised;
-      }));
+      const handRaisedPeers = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectHandRaisedPeers);
       participants.forEach((participant) => {
         if (peersOrderedByRoles[participant.roleName] === void 0) {
           peersOrderedByRoles[participant.roleName] = [];
@@ -12925,7 +12949,7 @@ var init_ParticipantList = __esm({
           "data-testid": "participant_list"
         },
         /* @__PURE__ */ import_react121.default.createElement(import_react_icons56.PeopleIcon, null),
-        /* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { mx: "$4", c: "inherit" } }, peerCount)
+        /* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { mx: "$4", c: "inherit" } }, getFormattedCount(peerCount))
       );
     };
     VirtualizedParticipants = ({ peersOrderedByRoles = {}, isConnected, filter, handRaisedList = [] }) => {
@@ -12986,9 +13010,9 @@ var init_ParticipantList = __esm({
       );
     };
     ParticipantActions = import_react121.default.memo(({ peerId, role, isLocal }) => {
-      var _a7, _b7;
-      const isHandRaised = (_a7 = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeerMetadata)(peerId))) == null ? void 0 : _a7.isHandRaised;
-      const canChangeRole = (_b7 = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions)) == null ? void 0 : _b7.changeRole;
+      var _a7;
+      const isHandRaised = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectHasPeerHandRaised)(peerId));
+      const canChangeRole = (_a7 = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions)) == null ? void 0 : _a7.changeRole;
       const shouldShowMoreActions = canChangeRole;
       const isAudioMuted = !(0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectIsPeerAudioEnabled)(peerId));
       return /* @__PURE__ */ import_react121.default.createElement(
@@ -13019,7 +13043,7 @@ var init_ParticipantList = __esm({
           },
           /* @__PURE__ */ import_react121.default.createElement(import_react_icons56.MicOffIcon, { height: 19, width: 19 })
         ) : null,
-        shouldShowMoreActions && !isInternalRole(role) && !isLocal ? /* @__PURE__ */ import_react121.default.createElement(ParticipantMoreActions, { peerId, role }) : null
+        shouldShowMoreActions && !isLocal ? /* @__PURE__ */ import_react121.default.createElement(ParticipantMoreActions, { peerId, role }) : null
       );
     });
     ParticipantMoreActions = ({ peerId, role }) => {
@@ -13086,8 +13110,8 @@ var init_ParticipantList = __esm({
     };
     ParticipantSearch = ({ onSearch, placeholder, inSidePane = false }) => {
       const [value, setValue] = import_react121.default.useState("");
-      const isMobile = (0, import_react_use18.useMedia)(config.media.md);
-      (0, import_react_use18.useDebounce)(
+      const isMobile = (0, import_react_use19.useMedia)(config.media.md);
+      (0, import_react_use19.useDebounce)(
         () => {
           onSearch(value);
         },
@@ -13130,14 +13154,15 @@ var init_ParticipantList = __esm({
 });
 
 // src/Prebuilt/components/Footer/Footer.tsx
-var import_react122, import_react_use19, import_chat, VirtualBackground3, Footer2;
+var import_react122, import_react_use20, import_chat, import_react_sdk66, VirtualBackground3, Footer2;
 var init_Footer3 = __esm({
   "src/Prebuilt/components/Footer/Footer.tsx"() {
     "use strict";
     init_define_process_env();
     import_react122 = __toESM(require("react"));
-    import_react_use19 = require("react-use");
+    import_react_use20 = require("react-use");
     import_chat = require("@100mslive/types-prebuilt/elements/chat");
+    import_react_sdk66 = require("@100mslive/react-sdk");
     init_src();
     init_AudioVideoToggle();
     init_EmojiReaction();
@@ -13155,9 +13180,11 @@ var init_Footer3 = __esm({
       elements
     }) => {
       var _a7, _b7;
-      const isMobile = (0, import_react_use19.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use20.useMedia)(config.media.md);
       const isOverlayChat = !!((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay);
       const openByDefault = ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.initial_state) === import_chat.Chat_ChatState.CHAT_STATE_OPEN;
+      const { toggleAudio, toggleVideo } = (0, import_react_sdk66.useAVToggle)();
+      const noAVPermissions = !(toggleAudio || toggleVideo);
       const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
       const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
       (0, import_react122.useEffect)(() => {
@@ -13204,7 +13231,7 @@ var init_Footer3 = __esm({
               }
             }
           },
-          isMobile ? /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, screenType === "hls_live_streaming" ? /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null) : null, (elements == null ? void 0 : elements.chat) && /* @__PURE__ */ import_react122.default.createElement(ChatToggle, null), /* @__PURE__ */ import_react122.default.createElement(MoreSettings, { elements, screenType })) : /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, /* @__PURE__ */ import_react122.default.createElement(ScreenshareToggle, null), /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null), (elements == null ? void 0 : elements.emoji_reactions) && /* @__PURE__ */ import_react122.default.createElement(EmojiReaction, null), /* @__PURE__ */ import_react122.default.createElement(LeaveRoom, { screenType }))
+          isMobile ? /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, noAVPermissions ? /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null) : null, (elements == null ? void 0 : elements.chat) && /* @__PURE__ */ import_react122.default.createElement(ChatToggle, null), /* @__PURE__ */ import_react122.default.createElement(MoreSettings, { elements, screenType })) : /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, /* @__PURE__ */ import_react122.default.createElement(ScreenshareToggle, null), /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null), (elements == null ? void 0 : elements.emoji_reactions) && /* @__PURE__ */ import_react122.default.createElement(EmojiReaction, null), /* @__PURE__ */ import_react122.default.createElement(LeaveRoom, { screenType }))
         ),
         /* @__PURE__ */ import_react122.default.createElement(Footer.Right, null, !isMobile && (elements == null ? void 0 : elements.chat) && /* @__PURE__ */ import_react122.default.createElement(ChatToggle, null), (elements == null ? void 0 : elements.participant_list) && /* @__PURE__ */ import_react122.default.createElement(ParticipantCount, null), /* @__PURE__ */ import_react122.default.createElement(MoreSettings, { elements, screenType }))
       );
@@ -13214,9 +13241,9 @@ var init_Footer3 = __esm({
 
 // src/Prebuilt/components/Notifications/HLSFailureModal.jsx
 function HLSFailureModal() {
-  const { hlsError } = (0, import_react_sdk66.useHMSStore)(import_react_sdk66.selectHLSState).error || false;
+  const { hlsError } = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectHLSState).error || false;
   const [openModal, setOpenModal] = (0, import_react123.useState)(!!hlsError);
-  const hmsActions = (0, import_react_sdk66.useHMSActions)();
+  const hmsActions = (0, import_react_sdk67.useHMSActions)();
   const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
   const startHLS = (0, import_react123.useCallback)(() => __async(this, null, function* () {
     try {
@@ -13258,13 +13285,13 @@ function HLSFailureModal() {
     ), /* @__PURE__ */ import_react123.default.createElement(Text, { variant: "sm", css: { mb: "$10", color: "$on_surface_medium" } }, "Something went wrong and your live broadcast failed. Please try again."), /* @__PURE__ */ import_react123.default.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ import_react123.default.createElement(Button, { outlined: true, variant: "standard", css: { w: "100%" }, onClick: () => setOpenModal(false) }, "Dismiss"), /* @__PURE__ */ import_react123.default.createElement(Button, { css: { w: "100%" }, onClick: startHLS }, "Go Live"))))
   ) : null;
 }
-var import_react123, import_react_sdk66;
+var import_react123, import_react_sdk67;
 var init_HLSFailureModal = __esm({
   "src/Prebuilt/components/Notifications/HLSFailureModal.jsx"() {
     "use strict";
     init_define_process_env();
     import_react123 = __toESM(require("react"));
-    import_react_sdk66 = require("@100mslive/react-sdk");
+    import_react_sdk67 = require("@100mslive/react-sdk");
     init_Button2();
     init_Layout();
     init_Modal();
@@ -13298,15 +13325,15 @@ var init_useVideoTileLayout = __esm({
 });
 
 // src/Prebuilt/components/InsetTile.tsx
-var import_react125, import_react_draggable, import_react_use20, import_react_sdk67, import_react_icons57, MinimisedTile, insetHeightPx, insetMaxWidthPx, defaultMobileAspectRatio, desktopAspectRatio, InsetTile;
+var import_react125, import_react_draggable, import_react_use21, import_react_sdk68, import_react_icons57, MinimisedTile, insetHeightPx, insetMaxWidthPx, defaultMobileAspectRatio, desktopAspectRatio, InsetTile;
 var init_InsetTile = __esm({
   "src/Prebuilt/components/InsetTile.tsx"() {
     "use strict";
     init_define_process_env();
     import_react125 = __toESM(require("react"));
     import_react_draggable = __toESM(require("react-draggable"));
-    import_react_use20 = require("react-use");
-    import_react_sdk67 = require("@100mslive/react-sdk");
+    import_react_use21 = require("react-use");
+    import_react_sdk68 = require("@100mslive/react-sdk");
     import_react_icons57 = require("@100mslive/react-icons");
     init_Layout();
     init_Text2();
@@ -13333,12 +13360,12 @@ var init_InsetTile = __esm({
     defaultMobileAspectRatio = 9 / 16;
     desktopAspectRatio = 1 / defaultMobileAspectRatio;
     InsetTile = () => {
-      const isMobile = (0, import_react_use20.useMedia)(config.media.md);
-      const isLandscape = (0, import_react_use20.useMedia)(config.media.ls);
-      const localPeer = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectLocalPeer);
+      const isMobile = (0, import_react_use21.useMedia)(config.media.md);
+      const isLandscape = (0, import_react_use21.useMedia)(config.media.ls);
+      const localPeer = (0, import_react_sdk68.useHMSStore)(import_react_sdk68.selectLocalPeer);
       const [minimised, setMinimised] = useSetAppDataByKey(APP_DATA.minimiseInset);
-      const videoTrack = (0, import_react_sdk67.useHMSStore)((0, import_react_sdk67.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
-      const isAllowedToPublish = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectIsAllowedToPublish);
+      const videoTrack = (0, import_react_sdk68.useHMSStore)((0, import_react_sdk68.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
+      const isAllowedToPublish = (0, import_react_sdk68.useHMSStore)(import_react_sdk68.selectIsAllowedToPublish);
       const videoTileProps = useVideoTileContext();
       let aspectRatio = isMobile ? defaultMobileAspectRatio : desktopAspectRatio;
       if ((videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) && !isMobile) {
@@ -13509,21 +13536,21 @@ var init_Grid = __esm({
 });
 
 // src/Prebuilt/components/hooks/useTileLayout.tsx
-var import_react128, import_react_use21, import_react_sdk68, aspectRatioConfig, usePagesWithTiles, useTileLayout;
+var import_react128, import_react_use22, import_react_sdk69, aspectRatioConfig, usePagesWithTiles, useTileLayout;
 var init_useTileLayout = __esm({
   "src/Prebuilt/components/hooks/useTileLayout.tsx"() {
     "use strict";
     init_define_process_env();
     import_react128 = require("react");
-    import_react_use21 = require("react-use");
-    import_react_sdk68 = require("@100mslive/react-sdk");
+    import_react_use22 = require("react-use");
+    import_react_sdk69 = require("@100mslive/react-sdk");
     init_Theme();
     aspectRatioConfig = { default: [1 / 1, 4 / 3, 16 / 9], mobile: [1 / 1, 3 / 4, 9 / 16] };
     usePagesWithTiles = ({ peers, maxTileCount }) => {
-      const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
-      const tracksMap = vanillaStore.getState(import_react_sdk68.selectTracksMap);
+      const vanillaStore = (0, import_react_sdk69.useHMSVanillaStore)();
+      const tracksMap = vanillaStore.getState(import_react_sdk69.selectTracksMap);
       const peersWithTiles = (0, import_react128.useMemo)(
-        () => (0, import_react_sdk68.getPeersWithTiles)(peers, tracksMap, () => false),
+        () => (0, import_react_sdk69.getPeersWithTiles)(peers, tracksMap, () => false),
         [peers, tracksMap]
       );
       const noOfPages = Math.ceil(peersWithTiles.length / maxTileCount);
@@ -13546,9 +13573,9 @@ var init_useTileLayout = __esm({
       maxTileCount,
       edgeToEdge = false
     }) => {
-      const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
-      const [ref, { width, height }] = (0, import_react_use21.useMeasure)();
-      const isMobile = (0, import_react_use21.useMedia)(config.media.lg);
+      const vanillaStore = (0, import_react_sdk69.useHMSVanillaStore)();
+      const [ref, { width, height }] = (0, import_react_use22.useMeasure)();
+      const isMobile = (0, import_react_use22.useMedia)(config.media.lg);
       const [pagesWithTiles, setPagesWithTiles] = (0, import_react128.useState)([]);
       (0, import_react128.useEffect)(() => {
         if (width === 0 || height === 0) {
@@ -13619,8 +13646,8 @@ var init_useTileLayout = __esm({
 // src/Prebuilt/components/VideoLayouts/EqualProminence.tsx
 function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSize, edgeToEdge }) {
   var _a7;
-  const localPeer = (0, import_react_sdk69.useHMSStore)(import_react_sdk69.selectLocalPeer);
-  const isMobile = (0, import_react_use22.useMedia)(config.media.md);
+  const localPeer = (0, import_react_sdk70.useHMSStore)(import_react_sdk70.selectLocalPeer);
+  const isMobile = (0, import_react_use23.useMedia)(config.media.md);
   let maxTileCount = useUISettings(UI_SETTINGS.maxTileCount);
   maxTileCount = isMobile ? Math.min(maxTileCount, 6) : maxTileCount;
   let pageList = usePagesWithTiles({
@@ -13659,14 +13686,14 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
     }
   ), isInsetEnabled && pageList.length > 0 && pageList[0][0].peer.id !== (localPeer == null ? void 0 : localPeer.id) && /* @__PURE__ */ import_react129.default.createElement(InsetTile, null));
 }
-var import_react129, import_react_use22, import_react_sdk69;
+var import_react129, import_react_use23, import_react_sdk70;
 var init_EqualProminence = __esm({
   "src/Prebuilt/components/VideoLayouts/EqualProminence.tsx"() {
     "use strict";
     init_define_process_env();
     import_react129 = __toESM(require("react"));
-    import_react_use22 = require("react-use");
-    import_react_sdk69 = require("@100mslive/react-sdk");
+    import_react_use23 = require("react-use");
+    import_react_sdk70 = require("@100mslive/react-sdk");
     init_Layout();
     init_Theme();
     init_InsetTile();
@@ -13752,20 +13779,20 @@ var init_ProminenceLayout = __esm({
 });
 
 // src/Prebuilt/components/SecondaryTiles.tsx
-var import_react131, import_react_use23, SecondaryTiles;
+var import_react131, import_react_use24, SecondaryTiles;
 var init_SecondaryTiles = __esm({
   "src/Prebuilt/components/SecondaryTiles.tsx"() {
     "use strict";
     init_define_process_env();
     import_react131 = __toESM(require("react"));
-    import_react_use23 = require("react-use");
+    import_react_use24 = require("react-use");
     init_ProminenceLayout();
     init_Theme();
     init_Pagination2();
     init_useTileLayout();
     SecondaryTiles = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
       var _a7;
-      const isMobile = (0, import_react_use23.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use24.useMedia)(config.media.md);
       const maxTileCount = isMobile ? 2 : 4;
       const pagesWithTiles = usePagesWithTiles({ peers, maxTileCount });
       const [page, setPage] = (0, import_react131.useState)(0);
@@ -13843,7 +13870,7 @@ function RoleProminence({
 }) {
   var _a7;
   const { prominentPeers, secondaryPeers } = useRoleProminencePeers(prominentRoles, peers, isInsetEnabled);
-  const localPeer = (0, import_react_sdk70.useHMSStore)(import_react_sdk70.selectLocalPeer);
+  const localPeer = (0, import_react_sdk71.useHMSStore)(import_react_sdk71.selectLocalPeer);
   const maxTileCount = 4;
   const pageList = usePagesWithTiles({
     peers: prominentPeers,
@@ -13872,13 +13899,13 @@ function RoleProminence({
     }
   ), /* @__PURE__ */ import_react133.default.createElement(SecondaryTiles, { peers: secondaryPeers, isInsetEnabled, edgeToEdge }), isInsetEnabled && localPeer && !prominentPeers.includes(localPeer) && /* @__PURE__ */ import_react133.default.createElement(InsetTile, null));
 }
-var import_react133, import_react_sdk70;
+var import_react133, import_react_sdk71;
 var init_RoleProminence = __esm({
   "src/Prebuilt/components/VideoLayouts/RoleProminence.tsx"() {
     "use strict";
     init_define_process_env();
     import_react133 = __toESM(require("react"));
-    import_react_sdk70 = require("@100mslive/react-sdk");
+    import_react_sdk71 = require("@100mslive/react-sdk");
     init_InsetTile();
     init_Pagination2();
     init_SecondaryTiles();
@@ -13890,19 +13917,19 @@ var init_RoleProminence = __esm({
 });
 
 // src/Prebuilt/components/ScreenshareDisplay.jsx
-var import_react134, import_react_sdk71, import_react_icons59, ScreenshareDisplay;
+var import_react134, import_react_sdk72, import_react_icons59, ScreenshareDisplay;
 var init_ScreenshareDisplay = __esm({
   "src/Prebuilt/components/ScreenshareDisplay.jsx"() {
     "use strict";
     init_define_process_env();
     import_react134 = __toESM(require("react"));
-    import_react_sdk71 = require("@100mslive/react-sdk");
+    import_react_sdk72 = require("@100mslive/react-sdk");
     import_react_icons59 = require("@100mslive/react-icons");
     init_Button2();
     init_Layout();
     init_Text2();
     ScreenshareDisplay = () => {
-      const hmsActions = (0, import_react_sdk71.useHMSActions)();
+      const hmsActions = (0, import_react_sdk72.useHMSActions)();
       return /* @__PURE__ */ import_react134.default.createElement(
         Flex,
         {
@@ -13936,15 +13963,15 @@ var init_ScreenshareDisplay = __esm({
 });
 
 // src/Prebuilt/components/ScreenshareTile.jsx
-var import_react135, import_react_use24, import_screenfull2, import_react_sdk72, import_react_icons60, labelStyles, Tile2, ScreenshareTile, ScreenshareTile_default;
+var import_react135, import_react_use25, import_screenfull2, import_react_sdk73, import_react_icons60, labelStyles, Tile2, ScreenshareTile, ScreenshareTile_default;
 var init_ScreenshareTile = __esm({
   "src/Prebuilt/components/ScreenshareTile.jsx"() {
     "use strict";
     init_define_process_env();
     import_react135 = __toESM(require("react"));
-    import_react_use24 = require("react-use");
+    import_react_use25 = require("react-use");
     import_screenfull2 = __toESM(require("screenfull"));
-    import_react_sdk72 = require("@100mslive/react-sdk");
+    import_react_sdk73 = require("@100mslive/react-sdk");
     import_react_icons60 = require("@100mslive/react-icons");
     init_TileMenu2();
     init_Stats2();
@@ -13963,19 +13990,19 @@ var init_ScreenshareTile = __esm({
       flexShrink: 0
     };
     Tile2 = ({ peerId, width = "100%", height = "100%" }) => {
-      const isLocal = (0, import_react_sdk72.useHMSStore)(import_react_sdk72.selectLocalPeerID) === peerId;
-      const track = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareByPeerID)(peerId));
-      const peer = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectPeerByID)(peerId));
+      const isLocal = (0, import_react_sdk73.useHMSStore)(import_react_sdk73.selectLocalPeerID) === peerId;
+      const track = (0, import_react_sdk73.useHMSStore)((0, import_react_sdk73.selectScreenShareByPeerID)(peerId));
+      const peer = (0, import_react_sdk73.useHMSStore)((0, import_react_sdk73.selectPeerByID)(peerId));
       const isAudioOnly = useUISettings(UI_SETTINGS.isAudioOnly);
       const [isMouseHovered, setIsMouseHovered] = (0, import_react135.useState)(false);
       const showStatsOnTiles = useUISettings(UI_SETTINGS.showStatsOnTiles);
       const fullscreenRef = (0, import_react135.useRef)(null);
       const [fullscreen, setFullscreen] = (0, import_react135.useState)(false);
-      const isFullscreen = (0, import_react_use24.useFullscreen)(fullscreenRef, fullscreen, {
+      const isFullscreen = (0, import_react_use25.useFullscreen)(fullscreenRef, fullscreen, {
         onClose: () => setFullscreen(false)
       });
       const isFullScreenSupported = import_screenfull2.default.isEnabled;
-      const audioTrack = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareAudioByPeerID)(peer == null ? void 0 : peer.id));
+      const audioTrack = (0, import_react_sdk73.useHMSStore)((0, import_react_sdk73.selectScreenShareAudioByPeerID)(peer == null ? void 0 : peer.id));
       if (isLocal && !["browser", "window", "application"].includes(track == null ? void 0 : track.displaySurface)) {
         return /* @__PURE__ */ import_react135.default.createElement(ScreenshareDisplay, null);
       }
@@ -14029,14 +14056,14 @@ var init_ScreenshareTile = __esm({
 });
 
 // src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx
-var import_react136, import_react_use25, import_react_sdk73, ScreenshareLayout;
+var import_react136, import_react_use26, import_react_sdk74, ScreenshareLayout;
 var init_ScreenshareLayout = __esm({
   "src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx"() {
     "use strict";
     init_define_process_env();
     import_react136 = __toESM(require("react"));
-    import_react_use25 = require("react-use");
-    import_react_sdk73 = require("@100mslive/react-sdk");
+    import_react_use26 = require("react-use");
+    import_react_sdk74 = require("@100mslive/react-sdk");
     init_Theme();
     init_Pagination2();
     init_ScreenshareTile();
@@ -14046,11 +14073,11 @@ var init_ScreenshareLayout = __esm({
     init_constants();
     ScreenshareLayout = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
       var _a7;
-      const peersSharing = (0, import_react_sdk73.useHMSStore)(import_react_sdk73.selectPeersScreenSharing);
+      const peersSharing = (0, import_react_sdk74.useHMSStore)(import_react_sdk74.selectPeersScreenSharing);
       const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
       const [page, setPage] = (0, import_react136.useState)(0);
       const activeSharePeer = peersSharing[page];
-      const isMobile = (0, import_react_use25.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use26.useMedia)(config.media.md);
       const secondaryPeers = (0, import_react136.useMemo)(
         () => isMobile ? activeSharePeer ? [activeSharePeer, ...peers.filter((p) => p.id !== (activeSharePeer == null ? void 0 : activeSharePeer.id))] : peers : peers.filter((p) => p.id !== (activeSharePeer == null ? void 0 : activeSharePeer.id)),
         [activeSharePeer, peers, isMobile]
@@ -14075,12 +14102,12 @@ var init_ScreenshareLayout = __esm({
 });
 
 // src/Prebuilt/common/PeersSorter.ts
-var import_react_sdk74, PeersSorter, PeersSorter_default;
+var import_react_sdk75, PeersSorter, PeersSorter_default;
 var init_PeersSorter = __esm({
   "src/Prebuilt/common/PeersSorter.ts"() {
     "use strict";
     init_define_process_env();
-    import_react_sdk74 = require("@100mslive/react-sdk");
+    import_react_sdk75 = require("@100mslive/react-sdk");
     PeersSorter = class {
       constructor(store) {
         this.storeUnsubscribe = void 0;
@@ -14101,7 +14128,7 @@ var init_PeersSorter = __esm({
             }
           });
           if (!this.storeUnsubscribe) {
-            this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange, import_react_sdk74.selectDominantSpeaker);
+            this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange, import_react_sdk75.selectDominantSpeaker);
           }
           this.moveSpeakerToFront(this.speaker);
         };
@@ -14164,13 +14191,13 @@ var init_PeersSorter = __esm({
 });
 
 // src/Prebuilt/components/VideoLayouts/GridLayout.tsx
-var import_react137, import_react_sdk75, GridLayout;
+var import_react137, import_react_sdk76, GridLayout;
 var init_GridLayout = __esm({
   "src/Prebuilt/components/VideoLayouts/GridLayout.tsx"() {
     "use strict";
     init_define_process_env();
     import_react137 = __toESM(require("react"));
-    import_react_sdk75 = require("@100mslive/react-sdk");
+    import_react_sdk76 = require("@100mslive/react-sdk");
     init_EqualProminence();
     init_RoleProminence();
     init_ScreenshareLayout();
@@ -14188,9 +14215,9 @@ var init_GridLayout = __esm({
       edge_to_edge = false,
       hide_metadata_on_tile = false
     }) => {
-      const peerSharing = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeerScreenSharing);
+      const peerSharing = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeerScreenSharing);
       const pinnedTrack = usePinnedTrack();
-      const peers = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeers);
+      const peers = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeers);
       const isRoleProminence = prominentRoles.length && peers.some(
         (peer) => peer.roleName && prominentRoles.includes(peer.roleName) && (peer.videoTrack || peer.audioTrack)
       ) || pinnedTrack;
@@ -14200,7 +14227,7 @@ var init_GridLayout = __esm({
         }
         return peers;
       }, [isInsetEnabled, isRoleProminence, peerSharing, peers]);
-      const vanillaStore = (0, import_react_sdk75.useHMSVanillaStore)();
+      const vanillaStore = (0, import_react_sdk76.useHMSVanillaStore)();
       const [sortedPeers, setSortedPeers] = (0, import_react137.useState)(updatedPeers);
       const peersSorter = (0, import_react137.useMemo)(() => new PeersSorter_default(vanillaStore), [vanillaStore]);
       const [pageSize, setPageSize] = (0, import_react137.useState)(0);
@@ -14261,13 +14288,13 @@ var init_GridLayout = __esm({
 });
 
 // src/Prebuilt/layouts/EmbedView.jsx
-var import_react138, import_react_sdk76, EmbedView, EmbebScreenShareView, EmbedComponent;
+var import_react138, import_react_sdk77, EmbedView, EmbebScreenShareView, EmbedComponent;
 var init_EmbedView = __esm({
   "src/Prebuilt/layouts/EmbedView.jsx"() {
     "use strict";
     init_define_process_env();
     import_react138 = __toESM(require("react"));
-    import_react_sdk76 = require("@100mslive/react-sdk");
+    import_react_sdk77 = require("@100mslive/react-sdk");
     init_SecondaryTiles();
     init_ProminenceLayout();
     init_Layout();
@@ -14277,8 +14304,8 @@ var init_EmbedView = __esm({
       return /* @__PURE__ */ import_react138.default.createElement(EmbebScreenShareView, null, /* @__PURE__ */ import_react138.default.createElement(EmbedComponent, null));
     };
     EmbebScreenShareView = ({ children }) => {
-      const peers = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeers);
-      const peerPresenting = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeerScreenSharing);
+      const peers = (0, import_react_sdk77.useHMSStore)(import_react_sdk77.selectPeers);
+      const peerPresenting = (0, import_react_sdk77.useHMSStore)(import_react_sdk77.selectPeerScreenSharing);
       const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
       const smallTilePeers = (0, import_react138.useMemo)(() => {
         const smallTilePeers2 = peers.filter((peer) => peer.id !== (peerPresenting == null ? void 0 : peerPresenting.id));
@@ -14293,7 +14320,7 @@ var init_EmbedView = __esm({
       return /* @__PURE__ */ import_react138.default.createElement(ProminenceLayout.Root, null, /* @__PURE__ */ import_react138.default.createElement(ProminenceLayout.ProminentSection, null, children), /* @__PURE__ */ import_react138.default.createElement(SecondaryTiles, { peers: smallTilePeers }));
     };
     EmbedComponent = () => {
-      const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk76.useScreenShare)(import_react_sdk76.throwErrorHandler);
+      const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk77.useScreenShare)(import_react_sdk77.throwErrorHandler);
       const [embedConfig, setEmbedConfig] = useSetAppDataByKey(APP_DATA.embedConfig);
       const [wasScreenShared, setWasScreenShared] = (0, import_react138.useState)(false);
       const screenShareAttemptInProgress = (0, import_react138.useRef)(false);
@@ -14343,13 +14370,13 @@ var init_EmbedView = __esm({
 });
 
 // src/Prebuilt/layouts/PDFView.jsx
-var import_react139, import_react_sdk77, PDFView, PDFEmbedComponent;
+var import_react139, import_react_sdk78, PDFView, PDFEmbedComponent;
 var init_PDFView = __esm({
   "src/Prebuilt/layouts/PDFView.jsx"() {
     "use strict";
     init_define_process_env();
     import_react139 = __toESM(require("react"));
-    import_react_sdk77 = require("@100mslive/react-sdk");
+    import_react_sdk78 = require("@100mslive/react-sdk");
     init_Layout();
     init_Theme();
     init_EmbedView();
@@ -14363,7 +14390,7 @@ var init_PDFView = __esm({
       const themeType = useTheme().themeType;
       const [isPDFLoaded, setIsPDFLoaded] = (0, import_react139.useState)(false);
       let pdfJSURL = define_process_env_default.REACT_APP_PDFJS_IFRAME_URL;
-      const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk77.useScreenShare)(import_react_sdk77.throwErrorHandler);
+      const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk78.useScreenShare)(import_react_sdk78.throwErrorHandler);
       const [pdfConfig, setPDFConfig] = useSetAppDataByKey(APP_DATA.pdfConfig);
       if (pdfConfig.url && !pdfConfig.file) {
         pdfJSURL = pdfJSURL + "?file=" + encodeURIComponent(pdfConfig.url);
@@ -14452,25 +14479,25 @@ var init_empty_chat = __esm({
 });
 
 // src/Prebuilt/components/hooks/useSetPinnedMessage.js
-var import_react140, import_react_sdk78, useSetPinnedMessage;
+var import_react140, import_react_sdk79, useSetPinnedMessage;
 var init_useSetPinnedMessage = __esm({
   "src/Prebuilt/components/hooks/useSetPinnedMessage.js"() {
     "use strict";
     init_define_process_env();
     import_react140 = require("react");
-    import_react_sdk78 = require("@100mslive/react-sdk");
+    import_react_sdk79 = require("@100mslive/react-sdk");
     init_ToastManager();
     init_constants();
     useSetPinnedMessage = () => {
-      const hmsActions = (0, import_react_sdk78.useHMSActions)();
-      const vanillaStore = (0, import_react_sdk78.useHMSVanillaStore)();
-      const pinnedMessage = (0, import_react_sdk78.useHMSStore)(import_react_sdk78.selectSessionMetadata);
+      const hmsActions = (0, import_react_sdk79.useHMSActions)();
+      const vanillaStore = (0, import_react_sdk79.useHMSVanillaStore)();
+      const pinnedMessage = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectSessionMetadata);
       const setPinnedMessage = (0, import_react140.useCallback)(
         /**
          * @param {import("@100mslive/react-sdk").HMSMessage | undefined} message
          */
         (message) => __async(void 0, null, function* () {
-          const peerName = vanillaStore.getState((0, import_react_sdk78.selectPeerNameByID)(message == null ? void 0 : message.sender)) || (message == null ? void 0 : message.senderName);
+          const peerName = vanillaStore.getState((0, import_react_sdk79.selectPeerNameByID)(message == null ? void 0 : message.sender)) || (message == null ? void 0 : message.senderName);
           const newPinnedMessage = message ? peerName ? `${peerName}: ${message.message}` : message.message : null;
           if (newPinnedMessage !== pinnedMessage) {
             yield hmsActions.sessionStore.set(SESSION_STORE_KEY.PINNED_MESSAGE, newPinnedMessage).catch((err) => ToastManager.addToast({ title: err.description }));
@@ -14484,17 +14511,17 @@ var init_useSetPinnedMessage = __esm({
 });
 
 // src/Prebuilt/components/Chat/ChatBody.jsx
-var import_react141, import_react_intersection_observer, import_react_use26, import_react_virtualized_auto_sizer, import_react_window2, import_react_sdk79, import_react_icons61, formatTime2, MessageTypeContainer, MessageType, URL_REGEX, Link3, AnnotisedMessage, getMessageType, ChatActions, SenderName, ChatMessage, ChatList, VirtualizedChatMessages, ChatBody;
+var import_react141, import_react_intersection_observer, import_react_use27, import_react_virtualized_auto_sizer, import_react_window2, import_react_sdk80, import_react_icons61, formatTime2, MessageTypeContainer, MessageType, URL_REGEX, Link3, AnnotisedMessage, getMessageType, ChatActions, SenderName, ChatMessage, ChatList, VirtualizedChatMessages, ChatBody;
 var init_ChatBody = __esm({
   "src/Prebuilt/components/Chat/ChatBody.jsx"() {
     "use strict";
     init_define_process_env();
     import_react141 = __toESM(require("react"));
     import_react_intersection_observer = require("react-intersection-observer");
-    import_react_use26 = require("react-use");
+    import_react_use27 = require("react-use");
     import_react_virtualized_auto_sizer = __toESM(require("react-virtualized-auto-sizer"));
     import_react_window2 = require("react-window");
-    import_react_sdk79 = require("@100mslive/react-sdk");
+    import_react_sdk80 = require("@100mslive/react-sdk");
     import_react_icons61 = require("@100mslive/react-icons");
     init_Dropdown2();
     init_IconButton2();
@@ -14539,8 +14566,8 @@ var init_ChatBody = __esm({
       );
     };
     MessageType = ({ roles, hasCurrentUserSent, receiver }) => {
-      const peerName = (0, import_react_sdk79.useHMSStore)((0, import_react_sdk79.selectPeerNameByID)(receiver));
-      const localPeerRoleName = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerRoleName);
+      const peerName = (0, import_react_sdk80.useHMSStore)((0, import_react_sdk80.selectPeerNameByID)(receiver));
+      const localPeerRoleName = (0, import_react_sdk80.useHMSStore)(import_react_sdk80.selectLocalPeerRoleName);
       if (receiver) {
         return /* @__PURE__ */ import_react141.default.createElement(
           MessageTypeContainer,
@@ -14610,12 +14637,12 @@ var init_ChatBody = __esm({
           setRowHeight(index, rowRef.current.clientHeight);
         }
       }, [index, setRowHeight]);
-      const isMobile = (0, import_react_use26.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use27.useMedia)(config.media.md);
       const { elements } = useRoomLayoutConferencingScreen();
       const isOverlay = ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) && isMobile;
-      const hmsActions = (0, import_react_sdk79.useHMSActions)();
-      const localPeerId = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerID);
-      const permissions = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectPermissions);
+      const hmsActions = (0, import_react_sdk80.useHMSActions)();
+      const localPeerId = (0, import_react_sdk80.useHMSStore)(import_react_sdk80.selectLocalPeerID);
+      const permissions = (0, import_react_sdk80.useHMSStore)(import_react_sdk80.selectPermissions);
       const messageType = getMessageType({
         roles: message.recipientRoles,
         receiver: message.recipientPeer
@@ -14785,10 +14812,10 @@ var init_ChatBody = __esm({
     });
     ChatBody = import_react141.default.forwardRef(({ role, peerId, scrollToBottom }, listRef) => {
       var _a7;
-      const storeMessageSelector = role ? (0, import_react_sdk79.selectMessagesByRole)(role) : peerId ? (0, import_react_sdk79.selectMessagesByPeerID)(peerId) : import_react_sdk79.selectHMSMessages;
-      let messages = (0, import_react_sdk79.useHMSStore)(storeMessageSelector);
+      const storeMessageSelector = role ? (0, import_react_sdk80.selectMessagesByRole)(role) : peerId ? (0, import_react_sdk80.selectMessagesByPeerID)(peerId) : import_react_sdk80.selectHMSMessages;
+      let messages = (0, import_react_sdk80.useHMSStore)(storeMessageSelector);
       messages = (0, import_react141.useMemo)(() => (messages == null ? void 0 : messages.filter((message) => message.type === "chat")) || [], [messages]);
-      const isMobile = (0, import_react_use26.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use27.useMedia)(config.media.md);
       const { elements } = useRoomLayoutConferencingScreen();
       if (messages.length === 0 && !(isMobile && ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay))) {
         return /* @__PURE__ */ import_react141.default.createElement(
@@ -14819,17 +14846,17 @@ var init_ChatBody = __esm({
 });
 
 // src/Prebuilt/components/AppData/useChatState.js
-var import_react142, import_react_sdk80, useChatDraftMessage;
+var import_react142, import_react_sdk81, useChatDraftMessage;
 var init_useChatState = __esm({
   "src/Prebuilt/components/AppData/useChatState.js"() {
     "use strict";
     init_define_process_env();
     import_react142 = require("react");
-    import_react_sdk80 = require("@100mslive/react-sdk");
+    import_react_sdk81 = require("@100mslive/react-sdk");
     init_constants();
     useChatDraftMessage = () => {
-      const hmsActions = (0, import_react_sdk80.useHMSActions)();
-      let chatDraftMessage = (0, import_react_sdk80.useHMSStore)((0, import_react_sdk80.selectAppData)(APP_DATA.chatDraft));
+      const hmsActions = (0, import_react_sdk81.useHMSActions)();
+      let chatDraftMessage = (0, import_react_sdk81.useHMSStore)((0, import_react_sdk81.selectAppData)(APP_DATA.chatDraft));
       if (chatDraftMessage === void 0 || chatDraftMessage === null) {
         chatDraftMessage = "";
       }
@@ -14911,16 +14938,16 @@ function EmojiPicker({ onSelect }) {
     )
   )));
 }
-var import_react144, import_react_use27, import_data, import_react145, import_react_sdk81, import_react_icons62, TextArea, ChatFooter;
+var import_react144, import_react_use28, import_data, import_react145, import_react_sdk82, import_react_icons62, TextArea, ChatFooter;
 var init_ChatFooter = __esm({
   "src/Prebuilt/components/Chat/ChatFooter.tsx"() {
     "use strict";
     init_define_process_env();
     import_react144 = __toESM(require("react"));
-    import_react_use27 = require("react-use");
+    import_react_use28 = require("react-use");
     import_data = __toESM(require("@emoji-mart/data"));
     import_react145 = __toESM(require("@emoji-mart/react"));
-    import_react_sdk81 = require("@100mslive/react-sdk");
+    import_react_sdk82 = require("@100mslive/react-sdk");
     import_react_icons62 = require("@100mslive/react-icons");
     init_src();
     init_ToastManager();
@@ -14951,10 +14978,10 @@ var init_ChatFooter = __esm({
       children
     }) => {
       var _a7;
-      const hmsActions = (0, import_react_sdk81.useHMSActions)();
+      const hmsActions = (0, import_react_sdk82.useHMSActions)();
       const inputRef = (0, import_react144.useRef)(null);
       const [draftMessage, setDraftMessage] = useChatDraftMessage();
-      const isMobile = (0, import_react_use27.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use28.useMedia)(config.media.md);
       const { elements } = useRoomLayoutConferencingScreen();
       const isOverlayChat = (_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay;
       const sendMessage = (0, import_react144.useCallback)(() => __async(void 0, null, function* () {
@@ -15019,7 +15046,8 @@ var init_ChatFooter = __esm({
             css: {
               c: "$on_surface_high",
               "&:valid ~ .send-msg": { color: "$on_surface_high" },
-              "& ~ .send-msg": { color: "$on_surface_low" }
+              "& ~ .send-msg": { color: "$on_surface_low" },
+              "&::placeholder": { color: "$on_surface_medium" }
             },
             placeholder: "Send a message....",
             ref: inputRef,
@@ -15071,29 +15099,29 @@ var init_ChatFooter = __esm({
 });
 
 // src/Prebuilt/components/Chat/useUnreadCount.js
-var import_react_sdk82, useUnreadCount;
+var import_react_sdk83, useUnreadCount;
 var init_useUnreadCount = __esm({
   "src/Prebuilt/components/Chat/useUnreadCount.js"() {
     "use strict";
     init_define_process_env();
-    import_react_sdk82 = require("@100mslive/react-sdk");
+    import_react_sdk83 = require("@100mslive/react-sdk");
     useUnreadCount = ({ role, peerId }) => {
-      const unreadCountSelector = role ? (0, import_react_sdk82.selectMessagesUnreadCountByRole)(role) : peerId ? (0, import_react_sdk82.selectMessagesUnreadCountByPeerID)(peerId) : import_react_sdk82.selectUnreadHMSMessagesCount;
-      const unreadCount = (0, import_react_sdk82.useHMSStore)(unreadCountSelector);
+      const unreadCountSelector = role ? (0, import_react_sdk83.selectMessagesUnreadCountByRole)(role) : peerId ? (0, import_react_sdk83.selectMessagesUnreadCountByPeerID)(peerId) : import_react_sdk83.selectUnreadHMSMessagesCount;
+      const unreadCount = (0, import_react_sdk83.useHMSStore)(unreadCountSelector);
       return unreadCount;
     };
   }
 });
 
 // src/Prebuilt/components/Chat/Chat.jsx
-var import_react146, import_react_use28, import_react_sdk83, import_react_icons63, PINNED_MESSAGE_LENGTH, PinnedMessage, Chat, NewMessageIndicator;
+var import_react146, import_react_use29, import_react_sdk84, import_react_icons63, PINNED_MESSAGE_LENGTH, PinnedMessage, Chat, NewMessageIndicator;
 var init_Chat = __esm({
   "src/Prebuilt/components/Chat/Chat.jsx"() {
     "use strict";
     init_define_process_env();
     import_react146 = __toESM(require("react"));
-    import_react_use28 = require("react-use");
-    import_react_sdk83 = require("@100mslive/react-sdk");
+    import_react_use29 = require("react-use");
+    import_react_sdk84 = require("@100mslive/react-sdk");
     import_react_icons63 = require("@100mslive/react-icons");
     init_Button2();
     init_Layout();
@@ -15108,8 +15136,8 @@ var init_Chat = __esm({
     init_constants();
     PINNED_MESSAGE_LENGTH = 80;
     PinnedMessage = ({ clearPinnedMessage }) => {
-      const permissions = (0, import_react_sdk83.useHMSStore)(import_react_sdk83.selectPermissions);
-      const pinnedMessage = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectSessionStore)(SESSION_STORE_KEY.PINNED_MESSAGE));
+      const permissions = (0, import_react_sdk84.useHMSStore)(import_react_sdk84.selectPermissions);
+      const pinnedMessage = (0, import_react_sdk84.useHMSStore)((0, import_react_sdk84.selectSessionStore)(SESSION_STORE_KEY.PINNED_MESSAGE));
       const formattedPinnedMessage = (pinnedMessage == null ? void 0 : pinnedMessage.length) && pinnedMessage.length > PINNED_MESSAGE_LENGTH ? `${pinnedMessage.slice(0, PINNED_MESSAGE_LENGTH)}...` : pinnedMessage;
       return pinnedMessage ? /* @__PURE__ */ import_react146.default.createElement(
         Flex,
@@ -15144,10 +15172,10 @@ var init_Chat = __esm({
     };
     Chat = ({ screenType }) => {
       var _a7, _b7;
-      const notification = (0, import_react_sdk83.useHMSNotifications)(import_react_sdk83.HMSNotificationTypes.PEER_LEFT);
+      const notification = (0, import_react_sdk84.useHMSNotifications)(import_react_sdk84.HMSNotificationTypes.PEER_LEFT);
       const [peerSelector, setPeerSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.PEER_ID);
       const [roleSelector, setRoleSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.ROLE);
-      const peerName = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectPeerNameByID)(peerSelector));
+      const peerName = (0, import_react_sdk84.useHMSStore)((0, import_react_sdk84.selectPeerNameByID)(peerSelector));
       const [chatOptions, setChatOptions] = (0, import_react146.useState)({
         role: roleSelector || "",
         peerId: peerSelector && peerName ? peerSelector : "",
@@ -15155,7 +15183,7 @@ var init_Chat = __esm({
       });
       const [isSelectorOpen] = (0, import_react146.useState)(false);
       const listRef = (0, import_react146.useRef)(null);
-      const hmsActions = (0, import_react_sdk83.useHMSActions)();
+      const hmsActions = (0, import_react_sdk84.useHMSActions)();
       const { setPinnedMessage } = useSetPinnedMessage();
       (0, import_react146.useEffect)(() => {
         if (notification && notification.data && peerSelector === notification.data.id) {
@@ -15167,15 +15195,15 @@ var init_Chat = __esm({
           });
         }
       }, [notification, peerSelector, setPeerSelector]);
-      const storeMessageSelector = import_react_sdk83.selectHMSMessagesCount;
+      const storeMessageSelector = import_react_sdk84.selectHMSMessagesCount;
       const { elements } = useRoomLayoutConferencingScreen();
-      const isMobile = (0, import_react_use28.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use29.useMedia)(config.media.md);
       let isScrolledToBottom = false;
       if (listRef.current) {
         const currentRef = listRef.current._outerRef;
         isScrolledToBottom = currentRef.scrollHeight - currentRef.clientHeight - currentRef.scrollTop < 10;
       }
-      const messagesCount = (0, import_react_sdk83.useHMSStore)(storeMessageSelector) || 0;
+      const messagesCount = (0, import_react_sdk84.useHMSStore)(storeMessageSelector) || 0;
       const scrollToBottom = (0, import_react146.useCallback)(
         (unreadCount = 0) => {
           var _a8;
@@ -15279,20 +15307,22 @@ var init_Chat = __esm({
 });
 
 // src/Prebuilt/components/SidePaneTabs.tsx
-var import_react147, import_react_use29, import_react_sdk84, import_react_icons64, tabTriggerCSS, SidePaneTabs;
+var import_react147, import_react_use30, import_react_sdk85, import_react_icons64, tabTriggerCSS, ParticipantCount2, SidePaneTabs;
 var init_SidePaneTabs = __esm({
   "src/Prebuilt/components/SidePaneTabs.tsx"() {
     "use strict";
     init_define_process_env();
     import_react147 = __toESM(require("react"));
-    import_react_use29 = require("react-use");
-    import_react_sdk84 = require("@100mslive/react-sdk");
+    import_react_use30 = require("react-use");
+    import_react_sdk85 = require("@100mslive/react-sdk");
     import_react_icons64 = require("@100mslive/react-icons");
     init_Chat();
     init_ParticipantList();
     init_src();
+    init_Tooltip2();
     init_useRoomLayoutScreen();
     init_useSidepane();
+    init_utils2();
     init_constants();
     tabTriggerCSS = {
       color: "$on_surface_high",
@@ -15302,18 +15332,21 @@ var init_SidePaneTabs = __esm({
       w: "100%",
       justifyContent: "center"
     };
+    ParticipantCount2 = ({ count }) => {
+      return count < 1e3 ? /* @__PURE__ */ import_react147.default.createElement("span", null, "(", count, ")") : /* @__PURE__ */ import_react147.default.createElement(Tooltip, { title: count }, /* @__PURE__ */ import_react147.default.createElement("span", null, "(", getFormattedCount(count), ")"));
+    };
     SidePaneTabs = import_react147.default.memo(({ active = SIDE_PANE_OPTIONS.CHAT, screenType, hideControls }) => {
       var _a7;
       const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
       const toggleParticipants = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
       const resetSidePane = useSidepaneReset();
       const [activeTab, setActiveTab] = (0, import_react147.useState)(active);
-      const peerCount = (0, import_react_sdk84.useHMSStore)(import_react_sdk84.selectPeerCount);
+      const peerCount = (0, import_react_sdk85.useHMSStore)(import_react_sdk85.selectPeerCount);
       const { elements } = useRoomLayoutConferencingScreen();
       const showChat = !!(elements == null ? void 0 : elements.chat);
       const showParticipants = !!(elements == null ? void 0 : elements.participant_list);
       const hideTabs = !(showChat && showParticipants);
-      const isMobile = (0, import_react_use29.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use30.useMedia)(config.media.md);
       const isOverlayChat = !!((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) && isMobile;
       const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
       (0, import_react147.useEffect)(() => {
@@ -15339,7 +15372,7 @@ var init_SidePaneTabs = __esm({
             transition: "margin 0.3s ease-in-out"
           }
         },
-        isOverlayChat && isChatOpen && showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, hideTabs ? /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, /* @__PURE__ */ import_react147.default.createElement(Text, { variant: "sm", css: { fontWeight: "$semiBold", p: "$4", c: "$on_surface_high", pr: "$12" } }, showChat ? "Chat" : `Participants (${peerCount})`), showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)) : /* @__PURE__ */ import_react147.default.createElement(
+        isOverlayChat && isChatOpen && showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, hideTabs ? /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, /* @__PURE__ */ import_react147.default.createElement(Text, { variant: "sm", css: { fontWeight: "$semiBold", p: "$4", c: "$on_surface_high", pr: "$12" } }, showChat ? "Chat" : /* @__PURE__ */ import_react147.default.createElement("span", null, "Participants ", /* @__PURE__ */ import_react147.default.createElement(ParticipantCount2, { count: peerCount }))), showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)) : /* @__PURE__ */ import_react147.default.createElement(
           Tabs.Root,
           {
             value: activeTab,
@@ -15368,9 +15401,8 @@ var init_SidePaneTabs = __esm({
                 color: activeTab !== SIDE_PANE_OPTIONS.PARTICIPANTS ? "$on_surface_low" : "$on_surface_high"
               })
             },
-            "Participants (",
-            peerCount,
-            ")"
+            "Participants ",
+            /* @__PURE__ */ import_react147.default.createElement(ParticipantCount2, { count: peerCount })
           )),
           /* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.PARTICIPANTS, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)),
           /* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.CHAT, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }))
@@ -15405,13 +15437,13 @@ var init_rtmp = __esm({
 });
 
 // src/Prebuilt/components/Streaming/HLSStreaming.jsx
-var import_react148, import_react_sdk85, import_react_icons65, getCardData, Card, HLSStreaming, StartHLS, EndHLS;
+var import_react148, import_react_sdk86, import_react_icons65, getCardData, Card, HLSStreaming, StartHLS, EndHLS;
 var init_HLSStreaming = __esm({
   "src/Prebuilt/components/Streaming/HLSStreaming.jsx"() {
     "use strict";
     init_define_process_env();
     import_react148 = __toESM(require("react"));
-    import_react_sdk85 = require("@100mslive/react-sdk");
+    import_react_sdk86 = require("@100mslive/react-sdk");
     import_react_icons65 = require("@100mslive/react-icons");
     init_src();
     init_Common();
@@ -15482,16 +15514,16 @@ var init_HLSStreaming = __esm({
     };
     HLSStreaming = ({ onBack }) => {
       const roleNames = useFilteredRoles();
-      const roomId = (0, import_react_sdk85.useHMSStore)(import_react_sdk85.selectRoomID);
+      const roomId = (0, import_react_sdk86.useHMSStore)(import_react_sdk86.selectRoomID);
       const cards = roleNames.map((roleName) => getCardData(roleName, roomId));
-      const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
+      const { isHLSRunning } = (0, import_react_sdk86.useRecordingStreaming)();
       const [showLinks, setShowLinks] = (0, import_react148.useState)(false);
       return !showLinks ? /* @__PURE__ */ import_react148.default.createElement(Container4, { rounded: true }, /* @__PURE__ */ import_react148.default.createElement(ContentHeader, { title: "Start Streaming", content: "HLS", onBack }), /* @__PURE__ */ import_react148.default.createElement(ContentBody, { title: "HLS Streaming", Icon: import_react_icons65.GoLiveIcon, removeVerticalPadding: true }, "Stream directly from the browser using any device with multiple hosts and real-time messaging, all within this platform."), isHLSRunning ? /* @__PURE__ */ import_react148.default.createElement(EndHLS, { setShowLinks }) : /* @__PURE__ */ import_react148.default.createElement(StartHLS, null)) : /* @__PURE__ */ import_react148.default.createElement(Container4, { rounded: true }, /* @__PURE__ */ import_react148.default.createElement(ContentHeader, { title: "Invite People", content: "Start the conversation", onBack: () => setShowLinks(false) }), /* @__PURE__ */ import_react148.default.createElement(Flex, { direction: "column", css: { gap: "$10", p: "$0 $10", overflowY: "auto", mb: "$10" } }, cards.map((card) => /* @__PURE__ */ import_react148.default.createElement(Card, __spreadProps(__spreadValues({ key: card.title }, card), { isHLSRunning })))));
     };
     StartHLS = () => {
       const [record, setRecord] = (0, import_react148.useState)(false);
       const [error, setError] = (0, import_react148.useState)(false);
-      const hmsActions = (0, import_react_sdk85.useHMSActions)();
+      const hmsActions = (0, import_react_sdk86.useHMSActions)();
       const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
       const startHLS = (0, import_react148.useCallback)(
         (variants) => __async(void 0, null, function* () {
@@ -15526,10 +15558,10 @@ var init_HLSStreaming = __esm({
       )), /* @__PURE__ */ import_react148.default.createElement(Flex, { align: "center", css: { p: "$4 $10" } }, /* @__PURE__ */ import_react148.default.createElement(Text, null, /* @__PURE__ */ import_react148.default.createElement(import_react_icons65.InfoIcon, { width: 16, height: 16 })), /* @__PURE__ */ import_react148.default.createElement(Text, { variant: "tiny", color: "$on_surface_medium", css: { mx: "$8" } }, "You cannot start recording once the stream starts, you will have to stop the stream to enable recording.")));
     };
     EndHLS = ({ setShowLinks }) => {
-      const hmsActions = (0, import_react_sdk85.useHMSActions)();
+      const hmsActions = (0, import_react_sdk86.useHMSActions)();
       const [inProgress, setInProgress] = (0, import_react148.useState)(false);
       const [error, setError] = (0, import_react148.useState)("");
-      const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
+      const { isHLSRunning } = (0, import_react_sdk86.useRecordingStreaming)();
       (0, import_react148.useEffect)(() => {
         if (inProgress && !isHLSRunning) {
           setInProgress(false);
@@ -15562,13 +15594,13 @@ var init_HLSStreaming = __esm({
 });
 
 // src/Prebuilt/components/Streaming/StreamingLanding.jsx
-var import_react149, import_react_sdk86, import_react_icons66, StreamingLanding;
+var import_react149, import_react_sdk87, import_react_icons66, StreamingLanding;
 var init_StreamingLanding = __esm({
   "src/Prebuilt/components/Streaming/StreamingLanding.jsx"() {
     "use strict";
     init_define_process_env();
     import_react149 = __toESM(require("react"));
-    import_react_sdk86 = require("@100mslive/react-sdk");
+    import_react_sdk87 = require("@100mslive/react-sdk");
     import_react_icons66 = require("@100mslive/react-icons");
     init_Layout();
     init_Text2();
@@ -15581,8 +15613,8 @@ var init_StreamingLanding = __esm({
     init_constants();
     StreamingLanding = () => {
       const toggleStreaming = useSidepaneToggle(SIDE_PANE_OPTIONS.STREAMING);
-      const { isHLSRunning, isRTMPRunning } = (0, import_react_sdk86.useRecordingStreaming)();
-      const permissions = (0, import_react_sdk86.useHMSStore)(import_react_sdk86.selectPermissions);
+      const { isHLSRunning, isRTMPRunning } = (0, import_react_sdk87.useRecordingStreaming)();
+      const permissions = (0, import_react_sdk87.useHMSStore)(import_react_sdk87.selectPermissions);
       const [showHLS, setShowHLS] = (0, import_react149.useState)(isHLSRunning);
       const [showRTMP, setShowRTMP] = (0, import_react149.useState)(isRTMPRunning);
       if (!(permissions == null ? void 0 : permissions.hlsStreaming) && !(permissions == null ? void 0 : permissions.rtmpStreaming)) {
@@ -15628,14 +15660,14 @@ var init_StreamingLanding = __esm({
 });
 
 // src/Prebuilt/layouts/SidePane.tsx
-var import_react150, import_react_use30, import_react_sdk87, SidePane, SidePane_default;
+var import_react150, import_react_use31, import_react_sdk88, SidePane, SidePane_default;
 var init_SidePane = __esm({
   "src/Prebuilt/layouts/SidePane.tsx"() {
     "use strict";
     init_define_process_env();
     import_react150 = __toESM(require("react"));
-    import_react_use30 = require("react-use");
-    import_react_sdk87 = require("@100mslive/react-sdk");
+    import_react_use31 = require("react-use");
+    import_react_sdk88 = require("@100mslive/react-sdk");
     init_SidePaneTabs();
     init_StreamingLanding();
     init_VideoTile2();
@@ -15649,10 +15681,10 @@ var init_SidePane = __esm({
       hideControls = false
     }) => {
       var _a7, _b7;
-      const isMobile = (0, import_react_use30.useMedia)(config.media.md);
-      const sidepane = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.sidePane));
-      const activeScreensharePeerId = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.activeScreensharePeerId));
-      const trackId = (_a7 = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectVideoTrackByPeerID)(activeScreensharePeerId))) == null ? void 0 : _a7.id;
+      const isMobile = (0, import_react_use31.useMedia)(config.media.md);
+      const sidepane = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectAppData)(APP_DATA.sidePane));
+      const activeScreensharePeerId = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectAppData)(APP_DATA.activeScreensharePeerId));
+      const trackId = (_a7 = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectVideoTrackByPeerID)(activeScreensharePeerId))) == null ? void 0 : _a7.id;
       const { elements } = useRoomLayoutConferencingScreen();
       let ViewComponent;
       if (sidepane === SIDE_PANE_OPTIONS.PARTICIPANTS || sidepane === SIDE_PANE_OPTIONS.CHAT) {
@@ -16379,16 +16411,16 @@ var HLSView_exports = {};
 __export(HLSView_exports, {
   default: () => HLSView_default
 });
-var import_react161, import_react_use31, import_hls_player3, import_screenfull3, import_react_sdk88, import_react_icons72, hlsPlayer, HLSView, HLSView_default;
+var import_react161, import_react_use32, import_hls_player3, import_screenfull3, import_react_sdk89, import_react_icons72, hlsPlayer, HLSView, HLSView_default;
 var init_HLSView = __esm({
   "src/Prebuilt/layouts/HLSView.jsx"() {
     "use strict";
     init_define_process_env();
     import_react161 = __toESM(require("react"));
-    import_react_use31 = require("react-use");
+    import_react_use32 = require("react-use");
     import_hls_player3 = require("@100mslive/hls-player");
     import_screenfull3 = __toESM(require("screenfull"));
-    import_react_sdk88 = require("@100mslive/react-sdk");
+    import_react_sdk89 = require("@100mslive/react-sdk");
     import_react_icons72 = require("@100mslive/react-icons");
     init_HlsStatsOverlay();
     init_HMSVideo2();
@@ -16407,9 +16439,9 @@ var init_HLSView = __esm({
       var _a7;
       const videoRef = (0, import_react161.useRef)(null);
       const hlsViewRef = (0, import_react161.useRef)(null);
-      const hlsState = (0, import_react_sdk88.useHMSStore)(import_react_sdk88.selectHLSState);
-      const enablHlsStats = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectAppData)(APP_DATA.hlsStats));
-      const hmsActions = (0, import_react_sdk88.useHMSActions)();
+      const hlsState = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectHLSState);
+      const enablHlsStats = (0, import_react_sdk89.useHMSStore)((0, import_react_sdk89.selectAppData)(APP_DATA.hlsStats));
+      const hmsActions = (0, import_react_sdk89.useHMSActions)();
       const { themeType, theme: theme2 } = useTheme();
       const [streamEnded, setStreamEnded] = (0, import_react161.useState)(false);
       let [hlsStatsState, setHlsStatsState] = (0, import_react161.useState)(null);
@@ -16421,13 +16453,13 @@ var init_HLSView = __esm({
       const [isHlsAutoplayBlocked, setIsHlsAutoplayBlocked] = (0, import_react161.useState)(false);
       const [isPaused, setIsPaused] = (0, import_react161.useState)(false);
       const isFullScreenSupported = import_screenfull3.default.isEnabled;
-      const [show, toggle] = (0, import_react_use31.useToggle)(false);
+      const [show, toggle] = (0, import_react_use32.useToggle)(false);
       const [controlsVisible, setControlsVisible] = (0, import_react161.useState)(true);
       const controlsRef = (0, import_react161.useRef)();
       const controlsTimerRef = (0, import_react161.useRef)();
       const [qualityDropDownOpen, setQualityDropDownOpen] = (0, import_react161.useState)(false);
-      const isMobile = (0, import_react_use31.useMedia)(config.media.md);
-      const isFullScreen = (0, import_react_use31.useFullscreen)(hlsViewRef, show, {
+      const isMobile = (0, import_react_use32.useMedia)(config.media.md);
+      const isFullScreen = (0, import_react_use32.useFullscreen)(hlsViewRef, show, {
         onClose: () => toggle(false)
       });
       const [showLoader, setShowLoader] = (0, import_react161.useState)(false);
@@ -16628,6 +16660,24 @@ var init_HLSView = __esm({
               onMouseMove: onHoverHandler,
               onMouseLeave: onHoverHandler
             },
+            isMobile && isPaused && /* @__PURE__ */ import_react161.default.createElement(
+              Box,
+              {
+                css: {
+                  position: "absolute",
+                  top: "40%",
+                  left: "50%",
+                  transform: "translateY(-40%) translateX(-50%)",
+                  padding: "$4 $14",
+                  display: "inline-flex",
+                  r: "$0",
+                  bg: "$primary_default"
+                }
+              },
+              /* @__PURE__ */ import_react161.default.createElement(IconButton, { onClick: () => __async(void 0, null, function* () {
+                return yield hlsPlayer == null ? void 0 : hlsPlayer.play();
+              }), "data-testid": "play_btn" }, /* @__PURE__ */ import_react161.default.createElement(import_react_icons72.PlayIcon, { width: "60px", height: "60px" }))
+            ),
             /* @__PURE__ */ import_react161.default.createElement(
               Flex,
               {
@@ -16727,13 +16777,13 @@ var init_HLSView = __esm({
 });
 
 // src/Prebuilt/layouts/VideoStreamingSection.tsx
-var import_react162, import_react_sdk89, HLSView2, VideoStreamingSection;
+var import_react162, import_react_sdk90, HLSView2, VideoStreamingSection;
 var init_VideoStreamingSection = __esm({
   "src/Prebuilt/layouts/VideoStreamingSection.tsx"() {
     "use strict";
     init_define_process_env();
     import_react162 = __toESM(require("react"));
-    import_react_sdk89 = require("@100mslive/react-sdk");
+    import_react_sdk90 = require("@100mslive/react-sdk");
     init_FullPageProgress();
     init_GridLayout();
     init_Layout();
@@ -16750,9 +16800,9 @@ var init_VideoStreamingSection = __esm({
       hideControls = false
     }) => {
       var _a7, _b7;
-      const localPeerRole = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectLocalPeerRoleName);
-      const isConnected = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectIsConnectedToRoom);
-      const hmsActions = (0, import_react_sdk89.useHMSActions)();
+      const localPeerRole = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerRoleName);
+      const isConnected = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectIsConnectedToRoom);
+      const hmsActions = (0, import_react_sdk90.useHMSActions)();
       const waitingViewerRole = useWaitingViewerRole();
       const urlToIframe = useUrlToEmbed();
       const pdfAnnotatorActive = usePDFAnnotator();
@@ -16801,24 +16851,24 @@ var init_VideoStreamingSection = __esm({
 });
 
 // src/Prebuilt/components/RoleChangeRequestModal.tsx
-var import_react163, import_react_sdk90, RoleChangeRequestModal, RequestDialog2;
+var import_react163, import_react_sdk91, RoleChangeRequestModal, RequestDialog2;
 var init_RoleChangeRequestModal = __esm({
   "src/Prebuilt/components/RoleChangeRequestModal.tsx"() {
     "use strict";
     init_define_process_env();
     import_react163 = __toESM(require("react"));
-    import_react_sdk90 = require("@100mslive/react-sdk");
+    import_react_sdk91 = require("@100mslive/react-sdk");
     init_PreviewJoin();
     init_src();
     init_useMetadata();
     init_constants();
     RoleChangeRequestModal = () => {
-      const hmsActions = (0, import_react_sdk90.useHMSActions)();
+      const hmsActions = (0, import_react_sdk91.useHMSActions)();
       const { updateMetaData } = useMyMetadata();
-      const currentRole = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerRoleName);
-      const roleChangeRequest = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectRoleChangeRequest);
-      const name = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerName);
-      const { sendEvent } = (0, import_react_sdk90.useCustomEvent)({ type: ROLE_CHANGE_DECLINED });
+      const currentRole = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectLocalPeerRoleName);
+      const roleChangeRequest = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectRoleChangeRequest);
+      const name = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectLocalPeerName);
+      const { sendEvent } = (0, import_react_sdk91.useCustomEvent)({ type: ROLE_CHANGE_DECLINED });
       (0, import_react163.useEffect)(() => {
         if (!(roleChangeRequest == null ? void 0 : roleChangeRequest.role)) {
           return;
@@ -16854,13 +16904,14 @@ var init_RoleChangeRequestModal = __esm({
               yield hmsActions.rejectChangeRole(roleChangeRequest);
               sendEvent(__spreadProps(__spreadValues({}, roleChangeRequest), { peerName: name }), { peerId: (_a7 = roleChangeRequest.requestedBy) == null ? void 0 : _a7.id });
               yield hmsActions.cancelMidCallPreview();
-              yield updateMetaData({ isHandRaised: false });
+              yield hmsActions.lowerLocalPeerHand();
             }
           }),
           body,
           onAction: () => __async(void 0, null, function* () {
             yield hmsActions.acceptChangeRole(roleChangeRequest);
-            yield updateMetaData({ isHandRaised: false, prevRole: currentRole });
+            yield updateMetaData({ prevRole: currentRole });
+            yield hmsActions.lowerLocalPeerHand();
           }),
           actionText: "Accept"
         }
@@ -16882,15 +16933,15 @@ var conference_exports = {};
 __export(conference_exports, {
   default: () => conference_default
 });
-var import_react164, import_react_router_dom5, import_react_use32, import_react_sdk91, Conference, conference_default;
+var import_react164, import_react_router_dom5, import_react_use33, import_react_sdk92, Conference, conference_default;
 var init_conference = __esm({
   "src/Prebuilt/components/conference.jsx"() {
     "use strict";
     init_define_process_env();
     import_react164 = __toESM(require("react"));
     import_react_router_dom5 = require("react-router-dom");
-    import_react_use32 = require("react-use");
-    import_react_sdk91 = require("@100mslive/react-sdk");
+    import_react_use33 = require("react-use");
+    import_react_sdk92 = require("@100mslive/react-sdk");
     init_Footer3();
     init_HLSFailureModal();
     init_PIPComponent();
@@ -16911,12 +16962,12 @@ var init_conference = __esm({
       const { userName, endpoints } = useHMSPrebuiltContext();
       const screenProps = useRoomLayoutConferencingScreen();
       const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
-      const roomState = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectRoomState);
-      const prevState = (0, import_react_use32.usePrevious)(roomState);
-      const isConnectedToRoom = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectIsConnectedToRoom);
-      const hmsActions = (0, import_react_sdk91.useHMSActions)();
+      const roomState = (0, import_react_sdk92.useHMSStore)(import_react_sdk92.selectRoomState);
+      const prevState = (0, import_react_use33.usePrevious)(roomState);
+      const isConnectedToRoom = (0, import_react_sdk92.useHMSStore)(import_react_sdk92.selectIsConnectedToRoom);
+      const hmsActions = (0, import_react_sdk92.useHMSActions)();
       const [hideControls, setHideControls] = (0, import_react164.useState)(false);
-      const dropdownList = (0, import_react_sdk91.useHMSStore)((0, import_react_sdk91.selectAppData)(APP_DATA.dropdownList));
+      const dropdownList = (0, import_react_sdk92.useHMSStore)((0, import_react_sdk92.selectAppData)(APP_DATA.dropdownList));
       const authTokenInAppData = useAuthToken();
       const headerRef = (0, import_react164.useRef)();
       const footerRef = (0, import_react164.useRef)();
@@ -16953,7 +17004,7 @@ var init_conference = __esm({
         if (!isPreviewScreenEnabled) {
           return;
         }
-        if (!prevState && !(roomState === import_react_sdk91.HMSRoomState.Connecting || roomState === import_react_sdk91.HMSRoomState.Reconnecting || isConnectedToRoom)) {
+        if (!prevState && !(roomState === import_react_sdk92.HMSRoomState.Connecting || roomState === import_react_sdk92.HMSRoomState.Reconnecting || isConnectedToRoom)) {
           if (role)
             navigate(`/preview/${roomId || ""}/${role}`);
           else
@@ -16961,7 +17012,7 @@ var init_conference = __esm({
         }
       }, [isConnectedToRoom, prevState, roomState, navigate, role, roomId, isPreviewScreenEnabled]);
       (0, import_react164.useEffect)(() => {
-        if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !== import_react_sdk91.HMSRoomState.Connecting && !autoRoomJoined.current) {
+        if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !== import_react_sdk92.HMSRoomState.Connecting && !autoRoomJoined.current) {
           hmsActions.join({
             userName,
             authToken: authTokenInAppData,
@@ -17057,14 +17108,14 @@ function AppRoutes({
   const isNotificationsDisabled = useIsNotificationDisabled();
   return /* @__PURE__ */ import_react165.default.createElement(Router, null, /* @__PURE__ */ import_react165.default.createElement(import_react165.default.Fragment, null, /* @__PURE__ */ import_react165.default.createElement(ToastContainer, null), /* @__PURE__ */ import_react165.default.createElement(Notifications, null), /* @__PURE__ */ import_react165.default.createElement(BackSwipe, null), !isNotificationsDisabled && /* @__PURE__ */ import_react165.default.createElement(FlyingEmoji, null), /* @__PURE__ */ import_react165.default.createElement(RemoteStopScreenshare, null), /* @__PURE__ */ import_react165.default.createElement(KeyboardHandler, null), /* @__PURE__ */ import_react165.default.createElement(AuthToken_default, { authTokenByRoomCodeEndpoint, defaultAuthToken }), roomLayout && /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Routes, null, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/*", element: /* @__PURE__ */ import_react165.default.createElement(RouteList, null) }))));
 }
-var import_react165, import_react_router_dom6, import_react_sdk92, Conference2, HMSPrebuilt, Redirector, RouteList, BackSwipe, Router;
+var import_react165, import_react_router_dom6, import_react_sdk93, Conference2, HMSPrebuilt, Redirector, RouteList, BackSwipe, Router;
 var init_App = __esm({
   "src/Prebuilt/App.tsx"() {
     "use strict";
     init_define_process_env();
     import_react165 = __toESM(require("react"));
     import_react_router_dom6 = require("react-router-dom");
-    import_react_sdk92 = require("@100mslive/react-sdk");
+    import_react_sdk93 = require("@100mslive/react-sdk");
     init_AppData();
     init_AuthToken();
     init_ErrorBoundary();
@@ -17105,7 +17156,7 @@ var init_App = __esm({
         const [hydrated, setHydrated] = import_react165.default.useState(false);
         (0, import_react165.useEffect)(() => {
           setHydrated(true);
-          const hms = new import_react_sdk92.HMSReactiveStore();
+          const hms = new import_react_sdk93.HMSReactiveStore();
           const hmsStore = hms.getStore();
           const hmsActions = hms.getActions();
           const hmsNotifications = hms.getNotifications();
@@ -17173,7 +17224,7 @@ var init_App = __esm({
             }
           },
           /* @__PURE__ */ import_react165.default.createElement(
-            import_react_sdk92.HMSRoomProvider,
+            import_react_sdk93.HMSRoomProvider,
             {
               isHMSStatsOn: FeatureFlags.enableStatsForNerds,
               actions: (_a7 = reactiveStore.current) == null ? void 0 : _a7.hmsActions,
@@ -17259,8 +17310,8 @@ var init_App = __esm({
       )), isLeaveScreenEnabled ? /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "leave" }, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: ":roomId/:role", element: /* @__PURE__ */ import_react165.default.createElement(PostLeave_default, null) }), /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: ":roomId", element: /* @__PURE__ */ import_react165.default.createElement(PostLeave_default, null) })) : null, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/:roomId/:role", element: /* @__PURE__ */ import_react165.default.createElement(Redirector, { showPreview: isPreviewScreenEnabled }) }), /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/:roomId/", element: /* @__PURE__ */ import_react165.default.createElement(Redirector, { showPreview: isPreviewScreenEnabled }) }));
     };
     BackSwipe = () => {
-      const isConnectedToRoom = (0, import_react_sdk92.useHMSStore)(import_react_sdk92.selectIsConnectedToRoom);
-      const hmsActions = (0, import_react_sdk92.useHMSActions)();
+      const isConnectedToRoom = (0, import_react_sdk93.useHMSStore)(import_react_sdk93.selectIsConnectedToRoom);
+      const hmsActions = (0, import_react_sdk93.useHMSActions)();
       (0, import_react165.useEffect)(() => {
         const onRouteLeave = () => __async(void 0, null, function* () {
           if (isConnectedToRoom) {