@100mslive/roomkit-react 0.2.6-alpha.2 → 0.2.6-alpha.3

package/dist/{chunk-DO5NCPPI.js → chunk-ZJU5GUBY.js}

@@ -106,7 +106,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_98ac6855-afa6-481b-90cb-fed1fe1ef94c", 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.0 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.6-alpha.2", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_98ac6855-afa6-481b-90cb-fed1fe1ef94c", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.19.0/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.6-alpha.2", 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.6", 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.1.10909125", 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: "590", 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: "20240212.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_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:18899", 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.6-alpha.2", 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: "7888657406", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "21fe3fa3f76f115ecedc9ffb68a5a43a7d760bef", 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: "5d104c59fdfaee46aa0c91b4ad095ec9aeaeb7f546bb7d8a6be4ff798e76d8d2", npm_package_exports___import: "./dist/index.js", STATS_BLT: "true", 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--1707837452211-0.743528143796671:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707837452015-0.9406369317948942:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707837430066-0.17901544159115135:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707837429882-0.657619027416386:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/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.0/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_7efc6daa-fae3-4b7c-9f26-0e7151201d03", INVOCATION_ID: "f030d15134a9499fa0d58489255c20d1", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.13/x64", npm_package_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: "432", GITHUB_TRIGGERING_ACTOR: "KaustubhKumar05", 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 323", 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.6-alpha.2", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.2.6-alpha.2", 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: "21fe3fa3f76f115ecedc9ffb68a5a43a7d760bef", 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: "KaustubhKumar05", 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_98ac6855-afa6-481b-90cb-fed1fe1ef94c", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "57426646", 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.1-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_98ac6855-afa6-481b-90cb-fed1fe1ef94c", 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_98ac6855-afa6-481b-90cb-fed1fe1ef94c" };
+    define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_b45e290a-2d91-471b-9cef-374efcd3c5aa", 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.0 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.6-alpha.3", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_b45e290a-2d91-471b-9cef-374efcd3c5aa", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.19.0/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.6-alpha.3", JAVA_HOME_8_X64: "/usr/lib/jvm/temurin-8-jdk-amd64", NODE_AUTH_TOKEN: "XXXXX-XXXXX-XXXXX-XXXXX", SHLVL: "1", npm_package_dependencies__radix_ui_react_tooltip: "1.0.6", npm_package_dependencies__radix_ui_react_popover: "1.0.6", npm_package_dependencies__100mslive_types_prebuilt: "0.12.6", 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.1.10909125", 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: "594", 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: "20240212.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_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:19503", 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.6-alpha.3", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", ACTIONS_RUNNER_ACTION_ARCHIVE_CACHE: "/opt/actionarchivecache", GITHUB_RUN_ID: "7897125030", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "e1e1ecc82a980ca298ecb36c81c35ab7500b06b4", 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: "f3f0abee6b9721ff06a24126511e80713371f9e33ef00a466da9e4d005901c0a", npm_package_exports___import: "./dist/index.js", STATS_BLT: "true", 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--1707890553873-0.45213674335187837:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707890553679-0.5145403068446215:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707890531884-0.24454757746692657:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1707890531706-0.26349008949685615:/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.0/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.19.0/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.0/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_c4375215-07c9-47a0-b9c9-73a402851d81", INVOCATION_ID: "308080f47c9b474892b5d6e7311e07d9", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.13/x64", npm_package_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: "433", GITHUB_TRIGGERING_ACTOR: "KaustubhKumar05", 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 466", 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.6-alpha.3", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.2.6-alpha.3", 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: "e1e1ecc82a980ca298ecb36c81c35ab7500b06b4", 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: "KaustubhKumar05", 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_b45e290a-2d91-471b-9cef-374efcd3c5aa", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "57426646", 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.1-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_b45e290a-2d91-471b-9cef-374efcd3c5aa", 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_b45e290a-2d91-471b-9cef-374efcd3c5aa" };
   }
 });
 
