@100mslive/roomkit-react 0.2.8-alpha.9 → 0.3.0

package/dist/index.cjs.js

@@ -108,7 +108,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_cf01f7b0-2724-4e4f-b298-ff7feccfe357", 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_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.21 npm/? node/v18.19.1 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.9.8-alpha.9", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_cf01f7b0-2724-4e4f-b298-ff7feccfe357", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.19.1/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.12.8-alpha.9", 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.7", 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", npm_package_repository_directory: "packages/roomkit-react", 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_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.6", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/26.2.11394342", JAVA_HOME_21_X64: "/usr/lib/jvm/temurin-21-jdk-amd64", 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: "591", 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.9", 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_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.14/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.7/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20240225.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", GOROOT_1_22_X64: "/opt/hostedtoolcache/go/1.22.0/x64", 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_dependencies__100mslive_hms_noise_cancellation: "0.0.0-alpha.1", 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:19780", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", 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_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.2.8-alpha.9", 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", ACTIONS_RUNNER_ACTION_ARCHIVE_CACHE: "/opt/actionarchivecache", GITHUB_RUN_ID: "8109554901", 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_dependencies_ts_pattern: "4.3.0", 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: "2a735b6edf0b63927744abb555b47ab9be6e5891", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "examples/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "7312e8d1b6dc1c3c88807c4efcd1e1b66331c074df1f1b56194f927df7add041", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/publish-alpha", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GITHUB_ACTION_REPOSITORY: "", npm_package_scripts_prebuilt: "cd packages/roomkit-react && yarn start", npm_package_devDependencies_postcss_loader: "^6.2.1", npm_package_devDependencies_esbuild_loader: "^4.0.2", PATH: "/tmp/yarn--1709286943827-0.6891216397962161:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709286943630-0.9971913087997049:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709286921685-0.8303138139294286:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709286921507-0.5830472582556345:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin:/snap/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:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/18.19.1/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_105a33c3-e668-4c3a-9613-d5a1981afa4e", INVOCATION_ID: "546f5e1c56564beaa3ea908eafaed9c6", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", 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", npm_package_repository_type: "git", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "459", GITHUB_TRIGGERING_ACTOR: "github-actions[bot]", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_lint_staged____js_ts_jsx_tsx_: "eslint", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "20 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: "20 KB", 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 59", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "publish-alpha", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "400 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-store/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_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.9.8-alpha.9", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.2.8-alpha.9", npm_package_size_limit_4_limit: "20 KB", npm_package_size_limit_1_path: "packages/hms-video-store/dist/index.js", 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_repository_url: "https://github.com/100mslive/web-sdks.git", 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/roomkit-react/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: "150 KB", npm_package_size_limit_3_path: "packages/roomkit-react/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "2a735b6edf0b63927744abb555b47ab9be6e5891", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "100 KB", npm_package_size_limit_4_path: "packages/hms-virtual-background/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/publish-alpha", GITHUB_ACTOR: "github-actions[bot]", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_license: "MIT", npm_package_size_limit_5_path: "packages/hms-virtual-background/dist/index.js", npm_config_strict_ssl: "true", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_6_path: "packages/react-icons/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_cf01f7b0-2724-4e4f-b298-ff7feccfe357", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "41898282", 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/react-icons/dist/index.js", npm_package_scripts_ybys: "yarn && yarn build --no-private && yarn storybook", 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.11.2-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_cf01f7b0-2724-4e4f-b298-ff7feccfe357", 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_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_dependencies_react_swipeable: "^7.0.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_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_cf01f7b0-2724-4e4f-b298-ff7feccfe357" };
+    define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_4eada179-91ba-42c0-812a-6c62a47c4853", 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_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.21 npm/? node/v18.19.1 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.10.0", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_4eada179-91ba-42c0-812a-6c62a47c4853", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.19.1/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.13.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.7", 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", npm_package_repository_directory: "packages/roomkit-react", 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_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.6", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/26.2.11394342", JAVA_HOME_21_X64: "/usr/lib/jvm/temurin-21-jdk-amd64", 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: "592", 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.9", 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_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.14/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.7/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20240225.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", GOROOT_1_22_X64: "/opt/hostedtoolcache/go/1.22.0/x64", 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_dependencies__100mslive_hms_noise_cancellation: "0.0.0-alpha.1", 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:20654", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", 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_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.3.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", ACTIONS_RUNNER_ACTION_ARCHIVE_CACHE: "/opt/actionarchivecache", GITHUB_RUN_ID: "8153826113", 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_dependencies_ts_pattern: "4.3.0", 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: "eaed700cd6f04214d3aa7a691c3f1bd603e1ce0e", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "examples/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "da4e18ae136d0946a91866f297091a0c26a9e103cec876b3731d92b61083b209", 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", GITHUB_ACTION_REPOSITORY: "", npm_package_scripts_prebuilt: "cd packages/roomkit-react && yarn start", npm_package_devDependencies_postcss_loader: "^6.2.1", npm_package_devDependencies_esbuild_loader: "^4.0.2", PATH: "/tmp/yarn--1709630446602-0.9281138785303897:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709630446409-0.47889333945358104:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709630424406-0.8143865164298287:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1709630424231-0.2506504138931236:/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/18.19.1/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.1/x64/bin:/snap/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:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/18.19.1/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_9f88d938-1924-4be0-a607-3d62ff2d1871", INVOCATION_ID: "254f6b36d06446e18715e52b31cd7d08", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", 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", npm_package_repository_type: "git", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "466", GITHUB_TRIGGERING_ACTOR: "raviteja83", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_lint_staged____js_ts_jsx_tsx_: "eslint", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "20 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: "20 KB", 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 222", 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: "400 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-store/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_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.10.0", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.3.0", npm_package_size_limit_4_limit: "20 KB", npm_package_size_limit_1_path: "packages/hms-video-store/dist/index.js", 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_repository_url: "https://github.com/100mslive/web-sdks.git", 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/roomkit-react/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: "150 KB", npm_package_size_limit_3_path: "packages/roomkit-react/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "eaed700cd6f04214d3aa7a691c3f1bd603e1ce0e", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "100 KB", npm_package_size_limit_4_path: "packages/hms-virtual-background/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_license: "MIT", npm_package_size_limit_5_path: "packages/hms-virtual-background/dist/index.js", npm_config_strict_ssl: "true", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_6_path: "packages/react-icons/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_4eada179-91ba-42c0-812a-6c62a47c4853", 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/react-icons/dist/index.js", npm_package_scripts_ybys: "yarn && yarn build --no-private && yarn storybook", 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.11.2-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_4eada179-91ba-42c0-812a-6c62a47c4853", 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_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_dependencies_react_swipeable: "^7.0.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_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_4eada179-91ba-42c0-812a-6c62a47c4853" };
   }
 });
 
