@100mslive/roomkit-react 0.1.6-alpha.1 → 0.1.6-alpha.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{HLSView-HNVYG5VE.js → HLSView-QMU5JK7U.js} +3 -3
- package/dist/Prebuilt/components/Footer/ChatToggle.d.ts +1 -3
- package/dist/Prebuilt/components/SidePaneTabs.d.ts +7 -0
- package/dist/{VirtualBackground-UM2FOUHQ.js → VirtualBackground-37FXUPYO.js} +6 -6
- package/dist/VirtualBackground-37FXUPYO.js.map +7 -0
- package/dist/{chunk-POE7H4IE.js → chunk-KBVIZGYW.js} +2 -2
- package/dist/{chunk-POE7H4IE.js.map → chunk-KBVIZGYW.js.map} +1 -1
- package/dist/{chunk-LYSAET4G.js → chunk-WVGGQZK4.js} +100 -106
- package/dist/{chunk-LYSAET4G.js.map → chunk-WVGGQZK4.js.map} +3 -3
- package/dist/{chunk-364HP22I.js → chunk-ZKE2N5LH.js} +2 -2
- package/dist/{conference-UWLJHMB2.js → conference-FJJQ4TXX.js} +419 -384
- package/dist/conference-FJJQ4TXX.js.map +7 -0
- package/dist/index.cjs.js +594 -570
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +2 -2
- package/dist/meta.cjs.json +127 -127
- package/dist/meta.esbuild.json +161 -160
- package/package.json +6 -6
- package/src/Prebuilt/components/Chat/Chat.jsx +2 -6
- package/src/Prebuilt/components/Footer/ChatToggle.tsx +2 -9
- package/src/Prebuilt/components/Footer/Footer.tsx +22 -6
- package/src/Prebuilt/components/Footer/ParticipantList.jsx +0 -2
- package/src/Prebuilt/components/Header/HeaderComponents.jsx +8 -1
- package/src/Prebuilt/components/InsetTile.tsx +1 -0
- package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx +1 -1
- package/src/Prebuilt/components/Notifications/Notifications.jsx +14 -7
- package/src/Prebuilt/components/Preview/PreviewJoin.tsx +2 -3
- package/src/Prebuilt/components/RoleChangeRequestModal.tsx +6 -4
- package/src/Prebuilt/components/SidePaneTabs.tsx +120 -0
- package/src/Prebuilt/components/hooks/useMetadata.jsx +7 -25
- package/src/Prebuilt/layouts/SidePane.tsx +12 -10
- package/src/Prebuilt/plugins/VirtualBackground/VirtualBackground.jsx +3 -3
- package/src/Prebuilt/provider/roomLayoutProvider/hooks/useFetchRoomLayout.ts +2 -2
- package/dist/VirtualBackground-UM2FOUHQ.js.map +0 -7
- package/dist/conference-UWLJHMB2.js.map +0 -7
- package/src/Prebuilt/components/Chat/ChatParticipantHeader.jsx +0 -84
- /package/dist/{HLSView-HNVYG5VE.js.map → HLSView-QMU5JK7U.js.map} +0 -0
- /package/dist/{chunk-364HP22I.js.map → chunk-ZKE2N5LH.js.map} +0 -0
package/dist/index.cjs.js
CHANGED
|
@@ -105,7 +105,7 @@ var __async = (__this, __arguments, generator) => {
|
|
|
105
105
|
var define_process_env_default;
|
|
106
106
|
var init_define_process_env = __esm({
|
|
107
107
|
"<define:process.env>"() {
|
|
108
|
-
define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_ec318a0a-6b14-4692-9d2d-40ccf99b3445", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_webpack_cli: "^4.9.2", npm_package_devDependencies_webpack_bundle_analyzer: "^4.5.0", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.19 npm/? node/v16.20.2 linux x64", npm_config_always_auth: "", NX_WORKSPACE_ROOT: "/home/runner/work/web-sdks/web-sdks", npm_package_devDependencies__rollup_plugin_node_resolve: "^13.1.3", npm_package_scripts_babel: "npx storybook@latest babelrc", CI: "true", npm_package_devDependencies__size_limit_file: "^5.0.3", npm_config_bin_links: "true", npm_config_wrap_output: "", npm_package_dependencies__radix_ui_react_tabs: "1.0.0", npm_package_dependencies__100mslive_react_sdk: "0.8.15-alpha.1", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_ec318a0a-6b14-4692-9d2d-40ccf99b3445", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", npm_config_init_version: "1.0.0", npm_package_dependencies__emoji_mart_react: "^1.0.1", npm_package_dependencies__emoji_mart_data: "^1.0.6", npm_package_dependencies__100mslive_hms_virtual_background: "1.11.15-alpha.1", JAVA_HOME_8_X64: "/usr/lib/jvm/temurin-8-jdk-amd64", NODE_AUTH_TOKEN: "XXXXX-XXXXX-XXXXX-XXXXX", SHLVL: "1", npm_package_dependencies__radix_ui_react_tooltip: "1.0.6", npm_package_dependencies__radix_ui_react_popover: "1.0.6", npm_package_dependencies__100mslive_types_prebuilt: "0.12.0", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_webpack_manifest_plugin: "^4.1.1", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.3", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "677", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.7", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_dependencies_react_router_dom: "^6.3.0", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.7/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.0/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20230903.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:17158", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_scripts_app: "cd apps/100ms-web && yarn start", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_sdk: "cd packages/hms-video-web && yarn start", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.1.15-alpha.1", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", GITHUB_RUN_ID: "6118845535", 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: "d3f042d48bb30f16c6c63f2a75c406611c0f2831", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "apps/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "fa361138caa82fd6c12e68b8f140302e95e7389e1bfe282966f1884716efd1d4", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/main", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GOROOT_1_18_X64: "/opt/hostedtoolcache/go/1.18.10/x64", GITHUB_ACTION_REPOSITORY: "", npm_package_workspaces_2: "playwright/*", npm_package_devDependencies_postcss_loader: "^6.2.1", PATH: "/tmp/yarn--1694157421262-0.11385139865299587:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694157421062-0.49315626489630593:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694157380940-0.32670900249471435:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694157380749-0.34075133152633197:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/snap/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_9b586943-7579-47b0-a0c5-cfbd1314c75d", INVOCATION_ID: "3696012e862c4693bd296c71b831e894", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.12/x64", npm_package_husky_hooks_pre_push: "lint-staged", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "367", GITHUB_TRIGGERING_ACTOR: "raviteja83", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies_pusher_js: "^7.0.3", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "80 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "80 KB", npm_package_lint_staged__: "format && lint:fix", npm_package_devDependencies_webpack: "^5.76.0", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 3", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "main", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "20 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-web/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_webpack_dev_server: "^4.7.4", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.8.15-alpha.1", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", STATS_NM: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.1.6-alpha.1", npm_package_size_limit_4_limit: "400 KB", npm_package_size_limit_1_path: "packages/hms-video-web/dist/index.js", npm_package_husky_hooks_pre_commit: "lint-staged", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "20 KB", npm_package_size_limit_3_path: "packages/hms-video-store/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "d3f042d48bb30f16c6c63f2a75c406611c0f2831", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "20 KB", npm_package_size_limit_4_path: "packages/roomkit-react/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/main", GITHUB_ACTOR: "raviteja83", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_size_limit_8_limit: "100 KB", npm_package_size_limit_5_path: "packages/roomkit-react/dist/index.js", npm_config_strict_ssl: "true", npm_package_license: "MIT", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_9_limit: "100 KB", npm_package_size_limit_6_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_ec318a0a-6b14-4692-9d2d-40ccf99b3445", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "6763261", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/hms-virtual-background/dist/index.js", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.10.0-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_ec318a0a-6b14-4692-9d2d-40ccf99b3445", npm_package_size_limit_8_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_size_limit_9_path: "packages/react-icons/dist/index.js", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.154/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_scripts_app_custom: "cd apps/100ms-custom-app && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_ec318a0a-6b14-4692-9d2d-40ccf99b3445" };
|
|
108
|
+
define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_f43336c5-bb3b-4487-bb65-eed87d62f6f9", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_webpack_cli: "^4.9.2", npm_package_devDependencies_webpack_bundle_analyzer: "^4.5.0", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.19 npm/? node/v16.20.2 linux x64", npm_config_always_auth: "", NX_WORKSPACE_ROOT: "/home/runner/work/web-sdks/web-sdks", npm_package_devDependencies__rollup_plugin_node_resolve: "^13.1.3", npm_package_scripts_babel: "npx storybook@latest babelrc", CI: "true", npm_package_devDependencies__size_limit_file: "^5.0.3", npm_config_bin_links: "true", npm_config_wrap_output: "", npm_package_dependencies__radix_ui_react_tabs: "1.0.0", npm_package_dependencies__100mslive_react_sdk: "0.8.15-alpha.2", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_f43336c5-bb3b-4487-bb65-eed87d62f6f9", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", npm_config_init_version: "1.0.0", npm_package_dependencies__emoji_mart_react: "^1.0.1", npm_package_dependencies__emoji_mart_data: "^1.0.6", npm_package_dependencies__100mslive_hms_virtual_background: "1.11.15-alpha.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.0", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_webpack_manifest_plugin: "^4.1.1", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.3", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "662", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.7", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_dependencies_react_router_dom: "^6.3.0", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.7/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.0/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20230903.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:17488", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_scripts_app: "cd apps/100ms-web && yarn start", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_sdk: "cd packages/hms-video-web && yarn start", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.1.15-alpha.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", GITHUB_RUN_ID: "6143673147", 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: "e9017621fb9f9594f985d47483ccab4bed324a35", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "apps/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "c185da290a263131093f6634fb953acbabb7a686aa4f872f19b9de675a815900", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/main", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GOROOT_1_18_X64: "/opt/hostedtoolcache/go/1.18.10/x64", GITHUB_ACTION_REPOSITORY: "", npm_package_workspaces_2: "playwright/*", npm_package_devDependencies_postcss_loader: "^6.2.1", PATH: "/tmp/yarn--1694419890877-0.7557965598114864:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694419890635-0.43974353783902886:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694419841019-0.8375148234533045:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694419840783-0.6699295563699477:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/snap/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_26cb5442-5860-4d00-8f15-204afa5fd258", INVOCATION_ID: "d4a83fa2da514561b3c0ce14a83611e0", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.12/x64", npm_package_husky_hooks_pre_push: "lint-staged", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "368", GITHUB_TRIGGERING_ACTOR: "raviteja83", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies_pusher_js: "^7.0.3", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "80 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "80 KB", npm_package_lint_staged__: "format && lint:fix", npm_package_devDependencies_webpack: "^5.76.0", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 6", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "main", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "20 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-web/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_webpack_dev_server: "^4.7.4", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.8.15-alpha.2", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.1.6-alpha.2", npm_package_size_limit_4_limit: "400 KB", npm_package_size_limit_1_path: "packages/hms-video-web/dist/index.js", npm_package_husky_hooks_pre_commit: "lint-staged", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "20 KB", npm_package_size_limit_3_path: "packages/hms-video-store/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "e9017621fb9f9594f985d47483ccab4bed324a35", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "20 KB", npm_package_size_limit_4_path: "packages/roomkit-react/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/main", GITHUB_ACTOR: "raviteja83", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_size_limit_8_limit: "100 KB", npm_package_size_limit_5_path: "packages/roomkit-react/dist/index.js", npm_config_strict_ssl: "true", npm_package_license: "MIT", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_9_limit: "100 KB", npm_package_size_limit_6_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_f43336c5-bb3b-4487-bb65-eed87d62f6f9", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "6763261", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/hms-virtual-background/dist/index.js", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.10.0-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_f43336c5-bb3b-4487-bb65-eed87d62f6f9", npm_package_size_limit_8_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_size_limit_9_path: "packages/react-icons/dist/index.js", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.154/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_scripts_app_custom: "cd apps/100ms-custom-app && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_f43336c5-bb3b-4487-bb65-eed87d62f6f9" };
|
|
109
109
|
}
|
|
110
110
|
});
|
|
111
111
|
|
|
@@ -4589,7 +4589,7 @@ var init_useFetchRoomLayout = __esm({
|
|
|
4589
4589
|
throw error;
|
|
4590
4590
|
});
|
|
4591
4591
|
useFetchRoomLayout = ({
|
|
4592
|
-
endpoint = "
|
|
4592
|
+
endpoint = "",
|
|
4593
4593
|
authToken = ""
|
|
4594
4594
|
}) => {
|
|
4595
4595
|
const [layout, setLayout] = (0, import_react34.useState)(void 0);
|
|
@@ -4613,7 +4613,7 @@ var init_useFetchRoomLayout = __esm({
|
|
|
4613
4613
|
}
|
|
4614
4614
|
isFetchInProgress.current = true;
|
|
4615
4615
|
try {
|
|
4616
|
-
const resp = yield fetchWithRetry(endpoint, {
|
|
4616
|
+
const resp = yield fetchWithRetry(endpoint || "https://api.100ms.live/v2/layouts/ui", {
|
|
4617
4617
|
headers: {
|
|
4618
4618
|
Authorization: `Bearer ${authToken}`
|
|
4619
4619
|
}
|
|
@@ -5886,6 +5886,7 @@ function Notifications() {
|
|
|
5886
5886
|
const notification = (0, import_react_sdk19.useHMSNotifications)();
|
|
5887
5887
|
const navigate = (0, import_react_router_dom2.useNavigate)();
|
|
5888
5888
|
const params = (0, import_react_router_dom2.useParams)();
|
|
5889
|
+
const vanillaStore = (0, import_react_sdk19.useHMSVanillaStore)();
|
|
5889
5890
|
const subscribedNotifications = useSubscribedNotifications() || {};
|
|
5890
5891
|
const roomState = (0, import_react_sdk19.useHMSStore)(import_react_sdk19.selectRoomState);
|
|
5891
5892
|
const updateRoomLayoutForRole = useUpdateRoomLayout();
|
|
@@ -5899,7 +5900,7 @@ function Notifications() {
|
|
|
5899
5900
|
}, []);
|
|
5900
5901
|
(0, import_react_sdk19.useCustomEvent)({ type: ROLE_CHANGE_DECLINED, onEvent: handleRoleChangeDenied });
|
|
5901
5902
|
(0, import_react46.useEffect)(() => {
|
|
5902
|
-
var _a7, _b7, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
|
|
5903
|
+
var _a7, _b7, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
|
|
5903
5904
|
if (!notification || isNotificationDisabled) {
|
|
5904
5905
|
return;
|
|
5905
5906
|
}
|
|
@@ -5957,20 +5958,24 @@ function Notifications() {
|
|
|
5957
5958
|
title: `Error: ${(_k = notification.data) == null ? void 0 : _k.message} - ${(_l = notification.data) == null ? void 0 : _l.description}`
|
|
5958
5959
|
});
|
|
5959
5960
|
break;
|
|
5960
|
-
case import_react_sdk19.HMSNotificationTypes.ROLE_UPDATED:
|
|
5961
|
+
case import_react_sdk19.HMSNotificationTypes.ROLE_UPDATED: {
|
|
5961
5962
|
if ((_m = notification.data) == null ? void 0 : _m.isLocal) {
|
|
5962
|
-
|
|
5963
|
-
|
|
5964
|
-
|
|
5965
|
-
|
|
5963
|
+
const { prevRole } = vanillaStore.getState((0, import_react_sdk19.selectPeerMetadata)((_n = notification.data) == null ? void 0 : _n.id));
|
|
5964
|
+
if (prevRole !== ((_o = notification == null ? void 0 : notification.data) == null ? void 0 : _o.roleName)) {
|
|
5965
|
+
ToastManager.addToast({
|
|
5966
|
+
title: `You are now a ${notification.data.roleName}`
|
|
5967
|
+
});
|
|
5968
|
+
updateRoomLayoutForRole(notification.data.roleName);
|
|
5969
|
+
}
|
|
5966
5970
|
}
|
|
5967
5971
|
break;
|
|
5972
|
+
}
|
|
5968
5973
|
case import_react_sdk19.HMSNotificationTypes.CHANGE_TRACK_STATE_REQUEST:
|
|
5969
|
-
const track = (
|
|
5974
|
+
const track = (_p = notification.data) == null ? void 0 : _p.track;
|
|
5970
5975
|
if (!notification.data.enabled) {
|
|
5971
5976
|
ToastManager.addToast({
|
|
5972
5977
|
title: `Your ${track.source} ${track.type} was muted by
|
|
5973
|
-
${(
|
|
5978
|
+
${(_q = notification.data.requestedBy) == null ? void 0 : _q.name}.`
|
|
5974
5979
|
});
|
|
5975
5980
|
}
|
|
5976
5981
|
break;
|
|
@@ -6073,6 +6078,11 @@ var init_HeaderComponents = __esm({
|
|
|
6073
6078
|
const isMobile = (0, import_react_use3.useMedia)(config.media.md);
|
|
6074
6079
|
const isConnected = (0, import_react_sdk20.useHMSStore)(import_react_sdk20.selectIsConnectedToRoom);
|
|
6075
6080
|
const [hideImage, setHideImage] = (0, import_react47.useState)(false);
|
|
6081
|
+
(0, import_react47.useEffect)(() => {
|
|
6082
|
+
if (hideImage) {
|
|
6083
|
+
setHideImage(false);
|
|
6084
|
+
}
|
|
6085
|
+
}, [logo]);
|
|
6076
6086
|
if (isConnected && isMobile) {
|
|
6077
6087
|
return null;
|
|
6078
6088
|
}
|
|
@@ -6220,8 +6230,6 @@ var init_useMetadata = __esm({
|
|
|
6220
6230
|
const localPeerId = (0, import_react_sdk21.useHMSStore)(import_react_sdk21.selectLocalPeerID);
|
|
6221
6231
|
const vanillaStore = (0, import_react_sdk21.useHMSVanillaStore)();
|
|
6222
6232
|
const metaData = (0, import_react_sdk21.useHMSStore)((0, import_react_sdk21.selectPeerMetadata)(localPeerId));
|
|
6223
|
-
const [isHandRaised, setHandRaised] = (0, import_react49.useState)((metaData == null ? void 0 : metaData.isHandRaised) || false);
|
|
6224
|
-
const [isBRBOn, setBRBOn] = (0, import_react49.useState)((metaData == null ? void 0 : metaData.isBRBOn) || false);
|
|
6225
6233
|
const update = (updatedFields) => __async(void 0, null, function* () {
|
|
6226
6234
|
try {
|
|
6227
6235
|
const currentMetadata = vanillaStore.getState((0, import_react_sdk21.selectPeerMetadata)(localPeerId));
|
|
@@ -6232,35 +6240,19 @@ var init_useMetadata = __esm({
|
|
|
6232
6240
|
}
|
|
6233
6241
|
});
|
|
6234
6242
|
const toggleHandRaise = (0, import_react49.useCallback)(() => __async(void 0, null, function* () {
|
|
6235
|
-
|
|
6236
|
-
|
|
6237
|
-
isHandRaised: !isHandRaised,
|
|
6238
|
-
isBRBOn: brbUpdate
|
|
6239
|
-
});
|
|
6240
|
-
if (success) {
|
|
6241
|
-
setBRBOn(brbUpdate);
|
|
6242
|
-
setHandRaised(!isHandRaised);
|
|
6243
|
-
}
|
|
6244
|
-
}), [isHandRaised, isBRBOn]);
|
|
6243
|
+
yield update({ isHandRaised: !(metaData == null ? void 0 : metaData.isHandRaised), isBRBOn: false });
|
|
6244
|
+
}), [metaData == null ? void 0 : metaData.isHandRaised]);
|
|
6245
6245
|
const toggleBRB = (0, import_react49.useCallback)(() => __async(void 0, null, function* () {
|
|
6246
|
-
|
|
6247
|
-
|
|
6248
|
-
isHandRaised: handRaiseUpdate,
|
|
6249
|
-
isBRBOn: !isBRBOn
|
|
6250
|
-
});
|
|
6251
|
-
if (success) {
|
|
6252
|
-
setBRBOn(!isBRBOn);
|
|
6253
|
-
setHandRaised(handRaiseUpdate);
|
|
6254
|
-
}
|
|
6255
|
-
}), [isHandRaised, isBRBOn]);
|
|
6246
|
+
yield update({ isBRBOn: !(metaData == null ? void 0 : metaData.isBRBOn), isHandRaised: false });
|
|
6247
|
+
}), [metaData == null ? void 0 : metaData.isBRBOn]);
|
|
6256
6248
|
const setPrevRole = (role) => __async(void 0, null, function* () {
|
|
6257
6249
|
yield update({
|
|
6258
6250
|
prevRole: role
|
|
6259
6251
|
});
|
|
6260
6252
|
});
|
|
6261
6253
|
return {
|
|
6262
|
-
isHandRaised,
|
|
6263
|
-
isBRBOn,
|
|
6254
|
+
isHandRaised: !!(metaData == null ? void 0 : metaData.isHandRaised),
|
|
6255
|
+
isBRBOn: !!(metaData == null ? void 0 : metaData.isBRBOn),
|
|
6264
6256
|
metaData,
|
|
6265
6257
|
updateMetaData: update,
|
|
6266
6258
|
toggleHandRaise,
|
|
@@ -9081,8 +9073,8 @@ var init_VirtualBackground = __esm({
|
|
|
9081
9073
|
}) => {
|
|
9082
9074
|
const pluginRef = (0, import_react77.useRef)(null);
|
|
9083
9075
|
const hmsActions = (0, import_react_sdk38.useHMSActions)();
|
|
9084
|
-
const isAllowedToPublish = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectIsAllowedToPublish);
|
|
9085
9076
|
const role = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectLocalPeerRole);
|
|
9077
|
+
const isVideoOn = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectIsLocalVideoEnabled);
|
|
9086
9078
|
const [isVBLoading, setIsVBLoading] = (0, import_react77.useState)(false);
|
|
9087
9079
|
const [isVBSupported, setIsVBSupported] = (0, import_react77.useState)(false);
|
|
9088
9080
|
const [isVBOn, setIsVBOn] = (0, import_react77.useState)(false);
|
|
@@ -9128,7 +9120,7 @@ var init_VirtualBackground = __esm({
|
|
|
9128
9120
|
}
|
|
9129
9121
|
});
|
|
9130
9122
|
}
|
|
9131
|
-
if (!
|
|
9123
|
+
if (!isVBSupported || !isVideoOn) {
|
|
9132
9124
|
return null;
|
|
9133
9125
|
}
|
|
9134
9126
|
if (asActionTile) {
|
|
@@ -9357,7 +9349,6 @@ var init_PreviewJoin = __esm({
|
|
|
9357
9349
|
);
|
|
9358
9350
|
};
|
|
9359
9351
|
PreviewControls = ({ hideSettings }) => {
|
|
9360
|
-
const isVideoOn = (0, import_react_sdk39.useHMSStore)(import_react_sdk39.selectIsLocalVideoEnabled);
|
|
9361
9352
|
const isMobile = (0, import_react_use11.useMedia)(config.media.md);
|
|
9362
9353
|
return /* @__PURE__ */ import_react78.default.createElement(
|
|
9363
9354
|
Flex,
|
|
@@ -9368,7 +9359,7 @@ var init_PreviewJoin = __esm({
|
|
|
9368
9359
|
mt: "$8"
|
|
9369
9360
|
}
|
|
9370
9361
|
},
|
|
9371
|
-
/* @__PURE__ */ import_react78.default.createElement(Flex, { css: { gap: "$4" } }, /* @__PURE__ */ import_react78.default.createElement(AudioVideoToggle,
|
|
9362
|
+
/* @__PURE__ */ import_react78.default.createElement(Flex, { css: { gap: "$4" } }, /* @__PURE__ */ import_react78.default.createElement(AudioVideoToggle, null), /* @__PURE__ */ import_react78.default.createElement(import_react78.Suspense, { fallback: "" }, !isMobile ? /* @__PURE__ */ import_react78.default.createElement(VirtualBackground2, null) : null)),
|
|
9372
9363
|
!hideSettings ? /* @__PURE__ */ import_react78.default.createElement(PreviewSettings, null) : null
|
|
9373
9364
|
);
|
|
9374
9365
|
};
|
|
@@ -11943,7 +11934,7 @@ var init_MwebOptions = __esm({
|
|
|
11943
11934
|
isRecordingLoading ? /* @__PURE__ */ import_react108.default.createElement(Loading, null) : /* @__PURE__ */ import_react108.default.createElement(import_react_icons48.RecordIcon, null),
|
|
11944
11935
|
/* @__PURE__ */ import_react108.default.createElement(ActionTile.Title, null, isBrowserRecordingOn ? "Recording On" : isRecordingLoading ? "Starting Recording" : "Start Recording")
|
|
11945
11936
|
) : null
|
|
11946
|
-
))), /* @__PURE__ */ import_react108.default.createElement(SettingsModal_default, { open: openSettingsSheet, onOpenChange: setOpenSettingsSheet }), openModals.has(MODALS2.MUTE_ALL) && /* @__PURE__ */ import_react108.default.createElement(MuteAllModal, { onOpenChange: (value) => updateState(MODALS2.MUTE_ALL, value), isMobile: true }), openModals.has(MODALS2.CHANGE_NAME) && /* @__PURE__ */ import_react108.default.createElement(
|
|
11937
|
+
))), /* @__PURE__ */ import_react108.default.createElement(SettingsModal_default, { open: openSettingsSheet, onOpenChange: setOpenSettingsSheet, screenType }), openModals.has(MODALS2.MUTE_ALL) && /* @__PURE__ */ import_react108.default.createElement(MuteAllModal, { onOpenChange: (value) => updateState(MODALS2.MUTE_ALL, value), isMobile: true }), openModals.has(MODALS2.CHANGE_NAME) && /* @__PURE__ */ import_react108.default.createElement(
|
|
11947
11938
|
ChangeNameModal,
|
|
11948
11939
|
{
|
|
11949
11940
|
onOpenChange: (value) => updateState(MODALS2.CHANGE_NAME, value),
|
|
@@ -12644,112 +12635,24 @@ var init_ChatToggle = __esm({
|
|
|
12644
12635
|
init_IconButton3();
|
|
12645
12636
|
init_useSidepane();
|
|
12646
12637
|
init_constants();
|
|
12647
|
-
ChatToggle = (
|
|
12638
|
+
ChatToggle = () => {
|
|
12648
12639
|
const countUnreadMessages = (0, import_react_sdk63.useHMSStore)(import_react_sdk63.selectUnreadHMSMessagesCount);
|
|
12649
12640
|
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
12650
12641
|
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
12651
|
-
(0, import_react118.useEffect)(() => {
|
|
12652
|
-
if (!isChatOpen && openByDefault) {
|
|
12653
|
-
toggleChat();
|
|
12654
|
-
}
|
|
12655
|
-
}, [toggleChat, openByDefault]);
|
|
12656
12642
|
return /* @__PURE__ */ import_react118.default.createElement(Tooltip, { key: "chat", title: `${isChatOpen ? "Close" : "Open"} chat` }, /* @__PURE__ */ import_react118.default.createElement(IconButton_default, { onClick: toggleChat, active: !isChatOpen, "data-testid": "chat_btn" }, countUnreadMessages === 0 ? /* @__PURE__ */ import_react118.default.createElement(import_react_icons54.ChatIcon, null) : /* @__PURE__ */ import_react118.default.createElement(import_react_icons54.ChatUnreadIcon, { "data-testid": "chat_unread_btn" })));
|
|
12657
12643
|
};
|
|
12658
12644
|
}
|
|
12659
12645
|
});
|
|
12660
12646
|
|
|
12661
|
-
// src/Prebuilt/components/Chat/ChatParticipantHeader.jsx
|
|
12662
|
-
var import_react119, import_react_sdk64, import_react_icons55, tabTriggerCSS, ChatParticipantHeader;
|
|
12663
|
-
var init_ChatParticipantHeader = __esm({
|
|
12664
|
-
"src/Prebuilt/components/Chat/ChatParticipantHeader.jsx"() {
|
|
12665
|
-
"use strict";
|
|
12666
|
-
init_define_process_env();
|
|
12667
|
-
import_react119 = __toESM(require("react"));
|
|
12668
|
-
import_react_sdk64 = require("@100mslive/react-sdk");
|
|
12669
|
-
import_react_icons55 = require("@100mslive/react-icons");
|
|
12670
|
-
init_src();
|
|
12671
|
-
init_useRoomLayoutScreen();
|
|
12672
|
-
init_useSidepane();
|
|
12673
|
-
init_constants();
|
|
12674
|
-
tabTriggerCSS = {
|
|
12675
|
-
color: "$on_surface_high",
|
|
12676
|
-
p: "$4",
|
|
12677
|
-
fontWeight: "$semiBold",
|
|
12678
|
-
fontSize: "$sm",
|
|
12679
|
-
w: "100%",
|
|
12680
|
-
justifyContent: "center"
|
|
12681
|
-
};
|
|
12682
|
-
ChatParticipantHeader = import_react119.default.memo(({ activeTabValue = SIDE_PANE_OPTIONS.CHAT }) => {
|
|
12683
|
-
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
12684
|
-
const toggleParticipants = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
12685
|
-
const [activeTab, setActiveTab] = (0, import_react119.useState)(activeTabValue);
|
|
12686
|
-
const peerCount = (0, import_react_sdk64.useHMSStore)(import_react_sdk64.selectPeerCount);
|
|
12687
|
-
const { elements } = useRoomLayoutConferencingScreen();
|
|
12688
|
-
const showChat = !!(elements == null ? void 0 : elements.chat);
|
|
12689
|
-
const showParticipants = !!(elements == null ? void 0 : elements.participant_list);
|
|
12690
|
-
const hideTabs = !(showChat && showParticipants);
|
|
12691
|
-
return /* @__PURE__ */ import_react119.default.createElement(
|
|
12692
|
-
Flex,
|
|
12693
|
-
{
|
|
12694
|
-
align: "center",
|
|
12695
|
-
css: {
|
|
12696
|
-
color: "$on_primary_high",
|
|
12697
|
-
h: "$16"
|
|
12698
|
-
}
|
|
12699
|
-
},
|
|
12700
|
-
hideTabs ? /* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: { fontWeight: "$semiBold", c: "$on_surface_high" } }, showChat ? "Chat" : `Participants (${peerCount})`) : /* @__PURE__ */ import_react119.default.createElement(Flex, { css: { w: "100%", bg: "$surface_default", borderRadius: "$2" } }, /* @__PURE__ */ import_react119.default.createElement(Tabs.Root, { value: activeTab, onValueChange: setActiveTab, css: { w: "100%" } }, /* @__PURE__ */ import_react119.default.createElement(Tabs.List, { css: { w: "100%", p: "$2" } }, /* @__PURE__ */ import_react119.default.createElement(
|
|
12701
|
-
Tabs.Trigger,
|
|
12702
|
-
{
|
|
12703
|
-
value: SIDE_PANE_OPTIONS.CHAT,
|
|
12704
|
-
onClick: toggleChat,
|
|
12705
|
-
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
12706
|
-
color: activeTab !== SIDE_PANE_OPTIONS.CHAT ? "$on_surface_low" : "$on_surface_high"
|
|
12707
|
-
})
|
|
12708
|
-
},
|
|
12709
|
-
"Chat"
|
|
12710
|
-
), /* @__PURE__ */ import_react119.default.createElement(
|
|
12711
|
-
Tabs.Trigger,
|
|
12712
|
-
{
|
|
12713
|
-
value: SIDE_PANE_OPTIONS.PARTICIPANTS,
|
|
12714
|
-
onClick: toggleParticipants,
|
|
12715
|
-
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
12716
|
-
color: activeTab !== SIDE_PANE_OPTIONS.PARTICIPANTS ? "$on_surface_low" : "$on_surface_high"
|
|
12717
|
-
})
|
|
12718
|
-
},
|
|
12719
|
-
"Participants (",
|
|
12720
|
-
peerCount,
|
|
12721
|
-
")"
|
|
12722
|
-
)))),
|
|
12723
|
-
/* @__PURE__ */ import_react119.default.createElement(
|
|
12724
|
-
IconButton,
|
|
12725
|
-
{
|
|
12726
|
-
css: { ml: "auto" },
|
|
12727
|
-
onClick: (e) => {
|
|
12728
|
-
e.stopPropagation();
|
|
12729
|
-
if (activeTab === SIDE_PANE_OPTIONS.CHAT) {
|
|
12730
|
-
toggleChat();
|
|
12731
|
-
} else {
|
|
12732
|
-
toggleParticipants();
|
|
12733
|
-
}
|
|
12734
|
-
},
|
|
12735
|
-
"data-testid": "close_chat"
|
|
12736
|
-
},
|
|
12737
|
-
/* @__PURE__ */ import_react119.default.createElement(import_react_icons55.CrossIcon, null)
|
|
12738
|
-
)
|
|
12739
|
-
);
|
|
12740
|
-
});
|
|
12741
|
-
}
|
|
12742
|
-
});
|
|
12743
|
-
|
|
12744
12647
|
// src/Prebuilt/components/Footer/RoleOptions.tsx
|
|
12745
|
-
var
|
|
12648
|
+
var import_react119, import_react_sdk64, import_react_icons55, dropdownItemCSS, optionTextCSS, RoleOptions;
|
|
12746
12649
|
var init_RoleOptions = __esm({
|
|
12747
12650
|
"src/Prebuilt/components/Footer/RoleOptions.tsx"() {
|
|
12748
12651
|
"use strict";
|
|
12749
12652
|
init_define_process_env();
|
|
12750
|
-
|
|
12751
|
-
|
|
12752
|
-
|
|
12653
|
+
import_react119 = __toESM(require("react"));
|
|
12654
|
+
import_react_sdk64 = require("@100mslive/react-sdk");
|
|
12655
|
+
import_react_icons55 = require("@100mslive/react-icons");
|
|
12753
12656
|
init_Dropdown2();
|
|
12754
12657
|
init_Layout();
|
|
12755
12658
|
init_Text2();
|
|
@@ -12758,12 +12661,12 @@ var init_RoleOptions = __esm({
|
|
|
12758
12661
|
dropdownItemCSS = { backgroundColor: "$surface_default", gap: "$4", p: "$8" };
|
|
12759
12662
|
optionTextCSS = { fontWeight: "$semiBold", color: "$on_surface_high", textTransform: "none" };
|
|
12760
12663
|
RoleOptions = ({ roleName, peerList }) => {
|
|
12761
|
-
const [openOptions, setOpenOptions] = (0,
|
|
12762
|
-
const permissions = (0,
|
|
12763
|
-
const hmsActions = (0,
|
|
12664
|
+
const [openOptions, setOpenOptions] = (0, import_react119.useState)(false);
|
|
12665
|
+
const permissions = (0, import_react_sdk64.useHMSStore)(import_react_sdk64.selectPermissions);
|
|
12666
|
+
const hmsActions = (0, import_react_sdk64.useHMSActions)();
|
|
12764
12667
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
12765
12668
|
const { on_stage_role, off_stage_roles = [] } = (elements == null ? void 0 : elements.on_stage_exp) || {};
|
|
12766
|
-
const vanillaStore = (0,
|
|
12669
|
+
const vanillaStore = (0, import_react_sdk64.useHMSVanillaStore)();
|
|
12767
12670
|
const store = vanillaStore.getState();
|
|
12768
12671
|
let allPeersHaveVideoOn = true;
|
|
12769
12672
|
let allPeersHaveAudioOn = true;
|
|
@@ -12804,7 +12707,7 @@ var init_RoleOptions = __esm({
|
|
|
12804
12707
|
console.error(e);
|
|
12805
12708
|
}
|
|
12806
12709
|
});
|
|
12807
|
-
return /* @__PURE__ */
|
|
12710
|
+
return /* @__PURE__ */ import_react119.default.createElement(Dropdown.Root, { open: openOptions, onOpenChange: setOpenOptions }, /* @__PURE__ */ import_react119.default.createElement(
|
|
12808
12711
|
Dropdown.Trigger,
|
|
12809
12712
|
{
|
|
12810
12713
|
onClick: (e) => e.stopPropagation(),
|
|
@@ -12823,40 +12726,40 @@ var init_RoleOptions = __esm({
|
|
|
12823
12726
|
}
|
|
12824
12727
|
}
|
|
12825
12728
|
},
|
|
12826
|
-
/* @__PURE__ */
|
|
12827
|
-
), /* @__PURE__ */
|
|
12729
|
+
/* @__PURE__ */ import_react119.default.createElement(Flex, null, /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VerticalMenuIcon, null))
|
|
12730
|
+
), /* @__PURE__ */ import_react119.default.createElement(
|
|
12828
12731
|
Dropdown.Content,
|
|
12829
12732
|
{
|
|
12830
12733
|
onClick: (e) => e.stopPropagation(),
|
|
12831
12734
|
css: { w: "max-content", maxWidth: "$64", bg: "$surface_default", py: 0 },
|
|
12832
12735
|
align: "end"
|
|
12833
12736
|
},
|
|
12834
|
-
canRemoveRoleFromStage && /* @__PURE__ */
|
|
12737
|
+
canRemoveRoleFromStage && /* @__PURE__ */ import_react119.default.createElement(
|
|
12835
12738
|
Dropdown.Item,
|
|
12836
12739
|
{
|
|
12837
12740
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderBottom: "1px solid $border_bright" }),
|
|
12838
12741
|
onClick: removeAllFromStage
|
|
12839
12742
|
},
|
|
12840
|
-
/* @__PURE__ */
|
|
12841
|
-
/* @__PURE__ */
|
|
12743
|
+
/* @__PURE__ */ import_react119.default.createElement(import_react_icons55.PersonRectangleIcon, null),
|
|
12744
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: optionTextCSS }, "Remove all from Stage")
|
|
12842
12745
|
),
|
|
12843
|
-
canMuteRole && /* @__PURE__ */
|
|
12746
|
+
canMuteRole && /* @__PURE__ */ import_react119.default.createElement(import_react119.default.Fragment, null, /* @__PURE__ */ import_react119.default.createElement(Dropdown.Item, { css: dropdownItemCSS, onClick: () => setTrackEnabled("audio", !allPeersHaveAudioOn) }, allPeersHaveAudioOn ? /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.MicOffIcon, null) : /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.MicOnIcon, null), /* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: optionTextCSS }, allPeersHaveAudioOn ? "Mute" : "Unmute", " Audio")), /* @__PURE__ */ import_react119.default.createElement(
|
|
12844
12747
|
Dropdown.Item,
|
|
12845
12748
|
{
|
|
12846
12749
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderTop: "1px solid $border_bright" }),
|
|
12847
12750
|
onClick: () => setTrackEnabled("video", !allPeersHaveVideoOn)
|
|
12848
12751
|
},
|
|
12849
|
-
allPeersHaveVideoOn ? /* @__PURE__ */
|
|
12850
|
-
/* @__PURE__ */
|
|
12752
|
+
allPeersHaveVideoOn ? /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VideoOffIcon, null) : /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VideoOnIcon, null),
|
|
12753
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: optionTextCSS }, allPeersHaveVideoOn ? "Mute" : "Unmute", " Video")
|
|
12851
12754
|
)),
|
|
12852
|
-
canRemoveRoleFromRoom && /* @__PURE__ */
|
|
12755
|
+
canRemoveRoleFromRoom && /* @__PURE__ */ import_react119.default.createElement(
|
|
12853
12756
|
Dropdown.Item,
|
|
12854
12757
|
{
|
|
12855
12758
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderTop: "1px solid $border_bright", color: "$alert_error_default" }),
|
|
12856
12759
|
onClick: removePeersFromRoom
|
|
12857
12760
|
},
|
|
12858
|
-
/* @__PURE__ */
|
|
12859
|
-
/* @__PURE__ */
|
|
12761
|
+
/* @__PURE__ */ import_react119.default.createElement(import_react_icons55.RemoveUserIcon, null),
|
|
12762
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: __spreadProps(__spreadValues({}, optionTextCSS), { color: "inherit" }) }, "Remove all from Room")
|
|
12860
12763
|
)
|
|
12861
12764
|
));
|
|
12862
12765
|
};
|
|
@@ -12867,12 +12770,12 @@ var init_RoleOptions = __esm({
|
|
|
12867
12770
|
function itemKey(index, data3) {
|
|
12868
12771
|
return data3.peerList[index].id;
|
|
12869
12772
|
}
|
|
12870
|
-
var
|
|
12773
|
+
var import_react120, import_react_use18, import_react_window, ROW_HEIGHT, VirtualizedParticipantItem, RoleAccordion;
|
|
12871
12774
|
var init_RoleAccordion = __esm({
|
|
12872
12775
|
"src/Prebuilt/components/Footer/RoleAccordion.tsx"() {
|
|
12873
12776
|
"use strict";
|
|
12874
12777
|
init_define_process_env();
|
|
12875
|
-
|
|
12778
|
+
import_react120 = __toESM(require("react"));
|
|
12876
12779
|
import_react_use18 = require("react-use");
|
|
12877
12780
|
import_react_window = require("react-window");
|
|
12878
12781
|
init_Accordion2();
|
|
@@ -12882,8 +12785,8 @@ var init_RoleAccordion = __esm({
|
|
|
12882
12785
|
init_RoleOptions();
|
|
12883
12786
|
init_utils2();
|
|
12884
12787
|
ROW_HEIGHT = 50;
|
|
12885
|
-
VirtualizedParticipantItem =
|
|
12886
|
-
return /* @__PURE__ */
|
|
12788
|
+
VirtualizedParticipantItem = import_react120.default.memo(({ index, data: data3 }) => {
|
|
12789
|
+
return /* @__PURE__ */ import_react120.default.createElement(Participant, { key: data3.peerList[index].id, peer: data3.peerList[index], isConnected: data3.isConnected });
|
|
12887
12790
|
});
|
|
12888
12791
|
RoleAccordion = ({
|
|
12889
12792
|
peerList = [],
|
|
@@ -12898,7 +12801,7 @@ var init_RoleAccordion = __esm({
|
|
|
12898
12801
|
return null;
|
|
12899
12802
|
}
|
|
12900
12803
|
const height = ROW_HEIGHT * peerList.length;
|
|
12901
|
-
return /* @__PURE__ */
|
|
12804
|
+
return /* @__PURE__ */ import_react120.default.createElement(Flex, { direction: "column", css: { flexGrow: 1, "&:hover .role_actions": { visibility: "visible" } }, ref }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12902
12805
|
Accordion.Root,
|
|
12903
12806
|
{
|
|
12904
12807
|
type: "single",
|
|
@@ -12906,7 +12809,7 @@ var init_RoleAccordion = __esm({
|
|
|
12906
12809
|
defaultValue: roleName,
|
|
12907
12810
|
css: { borderRadius: "$1", border: "1px solid $border_bright" }
|
|
12908
12811
|
},
|
|
12909
|
-
/* @__PURE__ */
|
|
12812
|
+
/* @__PURE__ */ import_react120.default.createElement(Accordion.Item, { value: roleName }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12910
12813
|
Accordion.Header,
|
|
12911
12814
|
{
|
|
12912
12815
|
iconStyles: { c: "$on_surface_high" },
|
|
@@ -12918,7 +12821,7 @@ var init_RoleAccordion = __esm({
|
|
|
12918
12821
|
c: "$on_surface_medium"
|
|
12919
12822
|
}
|
|
12920
12823
|
},
|
|
12921
|
-
/* @__PURE__ */
|
|
12824
|
+
/* @__PURE__ */ import_react120.default.createElement(Flex, { justify: "between", css: { flexGrow: 1, pr: "$6" } }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12922
12825
|
Text,
|
|
12923
12826
|
{
|
|
12924
12827
|
variant: "sm",
|
|
@@ -12927,8 +12830,8 @@ var init_RoleAccordion = __esm({
|
|
|
12927
12830
|
roleName,
|
|
12928
12831
|
" ",
|
|
12929
12832
|
`(${getFormattedCount(peerList.length)})`
|
|
12930
|
-
), /* @__PURE__ */
|
|
12931
|
-
), /* @__PURE__ */
|
|
12833
|
+
), /* @__PURE__ */ import_react120.default.createElement(RoleOptions, { roleName, peerList }))
|
|
12834
|
+
), /* @__PURE__ */ import_react120.default.createElement(Accordion.Content, null, /* @__PURE__ */ import_react120.default.createElement(Box, { css: { borderTop: "1px solid $border_default" } }), /* @__PURE__ */ import_react120.default.createElement(
|
|
12932
12835
|
import_react_window.FixedSizeList,
|
|
12933
12836
|
{
|
|
12934
12837
|
itemSize: ROW_HEIGHT,
|
|
@@ -12946,18 +12849,17 @@ var init_RoleAccordion = __esm({
|
|
|
12946
12849
|
});
|
|
12947
12850
|
|
|
12948
12851
|
// src/Prebuilt/components/Footer/ParticipantList.jsx
|
|
12949
|
-
var
|
|
12852
|
+
var import_react121, import_react_use19, import_react_sdk65, import_react_icons56, ParticipantList, ParticipantCount, VirtualizedParticipants, Participant, ParticipantActions, ParticipantMoreActions, ParticipantSearch;
|
|
12950
12853
|
var init_ParticipantList = __esm({
|
|
12951
12854
|
"src/Prebuilt/components/Footer/ParticipantList.jsx"() {
|
|
12952
12855
|
"use strict";
|
|
12953
12856
|
init_define_process_env();
|
|
12954
|
-
|
|
12857
|
+
import_react121 = __toESM(require("react"));
|
|
12955
12858
|
import_react_use19 = require("react-use");
|
|
12956
|
-
|
|
12957
|
-
|
|
12859
|
+
import_react_sdk65 = require("@100mslive/react-sdk");
|
|
12860
|
+
import_react_icons56 = require("@100mslive/react-icons");
|
|
12958
12861
|
init_src();
|
|
12959
12862
|
init_IconButton3();
|
|
12960
|
-
init_ChatParticipantHeader();
|
|
12961
12863
|
init_ConnectionIndicator();
|
|
12962
12864
|
init_ToastManager();
|
|
12963
12865
|
init_RoleAccordion();
|
|
@@ -12967,10 +12869,10 @@ var init_ParticipantList = __esm({
|
|
|
12967
12869
|
init_utils2();
|
|
12968
12870
|
init_constants();
|
|
12969
12871
|
ParticipantList = () => {
|
|
12970
|
-
const [filter, setFilter] = (0,
|
|
12872
|
+
const [filter, setFilter] = (0, import_react121.useState)();
|
|
12971
12873
|
const { participants, isConnected, peerCount } = useParticipants2(filter);
|
|
12972
12874
|
const peersOrderedByRoles = {};
|
|
12973
|
-
const handRaisedPeers = (0,
|
|
12875
|
+
const handRaisedPeers = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeersByCondition)((peer) => {
|
|
12974
12876
|
var _a7;
|
|
12975
12877
|
return (_a7 = JSON.parse(peer.metadata || "{}")) == null ? void 0 : _a7.isHandRaised;
|
|
12976
12878
|
}));
|
|
@@ -12980,7 +12882,7 @@ var init_ParticipantList = __esm({
|
|
|
12980
12882
|
}
|
|
12981
12883
|
peersOrderedByRoles[participant.roleName].push(participant);
|
|
12982
12884
|
});
|
|
12983
|
-
const onSearch = (0,
|
|
12885
|
+
const onSearch = (0, import_react121.useCallback)((value) => {
|
|
12984
12886
|
setFilter((filterValue) => {
|
|
12985
12887
|
if (!filterValue) {
|
|
12986
12888
|
filterValue = {};
|
|
@@ -12992,7 +12894,7 @@ var init_ParticipantList = __esm({
|
|
|
12992
12894
|
if (peerCount === 0) {
|
|
12993
12895
|
return null;
|
|
12994
12896
|
}
|
|
12995
|
-
return /* @__PURE__ */
|
|
12897
|
+
return /* @__PURE__ */ import_react121.default.createElement(import_react121.Fragment, null, /* @__PURE__ */ import_react121.default.createElement(Flex, { direction: "column", css: { size: "100%", gap: "$4" } }, !(filter == null ? void 0 : filter.search) && participants.length === 0 ? null : /* @__PURE__ */ import_react121.default.createElement(ParticipantSearch, { onSearch, inSidePane: true }), participants.length === 0 ? /* @__PURE__ */ import_react121.default.createElement(Flex, { align: "center", justify: "center", css: { w: "100%", p: "$8 0" } }, /* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm" }, !filter ? "No participants" : "No matching participants")) : null, /* @__PURE__ */ import_react121.default.createElement(
|
|
12996
12898
|
VirtualizedParticipants,
|
|
12997
12899
|
{
|
|
12998
12900
|
peersOrderedByRoles,
|
|
@@ -13003,10 +12905,10 @@ var init_ParticipantList = __esm({
|
|
|
13003
12905
|
)));
|
|
13004
12906
|
};
|
|
13005
12907
|
ParticipantCount = () => {
|
|
13006
|
-
const peerCount = (0,
|
|
12908
|
+
const peerCount = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPeerCount);
|
|
13007
12909
|
const toggleSidepane = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
13008
12910
|
const isParticipantsOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
13009
|
-
(0,
|
|
12911
|
+
(0, import_react121.useEffect)(() => {
|
|
13010
12912
|
if (isParticipantsOpen && peerCount === 0) {
|
|
13011
12913
|
toggleSidepane();
|
|
13012
12914
|
}
|
|
@@ -13014,7 +12916,7 @@ var init_ParticipantList = __esm({
|
|
|
13014
12916
|
if (peerCount === 0) {
|
|
13015
12917
|
return null;
|
|
13016
12918
|
}
|
|
13017
|
-
return /* @__PURE__ */
|
|
12919
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13018
12920
|
IconButton_default,
|
|
13019
12921
|
{
|
|
13020
12922
|
css: {
|
|
@@ -13030,12 +12932,12 @@ var init_ParticipantList = __esm({
|
|
|
13030
12932
|
active: !isParticipantsOpen,
|
|
13031
12933
|
"data-testid": "participant_list"
|
|
13032
12934
|
},
|
|
13033
|
-
/* @__PURE__ */
|
|
13034
|
-
/* @__PURE__ */
|
|
12935
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.PeopleIcon, null),
|
|
12936
|
+
/* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { mx: "$4", c: "inherit" } }, peerCount)
|
|
13035
12937
|
);
|
|
13036
12938
|
};
|
|
13037
12939
|
VirtualizedParticipants = ({ peersOrderedByRoles = {}, isConnected, filter, handRaisedList = [] }) => {
|
|
13038
|
-
return /* @__PURE__ */
|
|
12940
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13039
12941
|
Flex,
|
|
13040
12942
|
{
|
|
13041
12943
|
direction: "column",
|
|
@@ -13047,7 +12949,7 @@ var init_ParticipantList = __esm({
|
|
|
13047
12949
|
pr: "$3"
|
|
13048
12950
|
}
|
|
13049
12951
|
},
|
|
13050
|
-
/* @__PURE__ */
|
|
12952
|
+
/* @__PURE__ */ import_react121.default.createElement(
|
|
13051
12953
|
RoleAccordion,
|
|
13052
12954
|
{
|
|
13053
12955
|
peerList: handRaisedList,
|
|
@@ -13057,7 +12959,7 @@ var init_ParticipantList = __esm({
|
|
|
13057
12959
|
isHandRaisedAccordion: true
|
|
13058
12960
|
}
|
|
13059
12961
|
),
|
|
13060
|
-
Object.keys(peersOrderedByRoles).map((role) => /* @__PURE__ */
|
|
12962
|
+
Object.keys(peersOrderedByRoles).map((role) => /* @__PURE__ */ import_react121.default.createElement(
|
|
13061
12963
|
RoleAccordion,
|
|
13062
12964
|
{
|
|
13063
12965
|
key: role,
|
|
@@ -13070,8 +12972,8 @@ var init_ParticipantList = __esm({
|
|
|
13070
12972
|
);
|
|
13071
12973
|
};
|
|
13072
12974
|
Participant = ({ peer, isConnected }) => {
|
|
13073
|
-
const localPeerId = (0,
|
|
13074
|
-
return /* @__PURE__ */
|
|
12975
|
+
const localPeerId = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectLocalPeerID);
|
|
12976
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13075
12977
|
Flex,
|
|
13076
12978
|
{
|
|
13077
12979
|
key: peer.id,
|
|
@@ -13086,17 +12988,17 @@ var init_ParticipantList = __esm({
|
|
|
13086
12988
|
justify: "between",
|
|
13087
12989
|
"data-testid": "participant_" + peer.name
|
|
13088
12990
|
},
|
|
13089
|
-
/* @__PURE__ */
|
|
13090
|
-
isConnected ? /* @__PURE__ */
|
|
12991
|
+
/* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: __spreadProps(__spreadValues({}, textEllipsis(150)), { fontWeight: "$semiBold", color: "$on_surface_high" }) }, peer.name, " ", localPeerId === peer.id ? "(You)" : ""),
|
|
12992
|
+
isConnected ? /* @__PURE__ */ import_react121.default.createElement(ParticipantActions, { peerId: peer.id, isLocal: peer.id === localPeerId, role: peer.roleName }) : null
|
|
13091
12993
|
);
|
|
13092
12994
|
};
|
|
13093
|
-
ParticipantActions =
|
|
12995
|
+
ParticipantActions = import_react121.default.memo(({ peerId, role, isLocal }) => {
|
|
13094
12996
|
var _a7, _b7;
|
|
13095
|
-
const isHandRaised = (_a7 = (0,
|
|
13096
|
-
const canChangeRole = (_b7 = (0,
|
|
12997
|
+
const isHandRaised = (_a7 = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeerMetadata)(peerId))) == null ? void 0 : _a7.isHandRaised;
|
|
12998
|
+
const canChangeRole = (_b7 = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions)) == null ? void 0 : _b7.changeRole;
|
|
13097
12999
|
const shouldShowMoreActions = canChangeRole;
|
|
13098
|
-
const isAudioMuted = !(0,
|
|
13099
|
-
return /* @__PURE__ */
|
|
13000
|
+
const isAudioMuted = !(0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectIsPeerAudioEnabled)(peerId));
|
|
13001
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13100
13002
|
Flex,
|
|
13101
13003
|
{
|
|
13102
13004
|
align: "center",
|
|
@@ -13105,32 +13007,32 @@ var init_ParticipantList = __esm({
|
|
|
13105
13007
|
gap: "$8"
|
|
13106
13008
|
}
|
|
13107
13009
|
},
|
|
13108
|
-
/* @__PURE__ */
|
|
13109
|
-
isHandRaised && /* @__PURE__ */
|
|
13010
|
+
/* @__PURE__ */ import_react121.default.createElement(ConnectionIndicator, { peerId }),
|
|
13011
|
+
isHandRaised && /* @__PURE__ */ import_react121.default.createElement(
|
|
13110
13012
|
Flex,
|
|
13111
13013
|
{
|
|
13112
13014
|
align: "center",
|
|
13113
13015
|
justify: "center",
|
|
13114
13016
|
css: { p: "$1", c: "$on_surface_high", bg: "$surface_bright", borderRadius: "$round" }
|
|
13115
13017
|
},
|
|
13116
|
-
/* @__PURE__ */
|
|
13018
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.HandIcon, { height: 19, width: 19 })
|
|
13117
13019
|
),
|
|
13118
|
-
isAudioMuted ? /* @__PURE__ */
|
|
13020
|
+
isAudioMuted ? /* @__PURE__ */ import_react121.default.createElement(
|
|
13119
13021
|
Flex,
|
|
13120
13022
|
{
|
|
13121
13023
|
align: "center",
|
|
13122
13024
|
justify: "center",
|
|
13123
13025
|
css: { p: "$2", c: "$on_surface_high", bg: "$surface_bright", borderRadius: "$round" }
|
|
13124
13026
|
},
|
|
13125
|
-
/* @__PURE__ */
|
|
13027
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.MicOffIcon, { height: 19, width: 19 })
|
|
13126
13028
|
) : null,
|
|
13127
|
-
shouldShowMoreActions && !isInternalRole(role) && !isLocal ? /* @__PURE__ */
|
|
13029
|
+
shouldShowMoreActions && !isInternalRole(role) && !isLocal ? /* @__PURE__ */ import_react121.default.createElement(ParticipantMoreActions, { peerId, role }) : null
|
|
13128
13030
|
);
|
|
13129
13031
|
});
|
|
13130
13032
|
ParticipantMoreActions = ({ peerId, role }) => {
|
|
13131
13033
|
var _a7;
|
|
13132
|
-
const hmsActions = (0,
|
|
13133
|
-
const { changeRole: canChangeRole, removeOthers: canRemoveOthers } = (0,
|
|
13034
|
+
const hmsActions = (0, import_react_sdk65.useHMSActions)();
|
|
13035
|
+
const { changeRole: canChangeRole, removeOthers: canRemoveOthers } = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions);
|
|
13134
13036
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
13135
13037
|
const {
|
|
13136
13038
|
bring_to_stage_label,
|
|
@@ -13140,10 +13042,10 @@ var init_ParticipantList = __esm({
|
|
|
13140
13042
|
} = elements.on_stage_exp || {};
|
|
13141
13043
|
const isInStage = role === on_stage_role;
|
|
13142
13044
|
const shouldShowStageRoleChange = canChangeRole && (isInStage && remove_from_stage_label || (off_stage_roles == null ? void 0 : off_stage_roles.includes(role)) && bring_to_stage_label);
|
|
13143
|
-
const prevRole = (_a7 = (0,
|
|
13144
|
-
const localPeerId = (0,
|
|
13045
|
+
const prevRole = (_a7 = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeerMetadata)(peerId))) == null ? void 0 : _a7.prevRole;
|
|
13046
|
+
const localPeerId = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectLocalPeerID);
|
|
13145
13047
|
const isLocal = localPeerId === peerId;
|
|
13146
|
-
const [open, setOpen] = (0,
|
|
13048
|
+
const [open, setOpen] = (0, import_react121.useState)(false);
|
|
13147
13049
|
const handleStageAction = () => __async(void 0, null, function* () {
|
|
13148
13050
|
if (isInStage) {
|
|
13149
13051
|
prevRole && hmsActions.changeRoleOfPeer(peerId, prevRole, true);
|
|
@@ -13152,7 +13054,7 @@ var init_ParticipantList = __esm({
|
|
|
13152
13054
|
}
|
|
13153
13055
|
setOpen(false);
|
|
13154
13056
|
});
|
|
13155
|
-
return /* @__PURE__ */
|
|
13057
|
+
return /* @__PURE__ */ import_react121.default.createElement(Dropdown.Root, { open, onOpenChange: (value) => setOpen(value), modal: false }, /* @__PURE__ */ import_react121.default.createElement(
|
|
13156
13058
|
Dropdown.Trigger,
|
|
13157
13059
|
{
|
|
13158
13060
|
asChild: true,
|
|
@@ -13172,8 +13074,8 @@ var init_ParticipantList = __esm({
|
|
|
13172
13074
|
},
|
|
13173
13075
|
tabIndex: 0
|
|
13174
13076
|
},
|
|
13175
|
-
/* @__PURE__ */
|
|
13176
|
-
), /* @__PURE__ */
|
|
13077
|
+
/* @__PURE__ */ import_react121.default.createElement(Box, { css: { my: "auto" } }, /* @__PURE__ */ import_react121.default.createElement(import_react_icons56.VerticalMenuIcon, null))
|
|
13078
|
+
), /* @__PURE__ */ import_react121.default.createElement(Dropdown.Portal, null, /* @__PURE__ */ import_react121.default.createElement(Dropdown.Content, { align: "end", sideOffset: 8, css: { w: "$64", bg: "$surface_default" } }, shouldShowStageRoleChange ? /* @__PURE__ */ import_react121.default.createElement(Dropdown.Item, { css: { bg: "$surface_default" }, onClick: () => handleStageAction() }, /* @__PURE__ */ import_react121.default.createElement(import_react_icons56.ChangeRoleIcon, null), /* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { ml: "$4", fontWeight: "$semiBold", c: "$on_surface_high" } }, isInStage ? remove_from_stage_label : bring_to_stage_label)) : null, !isLocal && canRemoveOthers && /* @__PURE__ */ import_react121.default.createElement(
|
|
13177
13079
|
Dropdown.Item,
|
|
13178
13080
|
{
|
|
13179
13081
|
css: { color: "$alert_error_default", bg: "$surface_default" },
|
|
@@ -13185,12 +13087,12 @@ var init_ParticipantList = __esm({
|
|
|
13185
13087
|
}
|
|
13186
13088
|
})
|
|
13187
13089
|
},
|
|
13188
|
-
/* @__PURE__ */
|
|
13189
|
-
/* @__PURE__ */
|
|
13090
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.PeopleRemoveIcon, null),
|
|
13091
|
+
/* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { ml: "$4", color: "inherit", fontWeight: "$semiBold" } }, "Remove Participant")
|
|
13190
13092
|
))));
|
|
13191
13093
|
};
|
|
13192
13094
|
ParticipantSearch = ({ onSearch, placeholder, inSidePane = false }) => {
|
|
13193
|
-
const [value, setValue] =
|
|
13095
|
+
const [value, setValue] = import_react121.default.useState("");
|
|
13194
13096
|
const isMobile = (0, import_react_use19.useMedia)(config.media.md);
|
|
13195
13097
|
(0, import_react_use19.useDebounce)(
|
|
13196
13098
|
() => {
|
|
@@ -13199,7 +13101,7 @@ var init_ParticipantList = __esm({
|
|
|
13199
13101
|
300,
|
|
13200
13102
|
[value, onSearch]
|
|
13201
13103
|
);
|
|
13202
|
-
return /* @__PURE__ */
|
|
13104
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13203
13105
|
Flex,
|
|
13204
13106
|
{
|
|
13205
13107
|
align: "center",
|
|
@@ -13211,8 +13113,8 @@ var init_ParticipantList = __esm({
|
|
|
13211
13113
|
mt: inSidePane ? "$4" : ""
|
|
13212
13114
|
}
|
|
13213
13115
|
},
|
|
13214
|
-
/* @__PURE__ */
|
|
13215
|
-
/* @__PURE__ */
|
|
13116
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.SearchIcon, { style: { position: "absolute", left: isMobile ? "1.25rem" : "0.5rem" } }),
|
|
13117
|
+
/* @__PURE__ */ import_react121.default.createElement(
|
|
13216
13118
|
Input,
|
|
13217
13119
|
{
|
|
13218
13120
|
type: "text",
|
|
@@ -13235,15 +13137,14 @@ var init_ParticipantList = __esm({
|
|
|
13235
13137
|
});
|
|
13236
13138
|
|
|
13237
13139
|
// src/Prebuilt/components/Footer/Footer.tsx
|
|
13238
|
-
var
|
|
13140
|
+
var import_react122, import_react_use20, import_chat, VirtualBackground3, Footer2;
|
|
13239
13141
|
var init_Footer3 = __esm({
|
|
13240
13142
|
"src/Prebuilt/components/Footer/Footer.tsx"() {
|
|
13241
13143
|
"use strict";
|
|
13242
13144
|
init_define_process_env();
|
|
13243
|
-
|
|
13145
|
+
import_react122 = __toESM(require("react"));
|
|
13244
13146
|
import_react_use20 = require("react-use");
|
|
13245
13147
|
import_chat = require("@100mslive/types-prebuilt/elements/chat");
|
|
13246
|
-
import_react_sdk67 = require("@100mslive/react-sdk");
|
|
13247
13148
|
init_src();
|
|
13248
13149
|
init_AudioVideoToggle();
|
|
13249
13150
|
init_EmojiReaction();
|
|
@@ -13253,7 +13154,9 @@ var init_Footer3 = __esm({
|
|
|
13253
13154
|
init_ScreenShareToggle();
|
|
13254
13155
|
init_ChatToggle();
|
|
13255
13156
|
init_ParticipantList();
|
|
13256
|
-
|
|
13157
|
+
init_useSidepane();
|
|
13158
|
+
init_constants();
|
|
13159
|
+
VirtualBackground3 = import_react122.default.lazy(() => Promise.resolve().then(() => (init_VirtualBackground(), VirtualBackground_exports)));
|
|
13257
13160
|
Footer2 = ({
|
|
13258
13161
|
screenType,
|
|
13259
13162
|
elements
|
|
@@ -13262,8 +13165,14 @@ var init_Footer3 = __esm({
|
|
|
13262
13165
|
const isMobile = (0, import_react_use20.useMedia)(config.media.md);
|
|
13263
13166
|
const isOverlayChat = !!((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay);
|
|
13264
13167
|
const openByDefault = ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.initial_state) === import_chat.Chat_ChatState.CHAT_STATE_OPEN;
|
|
13265
|
-
const
|
|
13266
|
-
|
|
13168
|
+
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
13169
|
+
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
13170
|
+
(0, import_react122.useEffect)(() => {
|
|
13171
|
+
if (!isChatOpen && openByDefault) {
|
|
13172
|
+
toggleChat();
|
|
13173
|
+
}
|
|
13174
|
+
}, [toggleChat, openByDefault]);
|
|
13175
|
+
return /* @__PURE__ */ import_react122.default.createElement(
|
|
13267
13176
|
Footer.Root,
|
|
13268
13177
|
{
|
|
13269
13178
|
css: {
|
|
@@ -13277,7 +13186,7 @@ var init_Footer3 = __esm({
|
|
|
13277
13186
|
}
|
|
13278
13187
|
}
|
|
13279
13188
|
},
|
|
13280
|
-
/* @__PURE__ */
|
|
13189
|
+
/* @__PURE__ */ import_react122.default.createElement(
|
|
13281
13190
|
Footer.Left,
|
|
13282
13191
|
{
|
|
13283
13192
|
css: {
|
|
@@ -13288,11 +13197,11 @@ var init_Footer3 = __esm({
|
|
|
13288
13197
|
}
|
|
13289
13198
|
}
|
|
13290
13199
|
},
|
|
13291
|
-
isMobile ? /* @__PURE__ */
|
|
13292
|
-
/* @__PURE__ */
|
|
13293
|
-
isMobile ? null : /* @__PURE__ */
|
|
13200
|
+
isMobile ? /* @__PURE__ */ import_react122.default.createElement(LeaveRoom, { screenType }) : null,
|
|
13201
|
+
/* @__PURE__ */ import_react122.default.createElement(AudioVideoToggle, null),
|
|
13202
|
+
isMobile ? null : /* @__PURE__ */ import_react122.default.createElement(import_react122.Suspense, { fallback: /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null) }, /* @__PURE__ */ import_react122.default.createElement(VirtualBackground3, null))
|
|
13294
13203
|
),
|
|
13295
|
-
/* @__PURE__ */
|
|
13204
|
+
/* @__PURE__ */ import_react122.default.createElement(
|
|
13296
13205
|
Footer.Center,
|
|
13297
13206
|
{
|
|
13298
13207
|
css: {
|
|
@@ -13302,9 +13211,9 @@ var init_Footer3 = __esm({
|
|
|
13302
13211
|
}
|
|
13303
13212
|
}
|
|
13304
13213
|
},
|
|
13305
|
-
isMobile ? /* @__PURE__ */
|
|
13214
|
+
isMobile ? /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, screenType === "hls_live_streaming" ? /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null) : null, (elements == null ? void 0 : elements.chat) && /* @__PURE__ */ import_react122.default.createElement(ChatToggle, null), /* @__PURE__ */ import_react122.default.createElement(MoreSettings, { elements, screenType })) : /* @__PURE__ */ import_react122.default.createElement(import_react122.default.Fragment, null, /* @__PURE__ */ import_react122.default.createElement(ScreenshareToggle, null), /* @__PURE__ */ import_react122.default.createElement(RaiseHand, null), (elements == null ? void 0 : elements.emoji_reactions) && /* @__PURE__ */ import_react122.default.createElement(EmojiReaction, null), /* @__PURE__ */ import_react122.default.createElement(LeaveRoom, { screenType }))
|
|
13306
13215
|
),
|
|
13307
|
-
/* @__PURE__ */
|
|
13216
|
+
/* @__PURE__ */ import_react122.default.createElement(Footer.Right, null, !isMobile && (elements == null ? void 0 : elements.chat) && /* @__PURE__ */ import_react122.default.createElement(ChatToggle, null), (elements == null ? void 0 : elements.participant_list) && /* @__PURE__ */ import_react122.default.createElement(ParticipantCount, null), /* @__PURE__ */ import_react122.default.createElement(MoreSettings, { elements, screenType }))
|
|
13308
13217
|
);
|
|
13309
13218
|
};
|
|
13310
13219
|
}
|
|
@@ -13312,11 +13221,11 @@ var init_Footer3 = __esm({
|
|
|
13312
13221
|
|
|
13313
13222
|
// src/Prebuilt/components/Notifications/HLSFailureModal.jsx
|
|
13314
13223
|
function HLSFailureModal() {
|
|
13315
|
-
const { hlsError } = (0,
|
|
13316
|
-
const [openModal, setOpenModal] = (0,
|
|
13317
|
-
const hmsActions = (0,
|
|
13224
|
+
const { hlsError } = (0, import_react_sdk66.useHMSStore)(import_react_sdk66.selectHLSState).error || false;
|
|
13225
|
+
const [openModal, setOpenModal] = (0, import_react123.useState)(!!hlsError);
|
|
13226
|
+
const hmsActions = (0, import_react_sdk66.useHMSActions)();
|
|
13318
13227
|
const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
|
|
13319
|
-
const startHLS = (0,
|
|
13228
|
+
const startHLS = (0, import_react123.useCallback)(() => __async(this, null, function* () {
|
|
13320
13229
|
try {
|
|
13321
13230
|
if (isHLSStarted) {
|
|
13322
13231
|
return;
|
|
@@ -13331,7 +13240,7 @@ function HLSFailureModal() {
|
|
|
13331
13240
|
setHLSStarted(false);
|
|
13332
13241
|
}
|
|
13333
13242
|
}), [hmsActions, isHLSStarted, setHLSStarted]);
|
|
13334
|
-
return hlsError ? /* @__PURE__ */
|
|
13243
|
+
return hlsError ? /* @__PURE__ */ import_react123.default.createElement(
|
|
13335
13244
|
Dialog.Root,
|
|
13336
13245
|
{
|
|
13337
13246
|
open: openModal,
|
|
@@ -13341,7 +13250,7 @@ function HLSFailureModal() {
|
|
|
13341
13250
|
}
|
|
13342
13251
|
}
|
|
13343
13252
|
},
|
|
13344
|
-
/* @__PURE__ */
|
|
13253
|
+
/* @__PURE__ */ import_react123.default.createElement(Dialog.Portal, null, /* @__PURE__ */ import_react123.default.createElement(Dialog.Overlay, null), /* @__PURE__ */ import_react123.default.createElement(Dialog.Content, { css: { w: "min(360px, 90%)" } }, /* @__PURE__ */ import_react123.default.createElement(
|
|
13345
13254
|
Dialog.Title,
|
|
13346
13255
|
{
|
|
13347
13256
|
css: {
|
|
@@ -13352,17 +13261,17 @@ function HLSFailureModal() {
|
|
|
13352
13261
|
mt: "$4"
|
|
13353
13262
|
}
|
|
13354
13263
|
},
|
|
13355
|
-
/* @__PURE__ */
|
|
13356
|
-
), /* @__PURE__ */
|
|
13264
|
+
/* @__PURE__ */ import_react123.default.createElement(Text, { variant: "h6", css: { fontWeight: "$semiBold" } }, "Failed to Go Live")
|
|
13265
|
+
), /* @__PURE__ */ import_react123.default.createElement(Text, { variant: "sm", css: { mb: "$10", color: "$on_surface_medium" } }, "Something went wrong and your live broadcast failed. Please try again."), /* @__PURE__ */ import_react123.default.createElement(Flex, { align: "center", justify: "between", css: { w: "100%", gap: "$8" } }, /* @__PURE__ */ import_react123.default.createElement(Button, { outlined: true, variant: "standard", css: { w: "100%" }, onClick: () => setOpenModal(false) }, "Dismiss"), /* @__PURE__ */ import_react123.default.createElement(Button, { css: { w: "100%" }, onClick: startHLS }, "Go Live"))))
|
|
13357
13266
|
) : null;
|
|
13358
13267
|
}
|
|
13359
|
-
var
|
|
13268
|
+
var import_react123, import_react_sdk66;
|
|
13360
13269
|
var init_HLSFailureModal = __esm({
|
|
13361
13270
|
"src/Prebuilt/components/Notifications/HLSFailureModal.jsx"() {
|
|
13362
13271
|
"use strict";
|
|
13363
13272
|
init_define_process_env();
|
|
13364
|
-
|
|
13365
|
-
|
|
13273
|
+
import_react123 = __toESM(require("react"));
|
|
13274
|
+
import_react_sdk66 = require("@100mslive/react-sdk");
|
|
13366
13275
|
init_Button2();
|
|
13367
13276
|
init_Layout();
|
|
13368
13277
|
init_Modal();
|
|
@@ -13373,13 +13282,13 @@ var init_HLSFailureModal = __esm({
|
|
|
13373
13282
|
});
|
|
13374
13283
|
|
|
13375
13284
|
// src/Prebuilt/components/hooks/useVideoTileLayout.ts
|
|
13376
|
-
var
|
|
13285
|
+
var import_react124, VideoTileContext, useVideoTileContext;
|
|
13377
13286
|
var init_useVideoTileLayout = __esm({
|
|
13378
13287
|
"src/Prebuilt/components/hooks/useVideoTileLayout.ts"() {
|
|
13379
13288
|
"use strict";
|
|
13380
13289
|
init_define_process_env();
|
|
13381
|
-
|
|
13382
|
-
VideoTileContext =
|
|
13290
|
+
import_react124 = __toESM(require("react"));
|
|
13291
|
+
VideoTileContext = import_react124.default.createContext({
|
|
13383
13292
|
enableSpotlightingPeer: true,
|
|
13384
13293
|
hideParticipantNameOnTile: false,
|
|
13385
13294
|
roundedVideoTile: true,
|
|
@@ -13389,23 +13298,23 @@ var init_useVideoTileLayout = __esm({
|
|
|
13389
13298
|
hideMetadataOnTile: false
|
|
13390
13299
|
});
|
|
13391
13300
|
useVideoTileContext = () => {
|
|
13392
|
-
const context = (0,
|
|
13301
|
+
const context = (0, import_react124.useContext)(VideoTileContext);
|
|
13393
13302
|
return context;
|
|
13394
13303
|
};
|
|
13395
13304
|
}
|
|
13396
13305
|
});
|
|
13397
13306
|
|
|
13398
13307
|
// src/Prebuilt/components/InsetTile.tsx
|
|
13399
|
-
var
|
|
13308
|
+
var import_react125, import_react_draggable, import_react_use21, import_react_sdk67, import_react_icons57, MinimisedTile, insetHeightPx, insetMaxWidthPx, defaultMobileAspectRatio, desktopAspectRatio, InsetTile;
|
|
13400
13309
|
var init_InsetTile = __esm({
|
|
13401
13310
|
"src/Prebuilt/components/InsetTile.tsx"() {
|
|
13402
13311
|
"use strict";
|
|
13403
13312
|
init_define_process_env();
|
|
13404
|
-
|
|
13313
|
+
import_react125 = __toESM(require("react"));
|
|
13405
13314
|
import_react_draggable = __toESM(require("react-draggable"));
|
|
13406
13315
|
import_react_use21 = require("react-use");
|
|
13407
|
-
|
|
13408
|
-
|
|
13316
|
+
import_react_sdk67 = require("@100mslive/react-sdk");
|
|
13317
|
+
import_react_icons57 = require("@100mslive/react-icons");
|
|
13409
13318
|
init_Layout();
|
|
13410
13319
|
init_Text2();
|
|
13411
13320
|
init_Theme();
|
|
@@ -13416,14 +13325,14 @@ var init_InsetTile = __esm({
|
|
|
13416
13325
|
init_useVideoTileLayout();
|
|
13417
13326
|
init_constants();
|
|
13418
13327
|
MinimisedTile = ({ setMinimised }) => {
|
|
13419
|
-
return /* @__PURE__ */
|
|
13328
|
+
return /* @__PURE__ */ import_react125.default.createElement(Flex, { align: "center", css: { gap: "$6", r: "$1", bg: "$surface_default", p: "$4", color: "$on_surface_high" } }, /* @__PURE__ */ import_react125.default.createElement(AudioVideoToggle, { hideOptions: true }), /* @__PURE__ */ import_react125.default.createElement(Text, null, "You"), /* @__PURE__ */ import_react125.default.createElement(
|
|
13420
13329
|
IconButton_default,
|
|
13421
13330
|
{
|
|
13422
13331
|
className: "__cancel-drag-event",
|
|
13423
13332
|
onClick: () => setMinimised(false),
|
|
13424
13333
|
css: { bg: "transparent", border: "transparent" }
|
|
13425
13334
|
},
|
|
13426
|
-
/* @__PURE__ */
|
|
13335
|
+
/* @__PURE__ */ import_react125.default.createElement(import_react_icons57.ExpandIcon, null)
|
|
13427
13336
|
));
|
|
13428
13337
|
};
|
|
13429
13338
|
insetHeightPx = 180;
|
|
@@ -13433,10 +13342,10 @@ var init_InsetTile = __esm({
|
|
|
13433
13342
|
InsetTile = () => {
|
|
13434
13343
|
const isMobile = (0, import_react_use21.useMedia)(config.media.md);
|
|
13435
13344
|
const isLandscape = (0, import_react_use21.useMedia)(config.media.ls);
|
|
13436
|
-
const localPeer = (0,
|
|
13345
|
+
const localPeer = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectLocalPeer);
|
|
13437
13346
|
const [minimised, setMinimised] = useSetAppDataByKey(APP_DATA.minimiseInset);
|
|
13438
|
-
const videoTrack = (0,
|
|
13439
|
-
const isAllowedToPublish = (0,
|
|
13347
|
+
const videoTrack = (0, import_react_sdk67.useHMSStore)((0, import_react_sdk67.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
|
|
13348
|
+
const isAllowedToPublish = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectIsAllowedToPublish);
|
|
13440
13349
|
const videoTileProps = useVideoTileContext();
|
|
13441
13350
|
let aspectRatio = isMobile ? defaultMobileAspectRatio : desktopAspectRatio;
|
|
13442
13351
|
if ((videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) && !isMobile) {
|
|
@@ -13448,8 +13357,8 @@ var init_InsetTile = __esm({
|
|
|
13448
13357
|
width = 240;
|
|
13449
13358
|
height = width / aspectRatio;
|
|
13450
13359
|
}
|
|
13451
|
-
const nodeRef = (0,
|
|
13452
|
-
(0,
|
|
13360
|
+
const nodeRef = (0, import_react125.useRef)(null);
|
|
13361
|
+
(0, import_react125.useEffect)(() => {
|
|
13453
13362
|
const node = nodeRef.current;
|
|
13454
13363
|
if (!node || !window.ResizeObserver) {
|
|
13455
13364
|
return;
|
|
@@ -13470,7 +13379,7 @@ var init_InsetTile = __esm({
|
|
|
13470
13379
|
if (!isAllowedToPublish.video && !isAllowedToPublish.audio) {
|
|
13471
13380
|
return null;
|
|
13472
13381
|
}
|
|
13473
|
-
return /* @__PURE__ */
|
|
13382
|
+
return /* @__PURE__ */ import_react125.default.createElement(import_react_draggable.default, { bounds: "parent", nodeRef, cancel: ".__cancel-drag-event" }, /* @__PURE__ */ import_react125.default.createElement(
|
|
13474
13383
|
Box,
|
|
13475
13384
|
{
|
|
13476
13385
|
ref: nodeRef,
|
|
@@ -13486,9 +13395,9 @@ var init_InsetTile = __esm({
|
|
|
13486
13395
|
h: height
|
|
13487
13396
|
} : {})
|
|
13488
13397
|
},
|
|
13489
|
-
minimised ? /* @__PURE__ */
|
|
13398
|
+
minimised ? /* @__PURE__ */ import_react125.default.createElement(MinimisedTile, { setMinimised }) : /* @__PURE__ */ import_react125.default.createElement(
|
|
13490
13399
|
VideoTile_default,
|
|
13491
|
-
__spreadValues({
|
|
13400
|
+
__spreadProps(__spreadValues({
|
|
13492
13401
|
peerId: localPeer == null ? void 0 : localPeer.id,
|
|
13493
13402
|
trackid: localPeer == null ? void 0 : localPeer.videoTrack,
|
|
13494
13403
|
rootCSS: {
|
|
@@ -13500,7 +13409,9 @@ var init_InsetTile = __esm({
|
|
|
13500
13409
|
containerCSS: { background: "$surface_default" },
|
|
13501
13410
|
canMinimise: true,
|
|
13502
13411
|
isDragabble: true
|
|
13503
|
-
}, videoTileProps)
|
|
13412
|
+
}, videoTileProps), {
|
|
13413
|
+
hideParticipantNameOnTile: true
|
|
13414
|
+
})
|
|
13504
13415
|
)
|
|
13505
13416
|
));
|
|
13506
13417
|
};
|
|
@@ -13508,13 +13419,13 @@ var init_InsetTile = __esm({
|
|
|
13508
13419
|
});
|
|
13509
13420
|
|
|
13510
13421
|
// src/Prebuilt/components/Pagination.tsx
|
|
13511
|
-
var
|
|
13422
|
+
var import_react126, import_react_icons58, Pagination;
|
|
13512
13423
|
var init_Pagination2 = __esm({
|
|
13513
13424
|
"src/Prebuilt/components/Pagination.tsx"() {
|
|
13514
13425
|
"use strict";
|
|
13515
13426
|
init_define_process_env();
|
|
13516
|
-
|
|
13517
|
-
|
|
13427
|
+
import_react126 = __toESM(require("react"));
|
|
13428
|
+
import_react_icons58 = require("@100mslive/react-icons");
|
|
13518
13429
|
init_Pagination();
|
|
13519
13430
|
Pagination = ({
|
|
13520
13431
|
page,
|
|
@@ -13531,7 +13442,7 @@ var init_Pagination2 = __esm({
|
|
|
13531
13442
|
e.stopPropagation();
|
|
13532
13443
|
onPageChange(Math.max(page - 1, 0));
|
|
13533
13444
|
};
|
|
13534
|
-
(0,
|
|
13445
|
+
(0, import_react126.useEffect)(() => {
|
|
13535
13446
|
if (page >= numPages) {
|
|
13536
13447
|
onPageChange(Math.max(0, numPages - 1));
|
|
13537
13448
|
}
|
|
@@ -13539,7 +13450,7 @@ var init_Pagination2 = __esm({
|
|
|
13539
13450
|
if (numPages <= 1) {
|
|
13540
13451
|
return null;
|
|
13541
13452
|
}
|
|
13542
|
-
return /* @__PURE__ */
|
|
13453
|
+
return /* @__PURE__ */ import_react126.default.createElement(StyledPagination.Root, { css: { flexShrink: 0 } }, /* @__PURE__ */ import_react126.default.createElement(StyledPagination.Chevron, { disabled: disableLeft, onClick: prevPage }, /* @__PURE__ */ import_react126.default.createElement(import_react_icons58.ChevronLeftIcon, { width: 16, height: 16, style: { cursor: disableLeft ? "not-allowed" : "pointer" } })), numPages <= 5 ? /* @__PURE__ */ import_react126.default.createElement(StyledPagination.Dots, null, [...Array(numPages)].map((_, i) => /* @__PURE__ */ import_react126.default.createElement(
|
|
13543
13454
|
StyledPagination.Dot,
|
|
13544
13455
|
{
|
|
13545
13456
|
key: i,
|
|
@@ -13549,25 +13460,25 @@ var init_Pagination2 = __esm({
|
|
|
13549
13460
|
onPageChange(i);
|
|
13550
13461
|
}
|
|
13551
13462
|
}
|
|
13552
|
-
))) : null, /* @__PURE__ */
|
|
13463
|
+
))) : null, /* @__PURE__ */ import_react126.default.createElement(StyledPagination.Chevron, { disabled: disableRight, onClick: nextPage }, /* @__PURE__ */ import_react126.default.createElement(import_react_icons58.ChevronRightIcon, { width: 16, height: 16, style: { cursor: disableRight ? "not-allowed" : "pointer" } })));
|
|
13553
13464
|
};
|
|
13554
13465
|
}
|
|
13555
13466
|
});
|
|
13556
13467
|
|
|
13557
13468
|
// src/Prebuilt/components/VideoLayouts/Grid.tsx
|
|
13558
|
-
var
|
|
13469
|
+
var import_react127, Grid;
|
|
13559
13470
|
var init_Grid = __esm({
|
|
13560
13471
|
"src/Prebuilt/components/VideoLayouts/Grid.tsx"() {
|
|
13561
13472
|
"use strict";
|
|
13562
13473
|
init_define_process_env();
|
|
13563
|
-
|
|
13474
|
+
import_react127 = __toESM(require("react"));
|
|
13564
13475
|
init_Layout();
|
|
13565
13476
|
init_VideoTile2();
|
|
13566
13477
|
init_useVideoTileLayout();
|
|
13567
|
-
Grid =
|
|
13478
|
+
Grid = import_react127.default.forwardRef(
|
|
13568
13479
|
({ tiles, edgeToEdge }, ref) => {
|
|
13569
13480
|
const videoTileProps = useVideoTileContext();
|
|
13570
|
-
return /* @__PURE__ */
|
|
13481
|
+
return /* @__PURE__ */ import_react127.default.createElement(
|
|
13571
13482
|
Box,
|
|
13572
13483
|
{
|
|
13573
13484
|
ref,
|
|
@@ -13585,7 +13496,7 @@ var init_Grid = __esm({
|
|
|
13585
13496
|
},
|
|
13586
13497
|
tiles == null ? void 0 : tiles.map((tile) => {
|
|
13587
13498
|
var _a7, _b7, _c, _d;
|
|
13588
|
-
return /* @__PURE__ */
|
|
13499
|
+
return /* @__PURE__ */ import_react127.default.createElement(
|
|
13589
13500
|
VideoTile_default,
|
|
13590
13501
|
__spreadValues({
|
|
13591
13502
|
key: ((_a7 = tile.track) == null ? void 0 : _a7.id) || ((_b7 = tile.peer) == null ? void 0 : _b7.id),
|
|
@@ -13605,25 +13516,25 @@ var init_Grid = __esm({
|
|
|
13605
13516
|
});
|
|
13606
13517
|
|
|
13607
13518
|
// src/Prebuilt/components/hooks/useTileLayout.tsx
|
|
13608
|
-
var
|
|
13519
|
+
var import_react128, import_react_use22, import_react_sdk68, aspectRatioConfig, usePagesWithTiles, useTileLayout;
|
|
13609
13520
|
var init_useTileLayout = __esm({
|
|
13610
13521
|
"src/Prebuilt/components/hooks/useTileLayout.tsx"() {
|
|
13611
13522
|
"use strict";
|
|
13612
13523
|
init_define_process_env();
|
|
13613
|
-
|
|
13524
|
+
import_react128 = require("react");
|
|
13614
13525
|
import_react_use22 = require("react-use");
|
|
13615
|
-
|
|
13526
|
+
import_react_sdk68 = require("@100mslive/react-sdk");
|
|
13616
13527
|
init_Theme();
|
|
13617
13528
|
aspectRatioConfig = { default: [1 / 1, 4 / 3, 16 / 9], mobile: [1 / 1, 3 / 4, 9 / 16] };
|
|
13618
13529
|
usePagesWithTiles = ({ peers, maxTileCount }) => {
|
|
13619
|
-
const vanillaStore = (0,
|
|
13620
|
-
const tracksMap = vanillaStore.getState(
|
|
13621
|
-
const peersWithTiles = (0,
|
|
13622
|
-
() => (0,
|
|
13530
|
+
const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
|
|
13531
|
+
const tracksMap = vanillaStore.getState(import_react_sdk68.selectTracksMap);
|
|
13532
|
+
const peersWithTiles = (0, import_react128.useMemo)(
|
|
13533
|
+
() => (0, import_react_sdk68.getPeersWithTiles)(peers, tracksMap, () => false),
|
|
13623
13534
|
[peers, tracksMap]
|
|
13624
13535
|
);
|
|
13625
13536
|
const noOfPages = Math.ceil(peersWithTiles.length / maxTileCount);
|
|
13626
|
-
const pagesList = (0,
|
|
13537
|
+
const pagesList = (0, import_react128.useMemo)(() => {
|
|
13627
13538
|
let sliceStart = 0;
|
|
13628
13539
|
let remaining = peersWithTiles.length;
|
|
13629
13540
|
const list = [];
|
|
@@ -13642,11 +13553,11 @@ var init_useTileLayout = __esm({
|
|
|
13642
13553
|
maxTileCount,
|
|
13643
13554
|
edgeToEdge = false
|
|
13644
13555
|
}) => {
|
|
13645
|
-
const vanillaStore = (0,
|
|
13556
|
+
const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
|
|
13646
13557
|
const [ref, { width, height }] = (0, import_react_use22.useMeasure)();
|
|
13647
13558
|
const isMobile = (0, import_react_use22.useMedia)(config.media.lg);
|
|
13648
|
-
const [pagesWithTiles, setPagesWithTiles] = (0,
|
|
13649
|
-
(0,
|
|
13559
|
+
const [pagesWithTiles, setPagesWithTiles] = (0, import_react128.useState)([]);
|
|
13560
|
+
(0, import_react128.useEffect)(() => {
|
|
13650
13561
|
if (width === 0 || height === 0) {
|
|
13651
13562
|
return;
|
|
13652
13563
|
}
|
|
@@ -13715,7 +13626,7 @@ var init_useTileLayout = __esm({
|
|
|
13715
13626
|
// src/Prebuilt/components/VideoLayouts/EqualProminence.tsx
|
|
13716
13627
|
function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSize, edgeToEdge }) {
|
|
13717
13628
|
var _a7;
|
|
13718
|
-
const localPeer = (0,
|
|
13629
|
+
const localPeer = (0, import_react_sdk69.useHMSStore)(import_react_sdk69.selectLocalPeer);
|
|
13719
13630
|
const isMobile = (0, import_react_use23.useMedia)(config.media.md);
|
|
13720
13631
|
let maxTileCount = useUISettings(UI_SETTINGS.maxTileCount);
|
|
13721
13632
|
maxTileCount = isMobile ? Math.min(maxTileCount, 6) : maxTileCount;
|
|
@@ -13723,7 +13634,7 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
|
|
|
13723
13634
|
peers,
|
|
13724
13635
|
maxTileCount
|
|
13725
13636
|
});
|
|
13726
|
-
const inputPeers = (0,
|
|
13637
|
+
const inputPeers = (0, import_react129.useMemo)(
|
|
13727
13638
|
() => pageList.length === 0 ? localPeer ? [localPeer] : [] : peers,
|
|
13728
13639
|
[pageList.length, peers, localPeer]
|
|
13729
13640
|
);
|
|
@@ -13736,14 +13647,14 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
|
|
|
13736
13647
|
maxTileCount,
|
|
13737
13648
|
edgeToEdge
|
|
13738
13649
|
});
|
|
13739
|
-
const [page, setPage] = (0,
|
|
13650
|
+
const [page, setPage] = (0, import_react129.useState)(0);
|
|
13740
13651
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13741
|
-
(0,
|
|
13652
|
+
(0, import_react129.useEffect)(() => {
|
|
13742
13653
|
if (pageSize > 0) {
|
|
13743
13654
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13744
13655
|
}
|
|
13745
13656
|
}, [pageSize, onPageSize]);
|
|
13746
|
-
return /* @__PURE__ */
|
|
13657
|
+
return /* @__PURE__ */ import_react129.default.createElement(Flex, { direction: "column", css: { flex: "1 1 0", h: "100%", position: "relative", minWidth: 0 } }, /* @__PURE__ */ import_react129.default.createElement(Grid, { tiles: pagesWithTiles[page], ref, edgeToEdge }), !edgeToEdge && /* @__PURE__ */ import_react129.default.createElement(
|
|
13747
13658
|
Pagination,
|
|
13748
13659
|
{
|
|
13749
13660
|
page,
|
|
@@ -13753,16 +13664,16 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
|
|
|
13753
13664
|
},
|
|
13754
13665
|
numPages: pagesWithTiles.length
|
|
13755
13666
|
}
|
|
13756
|
-
), isInsetEnabled && pageList.length > 0 && pageList[0][0].peer.id !== (localPeer == null ? void 0 : localPeer.id) && /* @__PURE__ */
|
|
13667
|
+
), isInsetEnabled && pageList.length > 0 && pageList[0][0].peer.id !== (localPeer == null ? void 0 : localPeer.id) && /* @__PURE__ */ import_react129.default.createElement(InsetTile, null));
|
|
13757
13668
|
}
|
|
13758
|
-
var
|
|
13669
|
+
var import_react129, import_react_use23, import_react_sdk69;
|
|
13759
13670
|
var init_EqualProminence = __esm({
|
|
13760
13671
|
"src/Prebuilt/components/VideoLayouts/EqualProminence.tsx"() {
|
|
13761
13672
|
"use strict";
|
|
13762
13673
|
init_define_process_env();
|
|
13763
|
-
|
|
13674
|
+
import_react129 = __toESM(require("react"));
|
|
13764
13675
|
import_react_use23 = require("react-use");
|
|
13765
|
-
|
|
13676
|
+
import_react_sdk69 = require("@100mslive/react-sdk");
|
|
13766
13677
|
init_Layout();
|
|
13767
13678
|
init_Theme();
|
|
13768
13679
|
init_InsetTile();
|
|
@@ -13775,16 +13686,16 @@ var init_EqualProminence = __esm({
|
|
|
13775
13686
|
});
|
|
13776
13687
|
|
|
13777
13688
|
// src/Prebuilt/components/VideoLayouts/ProminenceLayout.tsx
|
|
13778
|
-
var
|
|
13689
|
+
var import_react130, Root25, ProminentSection, SecondarySection, ProminenceLayout;
|
|
13779
13690
|
var init_ProminenceLayout = __esm({
|
|
13780
13691
|
"src/Prebuilt/components/VideoLayouts/ProminenceLayout.tsx"() {
|
|
13781
13692
|
"use strict";
|
|
13782
13693
|
init_define_process_env();
|
|
13783
|
-
|
|
13694
|
+
import_react130 = __toESM(require("react"));
|
|
13784
13695
|
init_Layout();
|
|
13785
13696
|
init_VideoTile2();
|
|
13786
13697
|
init_useVideoTileLayout();
|
|
13787
|
-
Root25 = ({ children, edgeToEdge }) => /* @__PURE__ */
|
|
13698
|
+
Root25 = ({ children, edgeToEdge }) => /* @__PURE__ */ import_react130.default.createElement(
|
|
13788
13699
|
Flex,
|
|
13789
13700
|
{
|
|
13790
13701
|
direction: "column",
|
|
@@ -13793,7 +13704,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13793
13704
|
children
|
|
13794
13705
|
);
|
|
13795
13706
|
ProminentSection = ({ children, css: css2 = {} }) => {
|
|
13796
|
-
return /* @__PURE__ */
|
|
13707
|
+
return /* @__PURE__ */ import_react130.default.createElement(Flex, { direction: "column", css: __spreadValues({ flex: "1 1 0", gap: "$2", minHeight: 0 }, css2) }, children);
|
|
13797
13708
|
};
|
|
13798
13709
|
SecondarySection = ({
|
|
13799
13710
|
tiles,
|
|
@@ -13804,12 +13715,12 @@ var init_ProminenceLayout = __esm({
|
|
|
13804
13715
|
if (!(tiles == null ? void 0 : tiles.length)) {
|
|
13805
13716
|
return null;
|
|
13806
13717
|
}
|
|
13807
|
-
return /* @__PURE__ */
|
|
13718
|
+
return /* @__PURE__ */ import_react130.default.createElement(
|
|
13808
13719
|
Box,
|
|
13809
13720
|
{
|
|
13810
13721
|
css: {
|
|
13811
13722
|
display: "grid",
|
|
13812
|
-
gridTemplateRows:
|
|
13723
|
+
gridTemplateRows: import_react130.default.Children.count(children) > 0 ? "136px auto" : "154px",
|
|
13813
13724
|
gridTemplateColumns: `repeat(${tiles.length}, minmax(0, 1fr))`,
|
|
13814
13725
|
margin: "0 auto",
|
|
13815
13726
|
gap: "$2 $4",
|
|
@@ -13819,7 +13730,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13819
13730
|
},
|
|
13820
13731
|
tiles.map((tile) => {
|
|
13821
13732
|
var _a7, _b7, _c, _d;
|
|
13822
|
-
return /* @__PURE__ */
|
|
13733
|
+
return /* @__PURE__ */ import_react130.default.createElement(
|
|
13823
13734
|
VideoTile_default,
|
|
13824
13735
|
__spreadValues({
|
|
13825
13736
|
key: ((_a7 = tile.track) == null ? void 0 : _a7.id) || ((_b7 = tile.peer) == null ? void 0 : _b7.id),
|
|
@@ -13836,7 +13747,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13836
13747
|
}, tileLayoutProps)
|
|
13837
13748
|
);
|
|
13838
13749
|
}),
|
|
13839
|
-
/* @__PURE__ */
|
|
13750
|
+
/* @__PURE__ */ import_react130.default.createElement(Box, { css: { gridColumn: `1/span ${tiles.length}` } }, children)
|
|
13840
13751
|
);
|
|
13841
13752
|
};
|
|
13842
13753
|
ProminenceLayout = {
|
|
@@ -13848,12 +13759,12 @@ var init_ProminenceLayout = __esm({
|
|
|
13848
13759
|
});
|
|
13849
13760
|
|
|
13850
13761
|
// src/Prebuilt/components/SecondaryTiles.tsx
|
|
13851
|
-
var
|
|
13762
|
+
var import_react131, import_react_use24, SecondaryTiles;
|
|
13852
13763
|
var init_SecondaryTiles = __esm({
|
|
13853
13764
|
"src/Prebuilt/components/SecondaryTiles.tsx"() {
|
|
13854
13765
|
"use strict";
|
|
13855
13766
|
init_define_process_env();
|
|
13856
|
-
|
|
13767
|
+
import_react131 = __toESM(require("react"));
|
|
13857
13768
|
import_react_use24 = require("react-use");
|
|
13858
13769
|
init_ProminenceLayout();
|
|
13859
13770
|
init_Theme();
|
|
@@ -13864,14 +13775,14 @@ var init_SecondaryTiles = __esm({
|
|
|
13864
13775
|
const isMobile = (0, import_react_use24.useMedia)(config.media.md);
|
|
13865
13776
|
const maxTileCount = isMobile ? 2 : 4;
|
|
13866
13777
|
const pagesWithTiles = usePagesWithTiles({ peers, maxTileCount });
|
|
13867
|
-
const [page, setPage] = (0,
|
|
13778
|
+
const [page, setPage] = (0, import_react131.useState)(0);
|
|
13868
13779
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13869
|
-
(0,
|
|
13780
|
+
(0, import_react131.useEffect)(() => {
|
|
13870
13781
|
if (pageSize > 0) {
|
|
13871
13782
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13872
13783
|
}
|
|
13873
13784
|
}, [pageSize, onPageSize]);
|
|
13874
|
-
return /* @__PURE__ */
|
|
13785
|
+
return /* @__PURE__ */ import_react131.default.createElement(ProminenceLayout.SecondarySection, { tiles: pagesWithTiles[page], edgeToEdge }, !edgeToEdge && /* @__PURE__ */ import_react131.default.createElement(
|
|
13875
13786
|
Pagination,
|
|
13876
13787
|
{
|
|
13877
13788
|
page,
|
|
@@ -13887,16 +13798,16 @@ var init_SecondaryTiles = __esm({
|
|
|
13887
13798
|
});
|
|
13888
13799
|
|
|
13889
13800
|
// src/Prebuilt/components/hooks/useRoleProminencePeers.tsx
|
|
13890
|
-
var
|
|
13801
|
+
var import_react132, useRoleProminencePeers;
|
|
13891
13802
|
var init_useRoleProminencePeers = __esm({
|
|
13892
13803
|
"src/Prebuilt/components/hooks/useRoleProminencePeers.tsx"() {
|
|
13893
13804
|
"use strict";
|
|
13894
13805
|
init_define_process_env();
|
|
13895
|
-
|
|
13806
|
+
import_react132 = require("react");
|
|
13896
13807
|
init_useUISettings();
|
|
13897
13808
|
useRoleProminencePeers = (prominentRoles, peers, isInsetEnabled) => {
|
|
13898
13809
|
const pinnedTrack = usePinnedTrack();
|
|
13899
|
-
const [prominentPeers, secondaryPeers] = (0,
|
|
13810
|
+
const [prominentPeers, secondaryPeers] = (0, import_react132.useMemo)(() => {
|
|
13900
13811
|
return peers.reduce(
|
|
13901
13812
|
(acc, peer) => {
|
|
13902
13813
|
if (pinnedTrack) {
|
|
@@ -13939,7 +13850,7 @@ function RoleProminence({
|
|
|
13939
13850
|
}) {
|
|
13940
13851
|
var _a7;
|
|
13941
13852
|
const { prominentPeers, secondaryPeers } = useRoleProminencePeers(prominentRoles, peers, isInsetEnabled);
|
|
13942
|
-
const localPeer = (0,
|
|
13853
|
+
const localPeer = (0, import_react_sdk70.useHMSStore)(import_react_sdk70.selectLocalPeer);
|
|
13943
13854
|
const maxTileCount = 4;
|
|
13944
13855
|
const pageList = usePagesWithTiles({
|
|
13945
13856
|
peers: prominentPeers,
|
|
@@ -13949,14 +13860,14 @@ function RoleProminence({
|
|
|
13949
13860
|
pageList,
|
|
13950
13861
|
maxTileCount
|
|
13951
13862
|
});
|
|
13952
|
-
const [page, setPage] = (0,
|
|
13863
|
+
const [page, setPage] = (0, import_react133.useState)(0);
|
|
13953
13864
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13954
|
-
(0,
|
|
13865
|
+
(0, import_react133.useEffect)(() => {
|
|
13955
13866
|
if (pageSize > 0) {
|
|
13956
13867
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13957
13868
|
}
|
|
13958
13869
|
}, [pageSize, onPageSize]);
|
|
13959
|
-
return /* @__PURE__ */
|
|
13870
|
+
return /* @__PURE__ */ import_react133.default.createElement(ProminenceLayout.Root, null, /* @__PURE__ */ import_react133.default.createElement(ProminenceLayout.ProminentSection, null, /* @__PURE__ */ import_react133.default.createElement(Grid, { ref, tiles: pagesWithTiles[page] })), !edgeToEdge && /* @__PURE__ */ import_react133.default.createElement(
|
|
13960
13871
|
Pagination,
|
|
13961
13872
|
{
|
|
13962
13873
|
page,
|
|
@@ -13966,15 +13877,15 @@ function RoleProminence({
|
|
|
13966
13877
|
},
|
|
13967
13878
|
numPages: pagesWithTiles.length
|
|
13968
13879
|
}
|
|
13969
|
-
), /* @__PURE__ */
|
|
13880
|
+
), /* @__PURE__ */ import_react133.default.createElement(SecondaryTiles, { peers: secondaryPeers, isInsetEnabled, edgeToEdge }), isInsetEnabled && localPeer && !prominentPeers.includes(localPeer) && /* @__PURE__ */ import_react133.default.createElement(InsetTile, null));
|
|
13970
13881
|
}
|
|
13971
|
-
var
|
|
13882
|
+
var import_react133, import_react_sdk70;
|
|
13972
13883
|
var init_RoleProminence = __esm({
|
|
13973
13884
|
"src/Prebuilt/components/VideoLayouts/RoleProminence.tsx"() {
|
|
13974
13885
|
"use strict";
|
|
13975
13886
|
init_define_process_env();
|
|
13976
|
-
|
|
13977
|
-
|
|
13887
|
+
import_react133 = __toESM(require("react"));
|
|
13888
|
+
import_react_sdk70 = require("@100mslive/react-sdk");
|
|
13978
13889
|
init_InsetTile();
|
|
13979
13890
|
init_Pagination2();
|
|
13980
13891
|
init_SecondaryTiles();
|
|
@@ -13986,20 +13897,20 @@ var init_RoleProminence = __esm({
|
|
|
13986
13897
|
});
|
|
13987
13898
|
|
|
13988
13899
|
// src/Prebuilt/components/ScreenshareDisplay.jsx
|
|
13989
|
-
var
|
|
13900
|
+
var import_react134, import_react_sdk71, import_react_icons59, ScreenshareDisplay;
|
|
13990
13901
|
var init_ScreenshareDisplay = __esm({
|
|
13991
13902
|
"src/Prebuilt/components/ScreenshareDisplay.jsx"() {
|
|
13992
13903
|
"use strict";
|
|
13993
13904
|
init_define_process_env();
|
|
13994
|
-
|
|
13995
|
-
|
|
13996
|
-
|
|
13905
|
+
import_react134 = __toESM(require("react"));
|
|
13906
|
+
import_react_sdk71 = require("@100mslive/react-sdk");
|
|
13907
|
+
import_react_icons59 = require("@100mslive/react-icons");
|
|
13997
13908
|
init_Button2();
|
|
13998
13909
|
init_Layout();
|
|
13999
13910
|
init_Text2();
|
|
14000
13911
|
ScreenshareDisplay = () => {
|
|
14001
|
-
const hmsActions = (0,
|
|
14002
|
-
return /* @__PURE__ */
|
|
13912
|
+
const hmsActions = (0, import_react_sdk71.useHMSActions)();
|
|
13913
|
+
return /* @__PURE__ */ import_react134.default.createElement(
|
|
14003
13914
|
Flex,
|
|
14004
13915
|
{
|
|
14005
13916
|
direction: "column",
|
|
@@ -14011,9 +13922,9 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14011
13922
|
color: "$on_surface_high"
|
|
14012
13923
|
}
|
|
14013
13924
|
},
|
|
14014
|
-
/* @__PURE__ */
|
|
14015
|
-
/* @__PURE__ */
|
|
14016
|
-
/* @__PURE__ */
|
|
13925
|
+
/* @__PURE__ */ import_react134.default.createElement(import_react_icons59.ShareScreenIcon, { width: 48, height: 48 }),
|
|
13926
|
+
/* @__PURE__ */ import_react134.default.createElement(Text, { variant: "h5", css: { m: "$8 0" } }, "You are sharing your screen"),
|
|
13927
|
+
/* @__PURE__ */ import_react134.default.createElement(
|
|
14017
13928
|
Button,
|
|
14018
13929
|
{
|
|
14019
13930
|
variant: "danger",
|
|
@@ -14023,7 +13934,7 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14023
13934
|
}),
|
|
14024
13935
|
"data-testid": "stop_screen_share_btn"
|
|
14025
13936
|
},
|
|
14026
|
-
/* @__PURE__ */
|
|
13937
|
+
/* @__PURE__ */ import_react134.default.createElement(import_react_icons59.CrossIcon, { width: 18, height: 18 }),
|
|
14027
13938
|
"\xA0 Stop screen share"
|
|
14028
13939
|
)
|
|
14029
13940
|
);
|
|
@@ -14032,16 +13943,16 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14032
13943
|
});
|
|
14033
13944
|
|
|
14034
13945
|
// src/Prebuilt/components/ScreenshareTile.jsx
|
|
14035
|
-
var
|
|
13946
|
+
var import_react135, import_react_use25, import_screenfull2, import_react_sdk72, import_react_icons60, labelStyles, Tile2, ScreenshareTile, ScreenshareTile_default;
|
|
14036
13947
|
var init_ScreenshareTile = __esm({
|
|
14037
13948
|
"src/Prebuilt/components/ScreenshareTile.jsx"() {
|
|
14038
13949
|
"use strict";
|
|
14039
13950
|
init_define_process_env();
|
|
14040
|
-
|
|
13951
|
+
import_react135 = __toESM(require("react"));
|
|
14041
13952
|
import_react_use25 = require("react-use");
|
|
14042
13953
|
import_screenfull2 = __toESM(require("screenfull"));
|
|
14043
|
-
|
|
14044
|
-
|
|
13954
|
+
import_react_sdk72 = require("@100mslive/react-sdk");
|
|
13955
|
+
import_react_icons60 = require("@100mslive/react-icons");
|
|
14045
13956
|
init_TileMenu2();
|
|
14046
13957
|
init_Stats2();
|
|
14047
13958
|
init_Video2();
|
|
@@ -14059,31 +13970,31 @@ var init_ScreenshareTile = __esm({
|
|
|
14059
13970
|
flexShrink: 0
|
|
14060
13971
|
};
|
|
14061
13972
|
Tile2 = ({ peerId, width = "100%", height = "100%" }) => {
|
|
14062
|
-
const isLocal = (0,
|
|
14063
|
-
const track = (0,
|
|
14064
|
-
const peer = (0,
|
|
13973
|
+
const isLocal = (0, import_react_sdk72.useHMSStore)(import_react_sdk72.selectLocalPeerID) === peerId;
|
|
13974
|
+
const track = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareByPeerID)(peerId));
|
|
13975
|
+
const peer = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectPeerByID)(peerId));
|
|
14065
13976
|
const isAudioOnly = useUISettings(UI_SETTINGS.isAudioOnly);
|
|
14066
|
-
const [isMouseHovered, setIsMouseHovered] = (0,
|
|
13977
|
+
const [isMouseHovered, setIsMouseHovered] = (0, import_react135.useState)(false);
|
|
14067
13978
|
const showStatsOnTiles = useUISettings(UI_SETTINGS.showStatsOnTiles);
|
|
14068
13979
|
const label = getVideoTileLabel({
|
|
14069
13980
|
peerName: peer.name,
|
|
14070
13981
|
isLocal: false,
|
|
14071
13982
|
track
|
|
14072
13983
|
});
|
|
14073
|
-
const fullscreenRef = (0,
|
|
14074
|
-
const [fullscreen, setFullscreen] = (0,
|
|
13984
|
+
const fullscreenRef = (0, import_react135.useRef)(null);
|
|
13985
|
+
const [fullscreen, setFullscreen] = (0, import_react135.useState)(false);
|
|
14075
13986
|
const isFullscreen = (0, import_react_use25.useFullscreen)(fullscreenRef, fullscreen, {
|
|
14076
13987
|
onClose: () => setFullscreen(false)
|
|
14077
13988
|
});
|
|
14078
13989
|
const isFullScreenSupported = import_screenfull2.default.isEnabled;
|
|
14079
|
-
const audioTrack = (0,
|
|
13990
|
+
const audioTrack = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareAudioByPeerID)(peer == null ? void 0 : peer.id));
|
|
14080
13991
|
if (isLocal && !["browser", "window", "application"].includes(track == null ? void 0 : track.displaySurface)) {
|
|
14081
|
-
return /* @__PURE__ */
|
|
13992
|
+
return /* @__PURE__ */ import_react135.default.createElement(ScreenshareDisplay, null);
|
|
14082
13993
|
}
|
|
14083
13994
|
if (!peer) {
|
|
14084
13995
|
return null;
|
|
14085
13996
|
}
|
|
14086
|
-
return /* @__PURE__ */
|
|
13997
|
+
return /* @__PURE__ */ import_react135.default.createElement(StyledVideoTile.Root, { css: { width, height, p: 0, minHeight: 0 }, "data-testid": "screenshare_tile" }, /* @__PURE__ */ import_react135.default.createElement(
|
|
14087
13998
|
StyledVideoTile.Container,
|
|
14088
13999
|
{
|
|
14089
14000
|
transparentBg: true,
|
|
@@ -14094,9 +14005,9 @@ var init_ScreenshareTile = __esm({
|
|
|
14094
14005
|
setIsMouseHovered(false);
|
|
14095
14006
|
}
|
|
14096
14007
|
},
|
|
14097
|
-
showStatsOnTiles ? /* @__PURE__ */
|
|
14098
|
-
isFullScreenSupported && isMouseHovered ? /* @__PURE__ */
|
|
14099
|
-
track ? /* @__PURE__ */
|
|
14008
|
+
showStatsOnTiles ? /* @__PURE__ */ import_react135.default.createElement(VideoTileStats, { audioTrackID: audioTrack == null ? void 0 : audioTrack.id, videoTrackID: track == null ? void 0 : track.id, peerID: peerId, isLocal }) : null,
|
|
14009
|
+
isFullScreenSupported && isMouseHovered ? /* @__PURE__ */ import_react135.default.createElement(StyledVideoTile.FullScreenButton, { onClick: () => setFullscreen(!fullscreen) }, isFullscreen ? /* @__PURE__ */ import_react135.default.createElement(import_react_icons60.ShrinkIcon, null) : /* @__PURE__ */ import_react135.default.createElement(import_react_icons60.ExpandIcon, null)) : null,
|
|
14010
|
+
track ? /* @__PURE__ */ import_react135.default.createElement(
|
|
14100
14011
|
Video,
|
|
14101
14012
|
{
|
|
14102
14013
|
screenShare: true,
|
|
@@ -14106,24 +14017,24 @@ var init_ScreenshareTile = __esm({
|
|
|
14106
14017
|
css: { minHeight: 0 }
|
|
14107
14018
|
}
|
|
14108
14019
|
) : null,
|
|
14109
|
-
/* @__PURE__ */
|
|
14110
|
-
isMouseHovered && !(peer == null ? void 0 : peer.isLocal) ? /* @__PURE__ */
|
|
14020
|
+
/* @__PURE__ */ import_react135.default.createElement(StyledVideoTile.Info, { css: labelStyles }, label),
|
|
14021
|
+
isMouseHovered && !(peer == null ? void 0 : peer.isLocal) ? /* @__PURE__ */ import_react135.default.createElement(TileMenu_default, { isScreenshare: true, peerID: peer == null ? void 0 : peer.id, audioTrackID: audioTrack == null ? void 0 : audioTrack.id, videoTrackID: track == null ? void 0 : track.id }) : null
|
|
14111
14022
|
));
|
|
14112
14023
|
};
|
|
14113
|
-
ScreenshareTile =
|
|
14024
|
+
ScreenshareTile = import_react135.default.memo(Tile2);
|
|
14114
14025
|
ScreenshareTile_default = ScreenshareTile;
|
|
14115
14026
|
}
|
|
14116
14027
|
});
|
|
14117
14028
|
|
|
14118
14029
|
// src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx
|
|
14119
|
-
var
|
|
14030
|
+
var import_react136, import_react_use26, import_react_sdk73, ScreenshareLayout;
|
|
14120
14031
|
var init_ScreenshareLayout = __esm({
|
|
14121
14032
|
"src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx"() {
|
|
14122
14033
|
"use strict";
|
|
14123
14034
|
init_define_process_env();
|
|
14124
|
-
|
|
14035
|
+
import_react136 = __toESM(require("react"));
|
|
14125
14036
|
import_react_use26 = require("react-use");
|
|
14126
|
-
|
|
14037
|
+
import_react_sdk73 = require("@100mslive/react-sdk");
|
|
14127
14038
|
init_Theme();
|
|
14128
14039
|
init_Pagination2();
|
|
14129
14040
|
init_ScreenshareTile();
|
|
@@ -14133,22 +14044,22 @@ var init_ScreenshareLayout = __esm({
|
|
|
14133
14044
|
init_constants();
|
|
14134
14045
|
ScreenshareLayout = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
|
|
14135
14046
|
var _a7;
|
|
14136
|
-
const peersSharing = (0,
|
|
14047
|
+
const peersSharing = (0, import_react_sdk73.useHMSStore)(import_react_sdk73.selectPeersScreenSharing);
|
|
14137
14048
|
const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
|
|
14138
|
-
const [page, setPage] = (0,
|
|
14049
|
+
const [page, setPage] = (0, import_react136.useState)(0);
|
|
14139
14050
|
const activeSharePeer = peersSharing[page];
|
|
14140
14051
|
const isMobile = (0, import_react_use26.useMedia)(config.media.md);
|
|
14141
|
-
const secondaryPeers = (0,
|
|
14052
|
+
const secondaryPeers = (0, import_react136.useMemo)(
|
|
14142
14053
|
() => isMobile ? activeSharePeer ? [activeSharePeer, ...peers.filter((p) => p.id !== (activeSharePeer == null ? void 0 : activeSharePeer.id))] : peers : peers.filter((p) => p.id !== (activeSharePeer == null ? void 0 : activeSharePeer.id)),
|
|
14143
14054
|
[activeSharePeer, peers, isMobile]
|
|
14144
14055
|
);
|
|
14145
|
-
(0,
|
|
14056
|
+
(0, import_react136.useEffect)(() => {
|
|
14146
14057
|
setActiveScreenSharePeer(isMobile ? "" : activeSharePeer == null ? void 0 : activeSharePeer.id);
|
|
14147
14058
|
return () => {
|
|
14148
14059
|
setActiveScreenSharePeer("");
|
|
14149
14060
|
};
|
|
14150
14061
|
}, [activeSharePeer == null ? void 0 : activeSharePeer.id, isMobile, setActiveScreenSharePeer]);
|
|
14151
|
-
return /* @__PURE__ */
|
|
14062
|
+
return /* @__PURE__ */ import_react136.default.createElement(ProminenceLayout.Root, { edgeToEdge }, /* @__PURE__ */ import_react136.default.createElement(ProminenceLayout.ProminentSection, null, /* @__PURE__ */ import_react136.default.createElement(ScreenshareTile_default, { peerId: (_a7 = peersSharing[page]) == null ? void 0 : _a7.id }), !edgeToEdge && /* @__PURE__ */ import_react136.default.createElement(Pagination, { page, onPageChange: setPage, numPages: peersSharing.length })), /* @__PURE__ */ import_react136.default.createElement(
|
|
14152
14063
|
SecondaryTiles,
|
|
14153
14064
|
{
|
|
14154
14065
|
peers: secondaryPeers,
|
|
@@ -14162,12 +14073,12 @@ var init_ScreenshareLayout = __esm({
|
|
|
14162
14073
|
});
|
|
14163
14074
|
|
|
14164
14075
|
// src/Prebuilt/common/PeersSorter.ts
|
|
14165
|
-
var
|
|
14076
|
+
var import_react_sdk74, PeersSorter, PeersSorter_default;
|
|
14166
14077
|
var init_PeersSorter = __esm({
|
|
14167
14078
|
"src/Prebuilt/common/PeersSorter.ts"() {
|
|
14168
14079
|
"use strict";
|
|
14169
14080
|
init_define_process_env();
|
|
14170
|
-
|
|
14081
|
+
import_react_sdk74 = require("@100mslive/react-sdk");
|
|
14171
14082
|
PeersSorter = class {
|
|
14172
14083
|
constructor(store) {
|
|
14173
14084
|
this.storeUnsubscribe = void 0;
|
|
@@ -14188,7 +14099,7 @@ var init_PeersSorter = __esm({
|
|
|
14188
14099
|
}
|
|
14189
14100
|
});
|
|
14190
14101
|
if (!this.storeUnsubscribe) {
|
|
14191
|
-
this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange,
|
|
14102
|
+
this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange, import_react_sdk74.selectDominantSpeaker);
|
|
14192
14103
|
}
|
|
14193
14104
|
this.moveSpeakerToFront(this.speaker);
|
|
14194
14105
|
};
|
|
@@ -14251,13 +14162,13 @@ var init_PeersSorter = __esm({
|
|
|
14251
14162
|
});
|
|
14252
14163
|
|
|
14253
14164
|
// src/Prebuilt/components/VideoLayouts/GridLayout.tsx
|
|
14254
|
-
var
|
|
14165
|
+
var import_react137, import_react_sdk75, GridLayout;
|
|
14255
14166
|
var init_GridLayout = __esm({
|
|
14256
14167
|
"src/Prebuilt/components/VideoLayouts/GridLayout.tsx"() {
|
|
14257
14168
|
"use strict";
|
|
14258
14169
|
init_define_process_env();
|
|
14259
|
-
|
|
14260
|
-
|
|
14170
|
+
import_react137 = __toESM(require("react"));
|
|
14171
|
+
import_react_sdk75 = require("@100mslive/react-sdk");
|
|
14261
14172
|
init_EqualProminence();
|
|
14262
14173
|
init_RoleProminence();
|
|
14263
14174
|
init_ScreenshareLayout();
|
|
@@ -14275,23 +14186,23 @@ var init_GridLayout = __esm({
|
|
|
14275
14186
|
edge_to_edge = false,
|
|
14276
14187
|
hide_metadata_on_tile = false
|
|
14277
14188
|
}) => {
|
|
14278
|
-
const peerSharing = (0,
|
|
14189
|
+
const peerSharing = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeerScreenSharing);
|
|
14279
14190
|
const pinnedTrack = usePinnedTrack();
|
|
14280
|
-
const peers = (0,
|
|
14191
|
+
const peers = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeers);
|
|
14281
14192
|
const isRoleProminence = prominentRoles.length && peers.some(
|
|
14282
14193
|
(peer) => peer.roleName && prominentRoles.includes(peer.roleName) && (peer.videoTrack || peer.audioTrack)
|
|
14283
14194
|
) || pinnedTrack;
|
|
14284
|
-
const updatedPeers = (0,
|
|
14195
|
+
const updatedPeers = (0, import_react137.useMemo)(() => {
|
|
14285
14196
|
if (isInsetEnabled && !isRoleProminence && !peerSharing) {
|
|
14286
14197
|
return peers.filter((peer) => !peer.isLocal);
|
|
14287
14198
|
}
|
|
14288
14199
|
return peers;
|
|
14289
14200
|
}, [isInsetEnabled, isRoleProminence, peerSharing, peers]);
|
|
14290
|
-
const vanillaStore = (0,
|
|
14291
|
-
const [sortedPeers, setSortedPeers] = (0,
|
|
14292
|
-
const peersSorter = (0,
|
|
14293
|
-
const [pageSize, setPageSize] = (0,
|
|
14294
|
-
const [mainPage, setMainPage] = (0,
|
|
14201
|
+
const vanillaStore = (0, import_react_sdk75.useHMSVanillaStore)();
|
|
14202
|
+
const [sortedPeers, setSortedPeers] = (0, import_react137.useState)(updatedPeers);
|
|
14203
|
+
const peersSorter = (0, import_react137.useMemo)(() => new PeersSorter_default(vanillaStore), [vanillaStore]);
|
|
14204
|
+
const [pageSize, setPageSize] = (0, import_react137.useState)(0);
|
|
14205
|
+
const [mainPage, setMainPage] = (0, import_react137.useState)(0);
|
|
14295
14206
|
const tileLayout = {
|
|
14296
14207
|
enableSpotlightingPeer: enable_spotlighting_peer,
|
|
14297
14208
|
hideParticipantNameOnTile: hide_participant_name_on_tile,
|
|
@@ -14300,7 +14211,7 @@ var init_GridLayout = __esm({
|
|
|
14300
14211
|
hideMetadataOnTile: hide_metadata_on_tile,
|
|
14301
14212
|
objectFit: video_object_fit
|
|
14302
14213
|
};
|
|
14303
|
-
(0,
|
|
14214
|
+
(0, import_react137.useEffect)(() => {
|
|
14304
14215
|
if (mainPage !== 0) {
|
|
14305
14216
|
return;
|
|
14306
14217
|
}
|
|
@@ -14311,7 +14222,7 @@ var init_GridLayout = __esm({
|
|
|
14311
14222
|
peersSorter.onUpdate(setSortedPeers);
|
|
14312
14223
|
}, [mainPage, peersSorter, updatedPeers, pageSize]);
|
|
14313
14224
|
if (peerSharing) {
|
|
14314
|
-
return /* @__PURE__ */
|
|
14225
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14315
14226
|
ScreenshareLayout,
|
|
14316
14227
|
{
|
|
14317
14228
|
peers: sortedPeers,
|
|
@@ -14321,7 +14232,7 @@ var init_GridLayout = __esm({
|
|
|
14321
14232
|
}
|
|
14322
14233
|
));
|
|
14323
14234
|
} else if (isRoleProminence) {
|
|
14324
|
-
return /* @__PURE__ */
|
|
14235
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14325
14236
|
RoleProminence,
|
|
14326
14237
|
{
|
|
14327
14238
|
peers: sortedPeers,
|
|
@@ -14333,7 +14244,7 @@ var init_GridLayout = __esm({
|
|
|
14333
14244
|
}
|
|
14334
14245
|
));
|
|
14335
14246
|
}
|
|
14336
|
-
return /* @__PURE__ */
|
|
14247
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14337
14248
|
EqualProminence,
|
|
14338
14249
|
{
|
|
14339
14250
|
peers: sortedPeers,
|
|
@@ -14348,50 +14259,50 @@ var init_GridLayout = __esm({
|
|
|
14348
14259
|
});
|
|
14349
14260
|
|
|
14350
14261
|
// src/Prebuilt/layouts/EmbedView.jsx
|
|
14351
|
-
var
|
|
14262
|
+
var import_react138, import_react_sdk76, EmbedView, EmbebScreenShareView, EmbedComponent;
|
|
14352
14263
|
var init_EmbedView = __esm({
|
|
14353
14264
|
"src/Prebuilt/layouts/EmbedView.jsx"() {
|
|
14354
14265
|
"use strict";
|
|
14355
14266
|
init_define_process_env();
|
|
14356
|
-
|
|
14357
|
-
|
|
14267
|
+
import_react138 = __toESM(require("react"));
|
|
14268
|
+
import_react_sdk76 = require("@100mslive/react-sdk");
|
|
14358
14269
|
init_SecondaryTiles();
|
|
14359
14270
|
init_ProminenceLayout();
|
|
14360
14271
|
init_Layout();
|
|
14361
14272
|
init_useUISettings();
|
|
14362
14273
|
init_constants();
|
|
14363
14274
|
EmbedView = () => {
|
|
14364
|
-
return /* @__PURE__ */
|
|
14275
|
+
return /* @__PURE__ */ import_react138.default.createElement(EmbebScreenShareView, null, /* @__PURE__ */ import_react138.default.createElement(EmbedComponent, null));
|
|
14365
14276
|
};
|
|
14366
14277
|
EmbebScreenShareView = ({ children }) => {
|
|
14367
|
-
const peers = (0,
|
|
14368
|
-
const peerPresenting = (0,
|
|
14278
|
+
const peers = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeers);
|
|
14279
|
+
const peerPresenting = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeerScreenSharing);
|
|
14369
14280
|
const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
|
|
14370
|
-
const smallTilePeers = (0,
|
|
14281
|
+
const smallTilePeers = (0, import_react138.useMemo)(() => {
|
|
14371
14282
|
const smallTilePeers2 = peers.filter((peer) => peer.id !== (peerPresenting == null ? void 0 : peerPresenting.id));
|
|
14372
14283
|
return smallTilePeers2;
|
|
14373
14284
|
}, [peers, peerPresenting]);
|
|
14374
|
-
(0,
|
|
14285
|
+
(0, import_react138.useEffect)(() => {
|
|
14375
14286
|
setActiveScreenSharePeer(peerPresenting == null ? void 0 : peerPresenting.id);
|
|
14376
14287
|
return () => {
|
|
14377
14288
|
setActiveScreenSharePeer("");
|
|
14378
14289
|
};
|
|
14379
14290
|
}, [peerPresenting == null ? void 0 : peerPresenting.id, setActiveScreenSharePeer]);
|
|
14380
|
-
return /* @__PURE__ */
|
|
14291
|
+
return /* @__PURE__ */ import_react138.default.createElement(ProminenceLayout.Root, null, /* @__PURE__ */ import_react138.default.createElement(ProminenceLayout.ProminentSection, null, children), /* @__PURE__ */ import_react138.default.createElement(SecondaryTiles, { peers: smallTilePeers }));
|
|
14381
14292
|
};
|
|
14382
14293
|
EmbedComponent = () => {
|
|
14383
|
-
const { amIScreenSharing, toggleScreenShare } = (0,
|
|
14294
|
+
const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk76.useScreenShare)(import_react_sdk76.throwErrorHandler);
|
|
14384
14295
|
const [embedConfig, setEmbedConfig] = useSetAppDataByKey(APP_DATA.embedConfig);
|
|
14385
|
-
const [wasScreenShared, setWasScreenShared] = (0,
|
|
14386
|
-
const screenShareAttemptInProgress = (0,
|
|
14296
|
+
const [wasScreenShared, setWasScreenShared] = (0, import_react138.useState)(false);
|
|
14297
|
+
const screenShareAttemptInProgress = (0, import_react138.useRef)(false);
|
|
14387
14298
|
const src = embedConfig.url;
|
|
14388
|
-
const iframeRef = (0,
|
|
14389
|
-
const resetEmbedConfig = (0,
|
|
14299
|
+
const iframeRef = (0, import_react138.useRef)();
|
|
14300
|
+
const resetEmbedConfig = (0, import_react138.useCallback)(() => {
|
|
14390
14301
|
if (src) {
|
|
14391
14302
|
setEmbedConfig({ url: "" });
|
|
14392
14303
|
}
|
|
14393
14304
|
}, [src, setEmbedConfig]);
|
|
14394
|
-
(0,
|
|
14305
|
+
(0, import_react138.useEffect)(() => {
|
|
14395
14306
|
if (embedConfig.shareScreen && !amIScreenSharing && !wasScreenShared && !screenShareAttemptInProgress.current) {
|
|
14396
14307
|
screenShareAttemptInProgress.current = true;
|
|
14397
14308
|
toggleScreenShare({
|
|
@@ -14404,7 +14315,7 @@ var init_EmbedView = __esm({
|
|
|
14404
14315
|
});
|
|
14405
14316
|
}
|
|
14406
14317
|
}, []);
|
|
14407
|
-
(0,
|
|
14318
|
+
(0, import_react138.useEffect)(() => {
|
|
14408
14319
|
if (wasScreenShared && !amIScreenSharing) {
|
|
14409
14320
|
resetEmbedConfig();
|
|
14410
14321
|
}
|
|
@@ -14415,7 +14326,7 @@ var init_EmbedView = __esm({
|
|
|
14415
14326
|
}
|
|
14416
14327
|
};
|
|
14417
14328
|
}, [wasScreenShared, amIScreenSharing, resetEmbedConfig, toggleScreenShare]);
|
|
14418
|
-
return /* @__PURE__ */
|
|
14329
|
+
return /* @__PURE__ */ import_react138.default.createElement(Box, { ref: iframeRef, css: { size: "100%" } }, /* @__PURE__ */ import_react138.default.createElement(
|
|
14419
14330
|
"iframe",
|
|
14420
14331
|
{
|
|
14421
14332
|
src,
|
|
@@ -14430,38 +14341,38 @@ var init_EmbedView = __esm({
|
|
|
14430
14341
|
});
|
|
14431
14342
|
|
|
14432
14343
|
// src/Prebuilt/layouts/PDFView.jsx
|
|
14433
|
-
var
|
|
14344
|
+
var import_react139, import_react_sdk77, PDFView, PDFEmbedComponent;
|
|
14434
14345
|
var init_PDFView = __esm({
|
|
14435
14346
|
"src/Prebuilt/layouts/PDFView.jsx"() {
|
|
14436
14347
|
"use strict";
|
|
14437
14348
|
init_define_process_env();
|
|
14438
|
-
|
|
14439
|
-
|
|
14349
|
+
import_react139 = __toESM(require("react"));
|
|
14350
|
+
import_react_sdk77 = require("@100mslive/react-sdk");
|
|
14440
14351
|
init_Layout();
|
|
14441
14352
|
init_Theme();
|
|
14442
14353
|
init_EmbedView();
|
|
14443
14354
|
init_useUISettings();
|
|
14444
14355
|
init_constants();
|
|
14445
14356
|
PDFView = () => {
|
|
14446
|
-
return /* @__PURE__ */
|
|
14357
|
+
return /* @__PURE__ */ import_react139.default.createElement(EmbebScreenShareView, null, /* @__PURE__ */ import_react139.default.createElement(PDFEmbedComponent, null));
|
|
14447
14358
|
};
|
|
14448
14359
|
PDFEmbedComponent = () => {
|
|
14449
|
-
const ref = (0,
|
|
14360
|
+
const ref = (0, import_react139.useRef)();
|
|
14450
14361
|
const themeType = useTheme().themeType;
|
|
14451
|
-
const [isPDFLoaded, setIsPDFLoaded] = (0,
|
|
14362
|
+
const [isPDFLoaded, setIsPDFLoaded] = (0, import_react139.useState)(false);
|
|
14452
14363
|
let pdfJSURL = define_process_env_default.REACT_APP_PDFJS_IFRAME_URL;
|
|
14453
|
-
const { amIScreenSharing, toggleScreenShare } = (0,
|
|
14364
|
+
const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk77.useScreenShare)(import_react_sdk77.throwErrorHandler);
|
|
14454
14365
|
const [pdfConfig, setPDFConfig] = useSetAppDataByKey(APP_DATA.pdfConfig);
|
|
14455
14366
|
if (pdfConfig.url && !pdfConfig.file) {
|
|
14456
14367
|
pdfJSURL = pdfJSURL + "?file=" + encodeURIComponent(pdfConfig.url);
|
|
14457
14368
|
}
|
|
14458
|
-
const [wasScreenShared, setWasScreenShared] = (0,
|
|
14459
|
-
const screenShareAttemptInProgress = (0,
|
|
14460
|
-
const iframeRef = (0,
|
|
14461
|
-
const resetEmbedConfig = (0,
|
|
14369
|
+
const [wasScreenShared, setWasScreenShared] = (0, import_react139.useState)(false);
|
|
14370
|
+
const screenShareAttemptInProgress = (0, import_react139.useRef)(false);
|
|
14371
|
+
const iframeRef = (0, import_react139.useRef)();
|
|
14372
|
+
const resetEmbedConfig = (0, import_react139.useCallback)(() => {
|
|
14462
14373
|
setPDFConfig({ state: false });
|
|
14463
14374
|
}, [setPDFConfig]);
|
|
14464
|
-
(0,
|
|
14375
|
+
(0, import_react139.useEffect)(() => {
|
|
14465
14376
|
if (isPDFLoaded && ref.current) {
|
|
14466
14377
|
ref.current.contentWindow.postMessage(
|
|
14467
14378
|
{
|
|
@@ -14471,7 +14382,7 @@ var init_PDFView = __esm({
|
|
|
14471
14382
|
);
|
|
14472
14383
|
}
|
|
14473
14384
|
}, [isPDFLoaded, themeType]);
|
|
14474
|
-
(0,
|
|
14385
|
+
(0, import_react139.useEffect)(() => {
|
|
14475
14386
|
if (!amIScreenSharing && !wasScreenShared && !screenShareAttemptInProgress.current) {
|
|
14476
14387
|
screenShareAttemptInProgress.current = true;
|
|
14477
14388
|
toggleScreenShare({
|
|
@@ -14485,7 +14396,7 @@ var init_PDFView = __esm({
|
|
|
14485
14396
|
});
|
|
14486
14397
|
}
|
|
14487
14398
|
}, []);
|
|
14488
|
-
(0,
|
|
14399
|
+
(0, import_react139.useEffect)(() => {
|
|
14489
14400
|
if (wasScreenShared && !amIScreenSharing) {
|
|
14490
14401
|
resetEmbedConfig();
|
|
14491
14402
|
}
|
|
@@ -14496,7 +14407,7 @@ var init_PDFView = __esm({
|
|
|
14496
14407
|
}
|
|
14497
14408
|
};
|
|
14498
14409
|
}, [wasScreenShared, amIScreenSharing, resetEmbedConfig, toggleScreenShare]);
|
|
14499
|
-
return /* @__PURE__ */
|
|
14410
|
+
return /* @__PURE__ */ import_react139.default.createElement(Box, { ref: iframeRef, css: { size: "100%" } }, /* @__PURE__ */ import_react139.default.createElement(
|
|
14500
14411
|
"iframe",
|
|
14501
14412
|
{
|
|
14502
14413
|
src: pdfJSURL,
|
|
@@ -14539,25 +14450,25 @@ var init_empty_chat = __esm({
|
|
|
14539
14450
|
});
|
|
14540
14451
|
|
|
14541
14452
|
// src/Prebuilt/components/hooks/useSetPinnedMessage.js
|
|
14542
|
-
var
|
|
14453
|
+
var import_react140, import_react_sdk78, useSetPinnedMessage;
|
|
14543
14454
|
var init_useSetPinnedMessage = __esm({
|
|
14544
14455
|
"src/Prebuilt/components/hooks/useSetPinnedMessage.js"() {
|
|
14545
14456
|
"use strict";
|
|
14546
14457
|
init_define_process_env();
|
|
14547
|
-
|
|
14548
|
-
|
|
14458
|
+
import_react140 = require("react");
|
|
14459
|
+
import_react_sdk78 = require("@100mslive/react-sdk");
|
|
14549
14460
|
init_ToastManager();
|
|
14550
14461
|
init_constants();
|
|
14551
14462
|
useSetPinnedMessage = () => {
|
|
14552
|
-
const hmsActions = (0,
|
|
14553
|
-
const vanillaStore = (0,
|
|
14554
|
-
const pinnedMessage = (0,
|
|
14555
|
-
const setPinnedMessage = (0,
|
|
14463
|
+
const hmsActions = (0, import_react_sdk78.useHMSActions)();
|
|
14464
|
+
const vanillaStore = (0, import_react_sdk78.useHMSVanillaStore)();
|
|
14465
|
+
const pinnedMessage = (0, import_react_sdk78.useHMSStore)(import_react_sdk78.selectSessionMetadata);
|
|
14466
|
+
const setPinnedMessage = (0, import_react140.useCallback)(
|
|
14556
14467
|
/**
|
|
14557
14468
|
* @param {import("@100mslive/react-sdk").HMSMessage | undefined} message
|
|
14558
14469
|
*/
|
|
14559
14470
|
(message) => __async(void 0, null, function* () {
|
|
14560
|
-
const peerName = vanillaStore.getState((0,
|
|
14471
|
+
const peerName = vanillaStore.getState((0, import_react_sdk78.selectPeerNameByID)(message == null ? void 0 : message.sender)) || (message == null ? void 0 : message.senderName);
|
|
14561
14472
|
const newPinnedMessage = message ? peerName ? `${peerName}: ${message.message}` : message.message : null;
|
|
14562
14473
|
if (newPinnedMessage !== pinnedMessage) {
|
|
14563
14474
|
yield hmsActions.sessionStore.set(SESSION_STORE_KEY.PINNED_MESSAGE, newPinnedMessage).catch((err) => ToastManager.addToast({ title: err.description }));
|
|
@@ -14571,18 +14482,18 @@ var init_useSetPinnedMessage = __esm({
|
|
|
14571
14482
|
});
|
|
14572
14483
|
|
|
14573
14484
|
// src/Prebuilt/components/Chat/ChatBody.jsx
|
|
14574
|
-
var
|
|
14485
|
+
var import_react141, import_react_intersection_observer, import_react_use27, import_react_virtualized_auto_sizer, import_react_window2, import_react_sdk79, import_react_icons61, formatTime2, MessageTypeContainer, MessageType, URL_REGEX, Link3, AnnotisedMessage, getMessageType, ChatActions, SenderName, ChatMessage, ChatList, VirtualizedChatMessages, ChatBody;
|
|
14575
14486
|
var init_ChatBody = __esm({
|
|
14576
14487
|
"src/Prebuilt/components/Chat/ChatBody.jsx"() {
|
|
14577
14488
|
"use strict";
|
|
14578
14489
|
init_define_process_env();
|
|
14579
|
-
|
|
14490
|
+
import_react141 = __toESM(require("react"));
|
|
14580
14491
|
import_react_intersection_observer = require("react-intersection-observer");
|
|
14581
14492
|
import_react_use27 = require("react-use");
|
|
14582
14493
|
import_react_virtualized_auto_sizer = __toESM(require("react-virtualized-auto-sizer"));
|
|
14583
14494
|
import_react_window2 = require("react-window");
|
|
14584
|
-
|
|
14585
|
-
|
|
14495
|
+
import_react_sdk79 = require("@100mslive/react-sdk");
|
|
14496
|
+
import_react_icons61 = require("@100mslive/react-icons");
|
|
14586
14497
|
init_Dropdown2();
|
|
14587
14498
|
init_IconButton2();
|
|
14588
14499
|
init_Layout();
|
|
@@ -14608,7 +14519,7 @@ var init_ChatBody = __esm({
|
|
|
14608
14519
|
return `${hours}:${mins} ${suffix}`;
|
|
14609
14520
|
};
|
|
14610
14521
|
MessageTypeContainer = ({ left, right }) => {
|
|
14611
|
-
return /* @__PURE__ */
|
|
14522
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14612
14523
|
Flex,
|
|
14613
14524
|
{
|
|
14614
14525
|
align: "center",
|
|
@@ -14620,16 +14531,16 @@ var init_ChatBody = __esm({
|
|
|
14620
14531
|
r: "$0"
|
|
14621
14532
|
}
|
|
14622
14533
|
},
|
|
14623
|
-
left && /* @__PURE__ */
|
|
14624
|
-
left && right && /* @__PURE__ */
|
|
14625
|
-
right && /* @__PURE__ */
|
|
14534
|
+
left && /* @__PURE__ */ import_react141.default.createElement(SenderName, { variant: "tiny", as: "span", css: { color: "$on_surface_medium" } }, left),
|
|
14535
|
+
left && right && /* @__PURE__ */ import_react141.default.createElement(Box, { css: { borderLeft: "1px solid $border_bright", mx: "$4", h: "$8" } }),
|
|
14536
|
+
right && /* @__PURE__ */ import_react141.default.createElement(SenderName, { as: "span", variant: "tiny", css: { textTransform: "uppercase" } }, right)
|
|
14626
14537
|
);
|
|
14627
14538
|
};
|
|
14628
14539
|
MessageType = ({ roles, hasCurrentUserSent, receiver }) => {
|
|
14629
|
-
const peerName = (0,
|
|
14630
|
-
const localPeerRoleName = (0,
|
|
14540
|
+
const peerName = (0, import_react_sdk79.useHMSStore)((0, import_react_sdk79.selectPeerNameByID)(receiver));
|
|
14541
|
+
const localPeerRoleName = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerRoleName);
|
|
14631
14542
|
if (receiver) {
|
|
14632
|
-
return /* @__PURE__ */
|
|
14543
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14633
14544
|
MessageTypeContainer,
|
|
14634
14545
|
{
|
|
14635
14546
|
left: hasCurrentUserSent ? `${peerName ? `TO ${peerName}` : ""}` : "TO YOU",
|
|
@@ -14638,7 +14549,7 @@ var init_ChatBody = __esm({
|
|
|
14638
14549
|
);
|
|
14639
14550
|
}
|
|
14640
14551
|
if (roles && roles.length) {
|
|
14641
|
-
return /* @__PURE__ */
|
|
14552
|
+
return /* @__PURE__ */ import_react141.default.createElement(MessageTypeContainer, { left: "TO", right: hasCurrentUserSent ? roles.join(",") : localPeerRoleName });
|
|
14642
14553
|
}
|
|
14643
14554
|
return null;
|
|
14644
14555
|
};
|
|
@@ -14652,10 +14563,10 @@ var init_ChatBody = __esm({
|
|
|
14652
14563
|
});
|
|
14653
14564
|
AnnotisedMessage = ({ message }) => {
|
|
14654
14565
|
if (!message) {
|
|
14655
|
-
return /* @__PURE__ */
|
|
14566
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null);
|
|
14656
14567
|
}
|
|
14657
|
-
return /* @__PURE__ */
|
|
14658
|
-
(part) => URL_REGEX.test(part) ? /* @__PURE__ */
|
|
14568
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null, message.trim().split(/(\s)/).map(
|
|
14569
|
+
(part) => URL_REGEX.test(part) ? /* @__PURE__ */ import_react141.default.createElement(Link3, { href: part, key: part, target: "_blank", rel: "noopener noreferrer" }, part) : part
|
|
14659
14570
|
));
|
|
14660
14571
|
};
|
|
14661
14572
|
getMessageType = ({ roles, receiver }) => {
|
|
@@ -14665,18 +14576,18 @@ var init_ChatBody = __esm({
|
|
|
14665
14576
|
return receiver ? "private" : "";
|
|
14666
14577
|
};
|
|
14667
14578
|
ChatActions = ({ onPin, showPinAction }) => {
|
|
14668
|
-
const [open, setOpen] = (0,
|
|
14579
|
+
const [open, setOpen] = (0, import_react141.useState)(false);
|
|
14669
14580
|
if (!showPinAction) {
|
|
14670
14581
|
return null;
|
|
14671
14582
|
}
|
|
14672
|
-
return /* @__PURE__ */
|
|
14583
|
+
return /* @__PURE__ */ import_react141.default.createElement(Dropdown.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ import_react141.default.createElement(Dropdown.Trigger, { className: "chat_actions", css: { opacity: open ? 1 : 0, "@md": { opacity: 1 } }, asChild: true }, /* @__PURE__ */ import_react141.default.createElement(IconButton, null, /* @__PURE__ */ import_react141.default.createElement(Tooltip, { title: "More options" }, /* @__PURE__ */ import_react141.default.createElement(import_react_icons61.VerticalMenuIcon, null)))), /* @__PURE__ */ import_react141.default.createElement(Dropdown.Portal, null, /* @__PURE__ */ import_react141.default.createElement(
|
|
14673
14584
|
Dropdown.Content,
|
|
14674
14585
|
{
|
|
14675
14586
|
sideOffset: 5,
|
|
14676
14587
|
align: "end",
|
|
14677
14588
|
css: { width: "$48", backgroundColor: "$surface_bright", py: "$0", border: "1px solid $border_bright" }
|
|
14678
14589
|
},
|
|
14679
|
-
/* @__PURE__ */
|
|
14590
|
+
/* @__PURE__ */ import_react141.default.createElement(Dropdown.Item, { "data-testid": "pin_message_btn", onClick: onPin }, /* @__PURE__ */ import_react141.default.createElement(import_react_icons61.PinIcon, null), /* @__PURE__ */ import_react141.default.createElement(Text, { variant: "sm", css: { ml: "$4" } }, "Pin Message"))
|
|
14680
14591
|
)));
|
|
14681
14592
|
};
|
|
14682
14593
|
SenderName = styled(Text, {
|
|
@@ -14688,11 +14599,11 @@ var init_ChatBody = __esm({
|
|
|
14688
14599
|
color: "$on_surface_high",
|
|
14689
14600
|
fontWeight: "$semiBold"
|
|
14690
14601
|
});
|
|
14691
|
-
ChatMessage =
|
|
14602
|
+
ChatMessage = import_react141.default.memo(({ index, style = {}, message, setRowHeight, onPin }) => {
|
|
14692
14603
|
var _a7, _b7;
|
|
14693
14604
|
const { ref, inView } = (0, import_react_intersection_observer.useInView)({ threshold: 0.5, triggerOnce: true });
|
|
14694
|
-
const rowRef = (0,
|
|
14695
|
-
(0,
|
|
14605
|
+
const rowRef = (0, import_react141.useRef)(null);
|
|
14606
|
+
(0, import_react141.useEffect)(() => {
|
|
14696
14607
|
if (rowRef.current) {
|
|
14697
14608
|
setRowHeight(index, rowRef.current.clientHeight);
|
|
14698
14609
|
}
|
|
@@ -14700,20 +14611,20 @@ var init_ChatBody = __esm({
|
|
|
14700
14611
|
const isMobile = (0, import_react_use27.useMedia)(config.media.md);
|
|
14701
14612
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
14702
14613
|
const isOverlay = ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) && isMobile;
|
|
14703
|
-
const hmsActions = (0,
|
|
14704
|
-
const localPeerId = (0,
|
|
14705
|
-
const permissions = (0,
|
|
14614
|
+
const hmsActions = (0, import_react_sdk79.useHMSActions)();
|
|
14615
|
+
const localPeerId = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerID);
|
|
14616
|
+
const permissions = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectPermissions);
|
|
14706
14617
|
const messageType = getMessageType({
|
|
14707
14618
|
roles: message.recipientRoles,
|
|
14708
14619
|
receiver: message.recipientPeer
|
|
14709
14620
|
});
|
|
14710
14621
|
const showPinAction = permissions.removeOthers && !messageType && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.allow_pinning_messages);
|
|
14711
|
-
(0,
|
|
14622
|
+
(0, import_react141.useEffect)(() => {
|
|
14712
14623
|
if (message.id && !message.read && inView) {
|
|
14713
14624
|
hmsActions.setMessageRead(true, message.id);
|
|
14714
14625
|
}
|
|
14715
14626
|
}, [message.read, hmsActions, inView, message.id]);
|
|
14716
|
-
return /* @__PURE__ */
|
|
14627
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14717
14628
|
Box,
|
|
14718
14629
|
{
|
|
14719
14630
|
ref,
|
|
@@ -14721,7 +14632,7 @@ var init_ChatBody = __esm({
|
|
|
14721
14632
|
css: { mb: "$10", pr: "$10", mt: "$8", "&:hover .chat_actions": { opacity: 1 } },
|
|
14722
14633
|
style
|
|
14723
14634
|
},
|
|
14724
|
-
/* @__PURE__ */
|
|
14635
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14725
14636
|
Flex,
|
|
14726
14637
|
{
|
|
14727
14638
|
ref: rowRef,
|
|
@@ -14738,7 +14649,7 @@ var init_ChatBody = __esm({
|
|
|
14738
14649
|
key: message.time,
|
|
14739
14650
|
"data-testid": "chat_msg"
|
|
14740
14651
|
},
|
|
14741
|
-
/* @__PURE__ */
|
|
14652
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14742
14653
|
Text,
|
|
14743
14654
|
{
|
|
14744
14655
|
css: {
|
|
@@ -14751,7 +14662,7 @@ var init_ChatBody = __esm({
|
|
|
14751
14662
|
},
|
|
14752
14663
|
as: "div"
|
|
14753
14664
|
},
|
|
14754
|
-
/* @__PURE__ */
|
|
14665
|
+
/* @__PURE__ */ import_react141.default.createElement(Flex, { align: "baseline" }, message.senderName === "You" || !message.senderName ? /* @__PURE__ */ import_react141.default.createElement(SenderName, { as: "span", variant: "sm", css: { color: isOverlay ? "#FFF" : "$on_surface_high" } }, message.senderName || "Anonymous") : /* @__PURE__ */ import_react141.default.createElement(Tooltip, { title: message.senderName, side: "top", align: "start" }, /* @__PURE__ */ import_react141.default.createElement(SenderName, { as: "span", variant: "sm", css: { color: isOverlay ? "#FFF" : "$on_surface_high" } }, message.senderName)), !isOverlay ? /* @__PURE__ */ import_react141.default.createElement(
|
|
14755
14666
|
Text,
|
|
14756
14667
|
{
|
|
14757
14668
|
as: "span",
|
|
@@ -14764,7 +14675,7 @@ var init_ChatBody = __esm({
|
|
|
14764
14675
|
},
|
|
14765
14676
|
formatTime2(message.time)
|
|
14766
14677
|
) : null),
|
|
14767
|
-
/* @__PURE__ */
|
|
14678
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14768
14679
|
MessageType,
|
|
14769
14680
|
{
|
|
14770
14681
|
hasCurrentUserSent: message.sender === localPeerId,
|
|
@@ -14772,9 +14683,9 @@ var init_ChatBody = __esm({
|
|
|
14772
14683
|
roles: message.recipientRoles
|
|
14773
14684
|
}
|
|
14774
14685
|
),
|
|
14775
|
-
!isOverlay ? /* @__PURE__ */
|
|
14686
|
+
!isOverlay ? /* @__PURE__ */ import_react141.default.createElement(ChatActions, { onPin, showPinAction }) : null
|
|
14776
14687
|
),
|
|
14777
|
-
/* @__PURE__ */
|
|
14688
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14778
14689
|
Text,
|
|
14779
14690
|
{
|
|
14780
14691
|
variant: "sm",
|
|
@@ -14788,20 +14699,20 @@ var init_ChatBody = __esm({
|
|
|
14788
14699
|
},
|
|
14789
14700
|
onClick: (e) => e.stopPropagation()
|
|
14790
14701
|
},
|
|
14791
|
-
/* @__PURE__ */
|
|
14702
|
+
/* @__PURE__ */ import_react141.default.createElement(AnnotisedMessage, { message: message.message })
|
|
14792
14703
|
)
|
|
14793
14704
|
)
|
|
14794
14705
|
);
|
|
14795
14706
|
});
|
|
14796
|
-
ChatList =
|
|
14707
|
+
ChatList = import_react141.default.forwardRef(
|
|
14797
14708
|
({ width, height, setRowHeight, getRowHeight, messages, scrollToBottom }, listRef) => {
|
|
14798
14709
|
const { setPinnedMessage } = useSetPinnedMessage();
|
|
14799
|
-
(0,
|
|
14710
|
+
(0, import_react141.useLayoutEffect)(() => {
|
|
14800
14711
|
if (listRef.current && listRef.current.scrollToItem) {
|
|
14801
14712
|
scrollToBottom(1);
|
|
14802
14713
|
}
|
|
14803
14714
|
}, [listRef]);
|
|
14804
|
-
return /* @__PURE__ */
|
|
14715
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14805
14716
|
import_react_window2.VariableSizeList,
|
|
14806
14717
|
{
|
|
14807
14718
|
ref: listRef,
|
|
@@ -14813,7 +14724,7 @@ var init_ChatBody = __esm({
|
|
|
14813
14724
|
overflowX: "hidden"
|
|
14814
14725
|
}
|
|
14815
14726
|
},
|
|
14816
|
-
({ index, style }) => /* @__PURE__ */
|
|
14727
|
+
({ index, style }) => /* @__PURE__ */ import_react141.default.createElement(
|
|
14817
14728
|
ChatMessage,
|
|
14818
14729
|
{
|
|
14819
14730
|
style,
|
|
@@ -14827,19 +14738,19 @@ var init_ChatBody = __esm({
|
|
|
14827
14738
|
);
|
|
14828
14739
|
}
|
|
14829
14740
|
);
|
|
14830
|
-
VirtualizedChatMessages =
|
|
14831
|
-
const rowHeights = (0,
|
|
14741
|
+
VirtualizedChatMessages = import_react141.default.forwardRef(({ messages, scrollToBottom }, listRef) => {
|
|
14742
|
+
const rowHeights = (0, import_react141.useRef)({});
|
|
14832
14743
|
function getRowHeight(index) {
|
|
14833
14744
|
return rowHeights.current[index] + 16 || 72;
|
|
14834
14745
|
}
|
|
14835
|
-
const setRowHeight = (0,
|
|
14746
|
+
const setRowHeight = (0, import_react141.useCallback)(
|
|
14836
14747
|
(index, size) => {
|
|
14837
14748
|
listRef.current.resetAfterIndex(0);
|
|
14838
14749
|
rowHeights.current = __spreadProps(__spreadValues({}, rowHeights.current), { [index]: size });
|
|
14839
14750
|
},
|
|
14840
14751
|
[listRef]
|
|
14841
14752
|
);
|
|
14842
|
-
return /* @__PURE__ */
|
|
14753
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14843
14754
|
Box,
|
|
14844
14755
|
{
|
|
14845
14756
|
css: {
|
|
@@ -14848,14 +14759,14 @@ var init_ChatBody = __esm({
|
|
|
14848
14759
|
},
|
|
14849
14760
|
as: "div"
|
|
14850
14761
|
},
|
|
14851
|
-
/* @__PURE__ */
|
|
14762
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14852
14763
|
import_react_virtualized_auto_sizer.default,
|
|
14853
14764
|
{
|
|
14854
14765
|
style: {
|
|
14855
14766
|
width: "90%"
|
|
14856
14767
|
}
|
|
14857
14768
|
},
|
|
14858
|
-
({ height, width }) => /* @__PURE__ */
|
|
14769
|
+
({ height, width }) => /* @__PURE__ */ import_react141.default.createElement(
|
|
14859
14770
|
ChatList,
|
|
14860
14771
|
{
|
|
14861
14772
|
width,
|
|
@@ -14870,15 +14781,15 @@ var init_ChatBody = __esm({
|
|
|
14870
14781
|
)
|
|
14871
14782
|
);
|
|
14872
14783
|
});
|
|
14873
|
-
ChatBody =
|
|
14784
|
+
ChatBody = import_react141.default.forwardRef(({ role, peerId, scrollToBottom }, listRef) => {
|
|
14874
14785
|
var _a7;
|
|
14875
|
-
const storeMessageSelector = role ? (0,
|
|
14876
|
-
let messages = (0,
|
|
14877
|
-
messages = (0,
|
|
14786
|
+
const storeMessageSelector = role ? (0, import_react_sdk79.selectMessagesByRole)(role) : peerId ? (0, import_react_sdk79.selectMessagesByPeerID)(peerId) : import_react_sdk79.selectHMSMessages;
|
|
14787
|
+
let messages = (0, import_react_sdk79.useHMSStore)(storeMessageSelector);
|
|
14788
|
+
messages = (0, import_react141.useMemo)(() => (messages == null ? void 0 : messages.filter((message) => message.type === "chat")) || [], [messages]);
|
|
14878
14789
|
const isMobile = (0, import_react_use27.useMedia)(config.media.md);
|
|
14879
14790
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
14880
14791
|
if (messages.length === 0 && !(isMobile && ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay))) {
|
|
14881
|
-
return /* @__PURE__ */
|
|
14792
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14882
14793
|
Flex,
|
|
14883
14794
|
{
|
|
14884
14795
|
css: {
|
|
@@ -14890,7 +14801,7 @@ var init_ChatBody = __esm({
|
|
|
14890
14801
|
align: "center",
|
|
14891
14802
|
justify: "center"
|
|
14892
14803
|
},
|
|
14893
|
-
/* @__PURE__ */
|
|
14804
|
+
/* @__PURE__ */ import_react141.default.createElement(Box, null, /* @__PURE__ */ import_react141.default.createElement("img", { src: empty_chat_default, alt: "Empty Chat", height: 132, width: 185, style: { margin: "0 auto" } }), /* @__PURE__ */ import_react141.default.createElement(Text, { variant: "h5", css: { mt: "$8", c: "$on_surface_high" } }, "Start a conversation"), /* @__PURE__ */ import_react141.default.createElement(
|
|
14894
14805
|
Text,
|
|
14895
14806
|
{
|
|
14896
14807
|
variant: "sm",
|
|
@@ -14900,27 +14811,27 @@ var init_ChatBody = __esm({
|
|
|
14900
14811
|
))
|
|
14901
14812
|
);
|
|
14902
14813
|
}
|
|
14903
|
-
return /* @__PURE__ */
|
|
14814
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null, /* @__PURE__ */ import_react141.default.createElement(VirtualizedChatMessages, { messages, scrollToBottom, ref: listRef }));
|
|
14904
14815
|
});
|
|
14905
14816
|
}
|
|
14906
14817
|
});
|
|
14907
14818
|
|
|
14908
14819
|
// src/Prebuilt/components/AppData/useChatState.js
|
|
14909
|
-
var
|
|
14820
|
+
var import_react142, import_react_sdk80, useChatDraftMessage;
|
|
14910
14821
|
var init_useChatState = __esm({
|
|
14911
14822
|
"src/Prebuilt/components/AppData/useChatState.js"() {
|
|
14912
14823
|
"use strict";
|
|
14913
14824
|
init_define_process_env();
|
|
14914
|
-
|
|
14915
|
-
|
|
14825
|
+
import_react142 = require("react");
|
|
14826
|
+
import_react_sdk80 = require("@100mslive/react-sdk");
|
|
14916
14827
|
init_constants();
|
|
14917
14828
|
useChatDraftMessage = () => {
|
|
14918
|
-
const hmsActions = (0,
|
|
14919
|
-
let chatDraftMessage = (0,
|
|
14829
|
+
const hmsActions = (0, import_react_sdk80.useHMSActions)();
|
|
14830
|
+
let chatDraftMessage = (0, import_react_sdk80.useHMSStore)((0, import_react_sdk80.selectAppData)(APP_DATA.chatDraft));
|
|
14920
14831
|
if (chatDraftMessage === void 0 || chatDraftMessage === null) {
|
|
14921
14832
|
chatDraftMessage = "";
|
|
14922
14833
|
}
|
|
14923
|
-
const setDraftMessage = (0,
|
|
14834
|
+
const setDraftMessage = (0, import_react142.useCallback)(
|
|
14924
14835
|
(message) => {
|
|
14925
14836
|
hmsActions.setAppData(APP_DATA.chatDraft, message, true);
|
|
14926
14837
|
},
|
|
@@ -14932,15 +14843,15 @@ var init_useChatState = __esm({
|
|
|
14932
14843
|
});
|
|
14933
14844
|
|
|
14934
14845
|
// src/Prebuilt/components/Chat/useEmojiPickerStyles.js
|
|
14935
|
-
var
|
|
14846
|
+
var import_react143, useEmojiPickerStyles;
|
|
14936
14847
|
var init_useEmojiPickerStyles = __esm({
|
|
14937
14848
|
"src/Prebuilt/components/Chat/useEmojiPickerStyles.js"() {
|
|
14938
14849
|
"use strict";
|
|
14939
14850
|
init_define_process_env();
|
|
14940
|
-
|
|
14851
|
+
import_react143 = require("react");
|
|
14941
14852
|
useEmojiPickerStyles = (showing) => {
|
|
14942
|
-
const ref = (0,
|
|
14943
|
-
(0,
|
|
14853
|
+
const ref = (0, import_react143.useRef)(null);
|
|
14854
|
+
(0, import_react143.useEffect)(() => {
|
|
14944
14855
|
if (showing) {
|
|
14945
14856
|
setTimeout(() => {
|
|
14946
14857
|
var _a7, _b7;
|
|
@@ -14972,9 +14883,9 @@ var init_useEmojiPickerStyles = __esm({
|
|
|
14972
14883
|
|
|
14973
14884
|
// src/Prebuilt/components/Chat/ChatFooter.tsx
|
|
14974
14885
|
function EmojiPicker({ onSelect }) {
|
|
14975
|
-
const [showEmoji, setShowEmoji] = (0,
|
|
14886
|
+
const [showEmoji, setShowEmoji] = (0, import_react144.useState)(false);
|
|
14976
14887
|
const ref = useEmojiPickerStyles(showEmoji);
|
|
14977
|
-
return /* @__PURE__ */
|
|
14888
|
+
return /* @__PURE__ */ import_react144.default.createElement(Popover2.Root, { open: showEmoji, onOpenChange: setShowEmoji }, /* @__PURE__ */ import_react144.default.createElement(Popover2.Trigger, { asChild: true, css: { appearance: "none" } }, /* @__PURE__ */ import_react144.default.createElement(IconButton, { as: "div" }, /* @__PURE__ */ import_react144.default.createElement(import_react_icons62.EmojiIcon, null))), /* @__PURE__ */ import_react144.default.createElement(Popover2.Portal, null, /* @__PURE__ */ import_react144.default.createElement(
|
|
14978
14889
|
Popover2.Content,
|
|
14979
14890
|
{
|
|
14980
14891
|
alignOffset: -40,
|
|
@@ -14984,7 +14895,7 @@ function EmojiPicker({ onSelect }) {
|
|
|
14984
14895
|
p: 0
|
|
14985
14896
|
}
|
|
14986
14897
|
},
|
|
14987
|
-
/* @__PURE__ */
|
|
14898
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
14988
14899
|
Box,
|
|
14989
14900
|
{
|
|
14990
14901
|
css: {
|
|
@@ -14993,21 +14904,21 @@ function EmojiPicker({ onSelect }) {
|
|
|
14993
14904
|
},
|
|
14994
14905
|
ref
|
|
14995
14906
|
},
|
|
14996
|
-
/* @__PURE__ */
|
|
14907
|
+
/* @__PURE__ */ import_react144.default.createElement(import_react145.default, { onEmojiSelect: onSelect, data: import_data.default, previewPosition: "none", skinPosition: "search" })
|
|
14997
14908
|
)
|
|
14998
14909
|
)));
|
|
14999
14910
|
}
|
|
15000
|
-
var
|
|
14911
|
+
var import_react144, import_react_use28, import_data, import_react145, import_react_sdk81, import_react_icons62, TextArea, ChatFooter;
|
|
15001
14912
|
var init_ChatFooter = __esm({
|
|
15002
14913
|
"src/Prebuilt/components/Chat/ChatFooter.tsx"() {
|
|
15003
14914
|
"use strict";
|
|
15004
14915
|
init_define_process_env();
|
|
15005
|
-
|
|
14916
|
+
import_react144 = __toESM(require("react"));
|
|
15006
14917
|
import_react_use28 = require("react-use");
|
|
15007
14918
|
import_data = __toESM(require("@emoji-mart/data"));
|
|
15008
|
-
|
|
15009
|
-
|
|
15010
|
-
|
|
14919
|
+
import_react145 = __toESM(require("@emoji-mart/react"));
|
|
14920
|
+
import_react_sdk81 = require("@100mslive/react-sdk");
|
|
14921
|
+
import_react_icons62 = require("@100mslive/react-icons");
|
|
15011
14922
|
init_src();
|
|
15012
14923
|
init_ToastManager();
|
|
15013
14924
|
init_useRoomLayoutScreen();
|
|
@@ -15037,13 +14948,13 @@ var init_ChatFooter = __esm({
|
|
|
15037
14948
|
children
|
|
15038
14949
|
}) => {
|
|
15039
14950
|
var _a7;
|
|
15040
|
-
const hmsActions = (0,
|
|
15041
|
-
const inputRef = (0,
|
|
14951
|
+
const hmsActions = (0, import_react_sdk81.useHMSActions)();
|
|
14952
|
+
const inputRef = (0, import_react144.useRef)(null);
|
|
15042
14953
|
const [draftMessage, setDraftMessage] = useChatDraftMessage();
|
|
15043
14954
|
const isMobile = (0, import_react_use28.useMedia)(config.media.md);
|
|
15044
14955
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15045
14956
|
const isOverlayChat = (_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay;
|
|
15046
|
-
const sendMessage = (0,
|
|
14957
|
+
const sendMessage = (0, import_react144.useCallback)(() => __async(void 0, null, function* () {
|
|
15047
14958
|
var _a8;
|
|
15048
14959
|
const message = (_a8 = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a8.value;
|
|
15049
14960
|
if (!message || !message.trim().length) {
|
|
@@ -15066,19 +14977,19 @@ var init_ChatFooter = __esm({
|
|
|
15066
14977
|
ToastManager.addToast({ title: err.message });
|
|
15067
14978
|
}
|
|
15068
14979
|
}), [role, peerId, hmsActions, onSend]);
|
|
15069
|
-
(0,
|
|
14980
|
+
(0, import_react144.useEffect)(() => {
|
|
15070
14981
|
const messageElement = inputRef.current;
|
|
15071
14982
|
if (messageElement) {
|
|
15072
14983
|
messageElement.value = draftMessage;
|
|
15073
14984
|
}
|
|
15074
14985
|
}, [draftMessage]);
|
|
15075
|
-
(0,
|
|
14986
|
+
(0, import_react144.useEffect)(() => {
|
|
15076
14987
|
const messageElement = inputRef.current;
|
|
15077
14988
|
return () => {
|
|
15078
14989
|
setDraftMessage((messageElement == null ? void 0 : messageElement.value) || "");
|
|
15079
14990
|
};
|
|
15080
14991
|
}, [setDraftMessage]);
|
|
15081
|
-
return /* @__PURE__ */
|
|
14992
|
+
return /* @__PURE__ */ import_react144.default.createElement(import_react144.default.Fragment, null, /* @__PURE__ */ import_react144.default.createElement(Flex, { align: "center", css: { gap: "$4", w: "100%" } }, /* @__PURE__ */ import_react144.default.createElement(
|
|
15082
14993
|
Flex,
|
|
15083
14994
|
{
|
|
15084
14995
|
align: "center",
|
|
@@ -15099,7 +15010,7 @@ var init_ChatFooter = __esm({
|
|
|
15099
15010
|
}
|
|
15100
15011
|
},
|
|
15101
15012
|
children,
|
|
15102
|
-
/* @__PURE__ */
|
|
15013
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
15103
15014
|
TextArea,
|
|
15104
15015
|
{
|
|
15105
15016
|
css: {
|
|
@@ -15126,7 +15037,7 @@ var init_ChatFooter = __esm({
|
|
|
15126
15037
|
onCopy: (e) => e.stopPropagation()
|
|
15127
15038
|
}
|
|
15128
15039
|
),
|
|
15129
|
-
!isMobile ? /* @__PURE__ */
|
|
15040
|
+
!isMobile ? /* @__PURE__ */ import_react144.default.createElement(
|
|
15130
15041
|
EmojiPicker,
|
|
15131
15042
|
{
|
|
15132
15043
|
onSelect: (emoji) => {
|
|
@@ -15136,7 +15047,7 @@ var init_ChatFooter = __esm({
|
|
|
15136
15047
|
}
|
|
15137
15048
|
}
|
|
15138
15049
|
) : null,
|
|
15139
|
-
/* @__PURE__ */
|
|
15050
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
15140
15051
|
IconButton,
|
|
15141
15052
|
{
|
|
15142
15053
|
className: "send-msg",
|
|
@@ -15149,7 +15060,7 @@ var init_ChatFooter = __esm({
|
|
|
15149
15060
|
},
|
|
15150
15061
|
"data-testid": "send_msg_btn"
|
|
15151
15062
|
},
|
|
15152
|
-
/* @__PURE__ */
|
|
15063
|
+
/* @__PURE__ */ import_react144.default.createElement(import_react_icons62.SendIcon, null)
|
|
15153
15064
|
)
|
|
15154
15065
|
)));
|
|
15155
15066
|
};
|
|
@@ -15157,37 +15068,36 @@ var init_ChatFooter = __esm({
|
|
|
15157
15068
|
});
|
|
15158
15069
|
|
|
15159
15070
|
// src/Prebuilt/components/Chat/useUnreadCount.js
|
|
15160
|
-
var
|
|
15071
|
+
var import_react_sdk82, useUnreadCount;
|
|
15161
15072
|
var init_useUnreadCount = __esm({
|
|
15162
15073
|
"src/Prebuilt/components/Chat/useUnreadCount.js"() {
|
|
15163
15074
|
"use strict";
|
|
15164
15075
|
init_define_process_env();
|
|
15165
|
-
|
|
15076
|
+
import_react_sdk82 = require("@100mslive/react-sdk");
|
|
15166
15077
|
useUnreadCount = ({ role, peerId }) => {
|
|
15167
|
-
const unreadCountSelector = role ? (0,
|
|
15168
|
-
const unreadCount = (0,
|
|
15078
|
+
const unreadCountSelector = role ? (0, import_react_sdk82.selectMessagesUnreadCountByRole)(role) : peerId ? (0, import_react_sdk82.selectMessagesUnreadCountByPeerID)(peerId) : import_react_sdk82.selectUnreadHMSMessagesCount;
|
|
15079
|
+
const unreadCount = (0, import_react_sdk82.useHMSStore)(unreadCountSelector);
|
|
15169
15080
|
return unreadCount;
|
|
15170
15081
|
};
|
|
15171
15082
|
}
|
|
15172
15083
|
});
|
|
15173
15084
|
|
|
15174
15085
|
// src/Prebuilt/components/Chat/Chat.jsx
|
|
15175
|
-
var
|
|
15086
|
+
var import_react146, import_react_use29, import_react_sdk83, import_react_icons63, PINNED_MESSAGE_LENGTH, PinnedMessage, Chat, NewMessageIndicator;
|
|
15176
15087
|
var init_Chat = __esm({
|
|
15177
15088
|
"src/Prebuilt/components/Chat/Chat.jsx"() {
|
|
15178
15089
|
"use strict";
|
|
15179
15090
|
init_define_process_env();
|
|
15180
|
-
|
|
15091
|
+
import_react146 = __toESM(require("react"));
|
|
15181
15092
|
import_react_use29 = require("react-use");
|
|
15182
|
-
|
|
15183
|
-
|
|
15093
|
+
import_react_sdk83 = require("@100mslive/react-sdk");
|
|
15094
|
+
import_react_icons63 = require("@100mslive/react-icons");
|
|
15184
15095
|
init_Button2();
|
|
15185
15096
|
init_Layout();
|
|
15186
15097
|
init_Text2();
|
|
15187
15098
|
init_Theme();
|
|
15188
15099
|
init_ChatBody();
|
|
15189
15100
|
init_ChatFooter();
|
|
15190
|
-
init_ChatParticipantHeader();
|
|
15191
15101
|
init_useRoomLayoutScreen();
|
|
15192
15102
|
init_useUISettings();
|
|
15193
15103
|
init_useSetPinnedMessage();
|
|
@@ -15195,10 +15105,10 @@ var init_Chat = __esm({
|
|
|
15195
15105
|
init_constants();
|
|
15196
15106
|
PINNED_MESSAGE_LENGTH = 80;
|
|
15197
15107
|
PinnedMessage = ({ clearPinnedMessage }) => {
|
|
15198
|
-
const permissions = (0,
|
|
15199
|
-
const pinnedMessage = (0,
|
|
15108
|
+
const permissions = (0, import_react_sdk83.useHMSStore)(import_react_sdk83.selectPermissions);
|
|
15109
|
+
const pinnedMessage = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectSessionStore)(SESSION_STORE_KEY.PINNED_MESSAGE));
|
|
15200
15110
|
const formattedPinnedMessage = (pinnedMessage == null ? void 0 : pinnedMessage.length) && pinnedMessage.length > PINNED_MESSAGE_LENGTH ? `${pinnedMessage.slice(0, PINNED_MESSAGE_LENGTH)}...` : pinnedMessage;
|
|
15201
|
-
return pinnedMessage ? /* @__PURE__ */
|
|
15111
|
+
return pinnedMessage ? /* @__PURE__ */ import_react146.default.createElement(
|
|
15202
15112
|
Flex,
|
|
15203
15113
|
{
|
|
15204
15114
|
title: pinnedMessage,
|
|
@@ -15206,8 +15116,8 @@ var init_Chat = __esm({
|
|
|
15206
15116
|
align: "center",
|
|
15207
15117
|
justify: "between"
|
|
15208
15118
|
},
|
|
15209
|
-
/* @__PURE__ */
|
|
15210
|
-
/* @__PURE__ */
|
|
15119
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.PinIcon, null),
|
|
15120
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15211
15121
|
Box,
|
|
15212
15122
|
{
|
|
15213
15123
|
css: {
|
|
@@ -15217,34 +15127,34 @@ var init_Chat = __esm({
|
|
|
15217
15127
|
overflowY: "auto"
|
|
15218
15128
|
}
|
|
15219
15129
|
},
|
|
15220
|
-
/* @__PURE__ */
|
|
15130
|
+
/* @__PURE__ */ import_react146.default.createElement(Text, { variant: "sm" }, /* @__PURE__ */ import_react146.default.createElement(AnnotisedMessage, { message: formattedPinnedMessage }))
|
|
15221
15131
|
),
|
|
15222
|
-
permissions.removeOthers && /* @__PURE__ */
|
|
15132
|
+
permissions.removeOthers && /* @__PURE__ */ import_react146.default.createElement(
|
|
15223
15133
|
Flex,
|
|
15224
15134
|
{
|
|
15225
15135
|
onClick: () => clearPinnedMessage(),
|
|
15226
15136
|
css: { cursor: "pointer", color: "$on_surface_medium", "&:hover": { color: "$on_surface_high" } }
|
|
15227
15137
|
},
|
|
15228
|
-
/* @__PURE__ */
|
|
15138
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.CrossIcon, null)
|
|
15229
15139
|
)
|
|
15230
15140
|
) : null;
|
|
15231
15141
|
};
|
|
15232
15142
|
Chat = ({ screenType, hideControls = false }) => {
|
|
15233
15143
|
var _a7, _b7, _c;
|
|
15234
|
-
const notification = (0,
|
|
15144
|
+
const notification = (0, import_react_sdk83.useHMSNotifications)(import_react_sdk83.HMSNotificationTypes.PEER_LEFT);
|
|
15235
15145
|
const [peerSelector, setPeerSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.PEER_ID);
|
|
15236
15146
|
const [roleSelector, setRoleSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.ROLE);
|
|
15237
|
-
const peerName = (0,
|
|
15238
|
-
const [chatOptions, setChatOptions] = (0,
|
|
15147
|
+
const peerName = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectPeerNameByID)(peerSelector));
|
|
15148
|
+
const [chatOptions, setChatOptions] = (0, import_react146.useState)({
|
|
15239
15149
|
role: roleSelector || "",
|
|
15240
15150
|
peerId: peerSelector && peerName ? peerSelector : "",
|
|
15241
15151
|
selection: roleSelector ? roleSelector : peerSelector && peerName ? peerName : "Everyone"
|
|
15242
15152
|
});
|
|
15243
|
-
const [isSelectorOpen
|
|
15244
|
-
const listRef = (0,
|
|
15245
|
-
const hmsActions = (0,
|
|
15153
|
+
const [isSelectorOpen] = (0, import_react146.useState)(false);
|
|
15154
|
+
const listRef = (0, import_react146.useRef)(null);
|
|
15155
|
+
const hmsActions = (0, import_react_sdk83.useHMSActions)();
|
|
15246
15156
|
const { setPinnedMessage } = useSetPinnedMessage();
|
|
15247
|
-
(0,
|
|
15157
|
+
(0, import_react146.useEffect)(() => {
|
|
15248
15158
|
if (notification && notification.data && peerSelector === notification.data.id) {
|
|
15249
15159
|
setPeerSelector("");
|
|
15250
15160
|
setChatOptions({
|
|
@@ -15254,7 +15164,7 @@ var init_Chat = __esm({
|
|
|
15254
15164
|
});
|
|
15255
15165
|
}
|
|
15256
15166
|
}, [notification, peerSelector, setPeerSelector]);
|
|
15257
|
-
const storeMessageSelector =
|
|
15167
|
+
const storeMessageSelector = import_react_sdk83.selectHMSMessagesCount;
|
|
15258
15168
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15259
15169
|
const isMobile = (0, import_react_use29.useMedia)(config.media.md);
|
|
15260
15170
|
let isScrolledToBottom = false;
|
|
@@ -15262,8 +15172,8 @@ var init_Chat = __esm({
|
|
|
15262
15172
|
const currentRef = listRef.current._outerRef;
|
|
15263
15173
|
isScrolledToBottom = currentRef.scrollHeight - currentRef.clientHeight - currentRef.scrollTop < 10;
|
|
15264
15174
|
}
|
|
15265
|
-
const messagesCount = (0,
|
|
15266
|
-
const scrollToBottom = (0,
|
|
15175
|
+
const messagesCount = (0, import_react_sdk83.useHMSStore)(storeMessageSelector) || 0;
|
|
15176
|
+
const scrollToBottom = (0, import_react146.useCallback)(
|
|
15267
15177
|
(unreadCount = 0) => {
|
|
15268
15178
|
var _a8;
|
|
15269
15179
|
if (listRef.current && listRef.current.scrollToItem && unreadCount > 0) {
|
|
@@ -15277,7 +15187,7 @@ var init_Chat = __esm({
|
|
|
15277
15187
|
},
|
|
15278
15188
|
[hmsActions, messagesCount]
|
|
15279
15189
|
);
|
|
15280
|
-
return /* @__PURE__ */
|
|
15190
|
+
return /* @__PURE__ */ import_react146.default.createElement(
|
|
15281
15191
|
Flex,
|
|
15282
15192
|
{
|
|
15283
15193
|
direction: "column",
|
|
@@ -15288,8 +15198,8 @@ var init_Chat = __esm({
|
|
|
15288
15198
|
transition: "margin 0.3s ease-in-out"
|
|
15289
15199
|
}
|
|
15290
15200
|
},
|
|
15291
|
-
isMobile && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay) ? null : /* @__PURE__ */
|
|
15292
|
-
/* @__PURE__ */
|
|
15201
|
+
isMobile && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay) ? null : /* @__PURE__ */ import_react146.default.createElement(import_react146.default.Fragment, null, ((_c = elements == null ? void 0 : elements.chat) == null ? void 0 : _c.allow_pinning_messages) ? /* @__PURE__ */ import_react146.default.createElement(PinnedMessage, { clearPinnedMessage: setPinnedMessage }) : null),
|
|
15202
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15293
15203
|
ChatBody,
|
|
15294
15204
|
{
|
|
15295
15205
|
role: chatOptions.role,
|
|
@@ -15299,7 +15209,7 @@ var init_Chat = __esm({
|
|
|
15299
15209
|
screenType
|
|
15300
15210
|
}
|
|
15301
15211
|
),
|
|
15302
|
-
/* @__PURE__ */
|
|
15212
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15303
15213
|
ChatFooter,
|
|
15304
15214
|
{
|
|
15305
15215
|
role: chatOptions.role,
|
|
@@ -15317,7 +15227,7 @@ var init_Chat = __esm({
|
|
|
15317
15227
|
},
|
|
15318
15228
|
peerId: chatOptions.peerId
|
|
15319
15229
|
},
|
|
15320
|
-
!isSelectorOpen && !isScrolledToBottom && /* @__PURE__ */
|
|
15230
|
+
!isSelectorOpen && !isScrolledToBottom && /* @__PURE__ */ import_react146.default.createElement(NewMessageIndicator, { role: chatOptions.role, peerId: chatOptions.peerId, scrollToBottom })
|
|
15321
15231
|
)
|
|
15322
15232
|
);
|
|
15323
15233
|
};
|
|
@@ -15326,7 +15236,7 @@ var init_Chat = __esm({
|
|
|
15326
15236
|
if (!unreadCount) {
|
|
15327
15237
|
return null;
|
|
15328
15238
|
}
|
|
15329
|
-
return /* @__PURE__ */
|
|
15239
|
+
return /* @__PURE__ */ import_react146.default.createElement(
|
|
15330
15240
|
Flex,
|
|
15331
15241
|
{
|
|
15332
15242
|
justify: "center",
|
|
@@ -15337,7 +15247,7 @@ var init_Chat = __esm({
|
|
|
15337
15247
|
position: "absolute"
|
|
15338
15248
|
}
|
|
15339
15249
|
},
|
|
15340
|
-
/* @__PURE__ */
|
|
15250
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15341
15251
|
Button,
|
|
15342
15252
|
{
|
|
15343
15253
|
variant: "standard",
|
|
@@ -15360,13 +15270,121 @@ var init_Chat = __esm({
|
|
|
15360
15270
|
},
|
|
15361
15271
|
"New ",
|
|
15362
15272
|
unreadCount === 1 ? "message" : "messages",
|
|
15363
|
-
/* @__PURE__ */
|
|
15273
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.ChevronDownIcon, null)
|
|
15364
15274
|
)
|
|
15365
15275
|
);
|
|
15366
15276
|
};
|
|
15367
15277
|
}
|
|
15368
15278
|
});
|
|
15369
15279
|
|
|
15280
|
+
// src/Prebuilt/components/SidePaneTabs.tsx
|
|
15281
|
+
var import_react147, import_react_sdk84, import_react_icons64, tabTriggerCSS, SidePaneTabs;
|
|
15282
|
+
var init_SidePaneTabs = __esm({
|
|
15283
|
+
"src/Prebuilt/components/SidePaneTabs.tsx"() {
|
|
15284
|
+
"use strict";
|
|
15285
|
+
init_define_process_env();
|
|
15286
|
+
import_react147 = __toESM(require("react"));
|
|
15287
|
+
import_react_sdk84 = require("@100mslive/react-sdk");
|
|
15288
|
+
import_react_icons64 = require("@100mslive/react-icons");
|
|
15289
|
+
init_Chat();
|
|
15290
|
+
init_ParticipantList();
|
|
15291
|
+
init_src();
|
|
15292
|
+
init_useRoomLayoutScreen();
|
|
15293
|
+
init_useSidepane();
|
|
15294
|
+
init_constants();
|
|
15295
|
+
tabTriggerCSS = {
|
|
15296
|
+
color: "$on_surface_high",
|
|
15297
|
+
p: "$4",
|
|
15298
|
+
fontWeight: "$semiBold",
|
|
15299
|
+
fontSize: "$sm",
|
|
15300
|
+
w: "100%",
|
|
15301
|
+
justifyContent: "center"
|
|
15302
|
+
};
|
|
15303
|
+
SidePaneTabs = import_react147.default.memo(({ active = SIDE_PANE_OPTIONS.CHAT, screenType, hideControls }) => {
|
|
15304
|
+
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
15305
|
+
const toggleParticipants = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
15306
|
+
const resetSidePane = useSidepaneReset();
|
|
15307
|
+
const [activeTab, setActiveTab] = (0, import_react147.useState)(active);
|
|
15308
|
+
const peerCount = (0, import_react_sdk84.useHMSStore)(import_react_sdk84.selectPeerCount);
|
|
15309
|
+
const { elements } = useRoomLayoutConferencingScreen();
|
|
15310
|
+
const showChat = !!(elements == null ? void 0 : elements.chat);
|
|
15311
|
+
const showParticipants = !!(elements == null ? void 0 : elements.participant_list);
|
|
15312
|
+
const hideTabs = !(showChat && showParticipants);
|
|
15313
|
+
(0, import_react147.useEffect)(() => {
|
|
15314
|
+
if (activeTab === SIDE_PANE_OPTIONS.CHAT && !showChat && showParticipants) {
|
|
15315
|
+
setActiveTab(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
15316
|
+
} else if (activeTab === SIDE_PANE_OPTIONS.PARTICIPANTS && showChat && !showParticipants) {
|
|
15317
|
+
setActiveTab(SIDE_PANE_OPTIONS.CHAT);
|
|
15318
|
+
} else if (!showChat && !showParticipants) {
|
|
15319
|
+
resetSidePane();
|
|
15320
|
+
}
|
|
15321
|
+
}, [showChat, activeTab, showParticipants, resetSidePane]);
|
|
15322
|
+
return /* @__PURE__ */ import_react147.default.createElement(
|
|
15323
|
+
Flex,
|
|
15324
|
+
{
|
|
15325
|
+
direction: "column",
|
|
15326
|
+
css: {
|
|
15327
|
+
color: "$on_primary_high",
|
|
15328
|
+
h: "100%"
|
|
15329
|
+
}
|
|
15330
|
+
},
|
|
15331
|
+
hideTabs ? /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, /* @__PURE__ */ import_react147.default.createElement(Text, { variant: "sm", css: { fontWeight: "$semiBold", p: "$4", c: "$on_surface_high", pr: "$12" } }, showChat ? "Chat" : `Participants (${peerCount})`), showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType, hideControls }) : /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)) : /* @__PURE__ */ import_react147.default.createElement(
|
|
15332
|
+
Tabs.Root,
|
|
15333
|
+
{
|
|
15334
|
+
value: activeTab,
|
|
15335
|
+
onValueChange: setActiveTab,
|
|
15336
|
+
css: {
|
|
15337
|
+
flexDirection: "column",
|
|
15338
|
+
size: "100%"
|
|
15339
|
+
}
|
|
15340
|
+
},
|
|
15341
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.List, { css: { w: "calc(100% - $12)", p: "$2", borderRadius: "$2", bg: "$surface_default" } }, /* @__PURE__ */ import_react147.default.createElement(
|
|
15342
|
+
Tabs.Trigger,
|
|
15343
|
+
{
|
|
15344
|
+
value: SIDE_PANE_OPTIONS.CHAT,
|
|
15345
|
+
onClick: toggleChat,
|
|
15346
|
+
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
15347
|
+
color: activeTab !== SIDE_PANE_OPTIONS.CHAT ? "$on_surface_low" : "$on_surface_high"
|
|
15348
|
+
})
|
|
15349
|
+
},
|
|
15350
|
+
"Chat"
|
|
15351
|
+
), /* @__PURE__ */ import_react147.default.createElement(
|
|
15352
|
+
Tabs.Trigger,
|
|
15353
|
+
{
|
|
15354
|
+
value: SIDE_PANE_OPTIONS.PARTICIPANTS,
|
|
15355
|
+
onClick: toggleParticipants,
|
|
15356
|
+
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
15357
|
+
color: activeTab !== SIDE_PANE_OPTIONS.PARTICIPANTS ? "$on_surface_low" : "$on_surface_high"
|
|
15358
|
+
})
|
|
15359
|
+
},
|
|
15360
|
+
"Participants (",
|
|
15361
|
+
peerCount,
|
|
15362
|
+
")"
|
|
15363
|
+
)),
|
|
15364
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.PARTICIPANTS, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)),
|
|
15365
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.CHAT, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType, hideControls }))
|
|
15366
|
+
),
|
|
15367
|
+
/* @__PURE__ */ import_react147.default.createElement(
|
|
15368
|
+
IconButton,
|
|
15369
|
+
{
|
|
15370
|
+
css: { position: "absolute", right: "$10", top: "$11" },
|
|
15371
|
+
onClick: (e) => {
|
|
15372
|
+
e.stopPropagation();
|
|
15373
|
+
if (activeTab === SIDE_PANE_OPTIONS.CHAT) {
|
|
15374
|
+
toggleChat();
|
|
15375
|
+
} else {
|
|
15376
|
+
toggleParticipants();
|
|
15377
|
+
}
|
|
15378
|
+
},
|
|
15379
|
+
"data-testid": "close_chat"
|
|
15380
|
+
},
|
|
15381
|
+
/* @__PURE__ */ import_react147.default.createElement(import_react_icons64.CrossIcon, null)
|
|
15382
|
+
)
|
|
15383
|
+
);
|
|
15384
|
+
});
|
|
15385
|
+
}
|
|
15386
|
+
});
|
|
15387
|
+
|
|
15370
15388
|
// src/Prebuilt/images/rtmp.png
|
|
15371
15389
|
var rtmp_default;
|
|
15372
15390
|
var init_rtmp = __esm({
|
|
@@ -15376,13 +15394,13 @@ var init_rtmp = __esm({
|
|
|
15376
15394
|
});
|
|
15377
15395
|
|
|
15378
15396
|
// src/Prebuilt/components/Streaming/HLSStreaming.jsx
|
|
15379
|
-
var import_react148,
|
|
15397
|
+
var import_react148, import_react_sdk85, import_react_icons65, getCardData, Card, HLSStreaming, StartHLS, EndHLS;
|
|
15380
15398
|
var init_HLSStreaming = __esm({
|
|
15381
15399
|
"src/Prebuilt/components/Streaming/HLSStreaming.jsx"() {
|
|
15382
15400
|
"use strict";
|
|
15383
15401
|
init_define_process_env();
|
|
15384
15402
|
import_react148 = __toESM(require("react"));
|
|
15385
|
-
|
|
15403
|
+
import_react_sdk85 = require("@100mslive/react-sdk");
|
|
15386
15404
|
import_react_icons65 = require("@100mslive/react-icons");
|
|
15387
15405
|
init_src();
|
|
15388
15406
|
init_Common();
|
|
@@ -15453,16 +15471,16 @@ var init_HLSStreaming = __esm({
|
|
|
15453
15471
|
};
|
|
15454
15472
|
HLSStreaming = ({ onBack }) => {
|
|
15455
15473
|
const roleNames = useFilteredRoles();
|
|
15456
|
-
const roomId = (0,
|
|
15474
|
+
const roomId = (0, import_react_sdk85.useHMSStore)(import_react_sdk85.selectRoomID);
|
|
15457
15475
|
const cards = roleNames.map((roleName) => getCardData(roleName, roomId));
|
|
15458
|
-
const { isHLSRunning } = (0,
|
|
15476
|
+
const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
|
|
15459
15477
|
const [showLinks, setShowLinks] = (0, import_react148.useState)(false);
|
|
15460
15478
|
return !showLinks ? /* @__PURE__ */ import_react148.default.createElement(Container4, { rounded: true }, /* @__PURE__ */ import_react148.default.createElement(ContentHeader, { title: "Start Streaming", content: "HLS", onBack }), /* @__PURE__ */ import_react148.default.createElement(ContentBody, { title: "HLS Streaming", Icon: import_react_icons65.GoLiveIcon, removeVerticalPadding: true }, "Stream directly from the browser using any device with multiple hosts and real-time messaging, all within this platform."), isHLSRunning ? /* @__PURE__ */ import_react148.default.createElement(EndHLS, { setShowLinks }) : /* @__PURE__ */ import_react148.default.createElement(StartHLS, null)) : /* @__PURE__ */ import_react148.default.createElement(Container4, { rounded: true }, /* @__PURE__ */ import_react148.default.createElement(ContentHeader, { title: "Invite People", content: "Start the conversation", onBack: () => setShowLinks(false) }), /* @__PURE__ */ import_react148.default.createElement(Flex, { direction: "column", css: { gap: "$10", p: "$0 $10", overflowY: "auto", mb: "$10" } }, cards.map((card) => /* @__PURE__ */ import_react148.default.createElement(Card, __spreadProps(__spreadValues({ key: card.title }, card), { isHLSRunning })))));
|
|
15461
15479
|
};
|
|
15462
15480
|
StartHLS = () => {
|
|
15463
15481
|
const [record, setRecord] = (0, import_react148.useState)(false);
|
|
15464
15482
|
const [error, setError] = (0, import_react148.useState)(false);
|
|
15465
|
-
const hmsActions = (0,
|
|
15483
|
+
const hmsActions = (0, import_react_sdk85.useHMSActions)();
|
|
15466
15484
|
const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
|
|
15467
15485
|
const startHLS = (0, import_react148.useCallback)(
|
|
15468
15486
|
(variants) => __async(void 0, null, function* () {
|
|
@@ -15497,10 +15515,10 @@ var init_HLSStreaming = __esm({
|
|
|
15497
15515
|
)), /* @__PURE__ */ import_react148.default.createElement(Flex, { align: "center", css: { p: "$4 $10" } }, /* @__PURE__ */ import_react148.default.createElement(Text, null, /* @__PURE__ */ import_react148.default.createElement(import_react_icons65.InfoIcon, { width: 16, height: 16 })), /* @__PURE__ */ import_react148.default.createElement(Text, { variant: "tiny", color: "$on_surface_medium", css: { mx: "$8" } }, "You cannot start recording once the stream starts, you will have to stop the stream to enable recording.")));
|
|
15498
15516
|
};
|
|
15499
15517
|
EndHLS = ({ setShowLinks }) => {
|
|
15500
|
-
const hmsActions = (0,
|
|
15518
|
+
const hmsActions = (0, import_react_sdk85.useHMSActions)();
|
|
15501
15519
|
const [inProgress, setInProgress] = (0, import_react148.useState)(false);
|
|
15502
15520
|
const [error, setError] = (0, import_react148.useState)("");
|
|
15503
|
-
const { isHLSRunning } = (0,
|
|
15521
|
+
const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
|
|
15504
15522
|
(0, import_react148.useEffect)(() => {
|
|
15505
15523
|
if (inProgress && !isHLSRunning) {
|
|
15506
15524
|
setInProgress(false);
|
|
@@ -15533,13 +15551,13 @@ var init_HLSStreaming = __esm({
|
|
|
15533
15551
|
});
|
|
15534
15552
|
|
|
15535
15553
|
// src/Prebuilt/components/Streaming/StreamingLanding.jsx
|
|
15536
|
-
var import_react149,
|
|
15554
|
+
var import_react149, import_react_sdk86, import_react_icons66, StreamingLanding;
|
|
15537
15555
|
var init_StreamingLanding = __esm({
|
|
15538
15556
|
"src/Prebuilt/components/Streaming/StreamingLanding.jsx"() {
|
|
15539
15557
|
"use strict";
|
|
15540
15558
|
init_define_process_env();
|
|
15541
15559
|
import_react149 = __toESM(require("react"));
|
|
15542
|
-
|
|
15560
|
+
import_react_sdk86 = require("@100mslive/react-sdk");
|
|
15543
15561
|
import_react_icons66 = require("@100mslive/react-icons");
|
|
15544
15562
|
init_Layout();
|
|
15545
15563
|
init_Text2();
|
|
@@ -15552,8 +15570,8 @@ var init_StreamingLanding = __esm({
|
|
|
15552
15570
|
init_constants();
|
|
15553
15571
|
StreamingLanding = () => {
|
|
15554
15572
|
const toggleStreaming = useSidepaneToggle(SIDE_PANE_OPTIONS.STREAMING);
|
|
15555
|
-
const { isHLSRunning, isRTMPRunning } = (0,
|
|
15556
|
-
const permissions = (0,
|
|
15573
|
+
const { isHLSRunning, isRTMPRunning } = (0, import_react_sdk86.useRecordingStreaming)();
|
|
15574
|
+
const permissions = (0, import_react_sdk86.useHMSStore)(import_react_sdk86.selectPermissions);
|
|
15557
15575
|
const [showHLS, setShowHLS] = (0, import_react149.useState)(isHLSRunning);
|
|
15558
15576
|
const [showRTMP, setShowRTMP] = (0, import_react149.useState)(isRTMPRunning);
|
|
15559
15577
|
if (!(permissions == null ? void 0 : permissions.hlsStreaming) && !(permissions == null ? void 0 : permissions.rtmpStreaming)) {
|
|
@@ -15599,16 +15617,15 @@ var init_StreamingLanding = __esm({
|
|
|
15599
15617
|
});
|
|
15600
15618
|
|
|
15601
15619
|
// src/Prebuilt/layouts/SidePane.tsx
|
|
15602
|
-
var import_react150, import_react_use30,
|
|
15620
|
+
var import_react150, import_react_use30, import_react_sdk87, SidePane, SidePane_default;
|
|
15603
15621
|
var init_SidePane = __esm({
|
|
15604
15622
|
"src/Prebuilt/layouts/SidePane.tsx"() {
|
|
15605
15623
|
"use strict";
|
|
15606
15624
|
init_define_process_env();
|
|
15607
15625
|
import_react150 = __toESM(require("react"));
|
|
15608
15626
|
import_react_use30 = require("react-use");
|
|
15609
|
-
|
|
15610
|
-
|
|
15611
|
-
init_ParticipantList();
|
|
15627
|
+
import_react_sdk87 = require("@100mslive/react-sdk");
|
|
15628
|
+
init_SidePaneTabs();
|
|
15612
15629
|
init_StreamingLanding();
|
|
15613
15630
|
init_VideoTile2();
|
|
15614
15631
|
init_Layout();
|
|
@@ -15622,21 +15639,26 @@ var init_SidePane = __esm({
|
|
|
15622
15639
|
}) => {
|
|
15623
15640
|
var _a7, _b7;
|
|
15624
15641
|
const isMobile = (0, import_react_use30.useMedia)(config.media.md);
|
|
15625
|
-
const sidepane = (0,
|
|
15626
|
-
const activeScreensharePeerId = (0,
|
|
15627
|
-
const trackId = (_a7 = (0,
|
|
15642
|
+
const sidepane = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.sidePane));
|
|
15643
|
+
const activeScreensharePeerId = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.activeScreensharePeerId));
|
|
15644
|
+
const trackId = (_a7 = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectVideoTrackByPeerID)(activeScreensharePeerId))) == null ? void 0 : _a7.id;
|
|
15628
15645
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15629
15646
|
let ViewComponent;
|
|
15630
|
-
if (sidepane === SIDE_PANE_OPTIONS.PARTICIPANTS) {
|
|
15631
|
-
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(
|
|
15632
|
-
} else if (sidepane === SIDE_PANE_OPTIONS.CHAT) {
|
|
15633
|
-
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(Chat, { screenType, hideControls });
|
|
15647
|
+
if (sidepane === SIDE_PANE_OPTIONS.PARTICIPANTS || sidepane === SIDE_PANE_OPTIONS.CHAT) {
|
|
15648
|
+
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(SidePaneTabs, { screenType, hideControls, active: sidepane });
|
|
15634
15649
|
} else if (sidepane === SIDE_PANE_OPTIONS.STREAMING) {
|
|
15635
15650
|
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(StreamingLanding, null);
|
|
15636
15651
|
}
|
|
15637
15652
|
if (!ViewComponent && !trackId) {
|
|
15638
15653
|
return null;
|
|
15639
15654
|
}
|
|
15655
|
+
const tileLayout = {
|
|
15656
|
+
hideParticipantNameOnTile: tileProps == null ? void 0 : tileProps.hide_participant_name_on_tile,
|
|
15657
|
+
roundedVideoTile: tileProps == null ? void 0 : tileProps.rounded_video_tile,
|
|
15658
|
+
hideAudioMuteOnTile: tileProps == null ? void 0 : tileProps.hide_audio_mute_on_tile,
|
|
15659
|
+
hideMetadataOnTile: tileProps == null ? void 0 : tileProps.hide_metadata_on_tile,
|
|
15660
|
+
objectFit: tileProps == null ? void 0 : tileProps.video_object_fit
|
|
15661
|
+
};
|
|
15640
15662
|
const mwebStreamingChat = isMobile && sidepane === SIDE_PANE_OPTIONS.CHAT && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay);
|
|
15641
15663
|
return /* @__PURE__ */ import_react150.default.createElement(
|
|
15642
15664
|
Flex,
|
|
@@ -15658,9 +15680,8 @@ var init_SidePane = __esm({
|
|
|
15658
15680
|
trackId,
|
|
15659
15681
|
width: "100%",
|
|
15660
15682
|
height: 225,
|
|
15661
|
-
rootCSS: { p: 0, alignSelf: "start", flexShrink: 0 }
|
|
15662
|
-
|
|
15663
|
-
}, tileProps)
|
|
15683
|
+
rootCSS: { p: 0, alignSelf: "start", flexShrink: 0 }
|
|
15684
|
+
}, tileLayout)
|
|
15664
15685
|
),
|
|
15665
15686
|
!!ViewComponent && /* @__PURE__ */ import_react150.default.createElement(
|
|
15666
15687
|
Box,
|
|
@@ -16347,7 +16368,7 @@ var HLSView_exports = {};
|
|
|
16347
16368
|
__export(HLSView_exports, {
|
|
16348
16369
|
default: () => HLSView_default
|
|
16349
16370
|
});
|
|
16350
|
-
var import_react161, import_react_use31, import_hls_player3, import_screenfull3,
|
|
16371
|
+
var import_react161, import_react_use31, import_hls_player3, import_screenfull3, import_react_sdk88, import_react_icons72, hlsPlayer, HLSView, HLSView_default;
|
|
16351
16372
|
var init_HLSView = __esm({
|
|
16352
16373
|
"src/Prebuilt/layouts/HLSView.jsx"() {
|
|
16353
16374
|
"use strict";
|
|
@@ -16356,7 +16377,7 @@ var init_HLSView = __esm({
|
|
|
16356
16377
|
import_react_use31 = require("react-use");
|
|
16357
16378
|
import_hls_player3 = require("@100mslive/hls-player");
|
|
16358
16379
|
import_screenfull3 = __toESM(require("screenfull"));
|
|
16359
|
-
|
|
16380
|
+
import_react_sdk88 = require("@100mslive/react-sdk");
|
|
16360
16381
|
import_react_icons72 = require("@100mslive/react-icons");
|
|
16361
16382
|
init_HlsStatsOverlay();
|
|
16362
16383
|
init_HMSVideo2();
|
|
@@ -16375,9 +16396,9 @@ var init_HLSView = __esm({
|
|
|
16375
16396
|
var _a7;
|
|
16376
16397
|
const videoRef = (0, import_react161.useRef)(null);
|
|
16377
16398
|
const hlsViewRef = (0, import_react161.useRef)(null);
|
|
16378
|
-
const hlsState = (0,
|
|
16379
|
-
const enablHlsStats = (0,
|
|
16380
|
-
const hmsActions = (0,
|
|
16399
|
+
const hlsState = (0, import_react_sdk88.useHMSStore)(import_react_sdk88.selectHLSState);
|
|
16400
|
+
const enablHlsStats = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectAppData)(APP_DATA.hlsStats));
|
|
16401
|
+
const hmsActions = (0, import_react_sdk88.useHMSActions)();
|
|
16381
16402
|
const { themeType, theme: theme2 } = useTheme();
|
|
16382
16403
|
const [streamEnded, setStreamEnded] = (0, import_react161.useState)(false);
|
|
16383
16404
|
let [hlsStatsState, setHlsStatsState] = (0, import_react161.useState)(null);
|
|
@@ -16695,13 +16716,13 @@ var init_HLSView = __esm({
|
|
|
16695
16716
|
});
|
|
16696
16717
|
|
|
16697
16718
|
// src/Prebuilt/layouts/VideoStreamingSection.tsx
|
|
16698
|
-
var import_react162,
|
|
16719
|
+
var import_react162, import_react_sdk89, HLSView2, VideoStreamingSection;
|
|
16699
16720
|
var init_VideoStreamingSection = __esm({
|
|
16700
16721
|
"src/Prebuilt/layouts/VideoStreamingSection.tsx"() {
|
|
16701
16722
|
"use strict";
|
|
16702
16723
|
init_define_process_env();
|
|
16703
16724
|
import_react162 = __toESM(require("react"));
|
|
16704
|
-
|
|
16725
|
+
import_react_sdk89 = require("@100mslive/react-sdk");
|
|
16705
16726
|
init_FullPageProgress();
|
|
16706
16727
|
init_GridLayout();
|
|
16707
16728
|
init_Layout();
|
|
@@ -16718,9 +16739,9 @@ var init_VideoStreamingSection = __esm({
|
|
|
16718
16739
|
hideControls = false
|
|
16719
16740
|
}) => {
|
|
16720
16741
|
var _a7, _b7;
|
|
16721
|
-
const localPeerRole = (0,
|
|
16722
|
-
const isConnected = (0,
|
|
16723
|
-
const hmsActions = (0,
|
|
16742
|
+
const localPeerRole = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectLocalPeerRoleName);
|
|
16743
|
+
const isConnected = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectIsConnectedToRoom);
|
|
16744
|
+
const hmsActions = (0, import_react_sdk89.useHMSActions)();
|
|
16724
16745
|
const waitingViewerRole = useWaitingViewerRole();
|
|
16725
16746
|
const urlToIframe = useUrlToEmbed();
|
|
16726
16747
|
const pdfAnnotatorActive = usePDFAnnotator();
|
|
@@ -16769,30 +16790,33 @@ var init_VideoStreamingSection = __esm({
|
|
|
16769
16790
|
});
|
|
16770
16791
|
|
|
16771
16792
|
// src/Prebuilt/components/RoleChangeRequestModal.tsx
|
|
16772
|
-
var import_react163,
|
|
16793
|
+
var import_react163, import_react_sdk90, RoleChangeRequestModal, RequestDialog2;
|
|
16773
16794
|
var init_RoleChangeRequestModal = __esm({
|
|
16774
16795
|
"src/Prebuilt/components/RoleChangeRequestModal.tsx"() {
|
|
16775
16796
|
"use strict";
|
|
16776
16797
|
init_define_process_env();
|
|
16777
16798
|
import_react163 = __toESM(require("react"));
|
|
16778
|
-
|
|
16799
|
+
import_react_sdk90 = require("@100mslive/react-sdk");
|
|
16779
16800
|
init_PreviewJoin();
|
|
16780
16801
|
init_src();
|
|
16781
16802
|
init_useMetadata();
|
|
16782
16803
|
init_constants();
|
|
16783
16804
|
RoleChangeRequestModal = () => {
|
|
16784
|
-
const hmsActions = (0,
|
|
16805
|
+
const hmsActions = (0, import_react_sdk90.useHMSActions)();
|
|
16785
16806
|
const { updateMetaData } = useMyMetadata();
|
|
16786
|
-
const currentRole = (0,
|
|
16787
|
-
const roleChangeRequest = (0,
|
|
16788
|
-
const name = (0,
|
|
16789
|
-
const { sendEvent } = (0,
|
|
16807
|
+
const currentRole = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerRoleName);
|
|
16808
|
+
const roleChangeRequest = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectRoleChangeRequest);
|
|
16809
|
+
const name = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerName);
|
|
16810
|
+
const { sendEvent } = (0, import_react_sdk90.useCustomEvent)({ type: ROLE_CHANGE_DECLINED });
|
|
16790
16811
|
(0, import_react163.useEffect)(() => {
|
|
16791
16812
|
if (!(roleChangeRequest == null ? void 0 : roleChangeRequest.role)) {
|
|
16792
16813
|
return;
|
|
16793
16814
|
}
|
|
16794
|
-
|
|
16795
|
-
|
|
16815
|
+
(() => __async(void 0, null, function* () {
|
|
16816
|
+
yield updateMetaData({ prevRole: currentRole });
|
|
16817
|
+
yield hmsActions.preview({ asRole: roleChangeRequest.role.name });
|
|
16818
|
+
}))();
|
|
16819
|
+
}, [hmsActions, roleChangeRequest, currentRole, updateMetaData]);
|
|
16796
16820
|
if (!(roleChangeRequest == null ? void 0 : roleChangeRequest.role)) {
|
|
16797
16821
|
return null;
|
|
16798
16822
|
}
|
|
@@ -16826,7 +16850,7 @@ var init_RoleChangeRequestModal = __esm({
|
|
|
16826
16850
|
body,
|
|
16827
16851
|
onAction: () => __async(void 0, null, function* () {
|
|
16828
16852
|
yield hmsActions.acceptChangeRole(roleChangeRequest);
|
|
16829
|
-
yield updateMetaData({ isHandRaised: false
|
|
16853
|
+
yield updateMetaData({ isHandRaised: false });
|
|
16830
16854
|
}),
|
|
16831
16855
|
actionText: "Accept"
|
|
16832
16856
|
}
|
|
@@ -16848,7 +16872,7 @@ var conference_exports = {};
|
|
|
16848
16872
|
__export(conference_exports, {
|
|
16849
16873
|
default: () => conference_default
|
|
16850
16874
|
});
|
|
16851
|
-
var import_react164, import_react_router_dom5, import_react_use32,
|
|
16875
|
+
var import_react164, import_react_router_dom5, import_react_use32, import_react_sdk91, Conference, conference_default;
|
|
16852
16876
|
var init_conference = __esm({
|
|
16853
16877
|
"src/Prebuilt/components/conference.jsx"() {
|
|
16854
16878
|
"use strict";
|
|
@@ -16856,7 +16880,7 @@ var init_conference = __esm({
|
|
|
16856
16880
|
import_react164 = __toESM(require("react"));
|
|
16857
16881
|
import_react_router_dom5 = require("react-router-dom");
|
|
16858
16882
|
import_react_use32 = require("react-use");
|
|
16859
|
-
|
|
16883
|
+
import_react_sdk91 = require("@100mslive/react-sdk");
|
|
16860
16884
|
init_Footer3();
|
|
16861
16885
|
init_HLSFailureModal();
|
|
16862
16886
|
init_PIPComponent();
|
|
@@ -16877,12 +16901,12 @@ var init_conference = __esm({
|
|
|
16877
16901
|
const { userName, endpoints } = useHMSPrebuiltContext();
|
|
16878
16902
|
const screenProps = useRoomLayoutConferencingScreen();
|
|
16879
16903
|
const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
|
|
16880
|
-
const roomState = (0,
|
|
16904
|
+
const roomState = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectRoomState);
|
|
16881
16905
|
const prevState = (0, import_react_use32.usePrevious)(roomState);
|
|
16882
|
-
const isConnectedToRoom = (0,
|
|
16883
|
-
const hmsActions = (0,
|
|
16906
|
+
const isConnectedToRoom = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectIsConnectedToRoom);
|
|
16907
|
+
const hmsActions = (0, import_react_sdk91.useHMSActions)();
|
|
16884
16908
|
const [hideControls, setHideControls] = (0, import_react164.useState)(false);
|
|
16885
|
-
const dropdownList = (0,
|
|
16909
|
+
const dropdownList = (0, import_react_sdk91.useHMSStore)((0, import_react_sdk91.selectAppData)(APP_DATA.dropdownList));
|
|
16886
16910
|
const authTokenInAppData = useAuthToken();
|
|
16887
16911
|
const headerRef = (0, import_react164.useRef)();
|
|
16888
16912
|
const footerRef = (0, import_react164.useRef)();
|
|
@@ -16918,7 +16942,7 @@ var init_conference = __esm({
|
|
|
16918
16942
|
if (!isPreviewScreenEnabled) {
|
|
16919
16943
|
return;
|
|
16920
16944
|
}
|
|
16921
|
-
if (!prevState && !(roomState ===
|
|
16945
|
+
if (!prevState && !(roomState === import_react_sdk91.HMSRoomState.Connecting || roomState === import_react_sdk91.HMSRoomState.Reconnecting || isConnectedToRoom)) {
|
|
16922
16946
|
if (role)
|
|
16923
16947
|
navigate(`/preview/${roomId || ""}/${role}`);
|
|
16924
16948
|
else
|
|
@@ -16926,7 +16950,7 @@ var init_conference = __esm({
|
|
|
16926
16950
|
}
|
|
16927
16951
|
}, [isConnectedToRoom, prevState, roomState, navigate, role, roomId, isPreviewScreenEnabled]);
|
|
16928
16952
|
(0, import_react164.useEffect)(() => {
|
|
16929
|
-
if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !==
|
|
16953
|
+
if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !== import_react_sdk91.HMSRoomState.Connecting) {
|
|
16930
16954
|
hmsActions.join({
|
|
16931
16955
|
userName,
|
|
16932
16956
|
authToken: authTokenInAppData,
|
|
@@ -17021,14 +17045,14 @@ function AppRoutes({
|
|
|
17021
17045
|
const isNotificationsDisabled = useIsNotificationDisabled();
|
|
17022
17046
|
return /* @__PURE__ */ import_react165.default.createElement(Router, null, /* @__PURE__ */ import_react165.default.createElement(import_react165.default.Fragment, null, /* @__PURE__ */ import_react165.default.createElement(ToastContainer, null), /* @__PURE__ */ import_react165.default.createElement(Notifications, null), /* @__PURE__ */ import_react165.default.createElement(BackSwipe, null), !isNotificationsDisabled && /* @__PURE__ */ import_react165.default.createElement(FlyingEmoji, null), /* @__PURE__ */ import_react165.default.createElement(RemoteStopScreenshare, null), /* @__PURE__ */ import_react165.default.createElement(KeyboardHandler, null), /* @__PURE__ */ import_react165.default.createElement(AuthToken_default, { authTokenByRoomCodeEndpoint, defaultAuthToken }), roomLayout && /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Routes, null, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/*", element: /* @__PURE__ */ import_react165.default.createElement(RouteList, null) }))));
|
|
17023
17047
|
}
|
|
17024
|
-
var import_react165, import_react_router_dom6,
|
|
17048
|
+
var import_react165, import_react_router_dom6, import_react_sdk92, Conference2, HMSPrebuilt, Redirector, RouteList, BackSwipe, Router;
|
|
17025
17049
|
var init_App = __esm({
|
|
17026
17050
|
"src/Prebuilt/App.tsx"() {
|
|
17027
17051
|
"use strict";
|
|
17028
17052
|
init_define_process_env();
|
|
17029
17053
|
import_react165 = __toESM(require("react"));
|
|
17030
17054
|
import_react_router_dom6 = require("react-router-dom");
|
|
17031
|
-
|
|
17055
|
+
import_react_sdk92 = require("@100mslive/react-sdk");
|
|
17032
17056
|
init_AppData();
|
|
17033
17057
|
init_AuthToken();
|
|
17034
17058
|
init_ErrorBoundary();
|
|
@@ -17069,7 +17093,7 @@ var init_App = __esm({
|
|
|
17069
17093
|
const [hydrated, setHydrated] = import_react165.default.useState(false);
|
|
17070
17094
|
(0, import_react165.useEffect)(() => {
|
|
17071
17095
|
setHydrated(true);
|
|
17072
|
-
const hms = new
|
|
17096
|
+
const hms = new import_react_sdk92.HMSReactiveStore();
|
|
17073
17097
|
const hmsStore = hms.getStore();
|
|
17074
17098
|
const hmsActions = hms.getActions();
|
|
17075
17099
|
const hmsNotifications = hms.getNotifications();
|
|
@@ -17137,7 +17161,7 @@ var init_App = __esm({
|
|
|
17137
17161
|
}
|
|
17138
17162
|
},
|
|
17139
17163
|
/* @__PURE__ */ import_react165.default.createElement(
|
|
17140
|
-
|
|
17164
|
+
import_react_sdk92.HMSRoomProvider,
|
|
17141
17165
|
{
|
|
17142
17166
|
isHMSStatsOn: FeatureFlags.enableStatsForNerds,
|
|
17143
17167
|
actions: (_a7 = reactiveStore.current) == null ? void 0 : _a7.hmsActions,
|
|
@@ -17223,8 +17247,8 @@ var init_App = __esm({
|
|
|
17223
17247
|
)), isLeaveScreenEnabled ? /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "leave" }, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: ":roomId/:role", element: /* @__PURE__ */ import_react165.default.createElement(PostLeave_default, null) }), /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: ":roomId", element: /* @__PURE__ */ import_react165.default.createElement(PostLeave_default, null) })) : null, /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/:roomId/:role", element: /* @__PURE__ */ import_react165.default.createElement(Redirector, { showPreview: isPreviewScreenEnabled }) }), /* @__PURE__ */ import_react165.default.createElement(import_react_router_dom6.Route, { path: "/:roomId/", element: /* @__PURE__ */ import_react165.default.createElement(Redirector, { showPreview: isPreviewScreenEnabled }) }));
|
|
17224
17248
|
};
|
|
17225
17249
|
BackSwipe = () => {
|
|
17226
|
-
const isConnectedToRoom = (0,
|
|
17227
|
-
const hmsActions = (0,
|
|
17250
|
+
const isConnectedToRoom = (0, import_react_sdk92.useHMSStore)(import_react_sdk92.selectIsConnectedToRoom);
|
|
17251
|
+
const hmsActions = (0, import_react_sdk92.useHMSActions)();
|
|
17228
17252
|
(0, import_react165.useEffect)(() => {
|
|
17229
17253
|
const onRouteLeave = () => __async(void 0, null, function* () {
|
|
17230
17254
|
if (isConnectedToRoom) {
|