@@ -9157,8 +9157,7 @@ var APP_DATA = {
   activeScreensharePeerId: "activeScreensharePeerId",
   disableNotifications: "disableNotifications",
   pollState: "pollState",
-  background: "background",
-  backgroundType: "backgroundType"
+  background: "background"
 };
 var UI_SETTINGS = {
   isAudioOnly: "isAudioOnly",
@@ -11907,7 +11906,7 @@ import {
 
 // src/Prebuilt/components/AppData/AppData.tsx
 init_define_process_env();
-import React22, { useEffect as useEffect4 } from "react";
+import React23, { useEffect as useEffect5 } from "react";
 import {
   HMSRoomState,
   selectFullAppData,
@@ -12217,9 +12216,220 @@ var LayoutSettings = () => {
   ));
 };
 
+// src/Prebuilt/provider/roomLayoutProvider/hooks/useRoomLayoutScreen.ts
+init_define_process_env();
+
+// src/Prebuilt/provider/roomLayoutProvider/index.tsx
+init_define_process_env();
+var import_lodash2 = __toESM(require_lodash());
+import React22 from "react";
+
+// src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts
+init_define_process_env();
+import { useCallback as useCallback5, useEffect as useEffect4, useRef as useRef5, useState as useState5 } from "react";
+
+// src/Prebuilt/provider/roomLayoutProvider/constants/index.ts
+init_define_process_env();
+import { JoinForm_JoinBtnType } from "@100mslive/types-prebuilt/elements/join_form";
+var defaultLayout = {
+  id: "",
+  role_id: "",
+  template_id: "",
+  app_id: "",
+  typography: {
+    font_family: "Inter"
+  },
+  themes: [],
+  options: {},
+  screens: {
+    preview: {
+      default: {
+        elements: {
+          preview_header: {
+            title: "Get Started",
+            sub_title: "Setup your audio and video before joining"
+          },
+          join_form: {
+            join_btn_type: JoinForm_JoinBtnType.JOIN_BTN_TYPE_JOIN_ONLY,
+            join_btn_label: "Join Now",
+            go_live_btn_label: "Go Live"
+          }
+        }
+      }
+    },
+    conferencing: {
+      default: {
+        elements: {
+          chat: {
+            public_chat_enabled: true,
+            private_chat_enabled: true,
+            chat_title: "Chat",
+            allow_pinning_messages: true,
+            message_placeholder: "Send a message...",
+            roles_whitelist: [],
+            real_time_controls: {
+              can_disable_chat: true,
+              can_block_user: true,
+              can_hide_message: true
+            }
+          },
+          participant_list: {},
+          video_tile_layout: {
+            grid: {
+              enable_local_tile_inset: true,
+              prominent_roles: [],
+              enable_spotlighting_peer: true
+            }
+          },
+          emoji_reactions: {}
+        }
+      }
+    },
+    leave: {}
+  }
+};
+
+// src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts
+var fetchWithRetry = (..._0) => __async(void 0, [..._0], function* (url = "", options = {}) {
+  const MAX_RETRIES = 4;
+  let error = Error("something went wrong");
+  for (let i = 0; i < MAX_RETRIES; i++) {
+    try {
+      return yield fetch(url, options);
+    } catch (err) {
+      error = err;
+    }
+  }
+  console.error("Fetch failed after max retries", { url, options });
+  throw error;
+});
+var useFetchRoomLayout = ({
+  endpoint = "",
+  authToken = ""
+}) => {
+  const [layout, setLayout] = useState5(void 0);
+  const layoutResp = useRef5();
+  const isFetchInProgress = useRef5(false);
+  const updateRoomLayoutForRole = useCallback5((role) => {
+    var _a8;
+    if (!layoutResp.current) {
+      return;
+    }
+    const [layout2] = (((_a8 = layoutResp.current) == null ? void 0 : _a8.data) || []).filter((layout3) => layout3.role === role);
+    if (layout2) {
+      setLayout(layout2);
+    }
+  }, []);
+  useEffect4(() => {
+    (() => __async(void 0, null, function* () {
+      var _a8, _b7;
+      if (isFetchInProgress.current || !authToken) {
+        return;
+      }
+      isFetchInProgress.current = true;
+      try {
+        const resp = yield fetchWithRetry(endpoint || "https://api.100ms.live/v2/layouts/ui", {
+          headers: {
+            Authorization: `Bearer ${authToken}`
+          }
+        });
+        layoutResp.current = yield resp.json();
+      } catch (e) {
+        console.error("[Room Layout API]: Failed to fetch / process room layout. Resorting to default layout.", e);
+        layoutResp.current = {
+          data: [defaultLayout]
+        };
+      }
+      let layoutForRole = (_b7 = (_a8 = layoutResp.current) == null ? void 0 : _a8.data) == null ? void 0 : _b7[0];
+      if (!layoutForRole) {
+        console.error(
+          "[Room Layout API]: Unable to figure out room layout from API response. Resorting to default layout."
+        );
+        layoutForRole = defaultLayout;
+      }
+      const layout2 = layoutForRole;
+      setLayout(layout2);
+      isFetchInProgress.current = false;
+    }))();
+  }, [authToken, endpoint]);
+  return { layout, updateRoomLayoutForRole };
+};
+
+// src/Prebuilt/provider/roomLayoutProvider/index.tsx
+var RoomLayoutContext = React22.createContext(void 0);
+function customizer(objValue, srcValue) {
+  if ((0, import_lodash2.isArray)(objValue) || (0, import_lodash2.isArray)(srcValue)) {
+    return srcValue;
+  }
+  return void 0;
+}
+var RoomLayoutProvider = ({
+  children,
+  roomLayoutEndpoint,
+  overrideLayout
+}) => {
+  const authToken = useAuthToken();
+  const { layout, updateRoomLayoutForRole } = useFetchRoomLayout({ authToken, endpoint: roomLayoutEndpoint });
+  const mergedLayout = authToken && layout ? (0, import_lodash2.mergeWith)(layout, overrideLayout, customizer) : layout;
+  return /* @__PURE__ */ React22.createElement(RoomLayoutContext.Provider, { value: { layout: mergedLayout, updateRoomLayoutForRole } }, children);
+};
+var useRoomLayout = () => {
+  var _a8;
+  return (_a8 = React22.useContext(RoomLayoutContext)) == null ? void 0 : _a8.layout;
+};
+var useUpdateRoomLayout = () => {
+  var _a8;
+  return (_a8 = React22.useContext(RoomLayoutContext)) == null ? void 0 : _a8.updateRoomLayoutForRole;
+};
+
+// src/Prebuilt/provider/roomLayoutProvider/hooks/useRoomLayoutScreen.ts
+function useRoomLayoutScreen({
+  screen
+}) {
+  var _a8;
+  const roomLayout = useRoomLayout();
+  const screenProps = (_a8 = roomLayout == null ? void 0 : roomLayout.screens) == null ? void 0 : _a8[screen];
+  return screenProps;
+}
+function useRoomLayoutPreviewScreen() {
+  var _a8;
+  const screenProps = useRoomLayoutScreen({ screen: "preview" });
+  const isPreviewScreenEnabled = !!screenProps && !(screenProps == null ? void 0 : screenProps.skip_preview_screen);
+  let elements;
+  let screenType;
+  if (isPreviewScreenEnabled) {
+    screenType = Object.keys(screenProps).filter((key) => key !== "skip_preview_screen")[0];
+    elements = (_a8 = screenProps[screenType]) == null ? void 0 : _a8.elements;
+  }
+  return {
+    isPreviewScreenEnabled,
+    elements,
+    screenType
+  };
+}
+function useRoomLayoutConferencingScreen() {
+  var _a8, _b7;
+  const screenProps = useRoomLayoutScreen({ screen: "conferencing" }) || {};
+  const screenType = Object.keys(screenProps)[0];
+  const elements = (_a8 = screenProps[screenType]) == null ? void 0 : _a8.elements;
+  const hideSections = ((_b7 = screenProps[screenType]) == null ? void 0 : _b7.hideSections) || [];
+  return {
+    hideSections,
+    elements,
+    screenType
+  };
+}
+function useRoomLayoutLeaveScreen() {
+  const screenProps = useRoomLayoutScreen({ screen: "leave" });
+  const isLeaveScreenEnabled = !!screenProps;
+  return {
+    isLeaveScreenEnabled
+  };
+}
+
 // src/Prebuilt/components/AppData/useSidepane.js
 init_define_process_env();
-import { useCallback as useCallback5 } from "react";
+import { useCallback as useCallback6 } from "react";
 import { selectAppData as selectAppData2, useHMSActions as useHMSActions3, useHMSStore as useHMSStore4, useHMSVanillaStore as useHMSVanillaStore3 } from "@100mslive/react-sdk";
 var useIsSidepaneTypeOpen = (sidepaneType) => {
   if (!sidepaneType) {
@@ -12234,7 +12444,7 @@ var useSidepaneState = () => {
 var useSidepaneToggle = (sidepaneType) => {
   const hmsActions = useHMSActions3();
   const vanillaStore = useHMSVanillaStore3();
-  const toggleSidepane = useCallback5(() => {
+  const toggleSidepane = useCallback6(() => {
     const isOpen = vanillaStore.getState(selectAppData2(APP_DATA.sidePane)) === sidepaneType;
     hmsActions.setAppData(APP_DATA.sidePane, !isOpen ? sidepaneType : "");
   }, [vanillaStore, hmsActions, sidepaneType]);
@@ -12244,7 +12454,7 @@ var usePollViewToggle = () => {
   const hmsActions = useHMSActions3();
   const { view, setPollState } = usePollViewState();
   const isOpen = useSidepaneState() === SIDE_PANE_OPTIONS.POLLS;
-  const togglePollView = useCallback5(
+  const togglePollView = useCallback6(
     (id) => {
       id = typeof id === "string" ? id : void 0;
       const newView = id ? POLL_VIEWS.VOTE : isOpen && view ? null : POLL_VIEWS.CREATE_POLL_QUIZ;
@@ -12260,7 +12470,7 @@ var usePollViewToggle = () => {
 };
 var useSidepaneReset = () => {
   const hmsActions = useHMSActions3();
-  const resetSidepane = useCallback5(() => {
+  const resetSidepane = useCallback6(() => {
     hmsActions.setAppData(APP_DATA.sidePane, "");
     hmsActions.setAppData(APP_DATA.pollInView, "");
   }, [hmsActions]);
@@ -12302,25 +12512,27 @@ var initialAppData = {
   [APP_DATA.activeScreensharePeerId]: "",
   [APP_DATA.disableNotifications]: false,
   [APP_DATA.background]: "none",
-  [APP_DATA.backgroundType]: "none",
   [APP_DATA.pollState]: {
     [POLL_STATE.pollInView]: "",
     [POLL_STATE.view]: ""
   }
 };
-var AppData = React22.memo(() => {
+var AppData = React23.memo(() => {
+  var _a8;
   const hmsActions = useHMSActions4();
   const [preferences = {}] = useUserPreferences(UserPreferencesKeys.UI_SETTINGS);
   const appData = useHMSStore5(selectFullAppData);
-  useEffect4(() => {
+  const { elements } = useRoomLayoutConferencingScreen();
+  const toggleVB = useSidepaneToggle(SIDE_PANE_OPTIONS.VB);
+  useEffect5(() => {
     hmsActions.initAppData(__spreadValues(__spreadValues({}, initialAppData), appData));
     hmsActions.setFrameworkInfo({
       type: "react-web",
       isPrebuilt: true,
-      version: React22.version
+      version: React23.version
     });
   }, [hmsActions]);
-  useEffect4(() => {
+  useEffect5(() => {
     const uiSettings = preferences || {};
     const updatedSettings = __spreadProps(__spreadValues({}, uiSettings), {
       [UI_SETTINGS.isAudioOnly]: void 0,
@@ -12328,13 +12540,26 @@ var AppData = React22.memo(() => {
     });
     hmsActions.setAppData(APP_DATA.uiSettings, updatedSettings, true);
   }, [preferences, hmsActions]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!preferences.subscribedNotifications) {
       return;
     }
     hmsActions.setAppData(APP_DATA.subscribedNotifications, preferences.subscribedNotifications, true);
   }, [preferences.subscribedNotifications, hmsActions]);
-  return /* @__PURE__ */ React22.createElement(ResetStreamingStart, null);
+  useEffect5(() => {
+    var _a9, _b7;
+    let defaultMediaURL;
+    (_b7 = (_a9 = elements == null ? void 0 : elements.virtual_background) == null ? void 0 : _a9.background_media) == null ? void 0 : _b7.forEach((media) => {
+      if (media.default && media.url) {
+        defaultMediaURL = media.url;
+      }
+    });
+    if (defaultMediaURL) {
+      hmsActions.setAppData(APP_DATA.background, defaultMediaURL);
+      toggleVB();
+    }
+  }, [hmsActions, (_a8 = elements == null ? void 0 : elements.virtual_background) == null ? void 0 : _a8.background_media, toggleVB]);
+  return /* @__PURE__ */ React23.createElement(ResetStreamingStart, null);
 });
 var ResetStreamingStart = () => {
   const { isHLSRunning, isRTMPRunning, isBrowserRecordingOn } = useRecordingStreaming();
@@ -12346,19 +12571,19 @@ var ResetStreamingStart = () => {
   const [rtmpStarted, setRTMPStarted] = useSetAppDataByKey(APP_DATA.rtmpStarted);
   const toggleStreaming = useSidepaneToggle(SIDE_PANE_OPTIONS.STREAMING);
   const isStreamingOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.STREAMING);
-  useEffect4(() => {
+  useEffect5(() => {
     if (isBrowserRecordingOn && recordingStarted) {
       setRecordingStarted(false);
     }
   }, [isBrowserRecordingOn, recordingStarted, setRecordingStarted]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (roomState === HMSRoomState.Disconnected) {
       setHLSStarted(false);
       setRecordingStarted(false);
       setRTMPStarted(false);
     }
   }, [roomState, setHLSStarted, setRTMPStarted, setRecordingStarted]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (isHLSRunning || hlsError) {
       if (hlsStarted) {
         setHLSStarted(false);
@@ -12368,7 +12593,7 @@ var ResetStreamingStart = () => {
       }
     }
   }, [isHLSRunning, hlsStarted, setHLSStarted, hlsError, isStreamingOpen, toggleStreaming]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (isRTMPRunning || rtmpError || isBrowserRecordingOn) {
       if (rtmpStarted) {
         setRTMPStarted(false);
@@ -12383,15 +12608,15 @@ var ResetStreamingStart = () => {
 
 // src/Prebuilt/components/AuthToken.jsx
 init_define_process_env();
-import React24, { useEffect as useEffect5, useState as useState5 } from "react";
+import React25, { useEffect as useEffect6, useState as useState6 } from "react";
 import { useSessionStorage } from "react-use";
 import { v4 as uuid } from "uuid";
 import { useHMSActions as useHMSActions5 } from "@100mslive/react-sdk";
 
 // src/Prebuilt/AppContext.tsx
 init_define_process_env();
-import React23, { useContext as useContext2 } from "react";
-var HMSPrebuiltContext = React23.createContext({
+import React24, { useContext as useContext2 } from "react";
+var HMSPrebuiltContext = React24.createContext({
   roomCode: "",
   userName: "",
   userId: "",
@@ -12413,14 +12638,14 @@ var useHMSPrebuiltContext = () => {
 var transaction_error_default = 'data:image/svg+xml,<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M70 68.3333V26.6667C70 24.825 68.5083 23.3333 66.6667 23.3333H13.3333C11.4917 23.3333 10 24.825 10 26.6667V68.3333C10 70.175 11.4917 71.6667 13.3333 71.6667H66.6667C68.5083 71.6667 70 70.175 70 68.3333Z" fill="%23272A31"/>%0A<path d="M20 31.6667H60C61.8417 31.6667 63.3333 33.1583 63.3333 35C63.3333 36.8417 61.8417 38.3333 60 38.3333H20C18.1583 38.3333 16.6667 36.8417 16.6667 35C16.6667 33.1583 18.1583 31.6667 20 31.6667Z" fill="%238F9099"/>%0A<path d="M58.3333 36.6667V10C58.3333 9.08 57.5867 8.33334 56.6667 8.33334H55C55 9.25334 54.2533 10 53.3333 10C52.4133 10 51.6667 9.25334 51.6667 8.33334H48.3333C48.3333 9.25334 47.5867 10 46.6667 10C45.7467 10 45 9.25334 45 8.33334H41.6667C41.6667 9.25334 40.92 10 40 10C39.08 10 38.3333 9.25334 38.3333 8.33334H35C35 9.25334 34.2533 10 33.3333 10C32.4133 10 31.6667 9.25334 31.6667 8.33334H28.3333C28.3333 9.25334 27.5867 10 26.6667 10C25.7467 10 25 9.25334 25 8.33334H23.3333C22.4133 8.33334 21.6667 9.08 21.6667 10V36.6667H58.3333Z" fill="%23C74E5B"/>%0A<path d="M21.6667 43.3333H58.3333C60.175 43.3333 61.6667 44.825 61.6667 46.6667V50C61.6667 51.8417 60.175 53.3333 58.3333 53.3333H21.6667C19.825 53.3333 18.3333 51.8417 18.3333 50V46.6667C18.3333 44.825 19.825 43.3333 21.6667 43.3333Z" fill="%23C5C6D0"/>%0A<path d="M60 66.6667H55C54.08 66.6667 53.3333 65.92 53.3333 65V60C53.3333 59.08 54.08 58.3333 55 58.3333H60C60.92 58.3333 61.6667 59.08 61.6667 60V65C61.6667 65.92 60.92 66.6667 60 66.6667Z" fill="%23C5C6D0"/>%0A<path d="M25 66.6667H20C19.08 66.6667 18.3333 65.92 18.3333 65V60C18.3333 59.08 19.08 58.3333 20 58.3333H25C25.92 58.3333 26.6667 59.08 26.6667 60V65C26.6667 65.92 25.92 66.6667 25 66.6667ZM36.6667 66.6667H31.6667C30.7467 66.6667 30 65.92 30 65V60C30 59.08 30.7467 58.3333 31.6667 58.3333H36.6667C37.5867 58.3333 38.3333 59.08 38.3333 60V65C38.3333 65.92 37.5867 66.6667 36.6667 66.6667ZM48.3333 66.6667H43.3333C42.4133 66.6667 41.6667 65.92 41.6667 65V60C41.6667 59.08 42.4133 58.3333 43.3333 58.3333H48.3333C49.2533 58.3333 50 59.08 50 60V65C50 65.92 49.2533 66.6667 48.3333 66.6667Z" fill="%23C5C6D0"/>%0A<path d="M58.3333 35H21.6667V38.3333H58.3333V35Z" fill="%23C74E5B"/>%0A<path opacity="0.05" d="M45.3033 32.315C44.6383 32.315 44.01 32.0567 43.5367 31.585L40 28.0467L36.465 31.5817C35.9917 32.0533 35.365 32.3133 34.6967 32.3133C34.0283 32.3133 33.4 32.0533 32.9267 31.58L31.75 30.4033C31.2783 29.9333 31.0183 29.3033 31.0183 28.6333C31.0183 27.9667 31.2783 27.3383 31.75 26.8667L35.2867 23.3333L31.7517 19.7983C31.28 19.3283 31.02 18.7 31.02 18.0317C31.02 17.3617 31.28 16.7333 31.7517 16.2617L32.93 15.0833C33.4017 14.6117 34.0283 14.3517 34.6983 14.3517C35.3633 14.3517 35.9917 14.61 36.465 15.0817L40 18.62L43.535 15.0833C44.0083 14.6117 44.635 14.3517 45.3033 14.3517C45.9683 14.3517 46.5967 14.61 47.07 15.0817L48.25 16.2617C48.7217 16.7317 48.9817 17.3617 48.9817 18.0317C48.9817 18.6983 48.7217 19.3267 48.25 19.7983L44.7117 23.3333L48.2483 26.87C49.2217 27.84 49.2233 29.425 48.2517 30.4017L47.07 31.5833C46.5983 32.055 45.9717 32.315 45.3033 32.315Z" fill="black"/>%0A<path opacity="0.07" d="M45.3033 31.4817C44.8583 31.4817 44.44 31.3083 44.125 30.995L40 26.8683L35.875 30.9933C35.56 31.3083 35.1417 31.48 34.6967 31.48C34.25 31.48 33.8317 31.3067 33.5183 30.9917L32.34 29.8133C32.025 29.4983 31.8517 29.08 31.8517 28.6333C31.8517 28.1883 32.025 27.77 32.34 27.455L36.465 23.3333L32.34 19.2083C32.0267 18.895 31.8517 18.4767 31.8517 18.0317C31.8517 17.585 32.025 17.1667 32.34 16.8517L33.5183 15.6733C33.8317 15.36 34.25 15.1867 34.6967 15.1867C35.1417 15.1867 35.56 15.36 35.875 15.6733L40 19.7983L44.125 15.6717C44.44 15.3567 44.8583 15.185 45.3033 15.185C45.7483 15.185 46.1667 15.3583 46.4817 15.6717L47.66 16.8517C47.975 17.1667 48.1483 17.585 48.1483 18.0317C48.1483 18.4767 47.975 18.895 47.66 19.21L43.5333 23.3333L47.66 27.46C48.31 28.1067 48.31 29.1633 47.6617 29.815L46.4817 30.995C46.1667 31.3083 45.7483 31.4817 45.3033 31.4817Z" fill="black"/>%0A<path d="M42.3567 23.3333L47.0717 18.6183C47.3967 18.2933 47.3967 17.765 47.0717 17.44L45.8933 16.2617C45.5667 15.9367 45.04 15.9367 44.715 16.2617L40 20.9767L35.2867 16.2633C34.9617 15.9383 34.4333 15.9383 34.1083 16.2633L32.93 17.4417C32.605 17.7667 32.605 18.295 32.93 18.62L37.6433 23.3333L32.93 28.0467C32.605 28.3717 32.605 28.9 32.93 29.225L34.1083 30.4033C34.4333 30.7283 34.9617 30.7283 35.2867 30.4033L40 25.69L44.715 30.405C45.04 30.73 45.5683 30.73 45.8933 30.405L47.0717 29.2267C47.3967 28.9 47.3967 28.3733 47.0717 28.0483L42.3567 23.3333Z" fill="%23FFEDEC"/>%0A</svg>%0A';
 
 // src/Prebuilt/components/AuthToken.jsx
-var AuthToken = React24.memo(({ authTokenByRoomCodeEndpoint, defaultAuthToken }) => {
+var AuthToken = React25.memo(({ authTokenByRoomCodeEndpoint, defaultAuthToken }) => {
   const hmsActions = useHMSActions5();
   const { roomCode, userId } = useHMSPrebuiltContext();
-  const [error, setError] = useState5({ title: "", body: "" });
+  const [error, setError] = useState6({ title: "", body: "" });
   let authToken = defaultAuthToken;
   const [, setAuthTokenInAppData] = useSetAppDataByKey(APP_DATA.authToken);
   const [savedUserId, setSavedUserId] = useSessionStorage(UserPreferencesKeys.USER_ID);
-  useEffect5(() => {
+  useEffect6(() => {
     if (authToken) {
       setAuthTokenInAppData(authToken);
       return;
@@ -12444,7 +12669,7 @@ var AuthToken = React24.memo(({ authTokenByRoomCodeEndpoint, defaultAuthToken })
     setSavedUserId
   ]);
   if (error.title) {
-    return /* @__PURE__ */ React24.createElement(Dialog.Root, { open: true }, /* @__PURE__ */ React24.createElement(
+    return /* @__PURE__ */ React25.createElement(Dialog.Root, { open: true }, /* @__PURE__ */ React25.createElement(
       Dialog.Content,
       {
         css: {
@@ -12456,9 +12681,9 @@ var AuthToken = React24.memo(({ authTokenByRoomCodeEndpoint, defaultAuthToken })
           alignItems: "center"
         }
       },
-      /* @__PURE__ */ React24.createElement("img", { src: transaction_error_default, height: 80, width: 80 }),
-      /* @__PURE__ */ React24.createElement(Text, { variant: "h4", css: { textAlign: "center", mb: "$4", mt: "$10" } }, error.title),
-      /* @__PURE__ */ React24.createElement(Text, { css: { c: "$on_surface_medium", textAlign: "center" } }, error.body)
+      /* @__PURE__ */ React25.createElement("img", { src: transaction_error_default, height: 80, width: 80 }),
+      /* @__PURE__ */ React25.createElement(Text, { variant: "h4", css: { textAlign: "center", mb: "$4", mt: "$10" } }, error.title),
+      /* @__PURE__ */ React25.createElement(Text, { css: { c: "$on_surface_medium", textAlign: "center" } }, error.body)
     ));
   }
   return null;
@@ -12526,7 +12751,7 @@ import { useAVToggle as useAVToggle3 } from "@100mslive/react-sdk";
 
 // src/Prebuilt/components/AudioVideoToggle.jsx
 init_define_process_env();
-import React26, { Fragment as Fragment2 } from "react";
+import React27, { Fragment as Fragment2 } from "react";
 import {
   DeviceType,
   HMSRoomState as HMSRoomState2,
@@ -12542,7 +12767,7 @@ import { CameraFlipIcon, MicOffIcon, MicOnIcon, VideoOffIcon, VideoOnIcon } from
 
 // src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.jsx
 init_define_process_env();
-import React25 from "react";
+import React26 from "react";
 import { VerticalMenuIcon } from "@100mslive/react-icons";
 
 // src/Prebuilt/IconButton.tsx
@@ -12625,7 +12850,7 @@ var IconButtonWithOptions = ({
 }) => {
   const bgCss = { backgroundColor: disabled ? "$surface_brighter" : active ? "$transparent" : "$secondary_dim" };
   const iconCss = { color: disabled ? "$on_surface_low" : active ? "$on_surface_high" : "$on_primary_high" };
-  return /* @__PURE__ */ React25.createElement(Flex, null, /* @__PURE__ */ React25.createElement(IconSection, { css: bgCss, onClick }, /* @__PURE__ */ React25.createElement(Tooltip, { disabled: !tooltipMessage, title: tooltipMessage }, /* @__PURE__ */ React25.createElement(Flex, { align: "center", justify: "center", css: iconCss }, icon))), /* @__PURE__ */ React25.createElement(Dropdown.Root, null, /* @__PURE__ */ React25.createElement(
+  return /* @__PURE__ */ React26.createElement(Flex, null, /* @__PURE__ */ React26.createElement(IconSection, { css: bgCss, onClick }, /* @__PURE__ */ React26.createElement(Tooltip, { disabled: !tooltipMessage, title: tooltipMessage }, /* @__PURE__ */ React26.createElement(Flex, { align: "center", justify: "center", css: iconCss }, icon))), /* @__PURE__ */ React26.createElement(Dropdown.Root, null, /* @__PURE__ */ React26.createElement(
     Dropdown.Trigger,
     {
       asChild: true,
@@ -12636,8 +12861,8 @@ var IconButtonWithOptions = ({
         }
       }
     },
-    /* @__PURE__ */ React25.createElement(OptionsSection, { css: bgCss }, /* @__PURE__ */ React25.createElement(Tooltip, { title: "View Options" }, /* @__PURE__ */ React25.createElement(Box, { css: iconCss }, /* @__PURE__ */ React25.createElement(VerticalMenuIcon, null))))
-  ), /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement(OptionsSection, { css: bgCss }, /* @__PURE__ */ React26.createElement(Tooltip, { title: "View Options" }, /* @__PURE__ */ React26.createElement(Box, { css: iconCss }, /* @__PURE__ */ React26.createElement(VerticalMenuIcon, null))))
+  ), /* @__PURE__ */ React26.createElement(
     Dropdown.Content,
     {
       sideOffset: 5,
@@ -12649,7 +12874,7 @@ var IconButtonWithOptions = ({
         border: "none"
       }
     },
-    options.map((option, index) => /* @__PURE__ */ React25.createElement(
+    options.map((option, index) => /* @__PURE__ */ React26.createElement(
       Dropdown.Item,
       {
         key: option.title,
@@ -12720,7 +12945,7 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
   const { videoInput, audioInput } = allDevices;
   const formattedVideoInputList = videoInput == null ? void 0 : videoInput.map((videoInput2) => ({
     active: selectedDeviceIDs.videoInput === videoInput2.deviceId,
-    content: /* @__PURE__ */ React26.createElement(
+    content: /* @__PURE__ */ React27.createElement(
       Text,
       {
         variant: "sm",
@@ -12736,7 +12961,7 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
   }));
   const formattedAudioInputList = audioInput == null ? void 0 : audioInput.map((audioInput2) => ({
     active: selectedDeviceIDs.audioInput === audioInput2.deviceId,
-    content: /* @__PURE__ */ React26.createElement(
+    content: /* @__PURE__ */ React27.createElement(
       Text,
       {
         variant: "sm",
@@ -12757,7 +12982,7 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
   const roomState = useHMSStore6(selectRoomState2);
   const hasAudioDevices = (audioInput == null ? void 0 : audioInput.length) > 0;
   const hasVideoDevices = (videoInput == null ? void 0 : videoInput.length) > 0;
-  return /* @__PURE__ */ React26.createElement(Fragment2, null, toggleAudio ? hideOptions || !hasAudioDevices ? /* @__PURE__ */ React26.createElement(Tooltip, { title: `Turn ${isLocalAudioEnabled ? "off" : "on"} audio (${isMacOS ? "\u2318" : "ctrl"} + d)` }, /* @__PURE__ */ React26.createElement(
+  return /* @__PURE__ */ React27.createElement(Fragment2, null, toggleAudio ? hideOptions || !hasAudioDevices ? /* @__PURE__ */ React27.createElement(Tooltip, { title: `Turn ${isLocalAudioEnabled ? "off" : "on"} audio (${isMacOS ? "\u2318" : "ctrl"} + d)` }, /* @__PURE__ */ React27.createElement(
     IconButton_default,
     {
       active: isLocalAudioEnabled,
@@ -12767,20 +12992,20 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
       "data-testid": "audio_btn",
       className: "__cancel-drag-event"
     },
-    !isLocalAudioEnabled ? /* @__PURE__ */ React26.createElement(MicOffIcon, { "data-testid": "audio_off_btn" }) : /* @__PURE__ */ React26.createElement(MicOnIcon, { "data-testid": "audio_on_btn" })
-  )) : /* @__PURE__ */ React26.createElement(
+    !isLocalAudioEnabled ? /* @__PURE__ */ React27.createElement(MicOffIcon, { "data-testid": "audio_off_btn" }) : /* @__PURE__ */ React27.createElement(MicOnIcon, { "data-testid": "audio_on_btn" })
+  )) : /* @__PURE__ */ React27.createElement(
     IconButtonWithOptions,
     {
       options: formattedAudioInputList,
       disabled: !toggleAudio,
       onDisabledClick: toggleAudio,
       tooltipMessage: `Turn ${isLocalAudioEnabled ? "off" : "on"} audio (${isMacOS ? "\u2318" : "ctrl"} + d)`,
-      icon: !isLocalAudioEnabled ? /* @__PURE__ */ React26.createElement(MicOffIcon, { "data-testid": "audio_off_btn" }) : /* @__PURE__ */ React26.createElement(MicOnIcon, { "data-testid": "audio_on_btn" }),
+      icon: !isLocalAudioEnabled ? /* @__PURE__ */ React27.createElement(MicOffIcon, { "data-testid": "audio_off_btn" }) : /* @__PURE__ */ React27.createElement(MicOnIcon, { "data-testid": "audio_on_btn" }),
       active: isLocalAudioEnabled,
       onClick: toggleAudio,
       key: "toggleAudio"
     }
-  ) : null, toggleVideo ? hideOptions || !hasVideoDevices ? /* @__PURE__ */ React26.createElement(Tooltip, { title: `Turn ${isLocalVideoEnabled ? "off" : "on"} video (${isMacOS ? "\u2318" : "ctrl"} + e)` }, /* @__PURE__ */ React26.createElement(
+  ) : null, toggleVideo ? hideOptions || !hasVideoDevices ? /* @__PURE__ */ React27.createElement(Tooltip, { title: `Turn ${isLocalVideoEnabled ? "off" : "on"} video (${isMacOS ? "\u2318" : "ctrl"} + e)` }, /* @__PURE__ */ React27.createElement(
     IconButton_default,
     {
       key: "toggleVideo",
@@ -12790,20 +13015,20 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
       "data-testid": "video_btn",
       className: "__cancel-drag-event"
     },
-    !isLocalVideoEnabled ? /* @__PURE__ */ React26.createElement(VideoOffIcon, { "data-testid": "video_off_btn" }) : /* @__PURE__ */ React26.createElement(VideoOnIcon, { "data-testid": "video_on_btn" })
-  )) : /* @__PURE__ */ React26.createElement(
+    !isLocalVideoEnabled ? /* @__PURE__ */ React27.createElement(VideoOffIcon, { "data-testid": "video_off_btn" }) : /* @__PURE__ */ React27.createElement(VideoOnIcon, { "data-testid": "video_on_btn" })
+  )) : /* @__PURE__ */ React27.createElement(
     IconButtonWithOptions,
     {
       disabled: !toggleVideo,
       onDisabledClick: toggleVideo,
       options: formattedVideoInputList,
       tooltipMessage: `Turn ${isLocalVideoEnabled ? "off" : "on"} video (${isMacOS ? "\u2318" : "ctrl"} + e)`,
-      icon: !isLocalVideoEnabled ? /* @__PURE__ */ React26.createElement(VideoOffIcon, { "data-testid": "video_off_btn" }) : /* @__PURE__ */ React26.createElement(VideoOnIcon, { "data-testid": "video_on_btn" }),
+      icon: !isLocalVideoEnabled ? /* @__PURE__ */ React27.createElement(VideoOffIcon, { "data-testid": "video_off_btn" }) : /* @__PURE__ */ React27.createElement(VideoOnIcon, { "data-testid": "video_on_btn" }),
       key: "toggleVideo",
       active: isLocalVideoEnabled,
       onClick: toggleVideo
     }
-  ) : null, (localVideoTrack == null ? void 0 : localVideoTrack.facingMode) && roomState === HMSRoomState2.Preview ? /* @__PURE__ */ React26.createElement(Tooltip, { title: "Switch Camera", key: "switchCamera" }, /* @__PURE__ */ React26.createElement(
+  ) : null, (localVideoTrack == null ? void 0 : localVideoTrack.facingMode) && roomState === HMSRoomState2.Preview ? /* @__PURE__ */ React27.createElement(Tooltip, { title: "Switch Camera", key: "switchCamera" }, /* @__PURE__ */ React27.createElement(
     IconButton_default,
     {
       onClick: () => __async(void 0, null, function* () {
@@ -12817,13 +13042,13 @@ var AudioVideoToggle = ({ hideOptions = false }) => {
         }
       })
     },
-    /* @__PURE__ */ React26.createElement(CameraFlipIcon, null)
+    /* @__PURE__ */ React27.createElement(CameraFlipIcon, null)
   )) : null);
 };
 
 // src/Prebuilt/components/EmojiReaction.jsx
 init_define_process_env();
-import React28, { Fragment as Fragment3, useState as useState6 } from "react";
+import React29, { Fragment as Fragment3, useState as useState7 } from "react";
 import { useMedia } from "react-use";
 import data from "@emoji-mart/data/sets/14/apple.json";
 import { init } from "emoji-mart";
@@ -12838,13 +13063,13 @@ import { EmojiIcon } from "@100mslive/react-icons";
 
 // src/Prebuilt/components/Footer/EmojiCard.jsx
 init_define_process_env();
-import React27 from "react";
+import React28 from "react";
 var emojiReactionList = [
   [{ emojiId: "+1" }, { emojiId: "-1" }, { emojiId: "wave" }, { emojiId: "clap" }, { emojiId: "fire" }],
   [{ emojiId: "tada" }, { emojiId: "heart_eyes" }, { emojiId: "joy" }, { emojiId: "open_mouth" }, { emojiId: "sob" }]
 ];
 var EmojiCard = ({ sendReaction }) => {
-  return emojiReactionList.map((emojiLine, index) => /* @__PURE__ */ React27.createElement(Flex, { key: index, justify: "between", css: { mb: "$8" } }, emojiLine.map((emoji) => /* @__PURE__ */ React27.createElement(EmojiContainer, { key: emoji.emojiId, onClick: () => sendReaction(emoji.emojiId) }, /* @__PURE__ */ React27.createElement("em-emoji", { id: emoji.emojiId, size: "100%", set: "apple" })))));
+  return emojiReactionList.map((emojiLine, index) => /* @__PURE__ */ React28.createElement(Flex, { key: index, justify: "between", css: { mb: "$8" } }, emojiLine.map((emoji) => /* @__PURE__ */ React28.createElement(EmojiContainer, { key: emoji.emojiId, onClick: () => sendReaction(emoji.emojiId) }, /* @__PURE__ */ React28.createElement("em-emoji", { id: emoji.emojiId, size: "100%", set: "apple" })))));
 };
 var EmojiContainer = styled("span", {
   position: "relative",
@@ -12861,10 +13086,10 @@ var EmojiContainer = styled("span", {
 
 // src/Prebuilt/components/hooks/useDropdownList.ts
 init_define_process_env();
-import { useEffect as useEffect6 } from "react";
+import { useEffect as useEffect7 } from "react";
 var useDropdownList = ({ name, open }) => {
   const [dropdownList = [], setDropdownList] = useSetAppDataByKey(APP_DATA.dropdownList);
-  useEffect6(() => {
+  useEffect7(() => {
     if (open) {
       if (!dropdownList.includes(name)) {
         setDropdownList([...dropdownList, name]);
@@ -12883,7 +13108,7 @@ var useDropdownList = ({ name, open }) => {
 // src/Prebuilt/components/EmojiReaction.jsx
 init({ data });
 var EmojiReaction = () => {
-  const [open, setOpen] = useState6(false);
+  const [open, setOpen] = useState7(false);
   const isConnected = useHMSStore7(selectIsConnectedToRoom);
   useDropdownList({ open, name: "EmojiReaction" });
   const roles = useHMSStore7(selectAvailableRoleNames);
@@ -12905,12 +13130,12 @@ var EmojiReaction = () => {
   if (!isConnected) {
     return null;
   }
-  return isMobile ? /* @__PURE__ */ React28.createElement(EmojiCard, { sendReaction }) : /* @__PURE__ */ React28.createElement(Fragment3, null, /* @__PURE__ */ React28.createElement(Dropdown.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React28.createElement(Dropdown.Trigger, { asChild: true, "data-testid": "emoji_reaction_btn" }, /* @__PURE__ */ React28.createElement(IconButton_default, null, /* @__PURE__ */ React28.createElement(Tooltip, { title: "Emoji reaction" }, /* @__PURE__ */ React28.createElement(Box, null, /* @__PURE__ */ React28.createElement(EmojiIcon, null))))), /* @__PURE__ */ React28.createElement(Dropdown.Content, { sideOffset: 5, align: "center", css: { p: "$8", bg: "$surface_default" } }, /* @__PURE__ */ React28.createElement(EmojiCard, { sendReaction }))));
+  return isMobile ? /* @__PURE__ */ React29.createElement(EmojiCard, { sendReaction }) : /* @__PURE__ */ React29.createElement(Fragment3, null, /* @__PURE__ */ React29.createElement(Dropdown.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React29.createElement(Dropdown.Trigger, { asChild: true, "data-testid": "emoji_reaction_btn" }, /* @__PURE__ */ React29.createElement(IconButton_default, null, /* @__PURE__ */ React29.createElement(Tooltip, { title: "Emoji reaction" }, /* @__PURE__ */ React29.createElement(Box, null, /* @__PURE__ */ React29.createElement(EmojiIcon, null))))), /* @__PURE__ */ React29.createElement(Dropdown.Content, { sideOffset: 5, align: "center", css: { p: "$8", bg: "$surface_default" } }, /* @__PURE__ */ React29.createElement(EmojiCard, { sendReaction }))));
 };
 
 // src/Prebuilt/components/Leave/LeaveRoom.tsx
 init_define_process_env();
-import React35 from "react";
+import React36 from "react";
 import { useMedia as useMedia2 } from "react-use";
 import {
   selectHLSState as selectHLSState2,
@@ -12924,13 +13149,13 @@ import {
 
 // src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx
 init_define_process_env();
-import React32, { Fragment as Fragment4, useState as useState7 } from "react";
+import React33, { Fragment as Fragment4, useState as useState8 } from "react";
 import { selectIsConnectedToRoom as selectIsConnectedToRoom2, selectPermissions as selectPermissions2, useHMSStore as useHMSStore8, useRecordingStreaming as useRecordingStreaming2 } from "@100mslive/react-sdk";
 import { ExitIcon, StopIcon, VerticalMenuIcon as VerticalMenuIcon2 } from "@100mslive/react-icons";
 
 // src/Prebuilt/components/Leave/EndSessionContent.tsx
 init_define_process_env();
-import React29 from "react";
+import React30 from "react";
 import { AlertTriangleIcon, CrossIcon as CrossIcon3 } from "@100mslive/react-icons";
 var EndSessionContent = ({
   setShowEndStreamAlert,
@@ -12938,7 +13163,7 @@ var EndSessionContent = ({
   isModal = false,
   isStreamingOn = false
 }) => {
-  return /* @__PURE__ */ React29.createElement(Box, null, /* @__PURE__ */ React29.createElement(
+  return /* @__PURE__ */ React30.createElement(Box, null, /* @__PURE__ */ React30.createElement(
     Flex,
     {
       css: {
@@ -12947,10 +13172,10 @@ var EndSessionContent = ({
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React29.createElement(AlertTriangleIcon, { style: { marginRight: "0.5rem" } }),
-    /* @__PURE__ */ React29.createElement(Text, { variant: "lg", css: { color: "inherit", fontWeight: "$semiBold" } }, "End ", isStreamingOn ? "Stream" : "Session"),
-    isModal ? null : /* @__PURE__ */ React29.createElement(Box, { css: { color: "$on_surface_high", ml: "auto" }, onClick: () => setShowEndStreamAlert(false) }, /* @__PURE__ */ React29.createElement(CrossIcon3, null))
-  ), /* @__PURE__ */ React29.createElement(Text, { variant: "sm", css: { color: "$on_surface_medium", mb: "$8", mt: "$4" } }, "The ", isStreamingOn ? "stream" : "session", " will end for everyone. You can't undo this action."), /* @__PURE__ */ React29.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ React29.createElement(
+    /* @__PURE__ */ React30.createElement(AlertTriangleIcon, { style: { marginRight: "0.5rem" } }),
+    /* @__PURE__ */ React30.createElement(Text, { variant: "lg", css: { color: "inherit", fontWeight: "$semiBold" } }, "End ", isStreamingOn ? "Stream" : "Session"),
+    isModal ? null : /* @__PURE__ */ React30.createElement(Box, { css: { color: "$on_surface_high", ml: "auto" }, onClick: () => setShowEndStreamAlert(false) }, /* @__PURE__ */ React30.createElement(CrossIcon3, null))
+  ), /* @__PURE__ */ React30.createElement(Text, { variant: "sm", css: { color: "$on_surface_medium", mb: "$8", mt: "$4" } }, "The ", isStreamingOn ? "stream" : "session", " will end for everyone. You can't undo this action."), /* @__PURE__ */ React30.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ React30.createElement(
     Button,
     {
       outlined: true,
@@ -12959,7 +13184,7 @@ var EndSessionContent = ({
       onClick: () => setShowEndStreamAlert(false)
     },
     "Cancel"
-  ), /* @__PURE__ */ React29.createElement(
+  ), /* @__PURE__ */ React30.createElement(
     Button,
     {
       variant: "danger",
@@ -13003,7 +13228,7 @@ var MenuTriggerButton = styled(LeaveIconButton, {
 
 // src/Prebuilt/components/Leave/LeaveCard.tsx
 init_define_process_env();
-import React30 from "react";
+import React31 from "react";
 var LeaveCard = ({
   icon,
   title,
@@ -13013,19 +13238,19 @@ var LeaveCard = ({
   titleColor,
   css: css2 = {}
 }) => {
-  return /* @__PURE__ */ React30.createElement(Flex, { css: __spreadValues({ p: "$10", flexGrow: 1, gap: "$8", bg }, css2), onClick }, /* @__PURE__ */ React30.createElement(Box, { css: { color: titleColor } }, icon), /* @__PURE__ */ React30.createElement(Box, { css: { gap: "$2" } }, /* @__PURE__ */ React30.createElement(Text, { variant: "lg", css: { color: titleColor } }, title), /* @__PURE__ */ React30.createElement(Text, { variant: "sm", css: { c: "inherit" } }, subtitle)));
+  return /* @__PURE__ */ React31.createElement(Flex, { css: __spreadValues({ p: "$10", flexGrow: 1, gap: "$8", bg }, css2), onClick }, /* @__PURE__ */ React31.createElement(Box, { css: { color: titleColor } }, icon), /* @__PURE__ */ React31.createElement(Box, { css: { gap: "$2" } }, /* @__PURE__ */ React31.createElement(Text, { variant: "lg", css: { color: titleColor } }, title), /* @__PURE__ */ React31.createElement(Text, { variant: "sm", css: { c: "inherit" } }, subtitle)));
 };
 
 // src/Prebuilt/components/Leave/LeaveSessionContent.tsx
 init_define_process_env();
-import React31 from "react";
+import React32 from "react";
 import { AlertTriangleIcon as AlertTriangleIcon2, CrossIcon as CrossIcon4 } from "@100mslive/react-icons";
 var LeaveSessionContent = ({
   setShowLeaveRoomAlert,
   leaveRoom,
   isModal = false
 }) => {
-  return /* @__PURE__ */ React31.createElement(Box, null, /* @__PURE__ */ React31.createElement(
+  return /* @__PURE__ */ React32.createElement(Box, null, /* @__PURE__ */ React32.createElement(
     Flex,
     {
       css: {
@@ -13034,10 +13259,10 @@ var LeaveSessionContent = ({
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React31.createElement(AlertTriangleIcon2, { style: { marginRight: "0.5rem" } }),
-    /* @__PURE__ */ React31.createElement(Text, { variant: "lg", css: { color: "inherit", fontWeight: "$semiBold" } }, "Leave"),
-    isModal ? null : /* @__PURE__ */ React31.createElement(Box, { css: { color: "$on_surface_high", ml: "auto" }, onClick: () => setShowLeaveRoomAlert(false) }, /* @__PURE__ */ React31.createElement(CrossIcon4, null))
-  ), /* @__PURE__ */ React31.createElement(Text, { variant: "sm", css: { color: "$on_surface_low", mb: "$8", mt: "$4" } }, "Others will continue after you leave. You can join the session again."), /* @__PURE__ */ React31.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ React31.createElement(
+    /* @__PURE__ */ React32.createElement(AlertTriangleIcon2, { style: { marginRight: "0.5rem" } }),
+    /* @__PURE__ */ React32.createElement(Text, { variant: "lg", css: { color: "inherit", fontWeight: "$semiBold" } }, "Leave"),
+    isModal ? null : /* @__PURE__ */ React32.createElement(Box, { css: { color: "$on_surface_high", ml: "auto" }, onClick: () => setShowLeaveRoomAlert(false) }, /* @__PURE__ */ React32.createElement(CrossIcon4, null))
+  ), /* @__PURE__ */ React32.createElement(Text, { variant: "sm", css: { color: "$on_surface_low", mb: "$8", mt: "$4" } }, "Others will continue after you leave. You can join the session again."), /* @__PURE__ */ React32.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ React32.createElement(
     Button,
     {
       outlined: true,
@@ -13046,7 +13271,7 @@ var LeaveSessionContent = ({
       onClick: () => setShowLeaveRoomAlert(false)
     },
     "Cancel"
-  ), /* @__PURE__ */ React31.createElement(
+  ), /* @__PURE__ */ React32.createElement(
     Button,
     {
       variant: "danger",
@@ -13067,9 +13292,9 @@ var DesktopLeaveRoom = ({
   screenType,
   endRoom
 }) => {
-  const [open, setOpen] = useState7(false);
-  const [showLeaveRoomAlert, setShowLeaveRoomAlert] = useState7(false);
-  const [showEndStreamAlert, setShowEndStreamAlert] = useState7(false);
+  const [open, setOpen] = useState8(false);
+  const [showLeaveRoomAlert, setShowLeaveRoomAlert] = useState8(false);
+  const [showEndStreamAlert, setShowEndStreamAlert] = useState8(false);
   const isConnected = useHMSStore8(selectIsConnectedToRoom2);
   const permissions = useHMSStore8(selectPermissions2);
   const { isStreamingOn } = useRecordingStreaming2();
@@ -13079,7 +13304,7 @@ var DesktopLeaveRoom = ({
   if (!permissions || !isConnected) {
     return null;
   }
-  return /* @__PURE__ */ React32.createElement(Fragment4, null, showLeaveOptions ? /* @__PURE__ */ React32.createElement(Flex, null, /* @__PURE__ */ React32.createElement(
+  return /* @__PURE__ */ React33.createElement(Fragment4, null, showLeaveOptions ? /* @__PURE__ */ React33.createElement(Flex, null, /* @__PURE__ */ React33.createElement(
     LeaveIconButton,
     {
       key: "LeaveRoom",
@@ -13090,8 +13315,8 @@ var DesktopLeaveRoom = ({
       },
       onClick: () => setShowLeaveRoomAlert(true)
     },
-    /* @__PURE__ */ React32.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React32.createElement(Box, null, /* @__PURE__ */ React32.createElement(ExitIcon, { style: { transform: "rotate(180deg)" } })))
-  ), /* @__PURE__ */ React32.createElement(Dropdown.Root, { open, onOpenChange: setOpen, modal: false }, /* @__PURE__ */ React32.createElement(
+    /* @__PURE__ */ React33.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React33.createElement(Box, null, /* @__PURE__ */ React33.createElement(ExitIcon, { style: { transform: "rotate(180deg)" } })))
+  ), /* @__PURE__ */ React33.createElement(Dropdown.Root, { open, onOpenChange: setOpen, modal: false }, /* @__PURE__ */ React33.createElement(
     Dropdown.Trigger,
     {
       asChild: true,
@@ -13101,8 +13326,8 @@ var DesktopLeaveRoom = ({
         }
       }
     },
-    /* @__PURE__ */ React32.createElement(MenuTriggerButton, { "data-testid": "leave_end_dropdown_trigger" }, /* @__PURE__ */ React32.createElement(VerticalMenuIcon2, null))
-  ), /* @__PURE__ */ React32.createElement(Dropdown.Content, { css: { p: 0, w: "$100" }, alignOffset: -50, sideOffset: 10 }, /* @__PURE__ */ React32.createElement(
+    /* @__PURE__ */ React33.createElement(MenuTriggerButton, { "data-testid": "leave_end_dropdown_trigger" }, /* @__PURE__ */ React33.createElement(VerticalMenuIcon2, null))
+  ), /* @__PURE__ */ React33.createElement(Dropdown.Content, { css: { p: 0, w: "$100" }, alignOffset: -50, sideOffset: 10 }, /* @__PURE__ */ React33.createElement(
     Dropdown.Item,
     {
       css: {
@@ -13113,21 +13338,21 @@ var DesktopLeaveRoom = ({
       },
       "data-testid": "just_leave_btn"
     },
-    /* @__PURE__ */ React32.createElement(
+    /* @__PURE__ */ React33.createElement(
       LeaveCard,
       {
         title: showStream ? "Leave Stream" : "Leave Session",
         subtitle: `Others will continue after you leave. You can join the ${showStream ? "stream" : "session"} again.`,
         bg: "",
         titleColor: "$on_surface_high",
-        icon: /* @__PURE__ */ React32.createElement(ExitIcon, { height: 24, width: 24, style: { transform: "rotate(180deg)" } }),
+        icon: /* @__PURE__ */ React33.createElement(ExitIcon, { height: 24, width: 24, style: { transform: "rotate(180deg)" } }),
         onClick: () => __async(void 0, null, function* () {
           return yield leaveRoom();
         }),
         css: { p: "$8 $4" }
       }
     )
-  ), /* @__PURE__ */ React32.createElement(
+  ), /* @__PURE__ */ React33.createElement(
     Dropdown.Item,
     {
       css: {
@@ -13138,14 +13363,14 @@ var DesktopLeaveRoom = ({
       },
       "data-testid": "end_room_btn"
     },
-    /* @__PURE__ */ React32.createElement(
+    /* @__PURE__ */ React33.createElement(
       LeaveCard,
       {
         title: showStream ? "End Stream" : "End Session",
         subtitle: `The ${showStream ? "stream" : "session"} will end for everyone. You can't undo this action.`,
         bg: "",
         titleColor: "$alert_error_brighter",
-        icon: /* @__PURE__ */ React32.createElement(StopIcon, { height: 24, width: 24 }),
+        icon: /* @__PURE__ */ React33.createElement(StopIcon, { height: 24, width: 24 }),
         onClick: () => {
           setOpen(false);
           setShowEndStreamAlert(true);
@@ -13153,7 +13378,7 @@ var DesktopLeaveRoom = ({
         css: { p: "$8 $4" }
       }
     )
-  )))) : /* @__PURE__ */ React32.createElement(
+  )))) : /* @__PURE__ */ React33.createElement(
     LeaveIconButton,
     {
       onClick: () => {
@@ -13162,8 +13387,8 @@ var DesktopLeaveRoom = ({
       key: "LeaveRoom",
       "data-testid": "leave_room_btn"
     },
-    /* @__PURE__ */ React32.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React32.createElement(Box, null, /* @__PURE__ */ React32.createElement(ExitIcon, { style: { transform: "rotate(180deg)" } })))
-  ), /* @__PURE__ */ React32.createElement(Dialog.Root, { open: showEndStreamAlert, modal: false }, /* @__PURE__ */ React32.createElement(Dialog.Portal, null, /* @__PURE__ */ React32.createElement(Dialog.Overlay, null), /* @__PURE__ */ React32.createElement(Dialog.Content, { css: { w: "min(420px, 90%)", p: "$8", bg: "$surface_dim" } }, /* @__PURE__ */ React32.createElement(
+    /* @__PURE__ */ React33.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React33.createElement(Box, null, /* @__PURE__ */ React33.createElement(ExitIcon, { style: { transform: "rotate(180deg)" } })))
+  ), /* @__PURE__ */ React33.createElement(Dialog.Root, { open: showEndStreamAlert, modal: false }, /* @__PURE__ */ React33.createElement(Dialog.Portal, null, /* @__PURE__ */ React33.createElement(Dialog.Overlay, null), /* @__PURE__ */ React33.createElement(Dialog.Content, { css: { w: "min(420px, 90%)", p: "$8", bg: "$surface_dim" } }, /* @__PURE__ */ React33.createElement(
     EndSessionContent,
     {
       setShowEndStreamAlert,
@@ -13171,12 +13396,12 @@ var DesktopLeaveRoom = ({
       isStreamingOn,
       isModal: true
     }
-  )))), /* @__PURE__ */ React32.createElement(Dialog.Root, { open: showLeaveRoomAlert, modal: false }, /* @__PURE__ */ React32.createElement(Dialog.Portal, null, /* @__PURE__ */ React32.createElement(Dialog.Overlay, null), /* @__PURE__ */ React32.createElement(Dialog.Content, { css: { w: "min(420px, 90%)", p: "$8", bg: "$surface_dim" } }, /* @__PURE__ */ React32.createElement(LeaveSessionContent, { setShowLeaveRoomAlert, leaveRoom, isModal: true })))));
+  )))), /* @__PURE__ */ React33.createElement(Dialog.Root, { open: showLeaveRoomAlert, modal: false }, /* @__PURE__ */ React33.createElement(Dialog.Portal, null, /* @__PURE__ */ React33.createElement(Dialog.Overlay, null), /* @__PURE__ */ React33.createElement(Dialog.Content, { css: { w: "min(420px, 90%)", p: "$8", bg: "$surface_dim" } }, /* @__PURE__ */ React33.createElement(LeaveSessionContent, { setShowLeaveRoomAlert, leaveRoom, isModal: true })))));
 };
 
 // src/Prebuilt/components/Leave/MwebLeaveRoom.tsx
 init_define_process_env();
-import React34, { Fragment as Fragment5, useState as useState8 } from "react";
+import React35, { Fragment as Fragment5, useState as useState9 } from "react";
 import { selectIsConnectedToRoom as selectIsConnectedToRoom3, selectPermissions as selectPermissions3, useHMSStore as useHMSStore9, useRecordingStreaming as useRecordingStreaming3 } from "@100mslive/react-sdk";
 import { ExitIcon as ExitIcon2, StopIcon as StopIcon2 } from "@100mslive/react-icons";
 
@@ -13185,7 +13410,7 @@ init_define_process_env();
 
 // src/Sheet/Sheet.tsx
 init_define_process_env();
-import React33 from "react";
+import React34 from "react";
 import * as DialogPrimitive2 from "@radix-ui/react-dialog";
 var SheetRoot = styled(DialogPrimitive2.Root, {
   minHeight: "240px",
@@ -13259,10 +13484,10 @@ var StyledContent6 = styled(DialogPrimitive2.Content, {
     side: "bottom"
   }
 });
-var SheetContent = React33.forwardRef(
+var SheetContent = React34.forwardRef(
   (_a8, forwardedRef) => {
     var _b7 = _a8, { children } = _b7, props = __objRest(_b7, ["children"]);
-    return /* @__PURE__ */ React33.createElement(Dialog.Portal, null, /* @__PURE__ */ React33.createElement(StyledOverlay, null), /* @__PURE__ */ React33.createElement(StyledContent6, __spreadProps(__spreadValues({}, props), { ref: forwardedRef }), children));
+    return /* @__PURE__ */ React34.createElement(Dialog.Portal, null, /* @__PURE__ */ React34.createElement(StyledOverlay, null), /* @__PURE__ */ React34.createElement(StyledContent6, __spreadProps(__spreadValues({}, props), { ref: forwardedRef }), children));
   }
 );
 var SheetClose = Dialog.Close;
@@ -13287,9 +13512,9 @@ var MwebLeaveRoom = ({
   screenType,
   endRoom
 }) => {
-  const [open, setOpen] = useState8(false);
-  const [showLeaveRoomAlert, setShowLeaveRoomAlert] = useState8(false);
-  const [showEndStreamAlert, setShowEndStreamAlert] = useState8(false);
+  const [open, setOpen] = useState9(false);
+  const [showLeaveRoomAlert, setShowLeaveRoomAlert] = useState9(false);
+  const [showEndStreamAlert, setShowEndStreamAlert] = useState9(false);
   const isConnected = useHMSStore9(selectIsConnectedToRoom3);
   const permissions = useHMSStore9(selectPermissions3);
   const { isStreamingOn } = useRecordingStreaming3();
@@ -13299,7 +13524,7 @@ var MwebLeaveRoom = ({
   if (!permissions || !isConnected) {
     return null;
   }
-  return /* @__PURE__ */ React34.createElement(Fragment5, null, showLeaveOptions ? /* @__PURE__ */ React34.createElement(Sheet.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React34.createElement(Sheet.Trigger, { asChild: true }, /* @__PURE__ */ React34.createElement(
+  return /* @__PURE__ */ React35.createElement(Fragment5, null, showLeaveOptions ? /* @__PURE__ */ React35.createElement(Sheet.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React35.createElement(Sheet.Trigger, { asChild: true }, /* @__PURE__ */ React35.createElement(
     LeaveIconButton,
     {
       key: "LeaveRoom",
@@ -13309,21 +13534,21 @@ var MwebLeaveRoom = ({
         borderBottomRightRadius: "$1"
       }
     },
-    /* @__PURE__ */ React34.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React34.createElement(Box, null, /* @__PURE__ */ React34.createElement(ExitIcon2, { style: { transform: "rotate(180deg)" } })))
-  )), /* @__PURE__ */ React34.createElement(Sheet.Content, null, /* @__PURE__ */ React34.createElement(
+    /* @__PURE__ */ React35.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React35.createElement(Box, null, /* @__PURE__ */ React35.createElement(ExitIcon2, { style: { transform: "rotate(180deg)" } })))
+  )), /* @__PURE__ */ React35.createElement(Sheet.Content, null, /* @__PURE__ */ React35.createElement(
     LeaveCard,
     {
       title: showStream ? "Leave Stream" : "Leave Session",
       subtitle: `Others will continue after you leave. You can join the ${showStream ? "stream" : "session"} again.`,
       bg: "$surface_default",
       titleColor: "$on_surface_high",
-      icon: /* @__PURE__ */ React34.createElement(ExitIcon2, { height: 24, width: 24, style: { transform: "rotate(180deg)" } }),
+      icon: /* @__PURE__ */ React35.createElement(ExitIcon2, { height: 24, width: 24, style: { transform: "rotate(180deg)" } }),
       onClick: () => __async(void 0, null, function* () {
         return yield leaveRoom();
       }),
       css: { pt: 0, mt: "$10", color: "$on_surface_low", "&:hover": { color: "$on_surface_high" } }
     }
-  ), /* @__PURE__ */ React34.createElement(
+  ), /* @__PURE__ */ React35.createElement(
     LeaveCard,
     {
       title: showStream ? "End Stream" : "End Session",
@@ -13331,20 +13556,20 @@ var MwebLeaveRoom = ({
       bg: "$alert_error_dim",
       titleColor: "$alert_error_brighter",
       css: { color: "$alert_error_bright", "&:hover": { color: "$alert_error_brighter" } },
-      icon: /* @__PURE__ */ React34.createElement(StopIcon2, { height: 24, width: 24 }),
+      icon: /* @__PURE__ */ React35.createElement(StopIcon2, { height: 24, width: 24 }),
       onClick: () => {
         setOpen(false);
         setShowEndStreamAlert(true);
       }
     }
-  ))) : /* @__PURE__ */ React34.createElement(LeaveIconButton, { key: "LeaveRoom", "data-testid": "leave_room_btn", onClick: () => setShowLeaveRoomAlert(true) }, /* @__PURE__ */ React34.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React34.createElement(Box, null, /* @__PURE__ */ React34.createElement(ExitIcon2, { style: { transform: "rotate(180deg)" } })))), /* @__PURE__ */ React34.createElement(Sheet.Root, { open: showEndStreamAlert, onOpenChange: setShowEndStreamAlert }, /* @__PURE__ */ React34.createElement(Sheet.Content, { css: { bg: "$surface_dim", p: "$10", pb: "$12" } }, /* @__PURE__ */ React34.createElement(
+  ))) : /* @__PURE__ */ React35.createElement(LeaveIconButton, { key: "LeaveRoom", "data-testid": "leave_room_btn", onClick: () => setShowLeaveRoomAlert(true) }, /* @__PURE__ */ React35.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ React35.createElement(Box, null, /* @__PURE__ */ React35.createElement(ExitIcon2, { style: { transform: "rotate(180deg)" } })))), /* @__PURE__ */ React35.createElement(Sheet.Root, { open: showEndStreamAlert, onOpenChange: setShowEndStreamAlert }, /* @__PURE__ */ React35.createElement(Sheet.Content, { css: { bg: "$surface_dim", p: "$10", pb: "$12" } }, /* @__PURE__ */ React35.createElement(
     EndSessionContent,
     {
       setShowEndStreamAlert,
       leaveRoom: isStreamingOn ? leaveRoom : endRoom,
       isStreamingOn
     }
-  ))), /* @__PURE__ */ React34.createElement(Sheet.Root, { open: showLeaveRoomAlert, onOpenChange: setShowLeaveRoomAlert }, /* @__PURE__ */ React34.createElement(Sheet.Content, { css: { bg: "$surface_dim", p: "$10", pb: "$12" } }, /* @__PURE__ */ React34.createElement(LeaveSessionContent, { setShowLeaveRoomAlert, leaveRoom }))));
+  ))), /* @__PURE__ */ React35.createElement(Sheet.Root, { open: showLeaveRoomAlert, onOpenChange: setShowLeaveRoomAlert }, /* @__PURE__ */ React35.createElement(Sheet.Content, { css: { bg: "$surface_dim", p: "$10", pb: "$12" } }, /* @__PURE__ */ React35.createElement(LeaveSessionContent, { setShowLeaveRoomAlert, leaveRoom }))));
 };
 
 // src/Prebuilt/components/Leave/LeaveRoom.tsx
@@ -13386,7 +13611,7 @@ var LeaveRoom = ({ screenType }) => {
   if (!permissions || !isConnected) {
     return null;
   }
-  return isMobile ? /* @__PURE__ */ React35.createElement(MwebLeaveRoom, { leaveRoom, screenType, endRoom }) : /* @__PURE__ */ React35.createElement(DesktopLeaveRoom, { leaveRoom, screenType, endRoom });
+  return isMobile ? /* @__PURE__ */ React36.createElement(MwebLeaveRoom, { leaveRoom, screenType, endRoom }) : /* @__PURE__ */ React36.createElement(DesktopLeaveRoom, { leaveRoom, screenType, endRoom });
 };
 
 // src/Prebuilt/components/MoreSettings/MoreSettings.tsx
@@ -13403,11 +13628,11 @@ import { BrbIcon, CheckIcon as CheckIcon4, HamburgerMenuIcon, InfoIcon as InfoIc
 
 // src/Prebuilt/components/PIP/index.jsx
 init_define_process_env();
-import React37 from "react";
+import React38 from "react";
 
 // src/Prebuilt/components/PIP/PIPComponent.jsx
 init_define_process_env();
-import React36, { useCallback as useCallback6, useEffect as useEffect7, useState as useState9 } from "react";
+import React37, { useCallback as useCallback7, useEffect as useEffect8, useState as useState10 } from "react";
 import { selectPeers, selectTracksMap, useHMSActions as useHMSActions8, useHMSStore as useHMSStore11, useHMSVanillaStore as useHMSVanillaStore4 } from "@100mslive/react-sdk";
 import { PipIcon } from "@100mslive/react-icons";
 
@@ -13866,10 +14091,10 @@ var MediaSession = new SetupMediaSession();
 
 // src/Prebuilt/components/PIP/PIPComponent.jsx
 var PIPComponent = ({ content = null }) => {
-  const [isPipOn, setIsPipOn] = useState9(PictureInPicture.isOn());
+  const [isPipOn, setIsPipOn] = useState10(PictureInPicture.isOn());
   const hmsActions = useHMSActions8();
   const store = useHMSVanillaStore4();
-  const onPipToggle = useCallback6(() => {
+  const onPipToggle = useCallback7(() => {
     if (!isPipOn) {
       PictureInPicture.start(hmsActions, setIsPipOn).catch((err) => console.error("error in starting pip", err));
       MediaSession.setup(hmsActions, store);
@@ -13880,13 +14105,13 @@ var PIPComponent = ({ content = null }) => {
   if (!PictureInPicture.isSupported()) {
     return null;
   }
-  return /* @__PURE__ */ React36.createElement(React36.Fragment, null, content ? /* @__PURE__ */ React36.createElement(Flex, { css: { w: "100%" }, onClick: () => onPipToggle(), "data-testid": "pip_btn" }, content) : /* @__PURE__ */ React36.createElement(Tooltip, { title: `${isPipOn ? "Deactivate" : "Activate"} picture in picture view` }, /* @__PURE__ */ React36.createElement(IconButton_default, { active: !isPipOn, key: "pip", onClick: () => onPipToggle(), "data-testid": "pip_btn" }, /* @__PURE__ */ React36.createElement(PipIcon, null))));
+  return /* @__PURE__ */ React37.createElement(React37.Fragment, null, content ? /* @__PURE__ */ React37.createElement(Flex, { css: { w: "100%" }, onClick: () => onPipToggle(), "data-testid": "pip_btn" }, content) : /* @__PURE__ */ React37.createElement(Tooltip, { title: `${isPipOn ? "Deactivate" : "Activate"} picture in picture view` }, /* @__PURE__ */ React37.createElement(IconButton_default, { active: !isPipOn, key: "pip", onClick: () => onPipToggle(), "data-testid": "pip_btn" }, /* @__PURE__ */ React37.createElement(PipIcon, null))));
 };
 var ActivatedPIP = () => {
   const tracksMap = useHMSStore11(selectTracksMap);
   const storePeers = useHMSStore11(selectPeers);
   const pinnedTrack = usePinnedTrack();
-  useEffect7(() => {
+  useEffect8(() => {
     function updatePIP() {
       if (!PictureInPicture.isOn()) {
         return;
@@ -13902,13 +14127,13 @@ var ActivatedPIP = () => {
     PictureInPicture.listenToStateChange(updatePIP);
     updatePIP();
   }, [storePeers, tracksMap, pinnedTrack]);
-  return /* @__PURE__ */ React36.createElement(React36.Fragment, null);
+  return /* @__PURE__ */ React37.createElement(React37.Fragment, null);
 };
 var PIPComponent_default = PIPComponent;
 
 // src/Prebuilt/components/PIP/index.jsx
 var PIP = ({ content = null }) => {
-  return /* @__PURE__ */ React37.createElement(PIPComponent_default, { content });
+  return /* @__PURE__ */ React38.createElement(PIPComponent_default, { content });
 };
 
 // src/Prebuilt/components/RoleChangeModal.jsx
@@ -13937,217 +14162,6 @@ import {
   useHMSStore as useHMSStore12,
   useHMSVanillaStore as useHMSVanillaStore5
 } from "@100mslive/react-sdk";
-
-// src/Prebuilt/provider/roomLayoutProvider/index.tsx
-init_define_process_env();
-var import_lodash2 = __toESM(require_lodash());
-import React38 from "react";
-
-// src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts
-init_define_process_env();
-import { useCallback as useCallback7, useEffect as useEffect8, useRef as useRef5, useState as useState10 } from "react";
-
-// src/Prebuilt/provider/roomLayoutProvider/constants/index.ts
-init_define_process_env();
-import { JoinForm_JoinBtnType } from "@100mslive/types-prebuilt/elements/join_form";
-var defaultLayout = {
-  id: "",
-  role_id: "",
-  template_id: "",
-  app_id: "",
-  typography: {
-    font_family: "Inter"
-  },
-  themes: [],
-  options: {},
-  screens: {
-    preview: {
-      default: {
-        elements: {
-          preview_header: {
-            title: "Get Started",
-            sub_title: "Setup your audio and video before joining"
-          },
-          join_form: {
-            join_btn_type: JoinForm_JoinBtnType.JOIN_BTN_TYPE_JOIN_ONLY,
-            join_btn_label: "Join Now",
-            go_live_btn_label: "Go Live"
-          }
-        }
-      }
-    },
-    conferencing: {
-      default: {
-        elements: {
-          chat: {
-            public_chat_enabled: true,
-            private_chat_enabled: true,
-            chat_title: "Chat",
-            allow_pinning_messages: true,
-            message_placeholder: "Send a message...",
-            roles_whitelist: [],
-            real_time_controls: {
-              can_disable_chat: true,
-              can_block_user: true,
-              can_hide_message: true
-            }
-          },
-          participant_list: {},
-          video_tile_layout: {
-            grid: {
-              enable_local_tile_inset: true,
-              prominent_roles: [],
-              enable_spotlighting_peer: true
-            }
-          },
-          emoji_reactions: {}
-        }
-      }
-    },
-    leave: {}
-  }
-};
-
-// src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts
-var fetchWithRetry = (..._0) => __async(void 0, [..._0], function* (url = "", options = {}) {
-  const MAX_RETRIES = 4;
-  let error = Error("something went wrong");
-  for (let i = 0; i < MAX_RETRIES; i++) {
-    try {
-      return yield fetch(url, options);
-    } catch (err) {
-      error = err;
-    }
-  }
-  console.error("Fetch failed after max retries", { url, options });
-  throw error;
-});
-var useFetchRoomLayout = ({
-  endpoint = "",
-  authToken = ""
-}) => {
-  const [layout, setLayout] = useState10(void 0);
-  const layoutResp = useRef5();
-  const isFetchInProgress = useRef5(false);
-  const updateRoomLayoutForRole = useCallback7((role) => {
-    var _a8;
-    if (!layoutResp.current) {
-      return;
-    }
-    const [layout2] = (((_a8 = layoutResp.current) == null ? void 0 : _a8.data) || []).filter((layout3) => layout3.role === role);
-    if (layout2) {
-      setLayout(layout2);
-    }
-  }, []);
-  useEffect8(() => {
-    (() => __async(void 0, null, function* () {
-      var _a8, _b7;
-      if (isFetchInProgress.current || !authToken) {
-        return;
-      }
-      isFetchInProgress.current = true;
-      try {
-        const resp = yield fetchWithRetry(endpoint || "https://api.100ms.live/v2/layouts/ui", {
-          headers: {
-            Authorization: `Bearer ${authToken}`
-          }
-        });
-        layoutResp.current = yield resp.json();
-      } catch (e) {
-        console.error("[Room Layout API]: Failed to fetch / process room layout. Resorting to default layout.", e);
-        layoutResp.current = {
-          data: [defaultLayout]
-        };
-      }
-      let layoutForRole = (_b7 = (_a8 = layoutResp.current) == null ? void 0 : _a8.data) == null ? void 0 : _b7[0];
-      if (!layoutForRole) {
-        console.error(
-          "[Room Layout API]: Unable to figure out room layout from API response. Resorting to default layout."
-        );
-        layoutForRole = defaultLayout;
-      }
-      const layout2 = layoutForRole;
-      setLayout(layout2);
-      isFetchInProgress.current = false;
-    }))();
-  }, [authToken, endpoint]);
-  return { layout, updateRoomLayoutForRole };
-};
-
-// src/Prebuilt/provider/roomLayoutProvider/index.tsx
-var RoomLayoutContext = React38.createContext(void 0);
-function customizer(objValue, srcValue) {
-  if ((0, import_lodash2.isArray)(objValue) || (0, import_lodash2.isArray)(srcValue)) {
-    return srcValue;
-  }
-  return void 0;
-}
-var RoomLayoutProvider = ({
-  children,
-  roomLayoutEndpoint,
-  overrideLayout
-}) => {
-  const authToken = useAuthToken();
-  const { layout, updateRoomLayoutForRole } = useFetchRoomLayout({ authToken, endpoint: roomLayoutEndpoint });
-  const mergedLayout = authToken && layout ? (0, import_lodash2.mergeWith)(layout, overrideLayout, customizer) : layout;
-  return /* @__PURE__ */ React38.createElement(RoomLayoutContext.Provider, { value: { layout: mergedLayout, updateRoomLayoutForRole } }, children);
-};
-var useRoomLayout = () => {
-  var _a8;
-  return (_a8 = React38.useContext(RoomLayoutContext)) == null ? void 0 : _a8.layout;
-};
-var useUpdateRoomLayout = () => {
-  var _a8;
-  return (_a8 = React38.useContext(RoomLayoutContext)) == null ? void 0 : _a8.updateRoomLayoutForRole;
-};
-
-// src/Prebuilt/provider/roomLayoutProvider/hooks/useRoomLayoutScreen.ts
-init_define_process_env();
-function useRoomLayoutScreen({
-  screen
-}) {
-  var _a8;
-  const roomLayout = useRoomLayout();
-  const screenProps = (_a8 = roomLayout == null ? void 0 : roomLayout.screens) == null ? void 0 : _a8[screen];
-  return screenProps;
-}
-function useRoomLayoutPreviewScreen() {
-  var _a8;
-  const screenProps = useRoomLayoutScreen({ screen: "preview" });
-  const isPreviewScreenEnabled = !!screenProps && !(screenProps == null ? void 0 : screenProps.skip_preview_screen);
-  let elements;
-  let screenType;
-  if (isPreviewScreenEnabled) {
-    screenType = Object.keys(screenProps).filter((key) => key !== "skip_preview_screen")[0];
-    elements = (_a8 = screenProps[screenType]) == null ? void 0 : _a8.elements;
-  }
-  return {
-    isPreviewScreenEnabled,
-    elements,
-    screenType
-  };
-}
-function useRoomLayoutConferencingScreen() {
-  var _a8, _b7;
-  const screenProps = useRoomLayoutScreen({ screen: "conferencing" }) || {};
-  const screenType = Object.keys(screenProps)[0];
-  const elements = (_a8 = screenProps[screenType]) == null ? void 0 : _a8.elements;
-  const hideSections = ((_b7 = screenProps[screenType]) == null ? void 0 : _b7.hideSections) || [];
-  return {
-    hideSections,
-    elements,
-    screenType
-  };
-}
-function useRoomLayoutLeaveScreen() {
-  const screenProps = useRoomLayoutScreen({ screen: "leave" });
-  const isLeaveScreenEnabled = !!screenProps;
-  return {
-    isLeaveScreenEnabled
-  };
-}
-
-// src/Prebuilt/common/hooks.ts
 var useFilteredRoles = () => {
   var _a8;
   const { elements } = useRoomLayoutConferencingScreen();
@@ -18028,7 +18042,7 @@ var Qi = (a2, e) => {
 };
 var ya = (a2, e) => () => (e || a2((e = { exports: {} }).exports, e), e.exports);
 var nr = ya((Qc, Va) => {
-  Va.exports = { version: "0.11.6-alpha.2", 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"] };
+  Va.exports = { version: "0.11.6-alpha.3", 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"] };
 });
 var zi = ((n) => (n.Disconnected = "Disconnected", n.Preview = "Preview", n.Connecting = "Connecting", n.Connected = "Connected", n.Reconnecting = "Reconnecting", n.Disconnecting = "Disconnecting", n.Failed = "Failed", n))(zi || {});
 var Pa = ((e) => (e.CHAT = "chat", e))(Pa || {});
@@ -25724,7 +25738,7 @@ var defaultMedia2 = [
 // src/Prebuilt/components/VirtualBackground/VBPicker.tsx
 var iconDims = { height: "40px", width: "40px" };
 var VBPicker = ({ backgroundMedia = [] }) => {
-  var _a8, _b7;
+  var _a8;
   const toggleVB = useSidepaneToggle(SIDE_PANE_OPTIONS.VB);
   const hmsActions = useHMSActions40();
   const localPeer = useHMSStore61(selectLocalPeer6);
@@ -25739,9 +25753,7 @@ var VBPicker = ({ backgroundMedia = [] }) => {
   const isEffectsEnabled = useHMSStore61(Yn);
   const effectsKey = useHMSStore61(Xn);
   const isPluginAdded = useHMSStore61(selectIsLocalVideoPluginPresent(((_a8 = VBHandler) == null ? void 0 : _a8.getName()) || ""));
-  const [activeBackground, setActiveBackground] = useState50(
-    ((_b7 = VBHandler) == null ? void 0 : _b7.getBackground()) || HMSVirtualBackgroundTypes3.NONE
-  );
+  const background = useHMSStore61(zh(APP_DATA.background));
   const mediaList = backgroundMedia.length ? backgroundMedia.map((media) => media.url || "") : defaultMedia2;
   const inPreview = roomState === HMSRoomState4.Preview;
   const showVideoTile = isVideoOn && isLargeRoom && !inPreview;
@@ -25763,8 +25775,22 @@ var VBPicker = ({ backgroundMedia = [] }) => {
           hmsActions.addPluginToVideoTrack(vbObject, Math.floor(role.publishParams.video.frameRate / 2));
         }
       }
+      const handleDefaultBackground = () => __async(void 0, null, function* () {
+        switch (background) {
+          case HMSVirtualBackgroundTypes3.NONE: {
+            break;
+          }
+          case HMSVirtualBackgroundTypes3.BLUR: {
+            yield VBHandler.setBlur(blurAmount);
+            break;
+          }
+          default:
+            yield VBHandler.setBackground(background);
+        }
+      });
+      handleDefaultBackground();
     }
-  }, [hmsActions, role, isPluginAdded, isEffectsEnabled, effectsKey, track == null ? void 0 : track.id]);
+  }, [hmsActions, role, isPluginAdded, isEffectsEnabled, effectsKey, track == null ? void 0 : track.id, background, blurAmount]);
   useEffect28(() => {
     if (!isVideoOn) {
       toggleVB();
@@ -25807,7 +25833,7 @@ var VBPicker = ({ backgroundMedia = [] }) => {
             value: HMSVirtualBackgroundTypes3.NONE,
             onClick: () => __async(void 0, null, function* () {
               yield VBHandler.removeEffects();
-              setActiveBackground(HMSVirtualBackgroundTypes3.NONE);
+              hmsActions.setAppData(APP_DATA.background, HMSVirtualBackgroundTypes3.NONE);
             })
           },
           {
@@ -25817,14 +25843,14 @@ var VBPicker = ({ backgroundMedia = [] }) => {
             onClick: () => __async(void 0, null, function* () {
               var _a9;
               yield (_a9 = VBHandler) == null ? void 0 : _a9.setBlur(blurAmount);
-              setActiveBackground(HMSVirtualBackgroundTypes3.BLUR);
+              hmsActions.setAppData(APP_DATA.background, HMSVirtualBackgroundTypes3.BLUR);
             })
           }
         ],
-        activeBackground
+        activeBackground: background
       }
     ),
-    /* @__PURE__ */ React122.createElement(Flex, { direction: "column", css: { w: "100%", gap: "$8", mt: "$8" } }, activeBackground === HMSVirtualBackgroundTypes3.BLUR && isEffectsEnabled && effectsKey ? /* @__PURE__ */ React122.createElement(Box, null, /* @__PURE__ */ React122.createElement(Text, { variant: "sm", css: { color: "$on_surface_high", fontWeight: "$semiBold", mb: "$4" } }, "Blur intensity"), /* @__PURE__ */ React122.createElement(Flex, { css: { w: "100%", justifyContent: "space-between", alignItems: "center", gap: "$4" } }, /* @__PURE__ */ React122.createElement(Text, { variant: "caption", css: { fontWeight: "$medium", color: "$on_surface_medium" } }, "Low"), /* @__PURE__ */ React122.createElement(
+    /* @__PURE__ */ React122.createElement(Flex, { direction: "column", css: { w: "100%", gap: "$8", mt: "$8" } }, background === HMSVirtualBackgroundTypes3.BLUR && isEffectsEnabled && effectsKey ? /* @__PURE__ */ React122.createElement(Box, null, /* @__PURE__ */ React122.createElement(Text, { variant: "sm", css: { color: "$on_surface_high", fontWeight: "$semiBold", mb: "$4" } }, "Blur intensity"), /* @__PURE__ */ React122.createElement(Flex, { css: { w: "100%", justifyContent: "space-between", alignItems: "center", gap: "$4" } }, /* @__PURE__ */ React122.createElement(Text, { variant: "caption", css: { fontWeight: "$medium", color: "$on_surface_medium" } }, "Low"), /* @__PURE__ */ React122.createElement(
       Slider,
       {
         showTooltip: false,
@@ -25848,10 +25874,10 @@ var VBPicker = ({ backgroundMedia = [] }) => {
           onClick: () => __async(void 0, null, function* () {
             var _a9;
             yield (_a9 = VBHandler) == null ? void 0 : _a9.setBackground(mediaURL);
-            setActiveBackground(mediaURL);
+            hmsActions.setAppData(APP_DATA.background, mediaURL);
           })
         })),
-        activeBackground
+        activeBackground: background
       }
     )
   ));
@@ -27762,7 +27788,7 @@ var useCloseScreenshareWhiteboard = () => {
 };
 
 // src/Prebuilt/layouts/VideoStreamingSection.tsx
-var HLSView = React148.lazy(() => import("./HLSView-U3DKJBM7.js"));
+var HLSView = React148.lazy(() => import("./HLSView-7QXLQ4KD.js"));
 var VideoStreamingSection = ({
   screenType,
   elements,
@@ -29689,14 +29715,13 @@ var HMSPrebuilt = React171.forwardRef(
       }
       ref.current = __spreadValues({}, reactiveStore.current);
     }, [ref]);
-    useEffect66(
-      () => () => {
+    useEffect66(() => {
+      return () => {
         var _a9;
         VBHandler.reset();
         (_a9 = reactiveStore == null ? void 0 : reactiveStore.current) == null ? void 0 : _a9.hmsActions.leave();
-      },
-      []
-    );
+      };
+    }, []);
     const endpointsObj = endpoints;
     const tokenByRoomCodeEndpoint = (endpointsObj == null ? void 0 : endpointsObj.tokenByRoomCode) || "";
     const initEndpoint = (endpointsObj == null ? void 0 : endpointsObj.init) || "";
@@ -29767,7 +29792,6 @@ var HMSPrebuilt = React171.forwardRef(
                 }
               }
             },
-            /* @__PURE__ */ React171.createElement(AppData, null),
             /* @__PURE__ */ React171.createElement(Init, null),
             /* @__PURE__ */ React171.createElement(DialogContainerProvider, { dialogContainerSelector: containerSelector }, /* @__PURE__ */ React171.createElement(
               Box,
@@ -29830,7 +29854,7 @@ function AppRoutes({
   const roomLayout = useRoomLayout();
   const isNotificationsDisabled = useIsNotificationDisabled();
   const { activeState, rejoin } = useAppStateManager();
-  return /* @__PURE__ */ React171.createElement(AppStateContext.Provider, { value: { rejoin } }, /* @__PURE__ */ React171.createElement(React171.Fragment, null, /* @__PURE__ */ React171.createElement(ToastContainer, null), /* @__PURE__ */ React171.createElement(Notifications, null), /* @__PURE__ */ React171.createElement(MwebLandscapePrompt, null), /* @__PURE__ */ React171.createElement(BackSwipe, null), !isNotificationsDisabled && /* @__PURE__ */ React171.createElement(FlyingEmoji, null), /* @__PURE__ */ React171.createElement(RemoteStopScreenshare, null), /* @__PURE__ */ React171.createElement(KeyboardHandler, null), /* @__PURE__ */ React171.createElement(AuthToken_default, { authTokenByRoomCodeEndpoint, defaultAuthToken }), roomLayout && activeState && /* @__PURE__ */ React171.createElement(AppStates, { activeState })));
+  return /* @__PURE__ */ React171.createElement(AppStateContext.Provider, { value: { rejoin } }, /* @__PURE__ */ React171.createElement(React171.Fragment, null, activeState !== "leave" /* LEAVE */ && /* @__PURE__ */ React171.createElement(AppData, null), /* @__PURE__ */ React171.createElement(ToastContainer, null), /* @__PURE__ */ React171.createElement(Notifications, null), /* @__PURE__ */ React171.createElement(MwebLandscapePrompt, null), /* @__PURE__ */ React171.createElement(BackSwipe, null), !isNotificationsDisabled && /* @__PURE__ */ React171.createElement(FlyingEmoji, null), /* @__PURE__ */ React171.createElement(RemoteStopScreenshare, null), /* @__PURE__ */ React171.createElement(KeyboardHandler, null), /* @__PURE__ */ React171.createElement(AuthToken_default, { authTokenByRoomCodeEndpoint, defaultAuthToken }), roomLayout && activeState && /* @__PURE__ */ React171.createElement(AppStates, { activeState })));
 }
 
 // src/Progress/index.tsx
@@ -29971,4 +29995,4 @@ lodash/lodash.js:
    * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
    *)
 */
-//# sourceMappingURL=chunk-DO5NCPPI.js.map
+//# sourceMappingURL=chunk-ZJU5GUBY.js.map