@@ -6870,8 +6870,8 @@ var require_lodash = __commonJS({
           return { "start": start, "end": end };
         }
         function getWrapDetails(source) {
-          var match10 = source.match(reWrapDetails);
-          return match10 ? match10[1].split(reSplitDetails) : [];
+          var match13 = source.match(reWrapDetails);
+          return match13 ? match13[1].split(reSplitDetails) : [];
         }
         function hasPath(object, path, hasFunc) {
           path = castPath(path, object);
@@ -7139,8 +7139,8 @@ var require_lodash = __commonJS({
           if (string.charCodeAt(0) === 46) {
             result2.push("");
           }
-          string.replace(rePropName, function(match10, number, quote, subString) {
-            result2.push(quote ? subString.replace(reEscapeChar, "$1") : number || match10);
+          string.replace(rePropName, function(match13, number, quote, subString) {
+            result2.push(quote ? subString.replace(reEscapeChar, "$1") : number || match13);
           });
           return result2;
         });
@@ -8706,7 +8706,7 @@ var require_lodash = __commonJS({
             "g"
           );
           var sourceURL = "//# sourceURL=" + (hasOwnProperty.call(options, "sourceURL") ? (options.sourceURL + "").replace(/\s/g, " ") : "lodash.templateSources[" + ++templateCounter + "]") + "\n";
-          string.replace(reDelimiters, function(match10, escapeValue, interpolateValue, esTemplateValue, evaluateValue, offset) {
+          string.replace(reDelimiters, function(match13, escapeValue, interpolateValue, esTemplateValue, evaluateValue, offset) {
             interpolateValue || (interpolateValue = esTemplateValue);
             source += string.slice(index, offset).replace(reUnescapedString, escapeStringChar);
             if (escapeValue) {
@@ -8720,8 +8720,8 @@ var require_lodash = __commonJS({
             if (interpolateValue) {
               source += "' +\n((__t = (" + interpolateValue + ")) == null ? '' : __t) +\n'";
             }
-            index = offset + match10.length;
-            return match10;
+            index = offset + match13.length;
+            return match13;
           });
           source += "';\n";
           var variable = hasOwnProperty.call(options, "variable") && options.variable;
@@ -8809,13 +8809,13 @@ var require_lodash = __commonJS({
           }
           if (isRegExp(separator)) {
             if (string.slice(end).search(separator)) {
-              var match10, substring = result2;
+              var match13, substring = result2;
               if (!separator.global) {
                 separator = RegExp2(separator.source, toString(reFlags.exec(separator)) + "g");
               }
               separator.lastIndex = 0;
-              while (match10 = separator.exec(substring)) {
-                var newEnd = match10.index;
+              while (match13 = separator.exec(substring)) {
+                var newEnd = match13.index;
               }
               result2 = result2.slice(0, newEnd === undefined2 ? end : newEnd);
             }
@@ -11617,7 +11617,7 @@ var init_EmojiReaction = __esm({
     init_hooks();
     init_constants();
     (0, import_emoji_mart.init)({ data: import_apple.default });
-    EmojiReaction = () => {
+    EmojiReaction = ({ showCard = false }) => {
       const [open, setOpen] = (0, import_react48.useState)(false);
       const isConnected = (0, import_react_sdk15.useHMSStore)(import_react_sdk15.selectIsConnectedToRoom);
       useDropdownList({ open, name: "EmojiReaction" });
@@ -11643,7 +11643,7 @@ var init_EmojiReaction = __esm({
       if (!isConnected) {
         return null;
       }
-      if ((isMobile || isLandscape) && !(isLandscapeStream || isMobileHLSStream)) {
+      if (showCard) {
         return /* @__PURE__ */ import_react48.default.createElement(EmojiCard, { sendReaction });
       }
       return /* @__PURE__ */ import_react48.default.createElement(Dropdown.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ import_react48.default.createElement(Dropdown.Trigger, { asChild: true, "data-testid": "emoji_reaction_btn" }, /* @__PURE__ */ import_react48.default.createElement(
@@ -14018,7 +14018,7 @@ var require_ua_parser = __commonJS({
         }
       };
       var rgxMapper = function(ua, arrays) {
-        var i = 0, j, k2, p, q2, matches, match10;
+        var i = 0, j, k2, p, q2, matches, match13;
         while (i < arrays.length && !matches) {
           var regex = arrays[i], props = arrays[i + 1];
           j = k2 = 0;
@@ -14029,26 +14029,26 @@ var require_ua_parser = __commonJS({
             matches = regex[j++].exec(ua);
             if (!!matches) {
               for (p = 0; p < props.length; p++) {
-                match10 = matches[++k2];
+                match13 = matches[++k2];
                 q2 = props[p];
                 if (typeof q2 === OBJ_TYPE && q2.length > 0) {
                   if (q2.length === 2) {
                     if (typeof q2[1] == FUNC_TYPE) {
-                      this[q2[0]] = q2[1].call(this, match10);
+                      this[q2[0]] = q2[1].call(this, match13);
                     } else {
                       this[q2[0]] = q2[1];
                     }
                   } else if (q2.length === 3) {
                     if (typeof q2[1] === FUNC_TYPE && !(q2[1].exec && q2[1].test)) {
-                      this[q2[0]] = match10 ? q2[1].call(this, match10, q2[2]) : undefined2;
+                      this[q2[0]] = match13 ? q2[1].call(this, match13, q2[2]) : undefined2;
                     } else {
-                      this[q2[0]] = match10 ? match10.replace(q2[1], q2[2]) : undefined2;
+                      this[q2[0]] = match13 ? match13.replace(q2[1], q2[2]) : undefined2;
                     }
                   } else if (q2.length === 4) {
-                    this[q2[0]] = match10 ? q2[3].call(this, match10.replace(q2[1], q2[2])) : undefined2;
+                    this[q2[0]] = match13 ? q2[3].call(this, match13.replace(q2[1], q2[2])) : undefined2;
                   }
                 } else {
-                  this[q2] = match10 ? match10 : undefined2;
+                  this[q2] = match13 ? match13 : undefined2;
                 }
               }
             }
@@ -15939,8 +15939,8 @@ var require_lodash2 = __commonJS({
 
 // ../../node_modules/webrtc-adapter/src/js/utils.js
 function extractVersion(uastring, expr, pos) {
-  const match10 = uastring.match(expr);
-  return match10 && match10.length >= pos && parseInt(match10[pos], 10);
+  const match13 = uastring.match(expr);
+  return match13 && match13.length >= pos && parseInt(match13[pos], 10);
 }
 function wrapPeerConnectionEvent(window2, eventNameToWrap, wrapper) {
   if (!window2.RTCPeerConnection) {
@@ -16232,7 +16232,7 @@ function shimGetUserMedia(window2, browserDetails) {
         if (matches) {
           return navigator2.mediaDevices.enumerateDevices().then((devices) => {
             devices = devices.filter((d2) => d2.kind === "videoinput");
-            let dev = devices.find((d2) => matches.some((match10) => d2.label.toLowerCase().includes(match10)));
+            let dev = devices.find((d2) => matches.some((match13) => d2.label.toLowerCase().includes(match13)));
             if (!dev && devices.length && matches.includes("back")) {
               dev = devices[devices.length - 1];
             }
@@ -18330,11 +18330,11 @@ function shimMaxMessageSize(window2, browserDetails) {
     });
   };
   const getRemoteFirefoxVersion = function(description) {
-    const match10 = description.sdp.match(/mozilla...THIS_IS_SDPARTA-(\d+)/);
-    if (match10 === null || match10.length < 2) {
+    const match13 = description.sdp.match(/mozilla...THIS_IS_SDPARTA-(\d+)/);
+    if (match13 === null || match13.length < 2) {
       return -1;
     }
-    const version = parseInt(match10[1], 10);
+    const version = parseInt(match13[1], 10);
     return version !== version ? -1 : version;
   };
   const getCanSendMaxMessageSize = function(remoteIsFirefox) {
@@ -18359,12 +18359,12 @@ function shimMaxMessageSize(window2, browserDetails) {
     if (browserDetails.browser === "firefox" && browserDetails.version === 57) {
       maxMessageSize = 65535;
     }
-    const match10 = import_sdp.default.matchPrefix(
+    const match13 = import_sdp.default.matchPrefix(
       description.sdp,
       "a=max-message-size:"
     );
-    if (match10.length > 0) {
-      maxMessageSize = parseInt(match10[0].substring(19), 10);
+    if (match13.length > 0) {
+      maxMessageSize = parseInt(match13[0].substring(19), 10);
     } else if (browserDetails.browser === "firefox" && remoteIsFirefox !== -1) {
       maxMessageSize = 2147483637;
     }
@@ -19186,13 +19186,13 @@ var require_parser = __commonJS({
     var toIntIfInt = function(v2) {
       return String(Number(v2)) === v2 ? Number(v2) : v2;
     };
-    var attachProperties = function(match10, location, names, rawName) {
+    var attachProperties = function(match13, location, names, rawName) {
       if (rawName && !names) {
-        location[rawName] = toIntIfInt(match10[1]);
+        location[rawName] = toIntIfInt(match13[1]);
       } else {
         for (var i = 0; i < names.length; i += 1) {
-          if (match10[i + 1] != null) {
-            location[names[i]] = toIntIfInt(match10[i + 1]);
+          if (match13[i + 1] != null) {
+            location[names[i]] = toIntIfInt(match13[i + 1]);
           }
         }
       }
@@ -19417,7 +19417,7 @@ function He(a2, e) {
   if (e)
     for (let r of e.auxiliaryTracks) {
       let s = a2[r];
-      Ia(s) && (i = tt(s) ? s : i, t = it(s) ? s : t);
+      Ra(s) && (i = tt(s) ? s : i, t = it(s) ? s : t);
     }
   return { video: t, audio: i };
 }
@@ -19427,7 +19427,7 @@ function tt(a2) {
 function it(a2) {
   return a2 && a2.type === "video";
 }
-function Ia(a2) {
+function Ra(a2) {
   return a2 && a2.source === "screen";
 }
 function Gt(a2) {
@@ -19486,7 +19486,7 @@ function tm(a2) {
       return a2 ? e.sessionStore[a2] : e.sessionStore;
   };
 }
-var import_ua_parser_js, import_lodash3, import_uuid3, import_uuid4, import_lodash4, import_uuid5, import_uuid6, import_uuid7, import_eventemitter2, import_eventemitter22, import_uuid8, import_eventemitter23, Lt, import_eventemitter24, import_uuid9, import_uuid10, Ma, ya, ka, Vt, Gr, $r, Fr, S, M, Yi, ba, dr, Xi, Aa, Wr, Zi, Kr, V, Ra, An, In, G, $t, Jr, D, er, Ha, ye, Cn, Ca, ae, La, z, ue, Ln, Dn, Z, K, Da, zr, wn, _n, ir, wa, On, xn, Un, Vn, Bn, Fn, Gn, $n, at, _a7, Wn, Y, Xr, Kn, oe, qn, Wt, Na, Zr, jn, es, Jn, Qn, zn, Yn, Xn, Zn, ec, tc, ts, ac, Oa, oc, rs, rr, ss, as, os, ns, cs, ds, ls, us, ps, xa, d, pe, w, hs, Ce, Va, mc, ms, Ss, Ts, Be, v, f, Fa, h, or, fs, ne, vs, ys, ks, R, y, ur, q, pr, hr, Rs, Hs, Cs, mr, _s, Sr, Ns, gr, Tr, Us, Vs, pt, Qe, gt, k, Ir, Tt, qs, uo, po, J, Rr, ho, mo, So, go, To, Q, em, rm, ai, js, sm, am, om, fo, vo, cm, Js, dm, Mo, lm, um, pm, hm, mm, Sm, Qs, zs, Tm, fm, Ys, vm, Mm, Xs, ym, km, Pm, Zs, ea, yo, ko, Po, Em, bm, Am, Im, Rm, ta, Vm, Eo, Bm, Fm, Gm, Ao, Io, wr, Te, $, Ui, ji, jo, Jo, Qo, zo, fa, Yo, va, Ur, ve, Xo, Zo, en, tn, rn, sn, an, on, nn, cn, Vr, dn, ln, un, pn, hn, mn;
+var import_ua_parser_js, import_lodash3, import_uuid3, import_uuid4, import_lodash4, import_uuid5, import_uuid6, import_uuid7, import_eventemitter2, import_eventemitter22, import_uuid8, import_eventemitter23, Lt, import_eventemitter24, import_uuid9, import_uuid10, Ma, ya, ka, Vt, Gr, $r, Fr, S, M, Yi, ba, dr, Xi, Aa, Wr, Zi, Kr, V, Ia, An, Rn, G, $t, Jr, D, er, Ha, ye, Cn, Ca, ae, La, z, ue, Ln, Dn, Z, K, Da, zr, wn, _n, ir, wa, On, xn, Un, Vn, Bn, Fn, Gn, $n, at, _a7, Wn, Y, Xr, Kn, oe, qn, Wt, Na, Zr, jn, es, Jn, Qn, zn, Yn, Xn, Zn, ec, tc, ts, ac, Oa, oc, rs, rr, ss, as, os, ns, cs, ds, ls, us, ps, xa, d, pe, w, hs, Ce, Va, mc, ms, Ss, Ts, Be, v, f, Fa, h, or, fs, ne, vs, ys, ks, I, y, ur, q, pr, hr, Is, Hs, Cs, mr, _s, Sr, Ns, gr, Tr, Us, Vs, pt, Qe, gt, k, Rr, Tt, qs, uo, po, J, Ir, ho, mo, So, go, To, Q, em, rm, ai, js, sm, am, om, fo, vo, cm, Js, dm, Mo, lm, um, pm, hm, mm, Sm, Qs, zs, Tm, fm, Ys, vm, Mm, Xs, ym, km, Em, Zs, ea, yo, ko, Eo, Pm, bm, Am, Rm, Im, ta, Vm, Po, Bm, Fm, Gm, Ao, Ro, wr, Te, $, Ui, ji, jo, Jo, Qo, zo, fa, Yo, va, Ur, ve, Xo, Zo, en, tn, rn, sn, an, on, nn, cn, Vr, dn, ln, un, pn, hn, mn;
 var init_dist = __esm({
   "../hms-video-store/dist/index.js"() {
     "use strict";
@@ -19541,7 +19541,7 @@ var init_dist = __esm({
     };
     ba = (a2, e) => () => (e || a2((e = { exports: {} }).exports, e), e.exports);
     dr = ba((Xc, $a) => {
-      $a.exports = { version: "0.11.8-alpha.9", license: "MIT", repository: { type: "git", url: "https://github.com/100mslive/web-sdks.git", directory: "packages/hms-video-store" }, main: "dist/index.cjs.js", module: "dist/index.js", typings: "dist/index.d.ts", files: ["dist", "src"], engines: { node: ">=12" }, exports: { ".": { require: "./dist/index.cjs.js", import: "./dist/index.js", default: "./dist/index.js" } }, sideEffects: false, scripts: { prestart: "rm -rf dist && yarn types:build", start: 'concurrently "yarn dev" "yarn types"', dev: "node ../../scripts/dev", "build:only": "node ../../scripts/build", build: "yarn build:only && yarn types:build", types: "tsc -w", "types:build": "tsc -p tsconfig.json", format: "prettier --write src/**/*.ts", test: "jest --maxWorkers=1", "test:watch": "jest --watch", "test:coverage": "jest --coverage", lint: "eslint -c ../../.eslintrc .", "lint:fix": "yarn lint --fix", prepare: "yarn build", size: "size-limit", analyze: "size-limit --why", docs: "rm -rf ./docs && typedoc && rm -f ./docs/README.md && mkdir ./docs/home &&mv ./docs/modules.md ./docs/home/content.md && node ../../scripts/docs-store && npx prettier --write './docs/**/*'" }, name: "@100mslive/hms-video-store", author: "100ms", dependencies: { eventemitter2: "^6.4.9", immer: "^9.0.6", "lodash.isequal": "^4.5.0", reselect: "4.0.0", "sdp-transform": "^2.14.1", "ua-parser-js": "^1.0.1", uuid: "^8.3.2", "webrtc-adapter": "^8.0.0", zustand: "3.5.7" }, devDependencies: { "@types/dom-screen-wake-lock": "^1.0.1", "@types/lodash.isequal": "^4.5.8", "@types/sdp-transform": "^2.4.4", "@types/ua-parser-js": "^0.7.36", "@types/uuid": "^8.3.0", "jest-canvas-mock": "^2.3.1", "jsdom-worker": "^0.3.0", tslib: "^2.2.0" }, description: "@100mslive Core SDK which abstracts the complexities of webRTC while providing a reactive store for data management with a unidirectional data flow", keywords: ["video", "webrtc", "conferencing", "100ms"] };
+      $a.exports = { version: "0.12.0", license: "MIT", repository: { type: "git", url: "https://github.com/100mslive/web-sdks.git", directory: "packages/hms-video-store" }, main: "dist/index.cjs.js", module: "dist/index.js", typings: "dist/index.d.ts", files: ["dist", "src"], engines: { node: ">=12" }, exports: { ".": { require: "./dist/index.cjs.js", import: "./dist/index.js", default: "./dist/index.js" } }, sideEffects: false, scripts: { prestart: "rm -rf dist && yarn types:build", start: 'concurrently "yarn dev" "yarn types"', dev: "node ../../scripts/dev", "build:only": "node ../../scripts/build", build: "yarn build:only && yarn types:build", types: "tsc -w", "types:build": "tsc -p tsconfig.json", format: "prettier --write src/**/*.ts", test: "jest --maxWorkers=1", "test:watch": "jest --watch", "test:coverage": "jest --coverage", lint: "eslint -c ../../.eslintrc .", "lint:fix": "yarn lint --fix", prepare: "yarn build", size: "size-limit", analyze: "size-limit --why", docs: "rm -rf ./docs && typedoc && rm -f ./docs/README.md && mkdir ./docs/home &&mv ./docs/modules.md ./docs/home/content.md && node ../../scripts/docs-store && npx prettier --write './docs/**/*'" }, name: "@100mslive/hms-video-store", author: "100ms", dependencies: { eventemitter2: "^6.4.9", immer: "^9.0.6", "lodash.isequal": "^4.5.0", reselect: "4.0.0", "sdp-transform": "^2.14.1", "ua-parser-js": "^1.0.1", uuid: "^8.3.2", "webrtc-adapter": "^8.0.0", zustand: "3.5.7" }, devDependencies: { "@types/dom-screen-wake-lock": "^1.0.1", "@types/lodash.isequal": "^4.5.8", "@types/sdp-transform": "^2.4.4", "@types/ua-parser-js": "^0.7.36", "@types/uuid": "^8.3.0", "jest-canvas-mock": "^2.3.1", "jsdom-worker": "^0.3.0", tslib: "^2.2.0" }, description: "@100mslive Core SDK which abstracts the complexities of webRTC while providing a reactive store for data management with a unidirectional data flow", keywords: ["video", "webrtc", "conferencing", "100ms"] };
     });
     Xi = ((n) => (n.Disconnected = "Disconnected", n.Preview = "Preview", n.Connecting = "Connecting", n.Connected = "Connected", n.Reconnecting = "Reconnecting", n.Disconnecting = "Disconnecting", n.Failed = "Failed", n))(Xi || {});
     Aa = ((e) => (e.CHAT = "chat", e))(Aa || {});
@@ -19549,9 +19549,9 @@ var init_dist = __esm({
     Zi = ((C) => (C.PEER_JOINED = "PEER_JOINED", C.PEER_LEFT = "PEER_LEFT", C.PEER_LIST = "PEER_LIST", C.NEW_MESSAGE = "NEW_MESSAGE", C.ERROR = "ERROR", C.RECONNECTING = "RECONNECTING", C.RECONNECTED = "RECONNECTED", C.TRACK_ADDED = "TRACK_ADDED", C.TRACK_REMOVED = "TRACK_REMOVED", C.TRACK_MUTED = "TRACK_MUTED", C.TRACK_UNMUTED = "TRACK_UNMUTED", C.TRACK_DEGRADED = "TRACK_DEGRADED", C.TRACK_RESTORED = "TRACK_RESTORED", C.TRACK_DESCRIPTION_CHANGED = "TRACK_DESCRIPTION_CHANGED", C.ROLE_UPDATED = "ROLE_UPDATED", C.CHANGE_TRACK_STATE_REQUEST = "CHANGE_TRACK_STATE_REQUEST", C.CHANGE_MULTI_TRACK_STATE_REQUEST = "CHANGE_MULTI_TRACK_STATE_REQUEST", C.ROOM_ENDED = "ROOM_ENDED", C.REMOVED_FROM_ROOM = "REMOVED_FROM_ROOM", C.DEVICE_CHANGE_UPDATE = "DEVICE_CHANGE_UPDATE", C.PLAYLIST_TRACK_ENDED = "PLAYLIST_TRACK_ENDED", C.NAME_UPDATED = "NAME_UPDATED", C.METADATA_UPDATED = "METADATA_UPDATED", C.POLL_CREATED = "POLL_CREATED", C.POLL_STARTED = "POLL_STARTED", C.POLL_STOPPED = "POLL_STOPPED", C.POLL_VOTES_UPDATED = "POLL_VOTES_UPDATED", C.POLLS_LIST = "POLLS_LIST", C.HAND_RAISE_CHANGED = "HAND_RAISE_CHANGED", C))(Zi || {});
     Kr = ((t) => (t.audio = "audio", t.video = "video", t))(Kr || {});
     V = (a2) => a2.room;
-    Ra = (a2) => a2.errors;
-    An = createSelector(Ra, (a2) => a2.length === 0 ? null : a2.at(-1));
-    In = createSelector(V, (a2) => a2.id);
+    Ia = (a2) => a2.errors;
+    An = createSelector(Ia, (a2) => a2.length === 0 ? null : a2.at(-1));
+    Rn = createSelector(V, (a2) => a2.id);
     G = (a2) => a2.peers;
     $t = (a2) => a2.messages.byID;
     Jr = (a2) => a2.messages.allIDs;
@@ -19965,7 +19965,7 @@ var init_dist = __esm({
     };
     ys = dr().version;
     ks = (a2, e = ",") => Object.keys(a2).filter((t) => ie(a2[t])).map((t) => `${t}:${a2[t]}`).join(e);
-    R = class {
+    I = class {
       constructor({ name: e, level: t, properties: i, includesPII: r, timestamp: s }) {
         this.metadata = { peer: {}, userAgent: ot() };
         this.name = e, this.level = t, this.includesPII = r || false, this.properties = i || {}, this.timestamp = s || (/* @__PURE__ */ new Date()).getTime(), this.event_id = (0, import_uuid3.v4)(), this.device_id = vs();
@@ -19977,57 +19977,57 @@ var init_dist = __esm({
     y = class {
       static connect(e, t, i = /* @__PURE__ */ new Date(), r = /* @__PURE__ */ new Date(), s) {
         let o = this.eventNameFor("connect", e === void 0), n = e ? 2 : 1, l = this.getPropertiesWithError(M(S({}, t), { [this.KEY_REQUESTED_AT]: i == null ? void 0 : i.getTime(), [this.KEY_RESPONDED_AT]: r == null ? void 0 : r.getTime(), endpoint: s }), e);
-        return new R({ name: o, level: n, properties: l });
+        return new I({ name: o, level: n, properties: l });
       }
       static disconnect(e, t) {
         let i = "disconnected", r = e ? 2 : 1, s = this.getPropertiesWithError(t, e);
-        return new R({ name: i, level: r, properties: s });
+        return new I({ name: i, level: r, properties: s });
       }
       static preview(i) {
         var r = i, { error: e } = r, t = Yi(r, ["error"]);
         let s = this.eventNameFor("preview", e === void 0), o = e ? 2 : 1, n = this.getPropertiesWithError(t, e);
-        return new R({ name: s, level: o, properties: n });
+        return new I({ name: s, level: o, properties: n });
       }
       static join(i) {
         var r = i, { error: e } = r, t = Yi(r, ["error"]);
         let s = this.eventNameFor("join", e === void 0), o = e ? 2 : 1, n = this.getPropertiesWithError(M(S({}, t), { is_preview_called: !!t.is_preview_called }), e);
-        return new R({ name: s, level: o, properties: n });
+        return new I({ name: s, level: o, properties: n });
       }
       static publish({ devices: e, settings: t, error: i }) {
         let r = this.eventNameFor("publish", i === void 0), s = i ? 2 : 1, o = this.getPropertiesWithError({ devices: e, audio: t == null ? void 0 : t.audio, video: t == null ? void 0 : t.video }, i);
-        return new R({ name: r, level: s, properties: o });
+        return new I({ name: r, level: s, properties: o });
       }
       static hlsPlayerError(e) {
-        return new R({ name: "hlsPlayerError", level: 2, properties: this.getErrorProperties(e) });
+        return new I({ name: "hlsPlayerError", level: 2, properties: this.getErrorProperties(e) });
       }
       static subscribeFail(e) {
         let t = this.eventNameFor("subscribe", false), i = 2, r = this.getErrorProperties(e);
-        return new R({ name: t, level: i, properties: r });
+        return new I({ name: t, level: i, properties: r });
       }
       static leave() {
-        return new R({ name: "leave", level: 1 });
+        return new I({ name: "leave", level: 1 });
       }
       static autoplayError() {
-        return new R({ name: "autoplayError", level: 2 });
+        return new I({ name: "autoplayError", level: 2 });
       }
       static audioPlaybackError(e) {
-        return new R({ name: "audioPlaybackError", level: 2, properties: this.getErrorProperties(e) });
+        return new I({ name: "audioPlaybackError", level: 2, properties: this.getErrorProperties(e) });
       }
       static deviceChange({ isUserSelection: e, selection: t, type: i, devices: r, error: s }) {
         let o = this.eventNameFor(s ? "publish" : `device.${i}`, s === void 0), n = s ? 2 : 1, l = this.getPropertiesWithError({ selection: t, devices: r, isUserSelection: e }, s);
-        return new R({ name: o, level: n, properties: l });
+        return new I({ name: o, level: n, properties: l });
       }
       static performance(e) {
         let t = "perf.stats", i = 1, r = e.toAnalyticsProperties();
-        return new R({ name: t, level: i, properties: r });
+        return new I({ name: t, level: i, properties: r });
       }
       static rtcStats(e) {
         let t = "rtc.stats", i = 1, r = e.toAnalyticsProperties();
-        return new R({ name: t, level: i, properties: r });
+        return new I({ name: t, level: i, properties: r });
       }
       static rtcStatsFailed(e) {
         let t = "rtc.stats.failed", i = 2;
-        return new R({ name: t, level: i, properties: this.getErrorProperties(e) });
+        return new I({ name: t, level: i, properties: this.getErrorProperties(e) });
       }
       static degradationStats(e, t) {
         let i = "video.degradation.stats", r = 1, s = { degradedAt: e.degradedAt, trackId: e.trackId };
@@ -20035,20 +20035,20 @@ var init_dist = __esm({
           let o = /* @__PURE__ */ new Date(), n = o.valueOf() - e.degradedAt.valueOf();
           s = M(S({}, s), { duration: n, restoredAt: o });
         }
-        return new R({ name: i, level: r, properties: s });
+        return new I({ name: i, level: r, properties: s });
       }
       static audioDetectionFail(e, t) {
         let i = this.getPropertiesWithError({ device: t }, e), r = 2, s = "audiopresence.failed";
-        return new R({ name: s, level: r, properties: i });
+        return new I({ name: s, level: r, properties: i });
       }
       static previewNetworkQuality(e) {
-        return new R({ name: "perf.networkquality.preview", level: e.error ? 2 : 1, properties: e });
+        return new I({ name: "perf.networkquality.preview", level: e.error ? 2 : 1, properties: e });
       }
       static publishStats(e) {
-        return new R({ name: "publisher.stats", level: 1, properties: e });
+        return new I({ name: "publisher.stats", level: 1, properties: e });
       }
       static subscribeStats(e) {
-        return new R({ name: "subscriber.stats", level: 1, properties: e });
+        return new I({ name: "subscriber.stats", level: 1, properties: e });
       }
       static eventNameFor(e, t) {
         return `${e}.${t ? "success" : "failed"}`;
@@ -20099,7 +20099,7 @@ var init_dist = __esm({
     q = new ur();
     pr = ((t) => (t.TRANSFORM = "TRANSFORM", t.ANALYZE = "ANALYZE", t))(pr || {});
     hr = ((t) => (t.PLATFORM_NOT_SUPPORTED = "PLATFORM_NOT_SUPPORTED", t.DEVICE_NOT_SUPPORTED = "DEVICE_NOT_SUPPORTED", t))(hr || {});
-    Rs = ((n) => (n.NONE = "none", n.INITIALISED = "initialised", n.STARTED = "started", n.PAUSED = "paused", n.RESUMED = "resumed", n.STOPPED = "stopped", n.FAILED = "failed", n))(Rs || {});
+    Is = ((n) => (n.NONE = "none", n.INITIALISED = "initialised", n.STARTED = "started", n.PAUSED = "paused", n.RESUMED = "resumed", n.STOPPED = "stopped", n.FAILED = "failed", n))(Is || {});
     Hs = ((t) => (t.DVR = "dvr", t.NO_DVR = "no-dvr", t))(Hs || {});
     Cs = ((i) => (i.videoInput = "videoInput", i.audioInput = "audioInput", i.audioOutput = "audioOutput", i))(Cs || {});
     mr = class {
@@ -20233,13 +20233,13 @@ var init_dist = __esm({
       }
     };
     k.level = 0;
-    Ir = (a2, e) => e;
+    Rr = (a2, e) => e;
     Tt = (a2, e) => e;
     qs = (a2, e) => e;
     uo = (a2, e) => e;
     po = (a2, e) => e;
-    J = createSelector([G, Ir], (a2, e) => e ? a2[e] : null);
-    Rr = createSelector([D, Tt], (a2, e) => e ? a2[e] : null);
+    J = createSelector([G, Rr], (a2, e) => e ? a2[e] : null);
+    Ir = createSelector([D, Tt], (a2, e) => e ? a2[e] : null);
     ho = createSelector([D, Tt], (a2, e) => {
       if (!e)
         return null;
@@ -20271,7 +20271,7 @@ var init_dist = __esm({
         return e ? a2[e] : a2;
     }));
     rm = b(createSelector(J, (a2) => a2 == null ? void 0 : a2.name));
-    ai = b(Rr);
+    ai = b(Ir);
     js = b(ho);
     sm = b(mo);
     am = b(So);
@@ -20352,7 +20352,7 @@ var init_dist = __esm({
       return Ys(t == null ? void 0 : t.id)(a2);
     });
     Xs = b((a2, e) => {
-      let t = Rr(a2, e);
+      let t = Ir(a2, e);
       if (t) {
         if (t.type !== "audio") {
           k.w("Please pass audio track here");
@@ -20369,8 +20369,8 @@ var init_dist = __esm({
       let t = zs(e)(a2);
       return Xs(t == null ? void 0 : t.id)(a2);
     });
-    Pm = b((a2, e) => {
-      let t = Rr(a2, e);
+    Em = b((a2, e) => {
+      let t = Ir(a2, e);
       if (t) {
         if (t.type !== "video") {
           k.w("Please pass video track here");
@@ -20379,7 +20379,7 @@ var init_dist = __esm({
         return t.layer;
       }
     });
-    Zs = createSelector([at, ue, Ir], (a2, e, t) => {
+    Zs = createSelector([at, ue, Rr], (a2, e, t) => {
       if (t)
         return a2.filter((i) => {
           var r;
@@ -20398,26 +20398,26 @@ var init_dist = __esm({
       return !e.recipientPeer && !((t = e.recipientRoles) != null && t.length);
     }));
     ko = createSelector([ea, qs], (a2) => a2 ? a2.filter((e) => !e.read).length : 0);
-    Po = createSelector([Zs, Ir], (a2) => a2 ? a2.filter((e) => !e.read).length : 0);
-    Em = createSelector(yo, (a2) => a2.filter((e) => !e.read).length);
+    Eo = createSelector([Zs, Rr], (a2) => a2 ? a2.filter((e) => !e.read).length : 0);
+    Pm = createSelector(yo, (a2) => a2.filter((e) => !e.read).length);
     bm = b(Zs);
     Am = b(ea);
-    Im = b(ko);
-    Rm = b(Po);
+    Rm = b(ko);
+    Im = b(Eo);
     ta = b(To);
     Vm = createSelector([G, D], (a2, e) => Object.values(a2).map((i) => {
       var r;
       return { peer: i, isAudioEnabled: i.audioTrack ? (r = e[i.audioTrack]) == null ? void 0 : r.enabled : false };
     }));
-    Eo = (a2) => a2.roleChangeRequests[0] || null;
-    Bm = createSelector([Eo, G, oe], (a2, e, t) => a2 ? { requestedBy: a2.requestedBy ? e[a2.requestedBy] : void 0, role: t[a2.roleName], token: a2.token } : null);
+    Po = (a2) => a2.roleChangeRequests[0] || null;
+    Bm = createSelector([Po, G, oe], (a2, e, t) => a2 ? { requestedBy: a2.requestedBy ? e[a2.requestedBy] : void 0, role: t[a2.roleName], token: a2.token } : null);
     Fm = createSelector([Wt], (a2) => st(a2));
     Gm = createSelector([Zr], (a2) => st(a2));
     Ao = createSelector([K, D], (a2, e) => {
       let t = null;
       return a2 && (t = e[a2]), (t == null ? void 0 : t.plugins) || [];
     });
-    Io = createSelector([Z, D], (a2, e) => {
+    Ro = createSelector([Z, D], (a2, e) => {
       let t = null;
       return a2 && (t = e[a2]), (t == null ? void 0 : t.plugins) || [];
     });
@@ -20804,7 +20804,7 @@ var init_StreamActions = __esm({
     };
     RecordingPauseStatus = () => {
       const recording = (0, import_react_sdk32.useHMSStore)(import_react_sdk32.selectRecordingState);
-      if (recording.hls && recording.hls.state === Rs.PAUSED) {
+      if (recording.hls && recording.hls.state === Is.PAUSED) {
         return /* @__PURE__ */ import_react72.default.createElement(
           Tooltip,
           {
@@ -21478,7 +21478,7 @@ var init_MwebOptions = __esm({
             mx: "$4"
           }
         },
-        /* @__PURE__ */ import_react78.default.createElement(EmojiReaction, null)
+        /* @__PURE__ */ import_react78.default.createElement(EmojiReaction, { showCard: true })
       ), showRecordingOn && /* @__PURE__ */ import_react78.default.createElement(
         StopRecordingInSheet,
         {
@@ -22388,9 +22388,6 @@ var init_RoleOptions = __esm({
       if (import_react92.default.Children.toArray(children).length === 0) {
         return null;
       }
-      import_react92.default.Children.map(children, (child) => {
-        console.log({ child });
-      });
       return /* @__PURE__ */ import_react92.default.createElement(Dropdown.Root, { open: openOptions, onOpenChange: setOpenOptions }, /* @__PURE__ */ import_react92.default.createElement(
         Dropdown.Trigger,
         {
@@ -22429,9 +22426,12 @@ var init_RoleOptions = __esm({
       const { on_stage_role, off_stage_roles = [] } = (elements == null ? void 0 : elements.on_stage_exp) || {};
       const canRemoveRoleFromStage = (permissions == null ? void 0 : permissions.changeRole) && roleName === on_stage_role;
       const role = (0, import_react_sdk43.useHMSStore)((0, import_react_sdk43.selectRoleByRoleName)(roleName));
+      const tracks = (0, import_react_sdk43.useHMSStore)(import_react_sdk43.selectTracksMap);
+      if (!role) {
+        return null;
+      }
       const canPublishAudio = role.publishParams.allowed.includes("audio");
       const canPublishVideo = role.publishParams.allowed.includes("video");
-      const tracks = (0, import_react_sdk43.useHMSStore)(import_react_sdk43.selectTracksMap);
       let isVideoOnForSomePeers = false;
       let isAudioOnForSomePeers = false;
       peerList.forEach((peer) => {
@@ -25401,13 +25401,17 @@ var init_EmptyChat = __esm({
     init_empty_chat();
     init_useRoomLayoutScreen();
     init_useChatBlacklist();
+    init_hooks();
     EmptyChat = () => {
       var _a8;
       const { elements } = useRoomLayoutConferencingScreen();
       const isLocalPeerBlacklisted = useIsPeerBlacklisted({ local: true });
       const isMobile = (0, import_react_use16.useMedia)(config.media.md);
       const canSendMessages = elements.chat && (elements.chat.public_chat_enabled || elements.chat.private_chat_enabled || elements.chat.roles_whitelist && elements.chat.roles_whitelist.length) && !isLocalPeerBlacklisted;
-      if (isMobile && ((_a8 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a8.is_overlay))
+      const isMobileHLSStream = useMobileHLSStream();
+      const isLandscapeStream = useLandscapeHLSStream();
+      const streaming = isMobileHLSStream || isLandscapeStream;
+      if (isMobile && ((_a8 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a8.is_overlay) && !streaming)
         return /* @__PURE__ */ import_react130.default.createElement(import_react130.default.Fragment, null);
       return /* @__PURE__ */ import_react130.default.createElement(
         Flex,
@@ -25446,13 +25450,13 @@ var init_usePinnedBy = __esm({
       const pinnedMessages = (0, import_react_sdk62.useHMSStore)((0, import_react_sdk62.selectSessionStore)("pinnedMessages" /* PINNED_MESSAGES */));
       const [pinnedBy, setPinnedBy] = (0, import_react131.useState)("");
       (0, import_react131.useEffect)(() => {
-        let match10 = "";
+        let match13 = "";
         pinnedMessages == null ? void 0 : pinnedMessages.forEach((pinnedMessage) => {
           if (pinnedMessage.id === messageId) {
-            match10 = pinnedMessage.pinnedBy;
+            match13 = pinnedMessage.pinnedBy;
           }
         });
-        setPinnedBy(match10);
+        setPinnedBy(match13);
       }, [messageId, pinnedMessages]);
       return pinnedBy;
     };
@@ -26383,7 +26387,7 @@ var init_ChatFooter = __esm({
       if (isLocalPeerBlacklisted) {
         return null;
       }
-      return /* @__PURE__ */ import_react137.default.createElement(Box, { css: { position: "relative" } }, /* @__PURE__ */ import_react137.default.createElement(Flex, null, /* @__PURE__ */ import_react137.default.createElement(ChatSelectorContainer, null), canDisableChat && isMobile && isOverlayChat ? /* @__PURE__ */ import_react137.default.createElement(Flex, { align: "center", justify: "end", css: { mb: "$4" } }, /* @__PURE__ */ import_react137.default.createElement(Popover2.Root, null, /* @__PURE__ */ import_react137.default.createElement(Popover2.Trigger, { asChild: true }, /* @__PURE__ */ import_react137.default.createElement(IconButton, { css: { border: "1px solid $border_bright" } }, /* @__PURE__ */ import_react137.default.createElement(import_react_icons65.VerticalMenuIcon, { height: "16", width: "16" }))), /* @__PURE__ */ import_react137.default.createElement(Popover2.Portal, null, /* @__PURE__ */ import_react137.default.createElement(
+      return /* @__PURE__ */ import_react137.default.createElement(Box, { css: { position: "relative" } }, /* @__PURE__ */ import_react137.default.createElement(Flex, null, /* @__PURE__ */ import_react137.default.createElement(ChatSelectorContainer, null), canDisableChat && isMobile && isOverlayChat ? /* @__PURE__ */ import_react137.default.createElement(Flex, { align: "center", justify: "end", css: { mb: "$4" }, onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react137.default.createElement(Popover2.Root, null, /* @__PURE__ */ import_react137.default.createElement(Popover2.Trigger, { asChild: true }, /* @__PURE__ */ import_react137.default.createElement(IconButton, { css: { border: "1px solid $border_bright" } }, /* @__PURE__ */ import_react137.default.createElement(import_react_icons65.VerticalMenuIcon, { height: "16", width: "16" }))), /* @__PURE__ */ import_react137.default.createElement(Popover2.Portal, null, /* @__PURE__ */ import_react137.default.createElement(
         Popover2.Content,
         {
           align: "end",
@@ -26494,7 +26498,7 @@ var init_ChatFooter = __esm({
           css: {
             alignItems: "center"
           },
-          gap: "1"
+          gap: "2"
         },
         noAVPermissions ? /* @__PURE__ */ import_react137.default.createElement(RaiseHand, { css: { bg: "$surface_default" } }) : null,
         /* @__PURE__ */ import_react137.default.createElement(MoreSettings, { elements, screenType })
@@ -26816,6 +26820,10 @@ var init_Chat = __esm({
         },
         [hmsActions, vanillaStore]
       );
+      if (!(elements == null ? void 0 : elements.chat)) {
+        return null;
+      }
+      const streaming = isMobileHLSStream || isLandscapeStream;
       return /* @__PURE__ */ import_react143.default.createElement(
         Flex,
         {
@@ -26826,18 +26834,18 @@ var init_Chat = __esm({
             gap: "$4"
           }
         },
-        isMobile && ((_a8 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a8.is_overlay) ? null : /* @__PURE__ */ import_react143.default.createElement(PinnedMessage, null),
+        isMobile && ((_a8 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a8.is_overlay) && !streaming ? null : /* @__PURE__ */ import_react143.default.createElement(PinnedMessage, null),
         /* @__PURE__ */ import_react143.default.createElement(ChatBody, { ref: listRef, scrollToBottom }),
         /* @__PURE__ */ import_react143.default.createElement(ChatPaused, null),
         /* @__PURE__ */ import_react143.default.createElement(ChatBlocked, null),
-        isMobile && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay) ? /* @__PURE__ */ import_react143.default.createElement(PinnedMessage, null) : null,
+        isMobile && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay) && !streaming ? /* @__PURE__ */ import_react143.default.createElement(PinnedMessage, null) : null,
         isChatEnabled ? /* @__PURE__ */ import_react143.default.createElement(ChatFooter, { onSend: scrollToBottom }, /* @__PURE__ */ import_react143.default.createElement(NewMessageIndicator, { scrollToBottom, listRef })) : null,
         (isMobileHLSStream || isLandscapeStream) && /* @__PURE__ */ import_react143.default.createElement(
           Box,
           {
             css: __spreadValues({
               position: "absolute"
-            }, (0, import_ts_pattern7.match)({ isLandscapeStream, isChatEnabled }).with(
+            }, (0, import_ts_pattern7.match)({ isLandscapeStream, isMobileHLSStream, isChatEnabled }).with(
               {
                 isLandscapeStream: true,
                 isChatEnabled: true
@@ -26849,12 +26857,24 @@ var init_Chat = __esm({
                 isChatEnabled: false
               },
               () => ({ bottom: "$20", right: "$10" })
+            ).with(
+              {
+                isMobileHLSStream: true,
+                isChatEnabled: false
+              },
+              () => ({ bottom: "$19", right: "$8" })
+            ).with(
+              {
+                isMobileHLSStream: true,
+                isChatEnabled: true
+              },
+              () => ({ bottom: "$17", right: "$8" })
             ).with(
               {
                 isLandscapeStream: false,
                 isChatEnabled: true
               },
-              () => ({ bottom: "$19", right: "$8" })
+              () => ({ bottom: "$20", right: "$8" })
             ).otherwise(() => ({})))
           },
           /* @__PURE__ */ import_react143.default.createElement(EmojiReaction, null)
@@ -27108,7 +27128,7 @@ var init_SidePaneTabs = __esm({
     ParticipantCount2 = ({ count }) => {
       return count < 1e3 ? /* @__PURE__ */ import_react146.default.createElement("span", null, "(", count, ")") : /* @__PURE__ */ import_react146.default.createElement(Tooltip, { title: count }, /* @__PURE__ */ import_react146.default.createElement("span", null, "(", getFormattedCount(count), ")"));
     };
-    SidePaneTabs = import_react146.default.memo(({ active = SIDE_PANE_OPTIONS.CHAT, hideControls, hideTab = false }) => {
+    SidePaneTabs = import_react146.default.memo(({ active = SIDE_PANE_OPTIONS.CHAT, hideTab = false }) => {
       var _a8, _b7;
       const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
       const toggleParticipants = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
@@ -27146,7 +27166,6 @@ var init_SidePaneTabs = __esm({
             css: {
               color: "$on_primary_high",
               h: "100%",
-              marginTop: hideControls && isOverlayChat ? "$17" : "0",
               transition: "margin 0.3s ease-in-out",
               position: "relative"
             }
@@ -27161,7 +27180,6 @@ var init_SidePaneTabs = __esm({
           css: {
             color: "$on_primary_high",
             h: "100%",
-            marginTop: hideControls && isOverlayChat ? "$17" : "0",
             transition: "margin 0.3s ease-in-out"
           }
         },
@@ -28236,16 +28254,13 @@ var init_SidePane = __esm({
       },
       "@md": {
         p: "$6 $8",
-        pb: "$12",
-        borderTopLeftRadius: 0,
-        borderTopRightRadius: 0,
         animation: `${translateAcross({ yFrom: "100%" })} 150ms cubic-bezier(0.22, 1, 0.36, 1)`
       },
       variants: {
         landscapeStream: {
           true: {
             "@lg": {
-              position: "unset !important",
+              position: "unset",
               minHeight: "100%"
             }
           }
@@ -28259,13 +28274,22 @@ var init_SidePane = __esm({
         },
         overlayChat: {
           true: {
-            height: "unset",
-            maxHeight: 300,
-            background: "linear-gradient(180deg, rgba(0, 0, 0, 0.00) 35.94%, rgba(0, 0, 0, 0.64) 100%)",
-            "@md": {
-              pb: "$20"
+            "@lg": {
+              maxHeight: "300px",
+              background: "linear-gradient(180deg, rgba(0, 0, 0, 0.00) 35.94%, rgba(0, 0, 0, 0.64) 100%)",
+              position: "fixed",
+              zIndex: 12,
+              bottom: 0
             }
           }
+        },
+        roomDescription: {
+          true: {
+            overflowY: "auto"
+          }
+        },
+        hideControls: {
+          true: {}
         }
       },
       compoundVariants: [
@@ -28275,7 +28299,10 @@ var init_SidePane = __esm({
           css: {
             position: "unset",
             height: "100%",
-            maxHeight: "unset"
+            maxHeight: "unset",
+            "@md": {
+              pb: 0
+            }
           }
         },
         {
@@ -28286,6 +28313,13 @@ var init_SidePane = __esm({
             height: "100%",
             maxHeight: "unset"
           }
+        },
+        {
+          hideControls: false,
+          overlayChat: true,
+          css: {
+            pb: "$17"
+          }
         }
       ]
     });
@@ -28293,7 +28327,7 @@ var init_SidePane = __esm({
       tileProps,
       hideControls = false
     }) => {
-      var _a8, _b7, _c, _d, _e, _f;
+      var _a8, _b7, _c, _d, _e, _f, _g;
       const isMobile = (0, import_react_use28.useMedia)(config.media.md);
       const sidepane = (0, import_react_sdk78.useHMSStore)((0, import_react_sdk78.selectAppData)(APP_DATA.sidePane));
       const activeScreensharePeerId = (0, import_react_sdk78.useHMSStore)((0, import_react_sdk78.selectAppData)(APP_DATA.activeScreensharePeerId));
@@ -28320,22 +28354,43 @@ var init_SidePane = __esm({
       const mwebStreamingChat = isMobile && sidepane === SIDE_PANE_OPTIONS.CHAT && ((_f = elements == null ? void 0 : elements.chat) == null ? void 0 : _f.is_overlay);
       const commonProps = {
         landscapeStream: isLandscapeHLSStream,
-        mobileStream: isMobileHLSStream
+        mobileStream: isMobileHLSStream,
+        hideControls,
+        overlayChat: !!((_g = elements == null ? void 0 : elements.chat) == null ? void 0 : _g.is_overlay),
+        roomDescription: isMobile && sidepane === SIDE_PANE_OPTIONS.ROOM_DETAILS
       };
+      const SidepaneComponent = (0, import_ts_pattern9.match)(sidepane).with(SIDE_PANE_OPTIONS.POLLS, () => /* @__PURE__ */ import_react154.default.createElement(
+        Wrapper3,
+        __spreadValues({
+          css: {
+            "@md": {
+              borderTopLeftRadius: "$2",
+              borderTopRightRadius: "$2"
+            }
+          }
+        }, commonProps),
+        /* @__PURE__ */ import_react154.default.createElement(Polls, null)
+      )).with(SIDE_PANE_OPTIONS.VB, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadValues({ css: { p: "$10 $6 $10 $10" } }, commonProps), /* @__PURE__ */ import_react154.default.createElement(VBPicker, { backgroundMedia }))).with(SIDE_PANE_OPTIONS.CHAT, SIDE_PANE_OPTIONS.PARTICIPANTS, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadProps(__spreadValues({}, commonProps), { overlayChat: mwebStreamingChat }), /* @__PURE__ */ import_react154.default.createElement(SidePaneTabs, { active: sidepane, hideTab: isMobileHLSStream || isLandscapeHLSStream }))).with(SIDE_PANE_OPTIONS.ROOM_DETAILS, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadValues({}, commonProps), /* @__PURE__ */ import_react154.default.createElement(RoomDetailsPane, null))).otherwise(() => {
+        return null;
+      });
+      if (!trackId && !SidepaneComponent) {
+        return null;
+      }
       return /* @__PURE__ */ import_react154.default.createElement(
         Flex,
         {
           direction: "column",
           justify: "center",
           css: {
-            w: "$100",
+            w: (0, import_ts_pattern9.match)({ isMobileHLSStream, isLandscapeHLSStream }).with({ isLandscapeHLSStream: true }, () => "340px").with({ isMobileHLSStream: true }, () => "100%").otherwise(() => "$100"),
             h: "100%",
             flexShrink: 0,
             gap: "$4",
             position: "relative",
             "&:empty": { display: "none" },
-            "@ls": {
-              w: isMobileHLSStream || isLandscapeHLSStream ? "340px" : "$100"
+            "@md": {
+              position: "absolute",
+              zIndex: 12
             }
           }
         },
@@ -28349,27 +28404,7 @@ var init_SidePane = __esm({
             rootCSS: { p: 0, alignSelf: "start", flexShrink: 0 }
           }, tileLayout)
         ),
-        (0, import_ts_pattern9.match)(sidepane).with(SIDE_PANE_OPTIONS.POLLS, () => /* @__PURE__ */ import_react154.default.createElement(
-          Wrapper3,
-          __spreadValues({
-            css: {
-              "@md": {
-                borderTopLeftRadius: "$2",
-                borderTopRightRadius: "$2"
-              }
-            }
-          }, commonProps),
-          /* @__PURE__ */ import_react154.default.createElement(Polls, null)
-        )).with(SIDE_PANE_OPTIONS.VB, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadValues({ css: { p: "$10 $6 $10 $10" } }, commonProps), /* @__PURE__ */ import_react154.default.createElement(VBPicker, { backgroundMedia }))).with(SIDE_PANE_OPTIONS.CHAT, SIDE_PANE_OPTIONS.PARTICIPANTS, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadProps(__spreadValues({}, commonProps), { overlayChat: mwebStreamingChat }), /* @__PURE__ */ import_react154.default.createElement(
-          SidePaneTabs,
-          {
-            hideControls,
-            active: sidepane,
-            hideTab: isMobileHLSStream || isLandscapeHLSStream
-          }
-        ))).with(SIDE_PANE_OPTIONS.ROOM_DETAILS, () => /* @__PURE__ */ import_react154.default.createElement(Wrapper3, __spreadValues({}, commonProps), /* @__PURE__ */ import_react154.default.createElement(RoomDetailsPane, null))).otherwise(() => {
-          return null;
-        })
+        SidepaneComponent
       );
     };
     SidePane_default = SidePane;
@@ -30501,19 +30536,15 @@ var init_Controls = __esm({
 });
 
 // src/Prebuilt/components/HMSVideo/HMSVideo.jsx
-var import_react182, import_react_use41, HMSVideo;
+var import_react182, HMSVideo;
 var init_HMSVideo = __esm({
   "src/Prebuilt/components/HMSVideo/HMSVideo.jsx"() {
     "use strict";
     init_define_process_env();
     import_react182 = __toESM(require("react"));
-    import_react_use41 = require("react-use");
-    init_src();
-    init_hooks();
+    init_Layout();
     HMSVideo = (0, import_react182.forwardRef)((_a8, videoRef) => {
       var _b7 = _a8, { children } = _b7, props = __objRest(_b7, ["children"]);
-      const isLandscape = useIsLandscape();
-      const isMobile = (0, import_react_use41.useMedia)(config.media.md);
       return /* @__PURE__ */ import_react182.default.createElement(
         Flex,
         __spreadValues({
@@ -30521,6 +30552,13 @@ var init_HMSVideo = __esm({
           css: {
             size: "100%",
             position: "relative",
+            justifyContent: "center",
+            "@md": {
+              height: "auto",
+              "& video": {
+                height: "$60 !important"
+              }
+            },
             "& video::cue": {
               color: "white",
               whiteSpace: "pre-line",
@@ -30544,16 +30582,16 @@ var init_HMSVideo = __esm({
           "video",
           {
             style: {
-              flex: "1 1 0",
               margin: "0 auto",
-              minHeight: "0",
               objectFit: "contain",
-              width: "inherit",
-              height: isLandscape || isMobile ? "100%" : "",
-              position: isLandscape || isMobile ? "absolute" : ""
+              width: "auto",
+              height: "auto",
+              maxWidth: "100%",
+              maxHeight: "100%"
             },
             ref: videoRef,
-            playsInline: true
+            playsInline: true,
+            disablePictureInPicture: true
           }
         ),
         children
@@ -30659,44 +30697,54 @@ var init_VideoProgress = __esm({
     init_src();
     init_PlayerContext();
     init_utils6();
-    VideoProgress = () => {
+    VideoProgress = ({
+      seekProgress,
+      setSeekProgress
+    }) => {
       const { hlsPlayer: hlsPlayer2 } = useHMSPlayerContext();
       const [videoProgress, setVideoProgress] = (0, import_react186.useState)(0);
       const [bufferProgress, setBufferProgress] = (0, import_react186.useState)(0);
       const videoEl = hlsPlayer2 == null ? void 0 : hlsPlayer2.getVideoElement();
-      const onValueChange = (time) => {
-        hlsPlayer2 == null ? void 0 : hlsPlayer2.seekTo(time);
-      };
+      const setProgress = (0, import_react186.useCallback)(() => {
+        var _a8, _b7;
+        if (!videoEl) {
+          return;
+        }
+        const duration = isFinite(videoEl.duration) ? videoEl.duration : ((_a8 = videoEl.seekable) == null ? void 0 : _a8.end(0)) || 0;
+        const videoProgress2 = Math.floor(getPercentage(videoEl.currentTime, duration));
+        let bufferProgress2 = 0;
+        if (videoEl.buffered.length > 0) {
+          bufferProgress2 = Math.floor(getPercentage((_b7 = videoEl.buffered) == null ? void 0 : _b7.end(0), duration));
+        }
+        setVideoProgress(isNaN(videoProgress2) ? 0 : videoProgress2);
+        setBufferProgress(isNaN(bufferProgress2) ? 0 : bufferProgress2);
+      }, [videoEl]);
+      const timeupdateHandler = (0, import_react186.useCallback)(() => {
+        if (!videoEl || seekProgress) {
+          return;
+        }
+        setProgress();
+      }, [seekProgress, setProgress, videoEl]);
       (0, import_react186.useEffect)(() => {
         if (!videoEl) {
           return;
         }
-        const timeupdateHandler = () => {
-          var _a8, _b7;
-          if (!videoEl) {
-            return;
-          }
-          const duration = isFinite(videoEl.duration) ? videoEl.duration : ((_a8 = videoEl.seekable) == null ? void 0 : _a8.end(0)) || 0;
-          const videoProgress2 = Math.floor(getPercentage(videoEl.currentTime, duration));
-          let bufferProgress2 = 0;
-          if (videoEl.buffered.length > 0) {
-            bufferProgress2 = Math.floor(getPercentage((_b7 = videoEl.buffered) == null ? void 0 : _b7.end(0), duration));
-          }
-          setVideoProgress(isNaN(videoProgress2) ? 0 : videoProgress2);
-          setBufferProgress(isNaN(bufferProgress2) ? 0 : bufferProgress2);
-        };
         videoEl.addEventListener("timeupdate", timeupdateHandler);
         return function cleanup() {
           videoEl == null ? void 0 : videoEl.removeEventListener("timeupdate", timeupdateHandler);
         };
-      }, [videoEl]);
+      }, [timeupdateHandler, videoEl]);
       const onProgress = (progress) => {
+        var _a8;
         const progress1 = Math.floor(getPercentage(progress[0], 100));
         const videoEl2 = hlsPlayer2 == null ? void 0 : hlsPlayer2.getVideoElement();
-        const currentTime = progress1 * ((videoEl2 == null ? void 0 : videoEl2.duration) || 0) / 100;
-        if (onValueChange) {
-          onValueChange(currentTime);
+        if (!videoEl2) {
+          return;
         }
+        const duration = isFinite(videoEl2.duration) ? videoEl2.duration : ((_a8 = videoEl2.seekable) == null ? void 0 : _a8.end(0)) || 0;
+        const currentTime = progress1 * duration / 100;
+        hlsPlayer2 == null ? void 0 : hlsPlayer2.seekTo(currentTime);
+        setProgress();
       };
       if (!videoEl) {
         return null;
@@ -30717,6 +30765,8 @@ var init_VideoProgress = __esm({
           value: [videoProgress],
           showTooltip: false,
           onValueChange: onProgress,
+          onPointerDown: () => setSeekProgress(true),
+          onPointerUp: () => setSeekProgress(false),
           thumbStyles: { w: "$6", h: "$6" }
         }
       ), /* @__PURE__ */ import_react186.default.createElement(
@@ -30916,7 +30966,7 @@ function HLSAutoplayBlockedPrompt({
   unblockAutoPlay
 }) {
   const isLandscape = useIsLandscape();
-  const isMobile = (0, import_react_use42.useMedia)(config.media.md);
+  const isMobile = (0, import_react_use41.useMedia)(config.media.md);
   if ((isMobile || isLandscape) && open) {
     return /* @__PURE__ */ import_react190.default.createElement(
       IconButton,
@@ -30968,13 +31018,13 @@ function HLSAutoplayBlockedPrompt({
     )))
   );
 }
-var import_react190, import_react_use42, import_react_icons89;
+var import_react190, import_react_use41, import_react_icons89;
 var init_HLSAutoplayBlockedPrompt = __esm({
   "src/Prebuilt/components/HMSVideo/HLSAutoplayBlockedPrompt.tsx"() {
     "use strict";
     init_define_process_env();
     import_react190 = __toESM(require("react"));
-    import_react_use42 = require("react-use");
+    import_react_use41 = require("react-use");
     import_react_icons89 = require("@100mslive/react-icons");
     init_src();
     init_DialogContent2();
@@ -31009,7 +31059,7 @@ function HLSQualitySelector({
   isAuto,
   containerRef
 }) {
-  const isMobile = (0, import_react_use43.useMedia)(config.media.md);
+  const isMobile = (0, import_react_use42.useMedia)(config.media.md);
   const isLandscape = useIsLandscape();
   if (layers.length === 0) {
     return null;
@@ -31202,13 +31252,13 @@ function HLSQualitySelector({
     )
   )));
 }
-var import_react192, import_react_use43, import_react_icons91, getQualityText, getBitrateText;
+var import_react192, import_react_use42, import_react_icons91, getQualityText, getBitrateText;
 var init_HLSQualitySelector = __esm({
   "src/Prebuilt/components/HMSVideo/HLSQualitySelector.tsx"() {
     "use strict";
     init_define_process_env();
     import_react192 = __toESM(require("react"));
-    import_react_use43 = require("react-use");
+    import_react_use42 = require("react-use");
     import_react_icons91 = require("@100mslive/react-icons");
     init_src();
     init_Sheet2();
@@ -31235,7 +31285,7 @@ var init_MwebHLSViewTitle = __esm({
     init_useSidepane();
     init_constants();
     HLSViewTitle = () => {
-      const { title, details } = useRoomLayoutHeader();
+      const { title, details, description } = useRoomLayoutHeader();
       const toggleDetailsPane = useSidepaneToggle(SIDE_PANE_OPTIONS.ROOM_DETAILS);
       const isDetailSidepaneOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.ROOM_DETAILS);
       if (isDetailSidepaneOpen) {
@@ -31284,7 +31334,7 @@ var init_MwebHLSViewTitle = __esm({
           }
         },
         /* @__PURE__ */ import_react193.default.createElement(Logo, null),
-        /* @__PURE__ */ import_react193.default.createElement(Flex, { direction: "column" }, title ? /* @__PURE__ */ import_react193.default.createElement(Text, { variant: "sub2", css: { fontWeight: "$semiBold" } }, title) : null, /* @__PURE__ */ import_react193.default.createElement(Flex, null, /* @__PURE__ */ import_react193.default.createElement(RoomDetailsRow, { details }), /* @__PURE__ */ import_react193.default.createElement(Text, { variant: "caption", css: { color: "$on_surface_medium" }, onClick: toggleDetailsPane }, "\xA0...more")))
+        /* @__PURE__ */ import_react193.default.createElement(Flex, { direction: "column" }, title ? /* @__PURE__ */ import_react193.default.createElement(Text, { variant: "sub2", css: { fontWeight: "$semiBold" } }, title) : null, /* @__PURE__ */ import_react193.default.createElement(Flex, null, /* @__PURE__ */ import_react193.default.createElement(RoomDetailsRow, { details }), description ? /* @__PURE__ */ import_react193.default.createElement(Text, { variant: "caption", css: { color: "$on_surface_medium" }, onClick: toggleDetailsPane }, "\xA0...more") : null))
       );
     };
   }
@@ -31295,15 +31345,16 @@ var HLSView_exports = {};
 __export(HLSView_exports, {
   default: () => HLSView_default
 });
-var import_react194, import_react_use44, import_hls_player3, import_screenfull3, import_react_sdk96, import_react_icons93, hlsPlayer, toastMap, HLSView, HLSView_default;
+var import_react194, import_react_use43, import_hls_player3, import_screenfull3, import_ts_pattern10, import_react_sdk96, import_react_icons93, hlsPlayer, toastMap, ToggleChat, HLSView, HLSView_default;
 var init_HLSView = __esm({
   "src/Prebuilt/layouts/HLSView.jsx"() {
     "use strict";
     init_define_process_env();
     import_react194 = __toESM(require("react"));
-    import_react_use44 = require("react-use");
+    import_react_use43 = require("react-use");
     import_hls_player3 = require("@100mslive/hls-player");
     import_screenfull3 = __toESM(require("screenfull"));
+    import_ts_pattern10 = require("ts-pattern");
     import_react_sdk96 = require("@100mslive/react-sdk");
     import_react_icons93 = require("@100mslive/react-icons");
     init_ChatToggle();
@@ -31329,13 +31380,29 @@ var init_HLSView = __esm({
     init_hooks();
     init_constants();
     toastMap = {};
+    ToggleChat = () => {
+      const { elements } = useRoomLayoutConferencingScreen();
+      const sidepane = (0, import_react_sdk96.useHMSStore)((0, import_react_sdk96.selectAppData)(APP_DATA.sidePane));
+      const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
+      const showChat = !!(elements == null ? void 0 : elements.chat);
+      const isMobile = (0, import_react_use43.useMedia)(config.media.md);
+      const hmsActions = (0, import_react_sdk96.useHMSActions)();
+      (0, import_react194.useEffect)(() => {
+        (0, import_ts_pattern10.match)({ sidepane, isMobile, showChat }).with({ isMobile: true, showChat: true, sidepane: import_ts_pattern10.P.when((value) => !value) }, () => {
+          toggleChat();
+        }).with({ showChat: false, isMobile: true, sidepane: SIDE_PANE_OPTIONS.CHAT }, () => {
+          hmsActions.setAppData(APP_DATA.sidePane, "");
+        }).otherwise(() => {
+        });
+      }, [sidepane, isMobile, toggleChat, showChat, hmsActions]);
+      return null;
+    };
     HLSView = () => {
       var _a8, _b7, _c, _d, _e, _f;
       const videoRef = (0, import_react194.useRef)(null);
       const hlsViewRef = (0, import_react194.useRef)();
       const hlsState = (0, import_react_sdk96.useHMSStore)(import_react_sdk96.selectHLSState);
       const enablHlsStats = (0, import_react_sdk96.useHMSStore)((0, import_react_sdk96.selectAppData)(APP_DATA.hlsStats));
-      const { elements, screenType } = useRoomLayoutConferencingScreen();
       const notification = (0, import_react_sdk96.useHMSNotifications)(import_react_sdk96.HMSNotificationTypes.POLL_STOPPED);
       const hmsActions = (0, import_react_sdk96.useHMSActions)();
       const { themeType } = useTheme();
@@ -31350,31 +31417,22 @@ var init_HLSView = __esm({
       const [isHlsAutoplayBlocked, setIsHlsAutoplayBlocked] = (0, import_react194.useState)(false);
       const [isSeekEnabled, setIsSeekEnabled] = (0, import_react194.useState)(false);
       const [isPaused, setIsPaused] = (0, import_react194.useState)(false);
-      const [show, toggle] = (0, import_react_use44.useToggle)(false);
-      const lastHlsUrl = (0, import_react_use44.usePrevious)(hlsUrl);
-      const togglePollView = usePollViewToggle();
+      const [show, toggle] = (0, import_react_use43.useToggle)(false);
+      const lastHlsUrl = (0, import_react_use43.usePrevious)(hlsUrl);
       const vanillaStore = (0, import_react_sdk96.useHMSVanillaStore)();
       const [controlsVisible, setControlsVisible] = (0, import_react194.useState)(true);
       const [isUserSelectedAuto, setIsUserSelectedAuto] = (0, import_react194.useState)(true);
       const [qualityDropDownOpen, setQualityDropDownOpen] = (0, import_react194.useState)(false);
       const controlsRef = (0, import_react194.useRef)(null);
       const controlsTimerRef = (0, import_react194.useRef)();
-      const sidepane = (0, import_react_sdk96.useHMSStore)((0, import_react_sdk96.selectAppData)(APP_DATA.sidePane));
-      const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
-      const showChat = !!(elements == null ? void 0 : elements.chat);
+      const [seekProgress, setSeekProgress] = (0, import_react194.useState)(false);
       const isFullScreenSupported = import_screenfull3.default.isEnabled;
-      const isMobile = (0, import_react_use44.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use43.useMedia)(config.media.md);
       const isLandscape = useIsLandscape();
-      const isFullScreen = (0, import_react_use44.useFullscreen)(hlsViewRef, show, {
+      const isFullScreen = (0, import_react_use43.useFullscreen)(hlsViewRef, show, {
         onClose: () => toggle(false)
       });
       const [showLoader, setShowLoader] = (0, import_react194.useState)(false);
-      const isMwebHLSStream = screenType === "hls_live_streaming" && isMobile;
-      (0, import_react194.useEffect)(() => {
-        if (sidepane === "" && isMwebHLSStream && showChat) {
-          toggleChat();
-        }
-      }, [sidepane, isMwebHLSStream, toggleChat, showChat]);
       (0, import_react194.useEffect)(() => {
         const videoEl = videoRef.current;
         const showLoader2 = () => setShowLoader(true);
@@ -31453,7 +31511,13 @@ var init_HLSView = __esm({
                 action: /* @__PURE__ */ import_react194.default.createElement(
                   Button,
                   {
-                    onClick: () => togglePollView(pollId),
+                    onClick: () => {
+                      hmsActions.setAppData(APP_DATA.pollState, {
+                        [POLL_STATE.pollInView]: pollId,
+                        [POLL_STATE.view]: POLL_VIEWS.VOTE
+                      });
+                      hmsActions.setAppData(APP_DATA.sidePane, SIDE_PANE_OPTIONS.POLLS);
+                    },
                     variant: "standard",
                     css: {
                       backgroundColor: "$surface_bright",
@@ -31518,7 +31582,7 @@ var init_HLSView = __esm({
             hlsPlayer.reset();
           };
         }
-      }, [hlsUrl, togglePollView, vanillaStore]);
+      }, [hlsUrl, vanillaStore, hmsActions]);
       (0, import_react194.useEffect)(() => {
         const onHLSStats = (state) => setHlsStatsState(state);
         if (enablHlsStats) {
@@ -31551,14 +31615,16 @@ var init_HLSView = __esm({
           clearTimeout(controlsTimerRef.current);
         }
         controlsTimerRef.current = setTimeout(() => {
-          setControlsVisible(false);
+          if (!seekProgress) {
+            setControlsVisible(false);
+          }
         }, 5e3);
         return () => {
           if (controlsTimerRef.current) {
             clearTimeout(controlsTimerRef.current);
           }
         };
-      }, [controlsVisible, isFullScreen, qualityDropDownOpen]);
+      }, [controlsVisible, isFullScreen, seekProgress, qualityDropDownOpen]);
       const onSeekTo = (0, import_react194.useCallback)((seek) => {
         var _a9;
         hlsPlayer == null ? void 0 : hlsPlayer.seekTo(((_a9 = videoRef.current) == null ? void 0 : _a9.currentTime) + seek);
@@ -31601,17 +31667,33 @@ var init_HLSView = __esm({
             setControlsVisible(true);
             return;
           }
-          if (event.type === "mouseleave") {
+          if (event.type === "mouseleave" && !seekProgress) {
             setControlsVisible(false);
-          } else if (isFullScreen && !controlsVisible && event.type === "mousemove") {
+          } else if (!controlsVisible && event.type === "mousemove") {
             setControlsVisible(true);
             if (controlsTimerRef.current) {
               clearTimeout(controlsTimerRef.current);
             }
           }
         },
-        [controlsVisible, isFullScreen, isLandscape, isMobile, qualityDropDownOpen]
+        [controlsVisible, isLandscape, isMobile, qualityDropDownOpen, seekProgress]
       );
+      if (!hlsUrl || streamEnded) {
+        return /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, /* @__PURE__ */ import_react194.default.createElement(ToggleChat, null), hlsViewRef.current && (isMobile || isLandscape) && /* @__PURE__ */ import_react194.default.createElement(Box, { css: { position: "fixed", left: "$4", top: "$4", zIndex: 11 } }, /* @__PURE__ */ import_react194.default.createElement(LeaveRoom, { screenType: "hls_live_streaming", container: hlsViewRef.current })), /* @__PURE__ */ import_react194.default.createElement(
+          Flex,
+          {
+            key: "hls-viewer",
+            id: `hls-viewer-${themeType}`,
+            ref: hlsViewRef,
+            direction: isMobile || isLandscape ? "column" : "row",
+            justify: "center",
+            css: {
+              flex: isLandscape ? "2 1 0" : "1 1 0"
+            }
+          },
+          /* @__PURE__ */ import_react194.default.createElement(Flex, { align: "center", justify: "center", direction: "column", css: { size: "100%", px: "$10" } }, /* @__PURE__ */ import_react194.default.createElement(Flex, { css: { c: "$on_surface_high", r: "$round", bg: "$surface_default", p: "$2" } }, streamEnded ? /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.ColoredHandIcon, { height: 56, width: 56 }) : /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.GoLiveIcon, { height: 56, width: 56 })), /* @__PURE__ */ import_react194.default.createElement(Text, { variant: "h5", css: { c: "$on_surface_high", mt: "$10", mb: 0, textAlign: "center" } }, streamEnded ? "Stream has ended" : "Stream yet to start"), /* @__PURE__ */ import_react194.default.createElement(Text, { variant: "md", css: { textAlign: "center", mt: "$4", c: "$on_surface_medium" } }, streamEnded ? "Have a nice day!" : "Sit back and relax"))
+        ));
+      }
       return /* @__PURE__ */ import_react194.default.createElement(
         Flex,
         {
@@ -31619,13 +31701,18 @@ var init_HLSView = __esm({
           id: `hls-viewer-${themeType}`,
           ref: hlsViewRef,
           direction: isMobile || isLandscape ? "column" : "row",
+          justify: "center",
           css: {
-            w: sidepane !== "" && isLandscape ? "" : "100%",
-            h: sidepane !== "" && isMobile ? "36%" : "100%",
-            flex: "1 1 0"
+            flex: isLandscape ? "2 1 0" : "1 1 0",
+            "&:fullscreen": {
+              "& video": {
+                height: "unset !important"
+              }
+            }
           }
         },
-        hlsUrl && !streamEnded ? /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, /* @__PURE__ */ import_react194.default.createElement(HMSPlayerContext.Provider, { value: { hlsPlayer } }, (hlsStatsState == null ? void 0 : hlsStatsState.url) && enablHlsStats && !(isMobile || isLandscape) ? /* @__PURE__ */ import_react194.default.createElement(HlsStatsOverlay, { hlsStatsState, onClose: sfnOverlayClose }) : null, /* @__PURE__ */ import_react194.default.createElement(
+        hlsViewRef.current && (isMobile || isLandscape) && /* @__PURE__ */ import_react194.default.createElement(Box, { css: { position: "fixed", left: "$4", top: "$4", zIndex: 11 } }, /* @__PURE__ */ import_react194.default.createElement(LeaveRoom, { screenType: "hls_live_streaming", container: hlsViewRef.current })),
+        /* @__PURE__ */ import_react194.default.createElement(HMSPlayerContext.Provider, { value: { hlsPlayer } }, (hlsStatsState == null ? void 0 : hlsStatsState.url) && enablHlsStats && !(isMobile || isLandscape) ? /* @__PURE__ */ import_react194.default.createElement(HlsStatsOverlay, { hlsStatsState, onClose: sfnOverlayClose }) : null, /* @__PURE__ */ import_react194.default.createElement(
           Flex,
           {
             id: "hls-player-container",
@@ -31633,7 +31720,10 @@ var init_HLSView = __esm({
             justify: "center",
             css: {
               size: "100%",
-              margin: "0 auto"
+              margin: "0 auto",
+              "@md": {
+                height: "auto"
+              }
             }
           },
           !(isMobile || isLandscape) && /* @__PURE__ */ import_react194.default.createElement(HLSAutoplayBlockedPrompt, { open: isHlsAutoplayBlocked, unblockAutoPlay }),
@@ -31660,12 +31750,13 @@ var init_HLSView = __esm({
                 onDoubleClickHandler(e);
               }
             },
-            /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, isMobile || isLandscape ? /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, !showLoader && ((_b7 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _b7.playlist_type) === import_react_sdk96.HLSPlaylistType.DVR && /* @__PURE__ */ import_react194.default.createElement(
+            /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, isMobile || isLandscape ? /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, /* @__PURE__ */ import_react194.default.createElement(
               Flex,
               {
                 align: "center",
                 justify: "center",
                 css: {
+                  position: "absolute",
                   bg: "#00000066",
                   display: "inline-flex",
                   gap: "$2",
@@ -31675,7 +31766,7 @@ var init_HLSView = __esm({
                   opacity: controlsVisible ? `1` : "0"
                 }
               },
-              /* @__PURE__ */ import_react194.default.createElement(
+              !showLoader && ((_b7 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _b7.playlist_type) === import_react_sdk96.HLSPlaylistType.DVR && /* @__PURE__ */ import_react194.default.createElement(import_react194.default.Fragment, null, /* @__PURE__ */ import_react194.default.createElement(
                 HMSVideoPlayer.Seeker,
                 {
                   title: "backward",
@@ -31685,8 +31776,7 @@ var init_HLSView = __esm({
                   }
                 },
                 /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.BackwardArrowIcon, { width: 32, height: 32 })
-              ),
-              /* @__PURE__ */ import_react194.default.createElement(
+              ), /* @__PURE__ */ import_react194.default.createElement(
                 Box,
                 {
                   css: {
@@ -31695,8 +31785,7 @@ var init_HLSView = __esm({
                   }
                 },
                 /* @__PURE__ */ import_react194.default.createElement(HMSVideoPlayer.PlayPauseButton, { isPaused, width: 48, height: 48 })
-              ),
-              /* @__PURE__ */ import_react194.default.createElement(
+              ), /* @__PURE__ */ import_react194.default.createElement(
                 HMSVideoPlayer.Seeker,
                 {
                   title: "forward",
@@ -31706,7 +31795,7 @@ var init_HLSView = __esm({
                   }
                 },
                 /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.ForwardArrowIcon, { width: 32, height: 32 })
-              )
+              ))
             ), /* @__PURE__ */ import_react194.default.createElement(
               Flex,
               {
@@ -31732,7 +31821,6 @@ var init_HLSView = __esm({
                     p: "$4 $8"
                   }
                 },
-                /* @__PURE__ */ import_react194.default.createElement(HMSVideoPlayer.Controls.Left, null, hlsViewRef.current && /* @__PURE__ */ import_react194.default.createElement(LeaveRoom, { screenType, container: hlsViewRef.current })),
                 /* @__PURE__ */ import_react194.default.createElement(HMSVideoPlayer.Controls.Right, null, isLandscape && /* @__PURE__ */ import_react194.default.createElement(ChatToggle, null), hasCaptions && !isHlsAutoplayBlocked && /* @__PURE__ */ import_react194.default.createElement(HLSCaptionSelector, { isEnabled: isCaptionEnabled }), hlsViewRef.current && availableLayers.length > 0 && !isHlsAutoplayBlocked ? /* @__PURE__ */ import_react194.default.createElement(
                   HLSQualitySelector,
                   {
@@ -31746,7 +31834,7 @@ var init_HLSView = __esm({
                   }
                 ) : null, /* @__PURE__ */ import_react194.default.createElement(HLSAutoplayBlockedPrompt, { open: isHlsAutoplayBlocked, unblockAutoPlay }))
               )
-            )) : null, /* @__PURE__ */ import_react194.default.createElement(
+            )) : null, controlsVisible && /* @__PURE__ */ import_react194.default.createElement(
               Flex,
               {
                 ref: controlsRef,
@@ -31762,12 +31850,10 @@ var init_HLSView = __esm({
                   width: "100%",
                   pt: "$8",
                   flexShrink: 0,
-                  transition: "visibility 0s 0.5s, opacity 0.5s linear",
-                  visibility: controlsVisible ? `` : `hidden`,
-                  opacity: controlsVisible ? `1` : "0"
+                  transition: "visibility 0s 0.5s, opacity 0.5s linear"
                 }
               },
-              ((_d = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _d.playlist_type) === import_react_sdk96.HLSPlaylistType.DVR ? /* @__PURE__ */ import_react194.default.createElement(HMSVideoPlayer.Progress, null) : null,
+              ((_d = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _d.playlist_type) === import_react_sdk96.HLSPlaylistType.DVR ? /* @__PURE__ */ import_react194.default.createElement(HMSVideoPlayer.Progress, { seekProgress, setSeekProgress }) : null,
               /* @__PURE__ */ import_react194.default.createElement(
                 HMSVideoPlayer.Controls.Root,
                 {
@@ -31840,7 +31926,9 @@ var init_HLSView = __esm({
               )
             ))
           )
-        )), isMobile && !isFullScreen && /* @__PURE__ */ import_react194.default.createElement(HLSViewTitle, null)) : /* @__PURE__ */ import_react194.default.createElement(Flex, { align: "center", justify: "center", direction: "column", css: { size: "100%", px: "$10" } }, /* @__PURE__ */ import_react194.default.createElement(Flex, { align: "center", gap: "2", css: { position: "absolute", left: "$4", top: "$4", zIndex: 1 } }, isMobile || isLandscape ? /* @__PURE__ */ import_react194.default.createElement(LeaveRoom, { screenType }) : null), /* @__PURE__ */ import_react194.default.createElement(Flex, { css: { c: "$on_surface_high", r: "$round", bg: "$surface_default", p: "$2" } }, streamEnded ? /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.ColoredHandIcon, { height: 56, width: 56 }) : /* @__PURE__ */ import_react194.default.createElement(import_react_icons93.GoLiveIcon, { height: 56, width: 56 })), /* @__PURE__ */ import_react194.default.createElement(Text, { variant: "h5", css: { c: "$on_surface_high", mt: "$10", mb: 0, textAlign: "center" } }, streamEnded ? "Stream has ended" : "Stream yet to start"), /* @__PURE__ */ import_react194.default.createElement(Text, { variant: "md", css: { textAlign: "center", mt: "$4", c: "$on_surface_medium" } }, streamEnded ? "Have a nice day!" : "Sit back and relax"))
+        )),
+        /* @__PURE__ */ import_react194.default.createElement(ToggleChat, null),
+        isMobile && !isFullScreen && /* @__PURE__ */ import_react194.default.createElement(HLSViewTitle, null)
       );
     };
     HLSView_default = HLSView;
@@ -31848,12 +31936,13 @@ var init_HLSView = __esm({
 });
 
 // src/Prebuilt/layouts/VideoStreamingSection.tsx
-var import_react195, import_react_sdk97, HLSView2, VideoStreamingSection;
+var import_react195, import_ts_pattern11, import_react_sdk97, HLSView2, VideoStreamingSection;
 var init_VideoStreamingSection = __esm({
   "src/Prebuilt/layouts/VideoStreamingSection.tsx"() {
     "use strict";
     init_define_process_env();
     import_react195 = __toESM(require("react"));
+    import_ts_pattern11 = require("ts-pattern");
     import_react_sdk97 = require("@100mslive/react-sdk");
     init_FullPageProgress();
     init_GridLayout();
@@ -31923,14 +32012,15 @@ var init_VideoStreamingSection = __esm({
             position: "relative",
             gap: isMobileHLSStream || isLandscapeHLSStream ? "0" : "$4"
           },
-          direction: isMobileHLSStream ? "column" : "row"
+          direction: (0, import_ts_pattern11.match)({ isLandscapeHLSStream, isMobileHLSStream }).with({ isLandscapeHLSStream: true }, () => "row").with({ isMobileHLSStream: true }, () => "column").otherwise(() => "row")
         },
         ViewComponent,
         /* @__PURE__ */ import_react195.default.createElement(
           Box,
           {
             css: {
-              flex: isMobileHLSStream ? "1 1 0" : void 0,
+              flex: (0, import_ts_pattern11.match)({ isLandscapeHLSStream, isMobileHLSStream }).with({ isLandscapeHLSStream: true }, () => "1  1 0").with({ isMobileHLSStream: true }, () => "2 1 0").otherwise(() => void 0),
+              position: "relative",
               height: !isMobileHLSStream ? "100%" : void 0,
               maxHeight: "100%",
               "&:empty": { display: "none" },
@@ -31952,13 +32042,13 @@ var init_VideoStreamingSection = __esm({
 });
 
 // src/Prebuilt/components/Header/RoomDetailsHeader.tsx
-var import_react196, import_react_use45, import_react_icons94, RoomDetailsHeader;
+var import_react196, import_react_use44, import_react_icons94, RoomDetailsHeader;
 var init_RoomDetailsHeader = __esm({
   "src/Prebuilt/components/Header/RoomDetailsHeader.tsx"() {
     "use strict";
     init_define_process_env();
     import_react196 = __toESM(require("react"));
-    import_react_use45 = require("react-use");
+    import_react_use44 = require("react-use");
     import_react_icons94 = require("@100mslive/react-icons");
     init_Layout();
     init_Text2();
@@ -31969,7 +32059,7 @@ var init_RoomDetailsHeader = __esm({
     init_constants();
     RoomDetailsHeader = () => {
       const { title, description } = useRoomLayoutHeader();
-      const isMobile = (0, import_react_use45.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use44.useMedia)(config.media.md);
       const clipLength = 30;
       const toggleDetailsPane = useSidepaneToggle(SIDE_PANE_OPTIONS.ROOM_DETAILS);
       const toggleDetailsSheet = useSheetToggle(SHEET_OPTIONS.ROOM_DETAILS);
@@ -32147,13 +32237,13 @@ var init_common2 = __esm({
 });
 
 // src/Prebuilt/components/Header/Header.tsx
-var import_react198, import_react_use46, import_react_sdk99, Header2;
+var import_react198, import_react_use45, import_react_sdk99, Header2;
 var init_Header = __esm({
   "src/Prebuilt/components/Header/Header.tsx"() {
     "use strict";
     init_define_process_env();
     import_react198 = __toESM(require("react"));
-    import_react_use46 = require("react-use");
+    import_react_use45 = require("react-use");
     import_react_sdk99 = require("@100mslive/react-sdk");
     init_src();
     init_HeaderComponents();
@@ -32162,7 +32252,7 @@ var init_Header = __esm({
     init_common2();
     Header2 = () => {
       const roomState = (0, import_react_sdk99.useHMSStore)(import_react_sdk99.selectRoomState);
-      const isMobile = (0, import_react_use46.useMedia)(config.media.md);
+      const isMobile = (0, import_react_use45.useMedia)(config.media.md);
       if (roomState !== import_react_sdk99.HMSRoomState.Connected) {
         return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null);
       }
@@ -32237,6 +32327,7 @@ var init_ConferenceScreen = __esm({
     init_Layout();
     init_AppContext();
     init_VideoStreamingSection();
+    init_EmojiReaction();
     init_FullPageProgress();
     init_Header2();
     init_PreviousRoleInMetadata();
@@ -32380,13 +32471,25 @@ var init_ConferenceScreen = __esm({
           css: {
             alignItems: "center",
             pr: "$4",
-            pb: "$4"
+            pb: "$4",
+            position: "relative"
           },
           justify: "end",
-          gap: "1"
+          gap: "2"
         },
         noAVPermissions ? /* @__PURE__ */ import_react200.default.createElement(RaiseHand, null) : null,
-        /* @__PURE__ */ import_react200.default.createElement(MoreSettings, { elements: screenProps.elements, screenType: screenProps.screenType })
+        /* @__PURE__ */ import_react200.default.createElement(MoreSettings, { elements: screenProps.elements, screenType: screenProps.screenType }),
+        /* @__PURE__ */ import_react200.default.createElement(
+          Box,
+          {
+            css: {
+              position: "absolute",
+              bottom: "100%",
+              mb: "$4"
+            }
+          },
+          /* @__PURE__ */ import_react200.default.createElement(EmojiReaction, null)
+        )
       ), /* @__PURE__ */ import_react200.default.createElement(RoleChangeRequestModal, null), /* @__PURE__ */ import_react200.default.createElement(HLSFailureModal, null), /* @__PURE__ */ import_react200.default.createElement(ActivatedPIP, null), /* @__PURE__ */ import_react200.default.createElement(PreviousRoleInMetadata, null)));
     };
   }
@@ -32689,13 +32792,13 @@ var init_useRedirectToLeave = __esm({
 });
 
 // src/Prebuilt/AppStateContext.tsx
-var import_react206, import_react_use47, import_react_sdk104, AppStateContext, useHMSAppStateContext, useAppStateManager;
+var import_react206, import_react_use46, import_react_sdk104, AppStateContext, useHMSAppStateContext, useAppStateManager;
 var init_AppStateContext = __esm({
   "src/Prebuilt/AppStateContext.tsx"() {
     "use strict";
     init_define_process_env();
     import_react206 = __toESM(require("react"));
-    import_react_use47 = require("react-use");
+    import_react_use46 = require("react-use");
     import_react_sdk104 = require("@100mslive/react-sdk");
     init_VBHandler();
     init_roomLayoutProvider();
@@ -32718,7 +32821,7 @@ var init_AppStateContext = __esm({
       const roomLayout = useRoomLayout();
       const [activeState, setActiveState] = import_react206.default.useState();
       const roomState = (0, import_react_sdk104.useHMSStore)(import_react_sdk104.selectRoomState);
-      const prevRoomState = (0, import_react_use47.usePreviousDistinct)(roomState);
+      const prevRoomState = (0, import_react_use46.usePreviousDistinct)(roomState);
       const { isLeaveScreenEnabled } = useRoomLayoutLeaveScreen();
       const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
       const { redirectToLeave } = useRedirectToLeave();
@@ -32807,13 +32910,14 @@ var init_LeaveScreen = __esm({
 });
 
 // src/Prebuilt/components/MwebLandscapePrompt.tsx
-var import_react208, import_react_use48, import_react_icons98, MwebLandscapePrompt;
+var import_react208, import_react_use47, import_ts_pattern12, import_react_icons98, MwebLandscapePrompt;
 var init_MwebLandscapePrompt = __esm({
   "src/Prebuilt/components/MwebLandscapePrompt.tsx"() {
     "use strict";
     init_define_process_env();
     import_react208 = __toESM(require("react"));
-    import_react_use48 = require("react-use");
+    import_react_use47 = require("react-use");
+    import_ts_pattern12 = require("ts-pattern");
     import_react_icons98 = require("@100mslive/react-icons");
     init_Button2();
     init_Layout();
@@ -32824,7 +32928,7 @@ var init_MwebLandscapePrompt = __esm({
     init_utils2();
     MwebLandscapePrompt = () => {
       const [showMwebLandscapePrompt, setShowMwebLandscapePrompt] = (0, import_react208.useState)(false);
-      const isLandscape = (0, import_react_use48.useMedia)(config.media.ls);
+      const isLandscape = (0, import_react_use47.useMedia)(config.media.ls);
       const isLandscapeHLSStream = useLandscapeHLSStream();
       (0, import_react208.useEffect)(() => {
         var _a8;
@@ -32833,20 +32937,22 @@ var init_MwebLandscapePrompt = __esm({
           return;
         }
         if (!((_a8 = window.screen) == null ? void 0 : _a8.orientation)) {
-          setShowMwebLandscapePrompt(isLandscape);
+          setShowMwebLandscapePrompt(isLandscape && !isLandscapeHLSStream);
           return;
         }
         const handleRotation = () => {
           const angle = window.screen.orientation.angle;
           const type = window.screen.orientation.type || "";
-          setShowMwebLandscapePrompt(angle ? angle >= 90 && type.includes("landscape") : isLandscape);
+          setShowMwebLandscapePrompt(
+            (0, import_ts_pattern12.match)({ angle, isLandscapeHLSStream, isLandscape, type }).with({ isLandscapeHLSStream }, () => false).with({ angle: import_ts_pattern12.P.when((angle2) => angle2 && angle2 >= 90) }, ({ type: type2 }) => type2.includes("landscape")).otherwise(() => isLandscape)
+          );
         };
         handleRotation();
         window.screen.orientation.addEventListener("change", handleRotation);
         return () => {
           window.screen.orientation.removeEventListener("change", handleRotation);
         };
-      }, [isLandscape]);
+      }, [isLandscape, isLandscapeHLSStream]);
       if (isLandscapeHLSStream) {
         return null;
       }
@@ -33358,7 +33464,7 @@ function PermissionErrorModal() {
   const notification = (0, import_react_sdk111.useHMSNotifications)(import_react_sdk111.HMSNotificationTypes.ERROR);
   const [deviceType, setDeviceType] = (0, import_react215.useState)("");
   const [isSystemError, setIsSystemError] = (0, import_react215.useState)(false);
-  const isMobile = (0, import_react_use49.useMedia)(config.media.md);
+  const isMobile = (0, import_react_use48.useMedia)(config.media.md);
   (0, import_react215.useEffect)(() => {
     var _a8, _b7, _c, _d, _e;
     if (!notification || ((_a8 = notification.data) == null ? void 0 : _a8.code) !== 3001 && ((_b7 = notification.data) == null ? void 0 : _b7.code) !== 3011 || ((_c = notification.data) == null ? void 0 : _c.code) === 3001 && ((_d = notification.data) == null ? void 0 : _d.message.includes("screen"))) {
@@ -33414,13 +33520,13 @@ function PermissionErrorModal() {
     !isMobile ? /* @__PURE__ */ import_react215.default.createElement(Flex, { justify: "end", css: { w: "100%" } }, /* @__PURE__ */ import_react215.default.createElement(Button, { outlined: true, variant: "standard", onClick: () => setDeviceType("") }, "Dismiss")) : null
   ))) : null;
 }
-var import_react215, import_react_use49, import_react_sdk111;
+var import_react215, import_react_use48, import_react_sdk111;
 var init_PermissionErrorModal = __esm({
   "src/Prebuilt/components/Notifications/PermissionErrorModal.tsx"() {
     "use strict";
     init_define_process_env();
     import_react215 = __toESM(require("react"));
-    import_react_use49 = require("react-use");
+    import_react_use48 = require("react-use");
     import_react_sdk111 = require("@100mslive/react-sdk");
     init_src();
     init_android_perm_1();
@@ -33805,13 +33911,13 @@ var init_Notifications2 = __esm({
 });
 
 // src/Prebuilt/components/Preview/PreviewScreen.tsx
-var import_react221, import_react_use50, PreviewScreen;
+var import_react221, import_react_use49, PreviewScreen;
 var init_PreviewScreen = __esm({
   "src/Prebuilt/components/Preview/PreviewScreen.tsx"() {
     "use strict";
     init_define_process_env();
     import_react221 = __toESM(require("react"));
-    import_react_use50 = require("react-use");
+    import_react_use49 = require("react-use");
     init_src();
     init_AppContext();
     init_roomLayoutProvider();
@@ -33824,7 +33930,7 @@ var init_PreviewScreen = __esm({
       var _a8, _b7, _c;
       const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
       const skipPreview = !isPreviewScreenEnabled;
-      const previewAsRole = (0, import_react_use50.useSearchParam)(QUERY_PARAM_PREVIEW_AS_ROLE);
+      const previewAsRole = (0, import_react_use49.useSearchParam)(QUERY_PARAM_PREVIEW_AS_ROLE);
       const { userName } = useHMSPrebuiltContext();
       const initialName = userName || (skipPreview ? "Beam" : "");
       const authToken = useAuthToken();
@@ -33965,7 +34071,7 @@ function FlyingEmoji() {
   const localPeerId = (0, import_react_sdk119.useHMSStore)(import_react_sdk119.selectLocalPeerID);
   const vanillaStore = (0, import_react_sdk119.useHMSVanillaStore)();
   const [emojis, setEmojis] = (0, import_react226.useState)([]);
-  const isMobile = (0, import_react_use51.useMedia)(config.media.md);
+  const isMobile = (0, import_react_use50.useMedia)(config.media.md);
   const startingPoints = (0, import_react226.useMemo)(() => getStartingPoints(isMobile), [isMobile]);
   const showFlyingEmoji = (0, import_react226.useCallback)(
     ({ emojiId, senderId }) => {
@@ -34057,13 +34163,13 @@ function FlyingEmoji() {
     })
   );
 }
-var import_react226, import_react_use51, import_react_sdk119, emojiCount, flyAndFade, wiggleLeftRight, wiggleRightLeft, getStartingPoints;
+var import_react226, import_react_use50, import_react_sdk119, emojiCount, flyAndFade, wiggleLeftRight, wiggleRightLeft, getStartingPoints;
 var init_FlyingEmoji = __esm({
   "src/Prebuilt/plugins/FlyingEmoji.jsx"() {
     "use strict";
     init_define_process_env();
     import_react226 = __toESM(require("react"));
-    import_react_use51 = require("react-use");
+    import_react_use50 = require("react-use");
     import_react_sdk119 = require("@100mslive/react-sdk");
     init_Layout();
     init_Text2();