@100mslive/roomkit-react 0.1.6-alpha.1 → 0.1.6-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{HLSView-HNVYG5VE.js → HLSView-HL455FYH.js} +3 -3
- package/dist/Prebuilt/components/Footer/ChatToggle.d.ts +1 -3
- package/dist/Prebuilt/components/Leave/DesktopLeaveRoom.d.ts +2 -1
- package/dist/Prebuilt/components/Leave/MwebLeaveRoom.d.ts +2 -1
- package/dist/Prebuilt/components/SidePaneTabs.d.ts +7 -0
- package/dist/{VirtualBackground-UM2FOUHQ.js → VirtualBackground-6EP3X7MO.js} +6 -6
- package/dist/VirtualBackground-6EP3X7MO.js.map +7 -0
- package/dist/{chunk-LYSAET4G.js → chunk-6JF3GAOH.js} +109 -127
- package/dist/chunk-6JF3GAOH.js.map +7 -0
- package/dist/{chunk-POE7H4IE.js → chunk-KAJJ56J4.js} +2 -2
- package/dist/{chunk-POE7H4IE.js.map → chunk-KAJJ56J4.js.map} +1 -1
- package/dist/{chunk-364HP22I.js → chunk-UXBTLGWY.js} +2 -2
- package/dist/{conference-UWLJHMB2.js → conference-MPZNWHV5.js} +472 -415
- package/dist/conference-MPZNWHV5.js.map +7 -0
- package/dist/index.cjs.js +714 -678
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +2 -2
- package/dist/meta.cjs.json +153 -153
- package/dist/meta.esbuild.json +185 -184
- package/package.json +6 -6
- package/src/Button/Button.tsx +6 -6
- package/src/Prebuilt/components/Chat/Chat.jsx +3 -9
- package/src/Prebuilt/components/Chat/useEmojiPickerStyles.js +1 -0
- package/src/Prebuilt/components/Footer/ChatToggle.tsx +2 -9
- package/src/Prebuilt/components/Footer/Footer.tsx +23 -7
- package/src/Prebuilt/components/Footer/ParticipantList.jsx +4 -5
- package/src/Prebuilt/components/Footer/RoleAccordion.tsx +1 -1
- package/src/Prebuilt/components/Header/HeaderComponents.jsx +10 -9
- package/src/Prebuilt/components/InsetTile.tsx +1 -0
- package/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx +7 -9
- package/src/Prebuilt/components/Leave/LeaveRoom.tsx +6 -2
- package/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx +7 -4
- package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx +1 -1
- package/src/Prebuilt/components/Notifications/Notifications.jsx +4 -3
- package/src/Prebuilt/components/Preview/PreviewJoin.tsx +2 -3
- package/src/Prebuilt/components/RoleChangeRequestModal.tsx +4 -3
- package/src/Prebuilt/components/ScreenshareTile.jsx +15 -7
- package/src/Prebuilt/components/SidePaneTabs.tsx +141 -0
- package/src/Prebuilt/components/conference.jsx +9 -1
- 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/chunk-LYSAET4G.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-HL455FYH.js.map} +0 -0
- /package/dist/{chunk-364HP22I.js.map → chunk-UXBTLGWY.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_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_webpack_cli: "^4.9.2", npm_package_devDependencies_webpack_bundle_analyzer: "^4.5.0", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.19 npm/? node/v16.20.2 linux x64", npm_config_always_auth: "", NX_WORKSPACE_ROOT: "/home/runner/work/web-sdks/web-sdks", npm_package_devDependencies__rollup_plugin_node_resolve: "^13.1.3", npm_package_scripts_babel: "npx storybook@latest babelrc", CI: "true", npm_package_devDependencies__size_limit_file: "^5.0.3", npm_config_bin_links: "true", npm_config_wrap_output: "", npm_package_dependencies__radix_ui_react_tabs: "1.0.0", npm_package_dependencies__100mslive_react_sdk: "0.8.15-alpha.3", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", npm_config_init_version: "1.0.0", npm_package_dependencies__emoji_mart_react: "^1.0.1", npm_package_dependencies__emoji_mart_data: "^1.0.6", npm_package_dependencies__100mslive_hms_virtual_background: "1.11.15-alpha.3", JAVA_HOME_8_X64: "/usr/lib/jvm/temurin-8-jdk-amd64", NODE_AUTH_TOKEN: "XXXXX-XXXXX-XXXXX-XXXXX", SHLVL: "1", npm_package_dependencies__radix_ui_react_tooltip: "1.0.6", npm_package_dependencies__radix_ui_react_popover: "1.0.6", npm_package_dependencies__100mslive_types_prebuilt: "0.12.0", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_webpack_manifest_plugin: "^4.1.1", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.3", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "663", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.7", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_dependencies_react_router_dom: "^6.3.0", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.7/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.0/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20230903.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:17188", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_scripts_app: "cd apps/100ms-web && yarn start", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_sdk: "cd packages/hms-video-web && yarn start", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.1.15-alpha.3", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", GITHUB_RUN_ID: "6168539635", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "1724f0ddfffa3cd09487ab41c065c426c70c2bc3", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "apps/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "c67220c7f325baf560839d83195ee95941437fbb226869951f813b8aca3fdcfc", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/main", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GOROOT_1_18_X64: "/opt/hostedtoolcache/go/1.18.10/x64", GITHUB_ACTION_REPOSITORY: "", npm_package_workspaces_2: "playwright/*", npm_package_devDependencies_postcss_loader: "^6.2.1", PATH: "/tmp/yarn--1694584759586-0.4054495577248629:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584759378-0.1806739657761589:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584717715-0.032552056606420354:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1694584717521-0.3709286938947527:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/16.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/16.20.2/x64/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/snap/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/16.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_d9c702be-997e-4033-8626-ad85b8def8e1", INVOCATION_ID: "94d3b65fbfbb4008ab59c642387a4b27", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", GOROOT_1_19_X64: "/opt/hostedtoolcache/go/1.19.12/x64", npm_package_husky_hooks_pre_push: "lint-staged", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "369", GITHUB_TRIGGERING_ACTOR: "raviteja83", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies_pusher_js: "^7.0.3", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "80 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "80 KB", npm_package_lint_staged__: "format && lint:fix", npm_package_devDependencies_webpack: "^5.76.0", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 2", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "main", GITHUB_REPOSITORY: "100mslive/web-sdks", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "20 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-web/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_webpack_dev_server: "^4.7.4", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.8.15-alpha.3", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", STATS_NM: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.1.6-alpha.3", npm_package_size_limit_4_limit: "400 KB", npm_package_size_limit_1_path: "packages/hms-video-web/dist/index.js", npm_package_husky_hooks_pre_commit: "lint-staged", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "20 KB", npm_package_size_limit_3_path: "packages/hms-video-store/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "1724f0ddfffa3cd09487ab41c065c426c70c2bc3", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "20 KB", npm_package_size_limit_4_path: "packages/roomkit-react/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/main", GITHUB_ACTOR: "raviteja83", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_size_limit_8_limit: "100 KB", npm_package_size_limit_5_path: "packages/roomkit-react/dist/index.js", npm_config_strict_ssl: "true", npm_package_license: "MIT", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_9_limit: "100 KB", npm_package_size_limit_6_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "6763261", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/hms-virtual-background/dist/index.js", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.10.0-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_98258c95-4c6a-4d26-99ac-b24d0c9f2eab", npm_package_size_limit_8_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_size_limit_9_path: "packages/react-icons/dist/index.js", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.154/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_scripts_app_custom: "cd apps/100ms-custom-app && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_98258c95-4c6a-4d26-99ac-b24d0c9f2eab" };
|
|
109
109
|
}
|
|
110
110
|
});
|
|
111
111
|
|
|
@@ -814,12 +814,12 @@ var init_Button = __esm({
|
|
|
814
814
|
variants: {
|
|
815
815
|
variant: {
|
|
816
816
|
standard: getButtonVariants(
|
|
817
|
-
"$
|
|
818
|
-
"$
|
|
819
|
-
"$
|
|
820
|
-
"$
|
|
821
|
-
"$
|
|
822
|
-
"$
|
|
817
|
+
"$surface_brighter",
|
|
818
|
+
"$surface_bright",
|
|
819
|
+
"$surface_default",
|
|
820
|
+
"$surface_dim",
|
|
821
|
+
"$on_surface_high",
|
|
822
|
+
"$on_surface_low"
|
|
823
823
|
),
|
|
824
824
|
danger: getButtonVariants(
|
|
825
825
|
"$alert_error_default",
|
|
@@ -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
|
}
|
|
@@ -5957,7 +5957,7 @@ function Notifications() {
|
|
|
5957
5957
|
title: `Error: ${(_k = notification.data) == null ? void 0 : _k.message} - ${(_l = notification.data) == null ? void 0 : _l.description}`
|
|
5958
5958
|
});
|
|
5959
5959
|
break;
|
|
5960
|
-
case import_react_sdk19.HMSNotificationTypes.ROLE_UPDATED:
|
|
5960
|
+
case import_react_sdk19.HMSNotificationTypes.ROLE_UPDATED: {
|
|
5961
5961
|
if ((_m = notification.data) == null ? void 0 : _m.isLocal) {
|
|
5962
5962
|
ToastManager.addToast({
|
|
5963
5963
|
title: `You are now a ${notification.data.roleName}`
|
|
@@ -5965,6 +5965,7 @@ function Notifications() {
|
|
|
5965
5965
|
updateRoomLayoutForRole(notification.data.roleName);
|
|
5966
5966
|
}
|
|
5967
5967
|
break;
|
|
5968
|
+
}
|
|
5968
5969
|
case import_react_sdk19.HMSNotificationTypes.CHANGE_TRACK_STATE_REQUEST:
|
|
5969
5970
|
const track = (_n = notification.data) == null ? void 0 : _n.track;
|
|
5970
5971
|
if (!notification.data.enabled) {
|
|
@@ -6033,13 +6034,12 @@ var init_Notifications2 = __esm({
|
|
|
6033
6034
|
});
|
|
6034
6035
|
|
|
6035
6036
|
// src/Prebuilt/components/Header/HeaderComponents.jsx
|
|
6036
|
-
var import_react47,
|
|
6037
|
+
var import_react47, import_react_sdk20, import_react_icons12, SpeakerTag, LogoImg, Logo;
|
|
6037
6038
|
var init_HeaderComponents = __esm({
|
|
6038
6039
|
"src/Prebuilt/components/Header/HeaderComponents.jsx"() {
|
|
6039
6040
|
"use strict";
|
|
6040
6041
|
init_define_process_env();
|
|
6041
6042
|
import_react47 = __toESM(require("react"));
|
|
6042
|
-
import_react_use3 = require("react-use");
|
|
6043
6043
|
import_react_sdk20 = require("@100mslive/react-sdk");
|
|
6044
6044
|
import_react_icons12 = require("@100mslive/react-icons");
|
|
6045
6045
|
init_src();
|
|
@@ -6070,12 +6070,12 @@ var init_HeaderComponents = __esm({
|
|
|
6070
6070
|
var _a7;
|
|
6071
6071
|
const roomLayout = useRoomLayout();
|
|
6072
6072
|
const logo = (_a7 = roomLayout == null ? void 0 : roomLayout.logo) == null ? void 0 : _a7.url;
|
|
6073
|
-
const isMobile = (0, import_react_use3.useMedia)(config.media.md);
|
|
6074
|
-
const isConnected = (0, import_react_sdk20.useHMSStore)(import_react_sdk20.selectIsConnectedToRoom);
|
|
6075
6073
|
const [hideImage, setHideImage] = (0, import_react47.useState)(false);
|
|
6076
|
-
|
|
6077
|
-
|
|
6078
|
-
|
|
6074
|
+
(0, import_react47.useEffect)(() => {
|
|
6075
|
+
if (hideImage) {
|
|
6076
|
+
setHideImage(false);
|
|
6077
|
+
}
|
|
6078
|
+
}, [logo]);
|
|
6079
6079
|
return logo && !hideImage ? /* @__PURE__ */ import_react47.default.createElement(
|
|
6080
6080
|
LogoImg,
|
|
6081
6081
|
{
|
|
@@ -6220,8 +6220,6 @@ var init_useMetadata = __esm({
|
|
|
6220
6220
|
const localPeerId = (0, import_react_sdk21.useHMSStore)(import_react_sdk21.selectLocalPeerID);
|
|
6221
6221
|
const vanillaStore = (0, import_react_sdk21.useHMSVanillaStore)();
|
|
6222
6222
|
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
6223
|
const update = (updatedFields) => __async(void 0, null, function* () {
|
|
6226
6224
|
try {
|
|
6227
6225
|
const currentMetadata = vanillaStore.getState((0, import_react_sdk21.selectPeerMetadata)(localPeerId));
|
|
@@ -6232,35 +6230,19 @@ var init_useMetadata = __esm({
|
|
|
6232
6230
|
}
|
|
6233
6231
|
});
|
|
6234
6232
|
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]);
|
|
6233
|
+
yield update({ isHandRaised: !(metaData == null ? void 0 : metaData.isHandRaised), isBRBOn: false });
|
|
6234
|
+
}), [metaData == null ? void 0 : metaData.isHandRaised]);
|
|
6245
6235
|
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]);
|
|
6236
|
+
yield update({ isBRBOn: !(metaData == null ? void 0 : metaData.isBRBOn), isHandRaised: false });
|
|
6237
|
+
}), [metaData == null ? void 0 : metaData.isBRBOn]);
|
|
6256
6238
|
const setPrevRole = (role) => __async(void 0, null, function* () {
|
|
6257
6239
|
yield update({
|
|
6258
6240
|
prevRole: role
|
|
6259
6241
|
});
|
|
6260
6242
|
});
|
|
6261
6243
|
return {
|
|
6262
|
-
isHandRaised,
|
|
6263
|
-
isBRBOn,
|
|
6244
|
+
isHandRaised: !!(metaData == null ? void 0 : metaData.isHandRaised),
|
|
6245
|
+
isBRBOn: !!(metaData == null ? void 0 : metaData.isBRBOn),
|
|
6264
6246
|
metaData,
|
|
6265
6247
|
updateMetaData: update,
|
|
6266
6248
|
toggleHandRaise,
|
|
@@ -6506,13 +6488,13 @@ var init_AdditionalRoomState = __esm({
|
|
|
6506
6488
|
});
|
|
6507
6489
|
|
|
6508
6490
|
// src/Prebuilt/components/Header/StreamActions.tsx
|
|
6509
|
-
var import_react54,
|
|
6491
|
+
var import_react54, import_react_use3, import_react_sdk26, import_react_icons14, LiveStatus, RecordingStatus, StartRecording, StreamActions, StopRecordingInSheet;
|
|
6510
6492
|
var init_StreamActions = __esm({
|
|
6511
6493
|
"src/Prebuilt/components/Header/StreamActions.tsx"() {
|
|
6512
6494
|
"use strict";
|
|
6513
6495
|
init_define_process_env();
|
|
6514
6496
|
import_react54 = __toESM(require("react"));
|
|
6515
|
-
|
|
6497
|
+
import_react_use3 = require("react-use");
|
|
6516
6498
|
import_react_sdk26 = require("@100mslive/react-sdk");
|
|
6517
6499
|
import_react_icons14 = require("@100mslive/react-icons");
|
|
6518
6500
|
init_src();
|
|
@@ -6526,7 +6508,7 @@ var init_StreamActions = __esm({
|
|
|
6526
6508
|
var _a7;
|
|
6527
6509
|
const { isHLSRunning, isRTMPRunning } = (0, import_react_sdk26.useRecordingStreaming)();
|
|
6528
6510
|
const hlsState = (0, import_react_sdk26.useHMSStore)(import_react_sdk26.selectHLSState);
|
|
6529
|
-
const isMobile = (0,
|
|
6511
|
+
const isMobile = (0, import_react_use3.useMedia)(config.media.md);
|
|
6530
6512
|
const intervalRef = (0, import_react54.useRef)(null);
|
|
6531
6513
|
const [liveTime, setLiveTime] = (0, import_react54.useState)(0);
|
|
6532
6514
|
const startTimer = (0, import_react54.useCallback)(() => {
|
|
@@ -6571,7 +6553,7 @@ var init_StreamActions = __esm({
|
|
|
6571
6553
|
RecordingStatus = () => {
|
|
6572
6554
|
const { isBrowserRecordingOn, isServerRecordingOn, isHLSRecordingOn, isRecordingOn } = (0, import_react_sdk26.useRecordingStreaming)();
|
|
6573
6555
|
const permissions = (0, import_react_sdk26.useHMSStore)(import_react_sdk26.selectPermissions);
|
|
6574
|
-
const isMobile = (0,
|
|
6556
|
+
const isMobile = (0, import_react_use3.useMedia)(config.media.md);
|
|
6575
6557
|
if (!isRecordingOn || // if only browser recording is enabled, stop recording is shown
|
|
6576
6558
|
// so no need to show this as it duplicates
|
|
6577
6559
|
[permissions == null ? void 0 : permissions.browserRecording, !isServerRecordingOn, !isHLSRecordingOn, isBrowserRecordingOn].every(
|
|
@@ -6671,7 +6653,7 @@ var init_StreamActions = __esm({
|
|
|
6671
6653
|
};
|
|
6672
6654
|
StreamActions = () => {
|
|
6673
6655
|
const isConnected = (0, import_react_sdk26.useHMSStore)(import_react_sdk26.selectIsConnectedToRoom);
|
|
6674
|
-
const isMobile = (0,
|
|
6656
|
+
const isMobile = (0, import_react_use3.useMedia)(config.media.md);
|
|
6675
6657
|
const roomState = (0, import_react_sdk26.useHMSStore)(import_react_sdk26.selectRoomState);
|
|
6676
6658
|
return /* @__PURE__ */ import_react54.default.createElement(Flex, { align: "center", css: { gap: "$4" } }, /* @__PURE__ */ import_react54.default.createElement(AdditionalRoomState, null), !isMobile && /* @__PURE__ */ import_react54.default.createElement(Flex, { align: "center", css: { gap: "$4" } }, /* @__PURE__ */ import_react54.default.createElement(RecordingStatus, null), roomState !== import_react_sdk26.HMSRoomState.Preview ? /* @__PURE__ */ import_react54.default.createElement(LiveStatus, null) : null), isConnected && !isMobile ? /* @__PURE__ */ import_react54.default.createElement(StartRecording, null) : null);
|
|
6677
6659
|
};
|
|
@@ -6869,13 +6851,13 @@ var init_common = __esm({
|
|
|
6869
6851
|
});
|
|
6870
6852
|
|
|
6871
6853
|
// src/Prebuilt/components/Header/Header.tsx
|
|
6872
|
-
var import_react56,
|
|
6854
|
+
var import_react56, import_react_use4, import_react_sdk28, Header2;
|
|
6873
6855
|
var init_Header = __esm({
|
|
6874
6856
|
"src/Prebuilt/components/Header/Header.tsx"() {
|
|
6875
6857
|
"use strict";
|
|
6876
6858
|
init_define_process_env();
|
|
6877
6859
|
import_react56 = __toESM(require("react"));
|
|
6878
|
-
|
|
6860
|
+
import_react_use4 = require("react-use");
|
|
6879
6861
|
import_react_sdk28 = require("@100mslive/react-sdk");
|
|
6880
6862
|
init_src();
|
|
6881
6863
|
init_HeaderComponents();
|
|
@@ -6883,7 +6865,7 @@ var init_Header = __esm({
|
|
|
6883
6865
|
init_common();
|
|
6884
6866
|
Header2 = () => {
|
|
6885
6867
|
const roomState = (0, import_react_sdk28.useHMSStore)(import_react_sdk28.selectRoomState);
|
|
6886
|
-
const isMobile = (0,
|
|
6868
|
+
const isMobile = (0, import_react_use4.useMedia)(config.media.md);
|
|
6887
6869
|
if (roomState !== import_react_sdk28.HMSRoomState.Connected) {
|
|
6888
6870
|
return /* @__PURE__ */ import_react56.default.createElement(import_react56.default.Fragment, null);
|
|
6889
6871
|
}
|
|
@@ -7883,13 +7865,13 @@ var init_common2 = __esm({
|
|
|
7883
7865
|
});
|
|
7884
7866
|
|
|
7885
7867
|
// src/Prebuilt/components/Settings/SettingsModal.jsx
|
|
7886
|
-
var import_react68,
|
|
7868
|
+
var import_react68, import_react_use5, import_react_icons25, SettingsModal, MobileSettingModal, DesktopSettingModal, SettingsContentHeader, SettingsModal_default;
|
|
7887
7869
|
var init_SettingsModal = __esm({
|
|
7888
7870
|
"src/Prebuilt/components/Settings/SettingsModal.jsx"() {
|
|
7889
7871
|
"use strict";
|
|
7890
7872
|
init_define_process_env();
|
|
7891
7873
|
import_react68 = __toESM(require("react"));
|
|
7892
|
-
|
|
7874
|
+
import_react_use5 = require("react-use");
|
|
7893
7875
|
import_react_icons25 = require("@100mslive/react-icons");
|
|
7894
7876
|
init_Divider2();
|
|
7895
7877
|
init_IconButton2();
|
|
@@ -7902,7 +7884,7 @@ var init_SettingsModal = __esm({
|
|
|
7902
7884
|
init_common2();
|
|
7903
7885
|
SettingsModal = ({ open, onOpenChange, screenType, children = /* @__PURE__ */ import_react68.default.createElement(import_react68.default.Fragment, null) }) => {
|
|
7904
7886
|
const mediaQueryLg = config.media.md;
|
|
7905
|
-
const isMobile = (0,
|
|
7887
|
+
const isMobile = (0, import_react_use5.useMedia)(mediaQueryLg);
|
|
7906
7888
|
const [showSetting, setShowSetting] = (0, import_react68.useState)(
|
|
7907
7889
|
() => settingsList.reduce((obj, { tabName }) => __spreadProps(__spreadValues({}, obj), { [tabName]: true }), {})
|
|
7908
7890
|
);
|
|
@@ -8222,13 +8204,13 @@ var init_ChangeNameContent = __esm({
|
|
|
8222
8204
|
});
|
|
8223
8205
|
|
|
8224
8206
|
// src/Prebuilt/components/MoreSettings/ChangeNameModal.jsx
|
|
8225
|
-
var import_react70,
|
|
8207
|
+
var import_react70, import_react_use6, import_react_sdk33, ChangeNameModal;
|
|
8226
8208
|
var init_ChangeNameModal = __esm({
|
|
8227
8209
|
"src/Prebuilt/components/MoreSettings/ChangeNameModal.jsx"() {
|
|
8228
8210
|
"use strict";
|
|
8229
8211
|
init_define_process_env();
|
|
8230
8212
|
import_react70 = __toESM(require("react"));
|
|
8231
|
-
|
|
8213
|
+
import_react_use6 = require("react-use");
|
|
8232
8214
|
import_react_sdk33 = require("@100mslive/react-sdk");
|
|
8233
8215
|
init_src();
|
|
8234
8216
|
init_Sheet2();
|
|
@@ -8240,7 +8222,7 @@ var init_ChangeNameModal = __esm({
|
|
|
8240
8222
|
const hmsActions = (0, import_react_sdk33.useHMSActions)();
|
|
8241
8223
|
const localPeerName = (0, import_react_sdk33.useHMSStore)(import_react_sdk33.selectLocalPeerName);
|
|
8242
8224
|
const [currentName, setCurrentName] = (0, import_react70.useState)(localPeerName);
|
|
8243
|
-
const isMobile = (0,
|
|
8225
|
+
const isMobile = (0, import_react_use6.useMedia)(config.media.md);
|
|
8244
8226
|
const changeName = () => __async(void 0, null, function* () {
|
|
8245
8227
|
const name = currentName.trim();
|
|
8246
8228
|
if (!name || name === localPeerName) {
|
|
@@ -8279,13 +8261,13 @@ var init_ChangeNameModal = __esm({
|
|
|
8279
8261
|
});
|
|
8280
8262
|
|
|
8281
8263
|
// src/Prebuilt/components/TileMenu/TileMenuContent.jsx
|
|
8282
|
-
var import_react71,
|
|
8264
|
+
var import_react71, import_react_use7, import_react_sdk34, import_react_icons27, isSameTile, spacingCSS, SpotlightActions, PinActions, MinimiseInset, SimulcastLayers, TileMenuContent;
|
|
8283
8265
|
var init_TileMenuContent = __esm({
|
|
8284
8266
|
"src/Prebuilt/components/TileMenu/TileMenuContent.jsx"() {
|
|
8285
8267
|
"use strict";
|
|
8286
8268
|
init_define_process_env();
|
|
8287
8269
|
import_react71 = __toESM(require("react"));
|
|
8288
|
-
|
|
8270
|
+
import_react_use7 = require("react-use");
|
|
8289
8271
|
import_react_sdk34 = require("@100mslive/react-sdk");
|
|
8290
8272
|
import_react_icons27 = require("@100mslive/react-icons");
|
|
8291
8273
|
init_Layout();
|
|
@@ -8440,7 +8422,7 @@ var init_TileMenuContent = __esm({
|
|
|
8440
8422
|
const { sendEvent } = (0, import_react_sdk34.useCustomEvent)({
|
|
8441
8423
|
type: REMOTE_STOP_SCREENSHARE_TYPE
|
|
8442
8424
|
});
|
|
8443
|
-
const isMobile = (0,
|
|
8425
|
+
const isMobile = (0, import_react_use7.useMedia)(config.media.md);
|
|
8444
8426
|
return isLocal ? (showPinAction || canMinimise) && /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, showPinAction && /* @__PURE__ */ import_react71.default.createElement(PinActions, { audioTrackID, videoTrackID }), showSpotlight && /* @__PURE__ */ import_react71.default.createElement(SpotlightActions, { peerId: peerID, onSpotLightClick: () => closeSheetOnClick() }), canMinimise && /* @__PURE__ */ import_react71.default.createElement(MinimiseInset, null), /* @__PURE__ */ import_react71.default.createElement(
|
|
8445
8427
|
StyledMenuTile.ItemButton,
|
|
8446
8428
|
{
|
|
@@ -8536,13 +8518,13 @@ var init_useDropdownList = __esm({
|
|
|
8536
8518
|
});
|
|
8537
8519
|
|
|
8538
8520
|
// src/Prebuilt/components/TileMenu/TileMenu.jsx
|
|
8539
|
-
var import_react73,
|
|
8521
|
+
var import_react73, import_react_use8, import_react_sdk35, import_react_icons28, TileMenu, TileMenu_default;
|
|
8540
8522
|
var init_TileMenu2 = __esm({
|
|
8541
8523
|
"src/Prebuilt/components/TileMenu/TileMenu.jsx"() {
|
|
8542
8524
|
"use strict";
|
|
8543
8525
|
init_define_process_env();
|
|
8544
8526
|
import_react73 = __toESM(require("react"));
|
|
8545
|
-
|
|
8527
|
+
import_react_use8 = require("react-use");
|
|
8546
8528
|
import_react_sdk35 = require("@100mslive/react-sdk");
|
|
8547
8529
|
import_react_icons28 = require("@100mslive/react-icons");
|
|
8548
8530
|
init_Layout();
|
|
@@ -8574,7 +8556,7 @@ var init_TileMenu2 = __esm({
|
|
|
8574
8556
|
const showPinAction = audioTrackID || videoTrackID && isPrimaryVideoTrack;
|
|
8575
8557
|
const track = (0, import_react_sdk35.useHMSStore)((0, import_react_sdk35.selectTrackByID)(videoTrackID));
|
|
8576
8558
|
const hideSimulcastLayers = !((_b7 = track == null ? void 0 : track.layerDefinitions) == null ? void 0 : _b7.length) || track.degraded || !track.enabled;
|
|
8577
|
-
const isMobile = (0,
|
|
8559
|
+
const isMobile = (0, import_react_use8.useMedia)(config.media.md);
|
|
8578
8560
|
const peer = (0, import_react_sdk35.useHMSStore)((0, import_react_sdk35.selectPeerByID)(peerID));
|
|
8579
8561
|
const [showNameChangeModal, setShowNameChangeModal] = (0, import_react73.useState)(false);
|
|
8580
8562
|
useDropdownList({ open, name: "TileMenu" });
|
|
@@ -8851,13 +8833,13 @@ var init_VideoTile2 = __esm({
|
|
|
8851
8833
|
});
|
|
8852
8834
|
|
|
8853
8835
|
// src/Prebuilt/components/Preview/PreviewForm.tsx
|
|
8854
|
-
var import_react75,
|
|
8836
|
+
var import_react75, import_react_use9, import_join_form2, import_react_sdk37, import_react_icons30, PreviewForm, Form, PreviewForm_default;
|
|
8855
8837
|
var init_PreviewForm = __esm({
|
|
8856
8838
|
"src/Prebuilt/components/Preview/PreviewForm.tsx"() {
|
|
8857
8839
|
"use strict";
|
|
8858
8840
|
init_define_process_env();
|
|
8859
8841
|
import_react75 = __toESM(require("react"));
|
|
8860
|
-
|
|
8842
|
+
import_react_use9 = require("react-use");
|
|
8861
8843
|
import_join_form2 = require("@100mslive/types-prebuilt/elements/join_form");
|
|
8862
8844
|
import_react_sdk37 = require("@100mslive/react-sdk");
|
|
8863
8845
|
import_react_icons30 = require("@100mslive/react-icons");
|
|
@@ -8876,7 +8858,7 @@ var init_PreviewForm = __esm({
|
|
|
8876
8858
|
const formSubmit = (e) => {
|
|
8877
8859
|
e.preventDefault();
|
|
8878
8860
|
};
|
|
8879
|
-
const isMobile = (0,
|
|
8861
|
+
const isMobile = (0, import_react_use9.useMedia)(config.media.md);
|
|
8880
8862
|
const { isHLSRunning } = (0, import_react_sdk37.useRecordingStreaming)();
|
|
8881
8863
|
const layout = useRoomLayout();
|
|
8882
8864
|
const { join_form: joinForm = {} } = ((_c = (_b7 = (_a7 = layout == null ? void 0 : layout.screens) == null ? void 0 : _a7.preview) == null ? void 0 : _b7.default) == null ? void 0 : _c.elements) || {};
|
|
@@ -9081,8 +9063,8 @@ var init_VirtualBackground = __esm({
|
|
|
9081
9063
|
}) => {
|
|
9082
9064
|
const pluginRef = (0, import_react77.useRef)(null);
|
|
9083
9065
|
const hmsActions = (0, import_react_sdk38.useHMSActions)();
|
|
9084
|
-
const isAllowedToPublish = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectIsAllowedToPublish);
|
|
9085
9066
|
const role = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectLocalPeerRole);
|
|
9067
|
+
const isVideoOn = (0, import_react_sdk38.useHMSStore)(import_react_sdk38.selectIsLocalVideoEnabled);
|
|
9086
9068
|
const [isVBLoading, setIsVBLoading] = (0, import_react77.useState)(false);
|
|
9087
9069
|
const [isVBSupported, setIsVBSupported] = (0, import_react77.useState)(false);
|
|
9088
9070
|
const [isVBOn, setIsVBOn] = (0, import_react77.useState)(false);
|
|
@@ -9128,7 +9110,7 @@ var init_VirtualBackground = __esm({
|
|
|
9128
9110
|
}
|
|
9129
9111
|
});
|
|
9130
9112
|
}
|
|
9131
|
-
if (!
|
|
9113
|
+
if (!isVBSupported || !isVideoOn) {
|
|
9132
9114
|
return null;
|
|
9133
9115
|
}
|
|
9134
9116
|
if (asActionTile) {
|
|
@@ -9173,13 +9155,13 @@ var init_VirtualBackground = __esm({
|
|
|
9173
9155
|
});
|
|
9174
9156
|
|
|
9175
9157
|
// src/Prebuilt/components/Preview/PreviewJoin.tsx
|
|
9176
|
-
var import_react78,
|
|
9158
|
+
var import_react78, import_react_use10, import_react_sdk39, import_react_icons32, VirtualBackground2, getParticipantChipContent, PreviewJoin, Container3, PreviewTile, PreviewControls, PreviewSettings, PreviewJoin_default;
|
|
9177
9159
|
var init_PreviewJoin = __esm({
|
|
9178
9160
|
"src/Prebuilt/components/Preview/PreviewJoin.tsx"() {
|
|
9179
9161
|
"use strict";
|
|
9180
9162
|
init_define_process_env();
|
|
9181
9163
|
import_react78 = __toESM(require("react"));
|
|
9182
|
-
|
|
9164
|
+
import_react_use10 = require("react-use");
|
|
9183
9165
|
import_react_sdk39 = require("@100mslive/react-sdk");
|
|
9184
9166
|
import_react_icons32 = require("@100mslive/react-icons");
|
|
9185
9167
|
init_src();
|
|
@@ -9327,7 +9309,7 @@ var init_PreviewJoin = __esm({
|
|
|
9327
9309
|
const track = (0, import_react_sdk39.useHMSStore)(trackSelector);
|
|
9328
9310
|
const showMuteIcon = !isLocalAudioEnabled || !toggleAudio;
|
|
9329
9311
|
const videoTrack = (0, import_react_sdk39.useHMSStore)((0, import_react_sdk39.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
|
|
9330
|
-
const isMobile = (0,
|
|
9312
|
+
const isMobile = (0, import_react_use10.useMedia)(config.media.md);
|
|
9331
9313
|
const aspectRatio = (videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) ? videoTrack.width / videoTrack.height : isMobile ? 9 / 16 : 16 / 9;
|
|
9332
9314
|
return /* @__PURE__ */ import_react78.default.createElement(
|
|
9333
9315
|
StyledVideoTile.Container,
|
|
@@ -9357,8 +9339,7 @@ var init_PreviewJoin = __esm({
|
|
|
9357
9339
|
);
|
|
9358
9340
|
};
|
|
9359
9341
|
PreviewControls = ({ hideSettings }) => {
|
|
9360
|
-
const
|
|
9361
|
-
const isMobile = (0, import_react_use11.useMedia)(config.media.md);
|
|
9342
|
+
const isMobile = (0, import_react_use10.useMedia)(config.media.md);
|
|
9362
9343
|
return /* @__PURE__ */ import_react78.default.createElement(
|
|
9363
9344
|
Flex,
|
|
9364
9345
|
{
|
|
@@ -9368,7 +9349,7 @@ var init_PreviewJoin = __esm({
|
|
|
9368
9349
|
mt: "$8"
|
|
9369
9350
|
}
|
|
9370
9351
|
},
|
|
9371
|
-
/* @__PURE__ */ import_react78.default.createElement(Flex, { css: { gap: "$4" } }, /* @__PURE__ */ import_react78.default.createElement(AudioVideoToggle,
|
|
9352
|
+
/* @__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
9353
|
!hideSettings ? /* @__PURE__ */ import_react78.default.createElement(PreviewSettings, null) : null
|
|
9373
9354
|
);
|
|
9374
9355
|
};
|
|
@@ -9381,14 +9362,14 @@ var init_PreviewJoin = __esm({
|
|
|
9381
9362
|
});
|
|
9382
9363
|
|
|
9383
9364
|
// src/Prebuilt/components/Preview/PreviewContainer.tsx
|
|
9384
|
-
var import_react79, import_react_router_dom4,
|
|
9365
|
+
var import_react79, import_react_router_dom4, import_react_use11, PreviewContainer, PreviewContainer_default;
|
|
9385
9366
|
var init_PreviewContainer = __esm({
|
|
9386
9367
|
"src/Prebuilt/components/Preview/PreviewContainer.tsx"() {
|
|
9387
9368
|
"use strict";
|
|
9388
9369
|
init_define_process_env();
|
|
9389
9370
|
import_react79 = __toESM(require("react"));
|
|
9390
9371
|
import_react_router_dom4 = require("react-router-dom");
|
|
9391
|
-
|
|
9372
|
+
import_react_use11 = require("react-use");
|
|
9392
9373
|
init_src();
|
|
9393
9374
|
init_AppContext();
|
|
9394
9375
|
init_roomLayoutProvider();
|
|
@@ -9402,7 +9383,7 @@ var init_PreviewContainer = __esm({
|
|
|
9402
9383
|
const navigate = (0, import_react_router_dom4.useNavigate)();
|
|
9403
9384
|
const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
|
|
9404
9385
|
const skipPreview = !isPreviewScreenEnabled;
|
|
9405
|
-
const previewAsRole = (0,
|
|
9386
|
+
const previewAsRole = (0, import_react_use11.useSearchParam)(QUERY_PARAM_PREVIEW_AS_ROLE);
|
|
9406
9387
|
const { userName } = useHMSPrebuiltContext();
|
|
9407
9388
|
const initialName = userName || (skipPreview ? "Beam" : "");
|
|
9408
9389
|
const { roomId: urlRoomId, role: userRole } = (0, import_react_router_dom4.useParams)();
|
|
@@ -9504,7 +9485,7 @@ function FlyingEmoji() {
|
|
|
9504
9485
|
const localPeerId = (0, import_react_sdk41.useHMSStore)(import_react_sdk41.selectLocalPeerID);
|
|
9505
9486
|
const vanillaStore = (0, import_react_sdk41.useHMSVanillaStore)();
|
|
9506
9487
|
const [emojis, setEmojis] = (0, import_react82.useState)([]);
|
|
9507
|
-
const isMobile = (0,
|
|
9488
|
+
const isMobile = (0, import_react_use12.useMedia)(config.media.md);
|
|
9508
9489
|
const startingPoints = (0, import_react82.useMemo)(() => getStartingPoints(isMobile), [isMobile]);
|
|
9509
9490
|
const showFlyingEmoji = (0, import_react82.useCallback)(
|
|
9510
9491
|
({ emojiId, senderId }) => {
|
|
@@ -9596,13 +9577,13 @@ function FlyingEmoji() {
|
|
|
9596
9577
|
})
|
|
9597
9578
|
);
|
|
9598
9579
|
}
|
|
9599
|
-
var import_react82,
|
|
9580
|
+
var import_react82, import_react_use12, import_react_sdk41, emojiCount, flyAndFade, wiggleLeftRight, wiggleRightLeft, getStartingPoints;
|
|
9600
9581
|
var init_FlyingEmoji = __esm({
|
|
9601
9582
|
"src/Prebuilt/plugins/FlyingEmoji.jsx"() {
|
|
9602
9583
|
"use strict";
|
|
9603
9584
|
init_define_process_env();
|
|
9604
9585
|
import_react82 = __toESM(require("react"));
|
|
9605
|
-
|
|
9586
|
+
import_react_use12 = require("react-use");
|
|
9606
9587
|
import_react_sdk41 = require("@100mslive/react-sdk");
|
|
9607
9588
|
init_Layout();
|
|
9608
9589
|
init_Text2();
|
|
@@ -9786,13 +9767,13 @@ var init_EmojiCard = __esm({
|
|
|
9786
9767
|
});
|
|
9787
9768
|
|
|
9788
9769
|
// src/Prebuilt/components/EmojiReaction.jsx
|
|
9789
|
-
var import_react87,
|
|
9770
|
+
var import_react87, import_react_use13, import_apple, import_emoji_mart, import_react_sdk45, import_react_icons33, EmojiReaction;
|
|
9790
9771
|
var init_EmojiReaction = __esm({
|
|
9791
9772
|
"src/Prebuilt/components/EmojiReaction.jsx"() {
|
|
9792
9773
|
"use strict";
|
|
9793
9774
|
init_define_process_env();
|
|
9794
9775
|
import_react87 = __toESM(require("react"));
|
|
9795
|
-
|
|
9776
|
+
import_react_use13 = require("react-use");
|
|
9796
9777
|
import_apple = __toESM(require("@emoji-mart/data/sets/14/apple.json"));
|
|
9797
9778
|
import_emoji_mart = require("emoji-mart");
|
|
9798
9779
|
import_react_sdk45 = require("@100mslive/react-sdk");
|
|
@@ -9812,7 +9793,7 @@ var init_EmojiReaction = __esm({
|
|
|
9812
9793
|
useDropdownList({ open, name: "EmojiReaction" });
|
|
9813
9794
|
const roles = (0, import_react_sdk45.useHMSStore)(import_react_sdk45.selectAvailableRoleNames);
|
|
9814
9795
|
const localPeerId = (0, import_react_sdk45.useHMSStore)(import_react_sdk45.selectLocalPeerID);
|
|
9815
|
-
const isMobile = (0,
|
|
9796
|
+
const isMobile = (0, import_react_use13.useMedia)(config.media.md);
|
|
9816
9797
|
const { sendEvent } = (0, import_react_sdk45.useCustomEvent)({
|
|
9817
9798
|
type: EMOJI_REACTION_TYPE
|
|
9818
9799
|
});
|
|
@@ -10019,7 +10000,8 @@ var init_DesktopLeaveRoom = __esm({
|
|
|
10019
10000
|
init_useDropdownList();
|
|
10020
10001
|
DesktopLeaveRoom = ({
|
|
10021
10002
|
leaveRoom,
|
|
10022
|
-
screenType
|
|
10003
|
+
screenType,
|
|
10004
|
+
endRoom
|
|
10023
10005
|
}) => {
|
|
10024
10006
|
const [open, setOpen] = (0, import_react91.useState)(false);
|
|
10025
10007
|
const [showLeaveRoomAlert, setShowLeaveRoomAlert] = (0, import_react91.useState)(false);
|
|
@@ -10027,12 +10009,12 @@ var init_DesktopLeaveRoom = __esm({
|
|
|
10027
10009
|
const isConnected = (0, import_react_sdk46.useHMSStore)(import_react_sdk46.selectIsConnectedToRoom);
|
|
10028
10010
|
const permissions = (0, import_react_sdk46.useHMSStore)(import_react_sdk46.selectPermissions);
|
|
10029
10011
|
const { isStreamingOn } = (0, import_react_sdk46.useRecordingStreaming)();
|
|
10030
|
-
const showStream =
|
|
10012
|
+
const showStream = screenType !== "hls_live_streaming" && isStreamingOn;
|
|
10031
10013
|
useDropdownList({ open: open || showEndStreamAlert || showLeaveRoomAlert, name: "LeaveRoom" });
|
|
10032
10014
|
if (!permissions || !isConnected) {
|
|
10033
10015
|
return null;
|
|
10034
10016
|
}
|
|
10035
|
-
return /* @__PURE__ */ import_react91.default.createElement(import_react91.Fragment, null, permissions.hlsStreaming ? /* @__PURE__ */ import_react91.default.createElement(Flex, null, /* @__PURE__ */ import_react91.default.createElement(
|
|
10017
|
+
return /* @__PURE__ */ import_react91.default.createElement(import_react91.Fragment, null, screenType !== "hls_live_streaming" && ((permissions == null ? void 0 : permissions.hlsStreaming) || (permissions == null ? void 0 : permissions.endRoom)) ? /* @__PURE__ */ import_react91.default.createElement(Flex, null, /* @__PURE__ */ import_react91.default.createElement(
|
|
10036
10018
|
LeaveIconButton,
|
|
10037
10019
|
{
|
|
10038
10020
|
key: "LeaveRoom",
|
|
@@ -10042,11 +10024,7 @@ var init_DesktopLeaveRoom = __esm({
|
|
|
10042
10024
|
borderBottomRightRadius: 0
|
|
10043
10025
|
},
|
|
10044
10026
|
onClick: () => {
|
|
10045
|
-
|
|
10046
|
-
setShowLeaveRoomAlert(true);
|
|
10047
|
-
} else {
|
|
10048
|
-
leaveRoom({ endstream: false });
|
|
10049
|
-
}
|
|
10027
|
+
leaveRoom({ endstream: false });
|
|
10050
10028
|
}
|
|
10051
10029
|
},
|
|
10052
10030
|
/* @__PURE__ */ import_react91.default.createElement(Tooltip, { title: "Leave Room" }, /* @__PURE__ */ import_react91.default.createElement(Box, null, /* @__PURE__ */ import_react91.default.createElement(import_react_icons36.ExitIcon, { style: { transform: "rotate(180deg)" } })))
|
|
@@ -10084,7 +10062,7 @@ var init_DesktopLeaveRoom = __esm({
|
|
|
10084
10062
|
css: { p: 0 }
|
|
10085
10063
|
}
|
|
10086
10064
|
)
|
|
10087
|
-
),
|
|
10065
|
+
), (permissions == null ? void 0 : permissions.endRoom) || (permissions == null ? void 0 : permissions.hlsStreaming) ? /* @__PURE__ */ import_react91.default.createElement(
|
|
10088
10066
|
Dropdown.Item,
|
|
10089
10067
|
{
|
|
10090
10068
|
css: {
|
|
@@ -10127,7 +10105,7 @@ var init_DesktopLeaveRoom = __esm({
|
|
|
10127
10105
|
EndSessionContent,
|
|
10128
10106
|
{
|
|
10129
10107
|
setShowEndStreamAlert,
|
|
10130
|
-
leaveRoom,
|
|
10108
|
+
leaveRoom: isStreamingOn ? leaveRoom : endRoom,
|
|
10131
10109
|
isStreamingOn,
|
|
10132
10110
|
isModal: true
|
|
10133
10111
|
}
|
|
@@ -10155,7 +10133,8 @@ var init_MwebLeaveRoom = __esm({
|
|
|
10155
10133
|
init_useDropdownList();
|
|
10156
10134
|
MwebLeaveRoom = ({
|
|
10157
10135
|
leaveRoom,
|
|
10158
|
-
screenType
|
|
10136
|
+
screenType,
|
|
10137
|
+
endRoom
|
|
10159
10138
|
}) => {
|
|
10160
10139
|
const [open, setOpen] = (0, import_react92.useState)(false);
|
|
10161
10140
|
const [showLeaveRoomAlert, setShowLeaveRoomAlert] = (0, import_react92.useState)(false);
|
|
@@ -10163,12 +10142,12 @@ var init_MwebLeaveRoom = __esm({
|
|
|
10163
10142
|
const isConnected = (0, import_react_sdk47.useHMSStore)(import_react_sdk47.selectIsConnectedToRoom);
|
|
10164
10143
|
const permissions = (0, import_react_sdk47.useHMSStore)(import_react_sdk47.selectPermissions);
|
|
10165
10144
|
const { isStreamingOn } = (0, import_react_sdk47.useRecordingStreaming)();
|
|
10166
|
-
const showStream =
|
|
10145
|
+
const showStream = screenType !== "hls_live_streaming" && isStreamingOn;
|
|
10167
10146
|
useDropdownList({ open, name: "LeaveRoom" });
|
|
10168
10147
|
if (!permissions || !isConnected) {
|
|
10169
10148
|
return null;
|
|
10170
10149
|
}
|
|
10171
|
-
return /* @__PURE__ */ import_react92.default.createElement(import_react92.Fragment, null,
|
|
10150
|
+
return /* @__PURE__ */ import_react92.default.createElement(import_react92.Fragment, null, screenType !== "hls_live_streaming" ? /* @__PURE__ */ import_react92.default.createElement(Sheet.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ import_react92.default.createElement(Sheet.Trigger, { asChild: true }, /* @__PURE__ */ import_react92.default.createElement(
|
|
10172
10151
|
LeaveIconButton,
|
|
10173
10152
|
{
|
|
10174
10153
|
key: "LeaveRoom",
|
|
@@ -10190,7 +10169,7 @@ var init_MwebLeaveRoom = __esm({
|
|
|
10190
10169
|
onClick: () => leaveRoom({ endstream: false }),
|
|
10191
10170
|
css: { pt: 0, mt: "$10", color: "$on_surface_low", "&:hover": { color: "$on_surface_high" } }
|
|
10192
10171
|
}
|
|
10193
|
-
),
|
|
10172
|
+
), (permissions == null ? void 0 : permissions.endRoom) || (permissions == null ? void 0 : permissions.hlsStreaming) ? /* @__PURE__ */ import_react92.default.createElement(
|
|
10194
10173
|
LeaveCard,
|
|
10195
10174
|
{
|
|
10196
10175
|
title: showStream ? "End Stream" : "End Session",
|
|
@@ -10222,7 +10201,7 @@ var init_MwebLeaveRoom = __esm({
|
|
|
10222
10201
|
EndSessionContent,
|
|
10223
10202
|
{
|
|
10224
10203
|
setShowEndStreamAlert,
|
|
10225
|
-
leaveRoom,
|
|
10204
|
+
leaveRoom: isStreamingOn ? leaveRoom : endRoom,
|
|
10226
10205
|
isStreamingOn
|
|
10227
10206
|
}
|
|
10228
10207
|
))), screenType === "hls_live_streaming" ? /* @__PURE__ */ import_react92.default.createElement(Sheet.Root, { open: showLeaveRoomAlert, onOpenChange: setShowLeaveRoomAlert }, /* @__PURE__ */ import_react92.default.createElement(Sheet.Content, { css: { bg: "$surface_dim", p: "$10", pb: "$12" } }, /* @__PURE__ */ import_react92.default.createElement(LeaveSessionContent, { setShowLeaveRoomAlert, leaveRoom }))) : null);
|
|
@@ -10231,13 +10210,13 @@ var init_MwebLeaveRoom = __esm({
|
|
|
10231
10210
|
});
|
|
10232
10211
|
|
|
10233
10212
|
// src/Prebuilt/components/Leave/LeaveRoom.tsx
|
|
10234
|
-
var import_react93,
|
|
10213
|
+
var import_react93, import_react_use14, import_react_sdk48, LeaveRoom;
|
|
10235
10214
|
var init_LeaveRoom = __esm({
|
|
10236
10215
|
"src/Prebuilt/components/Leave/LeaveRoom.tsx"() {
|
|
10237
10216
|
"use strict";
|
|
10238
10217
|
init_define_process_env();
|
|
10239
10218
|
import_react93 = __toESM(require("react"));
|
|
10240
|
-
|
|
10219
|
+
import_react_use14 = require("react-use");
|
|
10241
10220
|
import_react_sdk48 = require("@100mslive/react-sdk");
|
|
10242
10221
|
init_Theme();
|
|
10243
10222
|
init_ToastManager();
|
|
@@ -10247,7 +10226,7 @@ var init_LeaveRoom = __esm({
|
|
|
10247
10226
|
LeaveRoom = ({ screenType }) => {
|
|
10248
10227
|
const isConnected = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectIsConnectedToRoom);
|
|
10249
10228
|
const permissions = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectPermissions);
|
|
10250
|
-
const isMobile = (0,
|
|
10229
|
+
const isMobile = (0, import_react_use14.useMedia)(config.media.md);
|
|
10251
10230
|
const rolesMap = (0, import_react_sdk48.useHMSStore)(import_react_sdk48.selectRolesMap);
|
|
10252
10231
|
const streamingPermissionRoles = Object.keys(rolesMap).filter((roleName) => {
|
|
10253
10232
|
const roleObj = rolesMap[roleName];
|
|
@@ -10269,6 +10248,10 @@ var init_LeaveRoom = __esm({
|
|
|
10269
10248
|
ToastManager.addToast({ title: "Error in stopping the stream", type: "error" });
|
|
10270
10249
|
}
|
|
10271
10250
|
});
|
|
10251
|
+
const endRoom = () => {
|
|
10252
|
+
hmsActions.endRoom(false, "End Room");
|
|
10253
|
+
redirectToLeave();
|
|
10254
|
+
};
|
|
10272
10255
|
const leaveRoom = (_0) => __async(void 0, [_0], function* ({ endstream = false }) {
|
|
10273
10256
|
if (endstream || hlsState.running && peersWithStreamingRights.length === 1) {
|
|
10274
10257
|
yield stopStream();
|
|
@@ -10279,7 +10262,7 @@ var init_LeaveRoom = __esm({
|
|
|
10279
10262
|
if (!permissions || !isConnected) {
|
|
10280
10263
|
return null;
|
|
10281
10264
|
}
|
|
10282
|
-
return isMobile ? /* @__PURE__ */ import_react93.default.createElement(MwebLeaveRoom, { leaveRoom, screenType }) : /* @__PURE__ */ import_react93.default.createElement(DesktopLeaveRoom, { leaveRoom, screenType });
|
|
10265
|
+
return isMobile ? /* @__PURE__ */ import_react93.default.createElement(MwebLeaveRoom, { leaveRoom, screenType, endRoom }) : /* @__PURE__ */ import_react93.default.createElement(DesktopLeaveRoom, { leaveRoom, screenType, endRoom });
|
|
10283
10266
|
};
|
|
10284
10267
|
}
|
|
10285
10268
|
});
|
|
@@ -11745,13 +11728,13 @@ var init_DesktopOptions = __esm({
|
|
|
11745
11728
|
});
|
|
11746
11729
|
|
|
11747
11730
|
// src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx
|
|
11748
|
-
var import_react108,
|
|
11731
|
+
var import_react108, import_react_use15, import_react_sdk59, import_react_icons48, MODALS2, MwebOptions;
|
|
11749
11732
|
var init_MwebOptions = __esm({
|
|
11750
11733
|
"src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx"() {
|
|
11751
11734
|
"use strict";
|
|
11752
11735
|
init_define_process_env();
|
|
11753
11736
|
import_react108 = __toESM(require("react"));
|
|
11754
|
-
|
|
11737
|
+
import_react_use15 = require("react-use");
|
|
11755
11738
|
import_react_sdk59 = require("@100mslive/react-sdk");
|
|
11756
11739
|
import_react_icons48 = require("@100mslive/react-icons");
|
|
11757
11740
|
init_src();
|
|
@@ -11810,7 +11793,7 @@ var init_MwebOptions = __esm({
|
|
|
11810
11793
|
return copy;
|
|
11811
11794
|
});
|
|
11812
11795
|
};
|
|
11813
|
-
(0,
|
|
11796
|
+
(0, import_react_use15.useClickAway)(emojiCardRef, () => setShowEmojiCard(false));
|
|
11814
11797
|
return /* @__PURE__ */ import_react108.default.createElement(import_react108.default.Fragment, null, /* @__PURE__ */ import_react108.default.createElement(Sheet.Root, { open: openOptionsSheet, onOpenChange: setOpenOptionsSheet }, /* @__PURE__ */ import_react108.default.createElement(Tooltip, { title: "More options" }, /* @__PURE__ */ import_react108.default.createElement(Sheet.Trigger, { asChild: true, "data-testid": "more_settings_btn" }, /* @__PURE__ */ import_react108.default.createElement(IconButton_default, null, /* @__PURE__ */ import_react108.default.createElement(import_react_icons48.DragHandleIcon, null)))), /* @__PURE__ */ import_react108.default.createElement(Sheet.Content, { css: { bg: "$surface_dim", pb: "$14" } }, /* @__PURE__ */ import_react108.default.createElement(
|
|
11815
11798
|
Sheet.Title,
|
|
11816
11799
|
{
|
|
@@ -11943,7 +11926,7 @@ var init_MwebOptions = __esm({
|
|
|
11943
11926
|
isRecordingLoading ? /* @__PURE__ */ import_react108.default.createElement(Loading, null) : /* @__PURE__ */ import_react108.default.createElement(import_react_icons48.RecordIcon, null),
|
|
11944
11927
|
/* @__PURE__ */ import_react108.default.createElement(ActionTile.Title, null, isBrowserRecordingOn ? "Recording On" : isRecordingLoading ? "Starting Recording" : "Start Recording")
|
|
11945
11928
|
) : 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(
|
|
11929
|
+
))), /* @__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
11930
|
ChangeNameModal,
|
|
11948
11931
|
{
|
|
11949
11932
|
onOpenChange: (value) => updateState(MODALS2.CHANGE_NAME, value),
|
|
@@ -11993,13 +11976,13 @@ var init_MwebOptions = __esm({
|
|
|
11993
11976
|
});
|
|
11994
11977
|
|
|
11995
11978
|
// src/Prebuilt/components/MoreSettings/MoreSettings.tsx
|
|
11996
|
-
var import_react109,
|
|
11979
|
+
var import_react109, import_react_use16, MoreSettings;
|
|
11997
11980
|
var init_MoreSettings = __esm({
|
|
11998
11981
|
"src/Prebuilt/components/MoreSettings/MoreSettings.tsx"() {
|
|
11999
11982
|
"use strict";
|
|
12000
11983
|
init_define_process_env();
|
|
12001
11984
|
import_react109 = __toESM(require("react"));
|
|
12002
|
-
|
|
11985
|
+
import_react_use16 = require("react-use");
|
|
12003
11986
|
init_DesktopOptions();
|
|
12004
11987
|
init_MwebOptions();
|
|
12005
11988
|
init_src();
|
|
@@ -12007,7 +11990,7 @@ var init_MoreSettings = __esm({
|
|
|
12007
11990
|
elements,
|
|
12008
11991
|
screenType
|
|
12009
11992
|
}) => {
|
|
12010
|
-
const isMobile = (0,
|
|
11993
|
+
const isMobile = (0, import_react_use16.useMedia)(config.media.md);
|
|
12011
11994
|
return isMobile ? /* @__PURE__ */ import_react109.default.createElement(MwebOptions, { elements, screenType }) : /* @__PURE__ */ import_react109.default.createElement(DesktopOptions, { elements, screenType });
|
|
12012
11995
|
};
|
|
12013
11996
|
}
|
|
@@ -12644,112 +12627,24 @@ var init_ChatToggle = __esm({
|
|
|
12644
12627
|
init_IconButton3();
|
|
12645
12628
|
init_useSidepane();
|
|
12646
12629
|
init_constants();
|
|
12647
|
-
ChatToggle = (
|
|
12630
|
+
ChatToggle = () => {
|
|
12648
12631
|
const countUnreadMessages = (0, import_react_sdk63.useHMSStore)(import_react_sdk63.selectUnreadHMSMessagesCount);
|
|
12649
12632
|
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
12650
12633
|
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
12651
|
-
(0, import_react118.useEffect)(() => {
|
|
12652
|
-
if (!isChatOpen && openByDefault) {
|
|
12653
|
-
toggleChat();
|
|
12654
|
-
}
|
|
12655
|
-
}, [toggleChat, openByDefault]);
|
|
12656
12634
|
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
12635
|
};
|
|
12658
12636
|
}
|
|
12659
12637
|
});
|
|
12660
12638
|
|
|
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
12639
|
// src/Prebuilt/components/Footer/RoleOptions.tsx
|
|
12745
|
-
var
|
|
12640
|
+
var import_react119, import_react_sdk64, import_react_icons55, dropdownItemCSS, optionTextCSS, RoleOptions;
|
|
12746
12641
|
var init_RoleOptions = __esm({
|
|
12747
12642
|
"src/Prebuilt/components/Footer/RoleOptions.tsx"() {
|
|
12748
12643
|
"use strict";
|
|
12749
12644
|
init_define_process_env();
|
|
12750
|
-
|
|
12751
|
-
|
|
12752
|
-
|
|
12645
|
+
import_react119 = __toESM(require("react"));
|
|
12646
|
+
import_react_sdk64 = require("@100mslive/react-sdk");
|
|
12647
|
+
import_react_icons55 = require("@100mslive/react-icons");
|
|
12753
12648
|
init_Dropdown2();
|
|
12754
12649
|
init_Layout();
|
|
12755
12650
|
init_Text2();
|
|
@@ -12758,12 +12653,12 @@ var init_RoleOptions = __esm({
|
|
|
12758
12653
|
dropdownItemCSS = { backgroundColor: "$surface_default", gap: "$4", p: "$8" };
|
|
12759
12654
|
optionTextCSS = { fontWeight: "$semiBold", color: "$on_surface_high", textTransform: "none" };
|
|
12760
12655
|
RoleOptions = ({ roleName, peerList }) => {
|
|
12761
|
-
const [openOptions, setOpenOptions] = (0,
|
|
12762
|
-
const permissions = (0,
|
|
12763
|
-
const hmsActions = (0,
|
|
12656
|
+
const [openOptions, setOpenOptions] = (0, import_react119.useState)(false);
|
|
12657
|
+
const permissions = (0, import_react_sdk64.useHMSStore)(import_react_sdk64.selectPermissions);
|
|
12658
|
+
const hmsActions = (0, import_react_sdk64.useHMSActions)();
|
|
12764
12659
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
12765
12660
|
const { on_stage_role, off_stage_roles = [] } = (elements == null ? void 0 : elements.on_stage_exp) || {};
|
|
12766
|
-
const vanillaStore = (0,
|
|
12661
|
+
const vanillaStore = (0, import_react_sdk64.useHMSVanillaStore)();
|
|
12767
12662
|
const store = vanillaStore.getState();
|
|
12768
12663
|
let allPeersHaveVideoOn = true;
|
|
12769
12664
|
let allPeersHaveAudioOn = true;
|
|
@@ -12804,7 +12699,7 @@ var init_RoleOptions = __esm({
|
|
|
12804
12699
|
console.error(e);
|
|
12805
12700
|
}
|
|
12806
12701
|
});
|
|
12807
|
-
return /* @__PURE__ */
|
|
12702
|
+
return /* @__PURE__ */ import_react119.default.createElement(Dropdown.Root, { open: openOptions, onOpenChange: setOpenOptions }, /* @__PURE__ */ import_react119.default.createElement(
|
|
12808
12703
|
Dropdown.Trigger,
|
|
12809
12704
|
{
|
|
12810
12705
|
onClick: (e) => e.stopPropagation(),
|
|
@@ -12823,40 +12718,40 @@ var init_RoleOptions = __esm({
|
|
|
12823
12718
|
}
|
|
12824
12719
|
}
|
|
12825
12720
|
},
|
|
12826
|
-
/* @__PURE__ */
|
|
12827
|
-
), /* @__PURE__ */
|
|
12721
|
+
/* @__PURE__ */ import_react119.default.createElement(Flex, null, /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VerticalMenuIcon, null))
|
|
12722
|
+
), /* @__PURE__ */ import_react119.default.createElement(
|
|
12828
12723
|
Dropdown.Content,
|
|
12829
12724
|
{
|
|
12830
12725
|
onClick: (e) => e.stopPropagation(),
|
|
12831
12726
|
css: { w: "max-content", maxWidth: "$64", bg: "$surface_default", py: 0 },
|
|
12832
12727
|
align: "end"
|
|
12833
12728
|
},
|
|
12834
|
-
canRemoveRoleFromStage && /* @__PURE__ */
|
|
12729
|
+
canRemoveRoleFromStage && /* @__PURE__ */ import_react119.default.createElement(
|
|
12835
12730
|
Dropdown.Item,
|
|
12836
12731
|
{
|
|
12837
12732
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderBottom: "1px solid $border_bright" }),
|
|
12838
12733
|
onClick: removeAllFromStage
|
|
12839
12734
|
},
|
|
12840
|
-
/* @__PURE__ */
|
|
12841
|
-
/* @__PURE__ */
|
|
12735
|
+
/* @__PURE__ */ import_react119.default.createElement(import_react_icons55.PersonRectangleIcon, null),
|
|
12736
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: optionTextCSS }, "Remove all from Stage")
|
|
12842
12737
|
),
|
|
12843
|
-
canMuteRole && /* @__PURE__ */
|
|
12738
|
+
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
12739
|
Dropdown.Item,
|
|
12845
12740
|
{
|
|
12846
12741
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderTop: "1px solid $border_bright" }),
|
|
12847
12742
|
onClick: () => setTrackEnabled("video", !allPeersHaveVideoOn)
|
|
12848
12743
|
},
|
|
12849
|
-
allPeersHaveVideoOn ? /* @__PURE__ */
|
|
12850
|
-
/* @__PURE__ */
|
|
12744
|
+
allPeersHaveVideoOn ? /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VideoOffIcon, null) : /* @__PURE__ */ import_react119.default.createElement(import_react_icons55.VideoOnIcon, null),
|
|
12745
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: optionTextCSS }, allPeersHaveVideoOn ? "Mute" : "Unmute", " Video")
|
|
12851
12746
|
)),
|
|
12852
|
-
canRemoveRoleFromRoom && /* @__PURE__ */
|
|
12747
|
+
canRemoveRoleFromRoom && /* @__PURE__ */ import_react119.default.createElement(
|
|
12853
12748
|
Dropdown.Item,
|
|
12854
12749
|
{
|
|
12855
12750
|
css: __spreadProps(__spreadValues({}, dropdownItemCSS), { borderTop: "1px solid $border_bright", color: "$alert_error_default" }),
|
|
12856
12751
|
onClick: removePeersFromRoom
|
|
12857
12752
|
},
|
|
12858
|
-
/* @__PURE__ */
|
|
12859
|
-
/* @__PURE__ */
|
|
12753
|
+
/* @__PURE__ */ import_react119.default.createElement(import_react_icons55.RemoveUserIcon, null),
|
|
12754
|
+
/* @__PURE__ */ import_react119.default.createElement(Text, { variant: "sm", css: __spreadProps(__spreadValues({}, optionTextCSS), { color: "inherit" }) }, "Remove all from Room")
|
|
12860
12755
|
)
|
|
12861
12756
|
));
|
|
12862
12757
|
};
|
|
@@ -12867,13 +12762,13 @@ var init_RoleOptions = __esm({
|
|
|
12867
12762
|
function itemKey(index, data3) {
|
|
12868
12763
|
return data3.peerList[index].id;
|
|
12869
12764
|
}
|
|
12870
|
-
var
|
|
12765
|
+
var import_react120, import_react_use17, import_react_window, ROW_HEIGHT, VirtualizedParticipantItem, RoleAccordion;
|
|
12871
12766
|
var init_RoleAccordion = __esm({
|
|
12872
12767
|
"src/Prebuilt/components/Footer/RoleAccordion.tsx"() {
|
|
12873
12768
|
"use strict";
|
|
12874
12769
|
init_define_process_env();
|
|
12875
|
-
|
|
12876
|
-
|
|
12770
|
+
import_react120 = __toESM(require("react"));
|
|
12771
|
+
import_react_use17 = require("react-use");
|
|
12877
12772
|
import_react_window = require("react-window");
|
|
12878
12773
|
init_Accordion2();
|
|
12879
12774
|
init_Layout();
|
|
@@ -12882,8 +12777,8 @@ var init_RoleAccordion = __esm({
|
|
|
12882
12777
|
init_RoleOptions();
|
|
12883
12778
|
init_utils2();
|
|
12884
12779
|
ROW_HEIGHT = 50;
|
|
12885
|
-
VirtualizedParticipantItem =
|
|
12886
|
-
return /* @__PURE__ */
|
|
12780
|
+
VirtualizedParticipantItem = import_react120.default.memo(({ index, data: data3 }) => {
|
|
12781
|
+
return /* @__PURE__ */ import_react120.default.createElement(Participant, { key: data3.peerList[index].id, peer: data3.peerList[index], isConnected: data3.isConnected });
|
|
12887
12782
|
});
|
|
12888
12783
|
RoleAccordion = ({
|
|
12889
12784
|
peerList = [],
|
|
@@ -12892,13 +12787,13 @@ var init_RoleAccordion = __esm({
|
|
|
12892
12787
|
filter,
|
|
12893
12788
|
isHandRaisedAccordion = false
|
|
12894
12789
|
}) => {
|
|
12895
|
-
const [ref, { width }] = (0,
|
|
12790
|
+
const [ref, { width }] = (0, import_react_use17.useMeasure)();
|
|
12896
12791
|
const showAcordion = (filter == null ? void 0 : filter.search) ? peerList.some((peer) => peer.name.toLowerCase().includes(filter.search)) : true;
|
|
12897
12792
|
if (!showAcordion || isHandRaisedAccordion && (filter == null ? void 0 : filter.search) || peerList.length === 0) {
|
|
12898
12793
|
return null;
|
|
12899
12794
|
}
|
|
12900
12795
|
const height = ROW_HEIGHT * peerList.length;
|
|
12901
|
-
return /* @__PURE__ */
|
|
12796
|
+
return /* @__PURE__ */ import_react120.default.createElement(Flex, { direction: "column", css: { "&:hover .role_actions": { visibility: "visible" } }, ref }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12902
12797
|
Accordion.Root,
|
|
12903
12798
|
{
|
|
12904
12799
|
type: "single",
|
|
@@ -12906,7 +12801,7 @@ var init_RoleAccordion = __esm({
|
|
|
12906
12801
|
defaultValue: roleName,
|
|
12907
12802
|
css: { borderRadius: "$1", border: "1px solid $border_bright" }
|
|
12908
12803
|
},
|
|
12909
|
-
/* @__PURE__ */
|
|
12804
|
+
/* @__PURE__ */ import_react120.default.createElement(Accordion.Item, { value: roleName }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12910
12805
|
Accordion.Header,
|
|
12911
12806
|
{
|
|
12912
12807
|
iconStyles: { c: "$on_surface_high" },
|
|
@@ -12918,7 +12813,7 @@ var init_RoleAccordion = __esm({
|
|
|
12918
12813
|
c: "$on_surface_medium"
|
|
12919
12814
|
}
|
|
12920
12815
|
},
|
|
12921
|
-
/* @__PURE__ */
|
|
12816
|
+
/* @__PURE__ */ import_react120.default.createElement(Flex, { justify: "between", css: { flexGrow: 1, pr: "$6" } }, /* @__PURE__ */ import_react120.default.createElement(
|
|
12922
12817
|
Text,
|
|
12923
12818
|
{
|
|
12924
12819
|
variant: "sm",
|
|
@@ -12927,8 +12822,8 @@ var init_RoleAccordion = __esm({
|
|
|
12927
12822
|
roleName,
|
|
12928
12823
|
" ",
|
|
12929
12824
|
`(${getFormattedCount(peerList.length)})`
|
|
12930
|
-
), /* @__PURE__ */
|
|
12931
|
-
), /* @__PURE__ */
|
|
12825
|
+
), /* @__PURE__ */ import_react120.default.createElement(RoleOptions, { roleName, peerList }))
|
|
12826
|
+
), /* @__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
12827
|
import_react_window.FixedSizeList,
|
|
12933
12828
|
{
|
|
12934
12829
|
itemSize: ROW_HEIGHT,
|
|
@@ -12946,18 +12841,17 @@ var init_RoleAccordion = __esm({
|
|
|
12946
12841
|
});
|
|
12947
12842
|
|
|
12948
12843
|
// src/Prebuilt/components/Footer/ParticipantList.jsx
|
|
12949
|
-
var
|
|
12844
|
+
var import_react121, import_react_use18, import_react_sdk65, import_react_icons56, ParticipantList, ParticipantCount, VirtualizedParticipants, Participant, ParticipantActions, ParticipantMoreActions, ParticipantSearch;
|
|
12950
12845
|
var init_ParticipantList = __esm({
|
|
12951
12846
|
"src/Prebuilt/components/Footer/ParticipantList.jsx"() {
|
|
12952
12847
|
"use strict";
|
|
12953
12848
|
init_define_process_env();
|
|
12954
|
-
|
|
12955
|
-
|
|
12956
|
-
|
|
12957
|
-
|
|
12849
|
+
import_react121 = __toESM(require("react"));
|
|
12850
|
+
import_react_use18 = require("react-use");
|
|
12851
|
+
import_react_sdk65 = require("@100mslive/react-sdk");
|
|
12852
|
+
import_react_icons56 = require("@100mslive/react-icons");
|
|
12958
12853
|
init_src();
|
|
12959
12854
|
init_IconButton3();
|
|
12960
|
-
init_ChatParticipantHeader();
|
|
12961
12855
|
init_ConnectionIndicator();
|
|
12962
12856
|
init_ToastManager();
|
|
12963
12857
|
init_RoleAccordion();
|
|
@@ -12967,10 +12861,10 @@ var init_ParticipantList = __esm({
|
|
|
12967
12861
|
init_utils2();
|
|
12968
12862
|
init_constants();
|
|
12969
12863
|
ParticipantList = () => {
|
|
12970
|
-
const [filter, setFilter] = (0,
|
|
12864
|
+
const [filter, setFilter] = (0, import_react121.useState)();
|
|
12971
12865
|
const { participants, isConnected, peerCount } = useParticipants2(filter);
|
|
12972
12866
|
const peersOrderedByRoles = {};
|
|
12973
|
-
const handRaisedPeers = (0,
|
|
12867
|
+
const handRaisedPeers = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeersByCondition)((peer) => {
|
|
12974
12868
|
var _a7;
|
|
12975
12869
|
return (_a7 = JSON.parse(peer.metadata || "{}")) == null ? void 0 : _a7.isHandRaised;
|
|
12976
12870
|
}));
|
|
@@ -12980,7 +12874,7 @@ var init_ParticipantList = __esm({
|
|
|
12980
12874
|
}
|
|
12981
12875
|
peersOrderedByRoles[participant.roleName].push(participant);
|
|
12982
12876
|
});
|
|
12983
|
-
const onSearch = (0,
|
|
12877
|
+
const onSearch = (0, import_react121.useCallback)((value) => {
|
|
12984
12878
|
setFilter((filterValue) => {
|
|
12985
12879
|
if (!filterValue) {
|
|
12986
12880
|
filterValue = {};
|
|
@@ -12992,7 +12886,7 @@ var init_ParticipantList = __esm({
|
|
|
12992
12886
|
if (peerCount === 0) {
|
|
12993
12887
|
return null;
|
|
12994
12888
|
}
|
|
12995
|
-
return /* @__PURE__ */
|
|
12889
|
+
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
12890
|
VirtualizedParticipants,
|
|
12997
12891
|
{
|
|
12998
12892
|
peersOrderedByRoles,
|
|
@@ -13003,10 +12897,10 @@ var init_ParticipantList = __esm({
|
|
|
13003
12897
|
)));
|
|
13004
12898
|
};
|
|
13005
12899
|
ParticipantCount = () => {
|
|
13006
|
-
const peerCount = (0,
|
|
12900
|
+
const peerCount = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPeerCount);
|
|
13007
12901
|
const toggleSidepane = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
13008
12902
|
const isParticipantsOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
13009
|
-
(0,
|
|
12903
|
+
(0, import_react121.useEffect)(() => {
|
|
13010
12904
|
if (isParticipantsOpen && peerCount === 0) {
|
|
13011
12905
|
toggleSidepane();
|
|
13012
12906
|
}
|
|
@@ -13014,7 +12908,7 @@ var init_ParticipantList = __esm({
|
|
|
13014
12908
|
if (peerCount === 0) {
|
|
13015
12909
|
return null;
|
|
13016
12910
|
}
|
|
13017
|
-
return /* @__PURE__ */
|
|
12911
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13018
12912
|
IconButton_default,
|
|
13019
12913
|
{
|
|
13020
12914
|
css: {
|
|
@@ -13030,24 +12924,25 @@ var init_ParticipantList = __esm({
|
|
|
13030
12924
|
active: !isParticipantsOpen,
|
|
13031
12925
|
"data-testid": "participant_list"
|
|
13032
12926
|
},
|
|
13033
|
-
/* @__PURE__ */
|
|
13034
|
-
/* @__PURE__ */
|
|
12927
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.PeopleIcon, null),
|
|
12928
|
+
/* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { mx: "$4", c: "inherit" } }, peerCount)
|
|
13035
12929
|
);
|
|
13036
12930
|
};
|
|
13037
12931
|
VirtualizedParticipants = ({ peersOrderedByRoles = {}, isConnected, filter, handRaisedList = [] }) => {
|
|
13038
|
-
return /* @__PURE__ */
|
|
12932
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13039
12933
|
Flex,
|
|
13040
12934
|
{
|
|
13041
12935
|
direction: "column",
|
|
13042
12936
|
css: {
|
|
13043
12937
|
gap: "$8",
|
|
13044
|
-
maxHeight: "100%",
|
|
13045
12938
|
overflowY: "auto",
|
|
13046
12939
|
overflowX: "hidden",
|
|
13047
|
-
pr: "$
|
|
12940
|
+
pr: "$10",
|
|
12941
|
+
mr: "-$10",
|
|
12942
|
+
flex: "1 1 0"
|
|
13048
12943
|
}
|
|
13049
12944
|
},
|
|
13050
|
-
/* @__PURE__ */
|
|
12945
|
+
/* @__PURE__ */ import_react121.default.createElement(
|
|
13051
12946
|
RoleAccordion,
|
|
13052
12947
|
{
|
|
13053
12948
|
peerList: handRaisedList,
|
|
@@ -13057,7 +12952,7 @@ var init_ParticipantList = __esm({
|
|
|
13057
12952
|
isHandRaisedAccordion: true
|
|
13058
12953
|
}
|
|
13059
12954
|
),
|
|
13060
|
-
Object.keys(peersOrderedByRoles).map((role) => /* @__PURE__ */
|
|
12955
|
+
Object.keys(peersOrderedByRoles).map((role) => /* @__PURE__ */ import_react121.default.createElement(
|
|
13061
12956
|
RoleAccordion,
|
|
13062
12957
|
{
|
|
13063
12958
|
key: role,
|
|
@@ -13070,8 +12965,8 @@ var init_ParticipantList = __esm({
|
|
|
13070
12965
|
);
|
|
13071
12966
|
};
|
|
13072
12967
|
Participant = ({ peer, isConnected }) => {
|
|
13073
|
-
const localPeerId = (0,
|
|
13074
|
-
return /* @__PURE__ */
|
|
12968
|
+
const localPeerId = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectLocalPeerID);
|
|
12969
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13075
12970
|
Flex,
|
|
13076
12971
|
{
|
|
13077
12972
|
key: peer.id,
|
|
@@ -13086,17 +12981,17 @@ var init_ParticipantList = __esm({
|
|
|
13086
12981
|
justify: "between",
|
|
13087
12982
|
"data-testid": "participant_" + peer.name
|
|
13088
12983
|
},
|
|
13089
|
-
/* @__PURE__ */
|
|
13090
|
-
isConnected ? /* @__PURE__ */
|
|
12984
|
+
/* @__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)" : ""),
|
|
12985
|
+
isConnected ? /* @__PURE__ */ import_react121.default.createElement(ParticipantActions, { peerId: peer.id, isLocal: peer.id === localPeerId, role: peer.roleName }) : null
|
|
13091
12986
|
);
|
|
13092
12987
|
};
|
|
13093
|
-
ParticipantActions =
|
|
12988
|
+
ParticipantActions = import_react121.default.memo(({ peerId, role, isLocal }) => {
|
|
13094
12989
|
var _a7, _b7;
|
|
13095
|
-
const isHandRaised = (_a7 = (0,
|
|
13096
|
-
const canChangeRole = (_b7 = (0,
|
|
12990
|
+
const isHandRaised = (_a7 = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeerMetadata)(peerId))) == null ? void 0 : _a7.isHandRaised;
|
|
12991
|
+
const canChangeRole = (_b7 = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions)) == null ? void 0 : _b7.changeRole;
|
|
13097
12992
|
const shouldShowMoreActions = canChangeRole;
|
|
13098
|
-
const isAudioMuted = !(0,
|
|
13099
|
-
return /* @__PURE__ */
|
|
12993
|
+
const isAudioMuted = !(0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectIsPeerAudioEnabled)(peerId));
|
|
12994
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13100
12995
|
Flex,
|
|
13101
12996
|
{
|
|
13102
12997
|
align: "center",
|
|
@@ -13105,32 +13000,32 @@ var init_ParticipantList = __esm({
|
|
|
13105
13000
|
gap: "$8"
|
|
13106
13001
|
}
|
|
13107
13002
|
},
|
|
13108
|
-
/* @__PURE__ */
|
|
13109
|
-
isHandRaised && /* @__PURE__ */
|
|
13003
|
+
/* @__PURE__ */ import_react121.default.createElement(ConnectionIndicator, { peerId }),
|
|
13004
|
+
isHandRaised && /* @__PURE__ */ import_react121.default.createElement(
|
|
13110
13005
|
Flex,
|
|
13111
13006
|
{
|
|
13112
13007
|
align: "center",
|
|
13113
13008
|
justify: "center",
|
|
13114
13009
|
css: { p: "$1", c: "$on_surface_high", bg: "$surface_bright", borderRadius: "$round" }
|
|
13115
13010
|
},
|
|
13116
|
-
/* @__PURE__ */
|
|
13011
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.HandIcon, { height: 19, width: 19 })
|
|
13117
13012
|
),
|
|
13118
|
-
isAudioMuted ? /* @__PURE__ */
|
|
13013
|
+
isAudioMuted ? /* @__PURE__ */ import_react121.default.createElement(
|
|
13119
13014
|
Flex,
|
|
13120
13015
|
{
|
|
13121
13016
|
align: "center",
|
|
13122
13017
|
justify: "center",
|
|
13123
13018
|
css: { p: "$2", c: "$on_surface_high", bg: "$surface_bright", borderRadius: "$round" }
|
|
13124
13019
|
},
|
|
13125
|
-
/* @__PURE__ */
|
|
13020
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.MicOffIcon, { height: 19, width: 19 })
|
|
13126
13021
|
) : null,
|
|
13127
|
-
shouldShowMoreActions && !isInternalRole(role) && !isLocal ? /* @__PURE__ */
|
|
13022
|
+
shouldShowMoreActions && !isInternalRole(role) && !isLocal ? /* @__PURE__ */ import_react121.default.createElement(ParticipantMoreActions, { peerId, role }) : null
|
|
13128
13023
|
);
|
|
13129
13024
|
});
|
|
13130
13025
|
ParticipantMoreActions = ({ peerId, role }) => {
|
|
13131
13026
|
var _a7;
|
|
13132
|
-
const hmsActions = (0,
|
|
13133
|
-
const { changeRole: canChangeRole, removeOthers: canRemoveOthers } = (0,
|
|
13027
|
+
const hmsActions = (0, import_react_sdk65.useHMSActions)();
|
|
13028
|
+
const { changeRole: canChangeRole, removeOthers: canRemoveOthers } = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectPermissions);
|
|
13134
13029
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
13135
13030
|
const {
|
|
13136
13031
|
bring_to_stage_label,
|
|
@@ -13140,10 +13035,10 @@ var init_ParticipantList = __esm({
|
|
|
13140
13035
|
} = elements.on_stage_exp || {};
|
|
13141
13036
|
const isInStage = role === on_stage_role;
|
|
13142
13037
|
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,
|
|
13038
|
+
const prevRole = (_a7 = (0, import_react_sdk65.useHMSStore)((0, import_react_sdk65.selectPeerMetadata)(peerId))) == null ? void 0 : _a7.prevRole;
|
|
13039
|
+
const localPeerId = (0, import_react_sdk65.useHMSStore)(import_react_sdk65.selectLocalPeerID);
|
|
13145
13040
|
const isLocal = localPeerId === peerId;
|
|
13146
|
-
const [open, setOpen] = (0,
|
|
13041
|
+
const [open, setOpen] = (0, import_react121.useState)(false);
|
|
13147
13042
|
const handleStageAction = () => __async(void 0, null, function* () {
|
|
13148
13043
|
if (isInStage) {
|
|
13149
13044
|
prevRole && hmsActions.changeRoleOfPeer(peerId, prevRole, true);
|
|
@@ -13152,7 +13047,7 @@ var init_ParticipantList = __esm({
|
|
|
13152
13047
|
}
|
|
13153
13048
|
setOpen(false);
|
|
13154
13049
|
});
|
|
13155
|
-
return /* @__PURE__ */
|
|
13050
|
+
return /* @__PURE__ */ import_react121.default.createElement(Dropdown.Root, { open, onOpenChange: (value) => setOpen(value), modal: false }, /* @__PURE__ */ import_react121.default.createElement(
|
|
13156
13051
|
Dropdown.Trigger,
|
|
13157
13052
|
{
|
|
13158
13053
|
asChild: true,
|
|
@@ -13172,8 +13067,8 @@ var init_ParticipantList = __esm({
|
|
|
13172
13067
|
},
|
|
13173
13068
|
tabIndex: 0
|
|
13174
13069
|
},
|
|
13175
|
-
/* @__PURE__ */
|
|
13176
|
-
), /* @__PURE__ */
|
|
13070
|
+
/* @__PURE__ */ import_react121.default.createElement(Box, { css: { my: "auto" } }, /* @__PURE__ */ import_react121.default.createElement(import_react_icons56.VerticalMenuIcon, null))
|
|
13071
|
+
), /* @__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
13072
|
Dropdown.Item,
|
|
13178
13073
|
{
|
|
13179
13074
|
css: { color: "$alert_error_default", bg: "$surface_default" },
|
|
@@ -13185,34 +13080,34 @@ var init_ParticipantList = __esm({
|
|
|
13185
13080
|
}
|
|
13186
13081
|
})
|
|
13187
13082
|
},
|
|
13188
|
-
/* @__PURE__ */
|
|
13189
|
-
/* @__PURE__ */
|
|
13083
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.PeopleRemoveIcon, null),
|
|
13084
|
+
/* @__PURE__ */ import_react121.default.createElement(Text, { variant: "sm", css: { ml: "$4", color: "inherit", fontWeight: "$semiBold" } }, "Remove Participant")
|
|
13190
13085
|
))));
|
|
13191
13086
|
};
|
|
13192
13087
|
ParticipantSearch = ({ onSearch, placeholder, inSidePane = false }) => {
|
|
13193
|
-
const [value, setValue] =
|
|
13194
|
-
const isMobile = (0,
|
|
13195
|
-
(0,
|
|
13088
|
+
const [value, setValue] = import_react121.default.useState("");
|
|
13089
|
+
const isMobile = (0, import_react_use18.useMedia)(config.media.md);
|
|
13090
|
+
(0, import_react_use18.useDebounce)(
|
|
13196
13091
|
() => {
|
|
13197
13092
|
onSearch(value);
|
|
13198
13093
|
},
|
|
13199
13094
|
300,
|
|
13200
13095
|
[value, onSearch]
|
|
13201
13096
|
);
|
|
13202
|
-
return /* @__PURE__ */
|
|
13097
|
+
return /* @__PURE__ */ import_react121.default.createElement(
|
|
13203
13098
|
Flex,
|
|
13204
13099
|
{
|
|
13205
13100
|
align: "center",
|
|
13206
13101
|
css: {
|
|
13207
|
-
p: isMobile ? "
|
|
13102
|
+
p: isMobile ? "0" : "$2 0",
|
|
13208
13103
|
mb: "$2",
|
|
13209
13104
|
position: "relative",
|
|
13210
13105
|
color: "$on_surface_medium",
|
|
13211
13106
|
mt: inSidePane ? "$4" : ""
|
|
13212
13107
|
}
|
|
13213
13108
|
},
|
|
13214
|
-
/* @__PURE__ */
|
|
13215
|
-
/* @__PURE__ */
|
|
13109
|
+
/* @__PURE__ */ import_react121.default.createElement(import_react_icons56.SearchIcon, { style: { position: "absolute", left: isMobile ? "1.25rem" : "0.5rem" } }),
|
|
13110
|
+
/* @__PURE__ */ import_react121.default.createElement(
|
|
13216
13111
|
Input,
|
|
13217
13112
|
{
|
|
13218
13113
|
type: "text",
|
|
@@ -13235,15 +13130,14 @@ var init_ParticipantList = __esm({
|
|
|
13235
13130
|
});
|
|
13236
13131
|
|
|
13237
13132
|
// src/Prebuilt/components/Footer/Footer.tsx
|
|
13238
|
-
var
|
|
13133
|
+
var import_react122, import_react_use19, import_chat, VirtualBackground3, Footer2;
|
|
13239
13134
|
var init_Footer3 = __esm({
|
|
13240
13135
|
"src/Prebuilt/components/Footer/Footer.tsx"() {
|
|
13241
13136
|
"use strict";
|
|
13242
13137
|
init_define_process_env();
|
|
13243
|
-
|
|
13244
|
-
|
|
13138
|
+
import_react122 = __toESM(require("react"));
|
|
13139
|
+
import_react_use19 = require("react-use");
|
|
13245
13140
|
import_chat = require("@100mslive/types-prebuilt/elements/chat");
|
|
13246
|
-
import_react_sdk67 = require("@100mslive/react-sdk");
|
|
13247
13141
|
init_src();
|
|
13248
13142
|
init_AudioVideoToggle();
|
|
13249
13143
|
init_EmojiReaction();
|
|
@@ -13253,17 +13147,25 @@ var init_Footer3 = __esm({
|
|
|
13253
13147
|
init_ScreenShareToggle();
|
|
13254
13148
|
init_ChatToggle();
|
|
13255
13149
|
init_ParticipantList();
|
|
13256
|
-
|
|
13150
|
+
init_useSidepane();
|
|
13151
|
+
init_constants();
|
|
13152
|
+
VirtualBackground3 = import_react122.default.lazy(() => Promise.resolve().then(() => (init_VirtualBackground(), VirtualBackground_exports)));
|
|
13257
13153
|
Footer2 = ({
|
|
13258
13154
|
screenType,
|
|
13259
13155
|
elements
|
|
13260
13156
|
}) => {
|
|
13261
13157
|
var _a7, _b7;
|
|
13262
|
-
const isMobile = (0,
|
|
13158
|
+
const isMobile = (0, import_react_use19.useMedia)(config.media.md);
|
|
13263
13159
|
const isOverlayChat = !!((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay);
|
|
13264
13160
|
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
|
-
|
|
13161
|
+
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
13162
|
+
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
13163
|
+
(0, import_react122.useEffect)(() => {
|
|
13164
|
+
if (!isChatOpen && openByDefault) {
|
|
13165
|
+
toggleChat();
|
|
13166
|
+
}
|
|
13167
|
+
}, [toggleChat, openByDefault]);
|
|
13168
|
+
return /* @__PURE__ */ import_react122.default.createElement(
|
|
13267
13169
|
Footer.Root,
|
|
13268
13170
|
{
|
|
13269
13171
|
css: {
|
|
@@ -13273,11 +13175,11 @@ var init_Footer3 = __esm({
|
|
|
13273
13175
|
gap: "$10",
|
|
13274
13176
|
position: "relative",
|
|
13275
13177
|
// To prevent it from showing over the sidepane if chat type is not overlay
|
|
13276
|
-
zIndex: isOverlayChat ? 20 : 1
|
|
13178
|
+
zIndex: isOverlayChat && isChatOpen ? 20 : 1
|
|
13277
13179
|
}
|
|
13278
13180
|
}
|
|
13279
13181
|
},
|
|
13280
|
-
/* @__PURE__ */
|
|
13182
|
+
/* @__PURE__ */ import_react122.default.createElement(
|
|
13281
13183
|
Footer.Left,
|
|
13282
13184
|
{
|
|
13283
13185
|
css: {
|
|
@@ -13288,11 +13190,11 @@ var init_Footer3 = __esm({
|
|
|
13288
13190
|
}
|
|
13289
13191
|
}
|
|
13290
13192
|
},
|
|
13291
|
-
isMobile ? /* @__PURE__ */
|
|
13292
|
-
/* @__PURE__ */
|
|
13293
|
-
isMobile ? null : /* @__PURE__ */
|
|
13193
|
+
isMobile ? /* @__PURE__ */ import_react122.default.createElement(LeaveRoom, { screenType }) : null,
|
|
13194
|
+
/* @__PURE__ */ import_react122.default.createElement(AudioVideoToggle, null),
|
|
13195
|
+
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
13196
|
),
|
|
13295
|
-
/* @__PURE__ */
|
|
13197
|
+
/* @__PURE__ */ import_react122.default.createElement(
|
|
13296
13198
|
Footer.Center,
|
|
13297
13199
|
{
|
|
13298
13200
|
css: {
|
|
@@ -13302,9 +13204,9 @@ var init_Footer3 = __esm({
|
|
|
13302
13204
|
}
|
|
13303
13205
|
}
|
|
13304
13206
|
},
|
|
13305
|
-
isMobile ? /* @__PURE__ */
|
|
13207
|
+
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
13208
|
),
|
|
13307
|
-
/* @__PURE__ */
|
|
13209
|
+
/* @__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
13210
|
);
|
|
13309
13211
|
};
|
|
13310
13212
|
}
|
|
@@ -13312,11 +13214,11 @@ var init_Footer3 = __esm({
|
|
|
13312
13214
|
|
|
13313
13215
|
// src/Prebuilt/components/Notifications/HLSFailureModal.jsx
|
|
13314
13216
|
function HLSFailureModal() {
|
|
13315
|
-
const { hlsError } = (0,
|
|
13316
|
-
const [openModal, setOpenModal] = (0,
|
|
13317
|
-
const hmsActions = (0,
|
|
13217
|
+
const { hlsError } = (0, import_react_sdk66.useHMSStore)(import_react_sdk66.selectHLSState).error || false;
|
|
13218
|
+
const [openModal, setOpenModal] = (0, import_react123.useState)(!!hlsError);
|
|
13219
|
+
const hmsActions = (0, import_react_sdk66.useHMSActions)();
|
|
13318
13220
|
const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
|
|
13319
|
-
const startHLS = (0,
|
|
13221
|
+
const startHLS = (0, import_react123.useCallback)(() => __async(this, null, function* () {
|
|
13320
13222
|
try {
|
|
13321
13223
|
if (isHLSStarted) {
|
|
13322
13224
|
return;
|
|
@@ -13331,7 +13233,7 @@ function HLSFailureModal() {
|
|
|
13331
13233
|
setHLSStarted(false);
|
|
13332
13234
|
}
|
|
13333
13235
|
}), [hmsActions, isHLSStarted, setHLSStarted]);
|
|
13334
|
-
return hlsError ? /* @__PURE__ */
|
|
13236
|
+
return hlsError ? /* @__PURE__ */ import_react123.default.createElement(
|
|
13335
13237
|
Dialog.Root,
|
|
13336
13238
|
{
|
|
13337
13239
|
open: openModal,
|
|
@@ -13341,7 +13243,7 @@ function HLSFailureModal() {
|
|
|
13341
13243
|
}
|
|
13342
13244
|
}
|
|
13343
13245
|
},
|
|
13344
|
-
/* @__PURE__ */
|
|
13246
|
+
/* @__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
13247
|
Dialog.Title,
|
|
13346
13248
|
{
|
|
13347
13249
|
css: {
|
|
@@ -13352,17 +13254,17 @@ function HLSFailureModal() {
|
|
|
13352
13254
|
mt: "$4"
|
|
13353
13255
|
}
|
|
13354
13256
|
},
|
|
13355
|
-
/* @__PURE__ */
|
|
13356
|
-
), /* @__PURE__ */
|
|
13257
|
+
/* @__PURE__ */ import_react123.default.createElement(Text, { variant: "h6", css: { fontWeight: "$semiBold" } }, "Failed to Go Live")
|
|
13258
|
+
), /* @__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
13259
|
) : null;
|
|
13358
13260
|
}
|
|
13359
|
-
var
|
|
13261
|
+
var import_react123, import_react_sdk66;
|
|
13360
13262
|
var init_HLSFailureModal = __esm({
|
|
13361
13263
|
"src/Prebuilt/components/Notifications/HLSFailureModal.jsx"() {
|
|
13362
13264
|
"use strict";
|
|
13363
13265
|
init_define_process_env();
|
|
13364
|
-
|
|
13365
|
-
|
|
13266
|
+
import_react123 = __toESM(require("react"));
|
|
13267
|
+
import_react_sdk66 = require("@100mslive/react-sdk");
|
|
13366
13268
|
init_Button2();
|
|
13367
13269
|
init_Layout();
|
|
13368
13270
|
init_Modal();
|
|
@@ -13373,13 +13275,13 @@ var init_HLSFailureModal = __esm({
|
|
|
13373
13275
|
});
|
|
13374
13276
|
|
|
13375
13277
|
// src/Prebuilt/components/hooks/useVideoTileLayout.ts
|
|
13376
|
-
var
|
|
13278
|
+
var import_react124, VideoTileContext, useVideoTileContext;
|
|
13377
13279
|
var init_useVideoTileLayout = __esm({
|
|
13378
13280
|
"src/Prebuilt/components/hooks/useVideoTileLayout.ts"() {
|
|
13379
13281
|
"use strict";
|
|
13380
13282
|
init_define_process_env();
|
|
13381
|
-
|
|
13382
|
-
VideoTileContext =
|
|
13283
|
+
import_react124 = __toESM(require("react"));
|
|
13284
|
+
VideoTileContext = import_react124.default.createContext({
|
|
13383
13285
|
enableSpotlightingPeer: true,
|
|
13384
13286
|
hideParticipantNameOnTile: false,
|
|
13385
13287
|
roundedVideoTile: true,
|
|
@@ -13389,23 +13291,23 @@ var init_useVideoTileLayout = __esm({
|
|
|
13389
13291
|
hideMetadataOnTile: false
|
|
13390
13292
|
});
|
|
13391
13293
|
useVideoTileContext = () => {
|
|
13392
|
-
const context = (0,
|
|
13294
|
+
const context = (0, import_react124.useContext)(VideoTileContext);
|
|
13393
13295
|
return context;
|
|
13394
13296
|
};
|
|
13395
13297
|
}
|
|
13396
13298
|
});
|
|
13397
13299
|
|
|
13398
13300
|
// src/Prebuilt/components/InsetTile.tsx
|
|
13399
|
-
var
|
|
13301
|
+
var import_react125, import_react_draggable, import_react_use20, import_react_sdk67, import_react_icons57, MinimisedTile, insetHeightPx, insetMaxWidthPx, defaultMobileAspectRatio, desktopAspectRatio, InsetTile;
|
|
13400
13302
|
var init_InsetTile = __esm({
|
|
13401
13303
|
"src/Prebuilt/components/InsetTile.tsx"() {
|
|
13402
13304
|
"use strict";
|
|
13403
13305
|
init_define_process_env();
|
|
13404
|
-
|
|
13306
|
+
import_react125 = __toESM(require("react"));
|
|
13405
13307
|
import_react_draggable = __toESM(require("react-draggable"));
|
|
13406
|
-
|
|
13407
|
-
|
|
13408
|
-
|
|
13308
|
+
import_react_use20 = require("react-use");
|
|
13309
|
+
import_react_sdk67 = require("@100mslive/react-sdk");
|
|
13310
|
+
import_react_icons57 = require("@100mslive/react-icons");
|
|
13409
13311
|
init_Layout();
|
|
13410
13312
|
init_Text2();
|
|
13411
13313
|
init_Theme();
|
|
@@ -13416,14 +13318,14 @@ var init_InsetTile = __esm({
|
|
|
13416
13318
|
init_useVideoTileLayout();
|
|
13417
13319
|
init_constants();
|
|
13418
13320
|
MinimisedTile = ({ setMinimised }) => {
|
|
13419
|
-
return /* @__PURE__ */
|
|
13321
|
+
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
13322
|
IconButton_default,
|
|
13421
13323
|
{
|
|
13422
13324
|
className: "__cancel-drag-event",
|
|
13423
13325
|
onClick: () => setMinimised(false),
|
|
13424
13326
|
css: { bg: "transparent", border: "transparent" }
|
|
13425
13327
|
},
|
|
13426
|
-
/* @__PURE__ */
|
|
13328
|
+
/* @__PURE__ */ import_react125.default.createElement(import_react_icons57.ExpandIcon, null)
|
|
13427
13329
|
));
|
|
13428
13330
|
};
|
|
13429
13331
|
insetHeightPx = 180;
|
|
@@ -13431,12 +13333,12 @@ var init_InsetTile = __esm({
|
|
|
13431
13333
|
defaultMobileAspectRatio = 9 / 16;
|
|
13432
13334
|
desktopAspectRatio = 1 / defaultMobileAspectRatio;
|
|
13433
13335
|
InsetTile = () => {
|
|
13434
|
-
const isMobile = (0,
|
|
13435
|
-
const isLandscape = (0,
|
|
13436
|
-
const localPeer = (0,
|
|
13336
|
+
const isMobile = (0, import_react_use20.useMedia)(config.media.md);
|
|
13337
|
+
const isLandscape = (0, import_react_use20.useMedia)(config.media.ls);
|
|
13338
|
+
const localPeer = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectLocalPeer);
|
|
13437
13339
|
const [minimised, setMinimised] = useSetAppDataByKey(APP_DATA.minimiseInset);
|
|
13438
|
-
const videoTrack = (0,
|
|
13439
|
-
const isAllowedToPublish = (0,
|
|
13340
|
+
const videoTrack = (0, import_react_sdk67.useHMSStore)((0, import_react_sdk67.selectVideoTrackByID)(localPeer == null ? void 0 : localPeer.videoTrack));
|
|
13341
|
+
const isAllowedToPublish = (0, import_react_sdk67.useHMSStore)(import_react_sdk67.selectIsAllowedToPublish);
|
|
13440
13342
|
const videoTileProps = useVideoTileContext();
|
|
13441
13343
|
let aspectRatio = isMobile ? defaultMobileAspectRatio : desktopAspectRatio;
|
|
13442
13344
|
if ((videoTrack == null ? void 0 : videoTrack.width) && (videoTrack == null ? void 0 : videoTrack.height) && !isMobile) {
|
|
@@ -13448,8 +13350,8 @@ var init_InsetTile = __esm({
|
|
|
13448
13350
|
width = 240;
|
|
13449
13351
|
height = width / aspectRatio;
|
|
13450
13352
|
}
|
|
13451
|
-
const nodeRef = (0,
|
|
13452
|
-
(0,
|
|
13353
|
+
const nodeRef = (0, import_react125.useRef)(null);
|
|
13354
|
+
(0, import_react125.useEffect)(() => {
|
|
13453
13355
|
const node = nodeRef.current;
|
|
13454
13356
|
if (!node || !window.ResizeObserver) {
|
|
13455
13357
|
return;
|
|
@@ -13470,7 +13372,7 @@ var init_InsetTile = __esm({
|
|
|
13470
13372
|
if (!isAllowedToPublish.video && !isAllowedToPublish.audio) {
|
|
13471
13373
|
return null;
|
|
13472
13374
|
}
|
|
13473
|
-
return /* @__PURE__ */
|
|
13375
|
+
return /* @__PURE__ */ import_react125.default.createElement(import_react_draggable.default, { bounds: "parent", nodeRef, cancel: ".__cancel-drag-event" }, /* @__PURE__ */ import_react125.default.createElement(
|
|
13474
13376
|
Box,
|
|
13475
13377
|
{
|
|
13476
13378
|
ref: nodeRef,
|
|
@@ -13486,9 +13388,9 @@ var init_InsetTile = __esm({
|
|
|
13486
13388
|
h: height
|
|
13487
13389
|
} : {})
|
|
13488
13390
|
},
|
|
13489
|
-
minimised ? /* @__PURE__ */
|
|
13391
|
+
minimised ? /* @__PURE__ */ import_react125.default.createElement(MinimisedTile, { setMinimised }) : /* @__PURE__ */ import_react125.default.createElement(
|
|
13490
13392
|
VideoTile_default,
|
|
13491
|
-
__spreadValues({
|
|
13393
|
+
__spreadProps(__spreadValues({
|
|
13492
13394
|
peerId: localPeer == null ? void 0 : localPeer.id,
|
|
13493
13395
|
trackid: localPeer == null ? void 0 : localPeer.videoTrack,
|
|
13494
13396
|
rootCSS: {
|
|
@@ -13500,7 +13402,9 @@ var init_InsetTile = __esm({
|
|
|
13500
13402
|
containerCSS: { background: "$surface_default" },
|
|
13501
13403
|
canMinimise: true,
|
|
13502
13404
|
isDragabble: true
|
|
13503
|
-
}, videoTileProps)
|
|
13405
|
+
}, videoTileProps), {
|
|
13406
|
+
hideParticipantNameOnTile: true
|
|
13407
|
+
})
|
|
13504
13408
|
)
|
|
13505
13409
|
));
|
|
13506
13410
|
};
|
|
@@ -13508,13 +13412,13 @@ var init_InsetTile = __esm({
|
|
|
13508
13412
|
});
|
|
13509
13413
|
|
|
13510
13414
|
// src/Prebuilt/components/Pagination.tsx
|
|
13511
|
-
var
|
|
13415
|
+
var import_react126, import_react_icons58, Pagination;
|
|
13512
13416
|
var init_Pagination2 = __esm({
|
|
13513
13417
|
"src/Prebuilt/components/Pagination.tsx"() {
|
|
13514
13418
|
"use strict";
|
|
13515
13419
|
init_define_process_env();
|
|
13516
|
-
|
|
13517
|
-
|
|
13420
|
+
import_react126 = __toESM(require("react"));
|
|
13421
|
+
import_react_icons58 = require("@100mslive/react-icons");
|
|
13518
13422
|
init_Pagination();
|
|
13519
13423
|
Pagination = ({
|
|
13520
13424
|
page,
|
|
@@ -13531,7 +13435,7 @@ var init_Pagination2 = __esm({
|
|
|
13531
13435
|
e.stopPropagation();
|
|
13532
13436
|
onPageChange(Math.max(page - 1, 0));
|
|
13533
13437
|
};
|
|
13534
|
-
(0,
|
|
13438
|
+
(0, import_react126.useEffect)(() => {
|
|
13535
13439
|
if (page >= numPages) {
|
|
13536
13440
|
onPageChange(Math.max(0, numPages - 1));
|
|
13537
13441
|
}
|
|
@@ -13539,7 +13443,7 @@ var init_Pagination2 = __esm({
|
|
|
13539
13443
|
if (numPages <= 1) {
|
|
13540
13444
|
return null;
|
|
13541
13445
|
}
|
|
13542
|
-
return /* @__PURE__ */
|
|
13446
|
+
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
13447
|
StyledPagination.Dot,
|
|
13544
13448
|
{
|
|
13545
13449
|
key: i,
|
|
@@ -13549,25 +13453,25 @@ var init_Pagination2 = __esm({
|
|
|
13549
13453
|
onPageChange(i);
|
|
13550
13454
|
}
|
|
13551
13455
|
}
|
|
13552
|
-
))) : null, /* @__PURE__ */
|
|
13456
|
+
))) : 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
13457
|
};
|
|
13554
13458
|
}
|
|
13555
13459
|
});
|
|
13556
13460
|
|
|
13557
13461
|
// src/Prebuilt/components/VideoLayouts/Grid.tsx
|
|
13558
|
-
var
|
|
13462
|
+
var import_react127, Grid;
|
|
13559
13463
|
var init_Grid = __esm({
|
|
13560
13464
|
"src/Prebuilt/components/VideoLayouts/Grid.tsx"() {
|
|
13561
13465
|
"use strict";
|
|
13562
13466
|
init_define_process_env();
|
|
13563
|
-
|
|
13467
|
+
import_react127 = __toESM(require("react"));
|
|
13564
13468
|
init_Layout();
|
|
13565
13469
|
init_VideoTile2();
|
|
13566
13470
|
init_useVideoTileLayout();
|
|
13567
|
-
Grid =
|
|
13471
|
+
Grid = import_react127.default.forwardRef(
|
|
13568
13472
|
({ tiles, edgeToEdge }, ref) => {
|
|
13569
13473
|
const videoTileProps = useVideoTileContext();
|
|
13570
|
-
return /* @__PURE__ */
|
|
13474
|
+
return /* @__PURE__ */ import_react127.default.createElement(
|
|
13571
13475
|
Box,
|
|
13572
13476
|
{
|
|
13573
13477
|
ref,
|
|
@@ -13585,7 +13489,7 @@ var init_Grid = __esm({
|
|
|
13585
13489
|
},
|
|
13586
13490
|
tiles == null ? void 0 : tiles.map((tile) => {
|
|
13587
13491
|
var _a7, _b7, _c, _d;
|
|
13588
|
-
return /* @__PURE__ */
|
|
13492
|
+
return /* @__PURE__ */ import_react127.default.createElement(
|
|
13589
13493
|
VideoTile_default,
|
|
13590
13494
|
__spreadValues({
|
|
13591
13495
|
key: ((_a7 = tile.track) == null ? void 0 : _a7.id) || ((_b7 = tile.peer) == null ? void 0 : _b7.id),
|
|
@@ -13605,25 +13509,25 @@ var init_Grid = __esm({
|
|
|
13605
13509
|
});
|
|
13606
13510
|
|
|
13607
13511
|
// src/Prebuilt/components/hooks/useTileLayout.tsx
|
|
13608
|
-
var
|
|
13512
|
+
var import_react128, import_react_use21, import_react_sdk68, aspectRatioConfig, usePagesWithTiles, useTileLayout;
|
|
13609
13513
|
var init_useTileLayout = __esm({
|
|
13610
13514
|
"src/Prebuilt/components/hooks/useTileLayout.tsx"() {
|
|
13611
13515
|
"use strict";
|
|
13612
13516
|
init_define_process_env();
|
|
13613
|
-
|
|
13614
|
-
|
|
13615
|
-
|
|
13517
|
+
import_react128 = require("react");
|
|
13518
|
+
import_react_use21 = require("react-use");
|
|
13519
|
+
import_react_sdk68 = require("@100mslive/react-sdk");
|
|
13616
13520
|
init_Theme();
|
|
13617
13521
|
aspectRatioConfig = { default: [1 / 1, 4 / 3, 16 / 9], mobile: [1 / 1, 3 / 4, 9 / 16] };
|
|
13618
13522
|
usePagesWithTiles = ({ peers, maxTileCount }) => {
|
|
13619
|
-
const vanillaStore = (0,
|
|
13620
|
-
const tracksMap = vanillaStore.getState(
|
|
13621
|
-
const peersWithTiles = (0,
|
|
13622
|
-
() => (0,
|
|
13523
|
+
const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
|
|
13524
|
+
const tracksMap = vanillaStore.getState(import_react_sdk68.selectTracksMap);
|
|
13525
|
+
const peersWithTiles = (0, import_react128.useMemo)(
|
|
13526
|
+
() => (0, import_react_sdk68.getPeersWithTiles)(peers, tracksMap, () => false),
|
|
13623
13527
|
[peers, tracksMap]
|
|
13624
13528
|
);
|
|
13625
13529
|
const noOfPages = Math.ceil(peersWithTiles.length / maxTileCount);
|
|
13626
|
-
const pagesList = (0,
|
|
13530
|
+
const pagesList = (0, import_react128.useMemo)(() => {
|
|
13627
13531
|
let sliceStart = 0;
|
|
13628
13532
|
let remaining = peersWithTiles.length;
|
|
13629
13533
|
const list = [];
|
|
@@ -13642,11 +13546,11 @@ var init_useTileLayout = __esm({
|
|
|
13642
13546
|
maxTileCount,
|
|
13643
13547
|
edgeToEdge = false
|
|
13644
13548
|
}) => {
|
|
13645
|
-
const vanillaStore = (0,
|
|
13646
|
-
const [ref, { width, height }] = (0,
|
|
13647
|
-
const isMobile = (0,
|
|
13648
|
-
const [pagesWithTiles, setPagesWithTiles] = (0,
|
|
13649
|
-
(0,
|
|
13549
|
+
const vanillaStore = (0, import_react_sdk68.useHMSVanillaStore)();
|
|
13550
|
+
const [ref, { width, height }] = (0, import_react_use21.useMeasure)();
|
|
13551
|
+
const isMobile = (0, import_react_use21.useMedia)(config.media.lg);
|
|
13552
|
+
const [pagesWithTiles, setPagesWithTiles] = (0, import_react128.useState)([]);
|
|
13553
|
+
(0, import_react128.useEffect)(() => {
|
|
13650
13554
|
if (width === 0 || height === 0) {
|
|
13651
13555
|
return;
|
|
13652
13556
|
}
|
|
@@ -13715,15 +13619,15 @@ var init_useTileLayout = __esm({
|
|
|
13715
13619
|
// src/Prebuilt/components/VideoLayouts/EqualProminence.tsx
|
|
13716
13620
|
function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSize, edgeToEdge }) {
|
|
13717
13621
|
var _a7;
|
|
13718
|
-
const localPeer = (0,
|
|
13719
|
-
const isMobile = (0,
|
|
13622
|
+
const localPeer = (0, import_react_sdk69.useHMSStore)(import_react_sdk69.selectLocalPeer);
|
|
13623
|
+
const isMobile = (0, import_react_use22.useMedia)(config.media.md);
|
|
13720
13624
|
let maxTileCount = useUISettings(UI_SETTINGS.maxTileCount);
|
|
13721
13625
|
maxTileCount = isMobile ? Math.min(maxTileCount, 6) : maxTileCount;
|
|
13722
13626
|
let pageList = usePagesWithTiles({
|
|
13723
13627
|
peers,
|
|
13724
13628
|
maxTileCount
|
|
13725
13629
|
});
|
|
13726
|
-
const inputPeers = (0,
|
|
13630
|
+
const inputPeers = (0, import_react129.useMemo)(
|
|
13727
13631
|
() => pageList.length === 0 ? localPeer ? [localPeer] : [] : peers,
|
|
13728
13632
|
[pageList.length, peers, localPeer]
|
|
13729
13633
|
);
|
|
@@ -13736,14 +13640,14 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
|
|
|
13736
13640
|
maxTileCount,
|
|
13737
13641
|
edgeToEdge
|
|
13738
13642
|
});
|
|
13739
|
-
const [page, setPage] = (0,
|
|
13643
|
+
const [page, setPage] = (0, import_react129.useState)(0);
|
|
13740
13644
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13741
|
-
(0,
|
|
13645
|
+
(0, import_react129.useEffect)(() => {
|
|
13742
13646
|
if (pageSize > 0) {
|
|
13743
13647
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13744
13648
|
}
|
|
13745
13649
|
}, [pageSize, onPageSize]);
|
|
13746
|
-
return /* @__PURE__ */
|
|
13650
|
+
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
13651
|
Pagination,
|
|
13748
13652
|
{
|
|
13749
13653
|
page,
|
|
@@ -13753,16 +13657,16 @@ function EqualProminence({ isInsetEnabled = false, peers, onPageChange, onPageSi
|
|
|
13753
13657
|
},
|
|
13754
13658
|
numPages: pagesWithTiles.length
|
|
13755
13659
|
}
|
|
13756
|
-
), isInsetEnabled && pageList.length > 0 && pageList[0][0].peer.id !== (localPeer == null ? void 0 : localPeer.id) && /* @__PURE__ */
|
|
13660
|
+
), isInsetEnabled && pageList.length > 0 && pageList[0][0].peer.id !== (localPeer == null ? void 0 : localPeer.id) && /* @__PURE__ */ import_react129.default.createElement(InsetTile, null));
|
|
13757
13661
|
}
|
|
13758
|
-
var
|
|
13662
|
+
var import_react129, import_react_use22, import_react_sdk69;
|
|
13759
13663
|
var init_EqualProminence = __esm({
|
|
13760
13664
|
"src/Prebuilt/components/VideoLayouts/EqualProminence.tsx"() {
|
|
13761
13665
|
"use strict";
|
|
13762
13666
|
init_define_process_env();
|
|
13763
|
-
|
|
13764
|
-
|
|
13765
|
-
|
|
13667
|
+
import_react129 = __toESM(require("react"));
|
|
13668
|
+
import_react_use22 = require("react-use");
|
|
13669
|
+
import_react_sdk69 = require("@100mslive/react-sdk");
|
|
13766
13670
|
init_Layout();
|
|
13767
13671
|
init_Theme();
|
|
13768
13672
|
init_InsetTile();
|
|
@@ -13775,16 +13679,16 @@ var init_EqualProminence = __esm({
|
|
|
13775
13679
|
});
|
|
13776
13680
|
|
|
13777
13681
|
// src/Prebuilt/components/VideoLayouts/ProminenceLayout.tsx
|
|
13778
|
-
var
|
|
13682
|
+
var import_react130, Root25, ProminentSection, SecondarySection, ProminenceLayout;
|
|
13779
13683
|
var init_ProminenceLayout = __esm({
|
|
13780
13684
|
"src/Prebuilt/components/VideoLayouts/ProminenceLayout.tsx"() {
|
|
13781
13685
|
"use strict";
|
|
13782
13686
|
init_define_process_env();
|
|
13783
|
-
|
|
13687
|
+
import_react130 = __toESM(require("react"));
|
|
13784
13688
|
init_Layout();
|
|
13785
13689
|
init_VideoTile2();
|
|
13786
13690
|
init_useVideoTileLayout();
|
|
13787
|
-
Root25 = ({ children, edgeToEdge }) => /* @__PURE__ */
|
|
13691
|
+
Root25 = ({ children, edgeToEdge }) => /* @__PURE__ */ import_react130.default.createElement(
|
|
13788
13692
|
Flex,
|
|
13789
13693
|
{
|
|
13790
13694
|
direction: "column",
|
|
@@ -13793,7 +13697,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13793
13697
|
children
|
|
13794
13698
|
);
|
|
13795
13699
|
ProminentSection = ({ children, css: css2 = {} }) => {
|
|
13796
|
-
return /* @__PURE__ */
|
|
13700
|
+
return /* @__PURE__ */ import_react130.default.createElement(Flex, { direction: "column", css: __spreadValues({ flex: "1 1 0", gap: "$2", minHeight: 0 }, css2) }, children);
|
|
13797
13701
|
};
|
|
13798
13702
|
SecondarySection = ({
|
|
13799
13703
|
tiles,
|
|
@@ -13804,12 +13708,12 @@ var init_ProminenceLayout = __esm({
|
|
|
13804
13708
|
if (!(tiles == null ? void 0 : tiles.length)) {
|
|
13805
13709
|
return null;
|
|
13806
13710
|
}
|
|
13807
|
-
return /* @__PURE__ */
|
|
13711
|
+
return /* @__PURE__ */ import_react130.default.createElement(
|
|
13808
13712
|
Box,
|
|
13809
13713
|
{
|
|
13810
13714
|
css: {
|
|
13811
13715
|
display: "grid",
|
|
13812
|
-
gridTemplateRows:
|
|
13716
|
+
gridTemplateRows: import_react130.default.Children.count(children) > 0 ? "136px auto" : "154px",
|
|
13813
13717
|
gridTemplateColumns: `repeat(${tiles.length}, minmax(0, 1fr))`,
|
|
13814
13718
|
margin: "0 auto",
|
|
13815
13719
|
gap: "$2 $4",
|
|
@@ -13819,7 +13723,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13819
13723
|
},
|
|
13820
13724
|
tiles.map((tile) => {
|
|
13821
13725
|
var _a7, _b7, _c, _d;
|
|
13822
|
-
return /* @__PURE__ */
|
|
13726
|
+
return /* @__PURE__ */ import_react130.default.createElement(
|
|
13823
13727
|
VideoTile_default,
|
|
13824
13728
|
__spreadValues({
|
|
13825
13729
|
key: ((_a7 = tile.track) == null ? void 0 : _a7.id) || ((_b7 = tile.peer) == null ? void 0 : _b7.id),
|
|
@@ -13836,7 +13740,7 @@ var init_ProminenceLayout = __esm({
|
|
|
13836
13740
|
}, tileLayoutProps)
|
|
13837
13741
|
);
|
|
13838
13742
|
}),
|
|
13839
|
-
/* @__PURE__ */
|
|
13743
|
+
/* @__PURE__ */ import_react130.default.createElement(Box, { css: { gridColumn: `1/span ${tiles.length}` } }, children)
|
|
13840
13744
|
);
|
|
13841
13745
|
};
|
|
13842
13746
|
ProminenceLayout = {
|
|
@@ -13848,30 +13752,30 @@ var init_ProminenceLayout = __esm({
|
|
|
13848
13752
|
});
|
|
13849
13753
|
|
|
13850
13754
|
// src/Prebuilt/components/SecondaryTiles.tsx
|
|
13851
|
-
var
|
|
13755
|
+
var import_react131, import_react_use23, SecondaryTiles;
|
|
13852
13756
|
var init_SecondaryTiles = __esm({
|
|
13853
13757
|
"src/Prebuilt/components/SecondaryTiles.tsx"() {
|
|
13854
13758
|
"use strict";
|
|
13855
13759
|
init_define_process_env();
|
|
13856
|
-
|
|
13857
|
-
|
|
13760
|
+
import_react131 = __toESM(require("react"));
|
|
13761
|
+
import_react_use23 = require("react-use");
|
|
13858
13762
|
init_ProminenceLayout();
|
|
13859
13763
|
init_Theme();
|
|
13860
13764
|
init_Pagination2();
|
|
13861
13765
|
init_useTileLayout();
|
|
13862
13766
|
SecondaryTiles = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
|
|
13863
13767
|
var _a7;
|
|
13864
|
-
const isMobile = (0,
|
|
13768
|
+
const isMobile = (0, import_react_use23.useMedia)(config.media.md);
|
|
13865
13769
|
const maxTileCount = isMobile ? 2 : 4;
|
|
13866
13770
|
const pagesWithTiles = usePagesWithTiles({ peers, maxTileCount });
|
|
13867
|
-
const [page, setPage] = (0,
|
|
13771
|
+
const [page, setPage] = (0, import_react131.useState)(0);
|
|
13868
13772
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13869
|
-
(0,
|
|
13773
|
+
(0, import_react131.useEffect)(() => {
|
|
13870
13774
|
if (pageSize > 0) {
|
|
13871
13775
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13872
13776
|
}
|
|
13873
13777
|
}, [pageSize, onPageSize]);
|
|
13874
|
-
return /* @__PURE__ */
|
|
13778
|
+
return /* @__PURE__ */ import_react131.default.createElement(ProminenceLayout.SecondarySection, { tiles: pagesWithTiles[page], edgeToEdge }, !edgeToEdge && /* @__PURE__ */ import_react131.default.createElement(
|
|
13875
13779
|
Pagination,
|
|
13876
13780
|
{
|
|
13877
13781
|
page,
|
|
@@ -13887,16 +13791,16 @@ var init_SecondaryTiles = __esm({
|
|
|
13887
13791
|
});
|
|
13888
13792
|
|
|
13889
13793
|
// src/Prebuilt/components/hooks/useRoleProminencePeers.tsx
|
|
13890
|
-
var
|
|
13794
|
+
var import_react132, useRoleProminencePeers;
|
|
13891
13795
|
var init_useRoleProminencePeers = __esm({
|
|
13892
13796
|
"src/Prebuilt/components/hooks/useRoleProminencePeers.tsx"() {
|
|
13893
13797
|
"use strict";
|
|
13894
13798
|
init_define_process_env();
|
|
13895
|
-
|
|
13799
|
+
import_react132 = require("react");
|
|
13896
13800
|
init_useUISettings();
|
|
13897
13801
|
useRoleProminencePeers = (prominentRoles, peers, isInsetEnabled) => {
|
|
13898
13802
|
const pinnedTrack = usePinnedTrack();
|
|
13899
|
-
const [prominentPeers, secondaryPeers] = (0,
|
|
13803
|
+
const [prominentPeers, secondaryPeers] = (0, import_react132.useMemo)(() => {
|
|
13900
13804
|
return peers.reduce(
|
|
13901
13805
|
(acc, peer) => {
|
|
13902
13806
|
if (pinnedTrack) {
|
|
@@ -13939,7 +13843,7 @@ function RoleProminence({
|
|
|
13939
13843
|
}) {
|
|
13940
13844
|
var _a7;
|
|
13941
13845
|
const { prominentPeers, secondaryPeers } = useRoleProminencePeers(prominentRoles, peers, isInsetEnabled);
|
|
13942
|
-
const localPeer = (0,
|
|
13846
|
+
const localPeer = (0, import_react_sdk70.useHMSStore)(import_react_sdk70.selectLocalPeer);
|
|
13943
13847
|
const maxTileCount = 4;
|
|
13944
13848
|
const pageList = usePagesWithTiles({
|
|
13945
13849
|
peers: prominentPeers,
|
|
@@ -13949,14 +13853,14 @@ function RoleProminence({
|
|
|
13949
13853
|
pageList,
|
|
13950
13854
|
maxTileCount
|
|
13951
13855
|
});
|
|
13952
|
-
const [page, setPage] = (0,
|
|
13856
|
+
const [page, setPage] = (0, import_react133.useState)(0);
|
|
13953
13857
|
const pageSize = ((_a7 = pagesWithTiles[0]) == null ? void 0 : _a7.length) || 0;
|
|
13954
|
-
(0,
|
|
13858
|
+
(0, import_react133.useEffect)(() => {
|
|
13955
13859
|
if (pageSize > 0) {
|
|
13956
13860
|
onPageSize == null ? void 0 : onPageSize(pageSize);
|
|
13957
13861
|
}
|
|
13958
13862
|
}, [pageSize, onPageSize]);
|
|
13959
|
-
return /* @__PURE__ */
|
|
13863
|
+
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
13864
|
Pagination,
|
|
13961
13865
|
{
|
|
13962
13866
|
page,
|
|
@@ -13966,15 +13870,15 @@ function RoleProminence({
|
|
|
13966
13870
|
},
|
|
13967
13871
|
numPages: pagesWithTiles.length
|
|
13968
13872
|
}
|
|
13969
|
-
), /* @__PURE__ */
|
|
13873
|
+
), /* @__PURE__ */ import_react133.default.createElement(SecondaryTiles, { peers: secondaryPeers, isInsetEnabled, edgeToEdge }), isInsetEnabled && localPeer && !prominentPeers.includes(localPeer) && /* @__PURE__ */ import_react133.default.createElement(InsetTile, null));
|
|
13970
13874
|
}
|
|
13971
|
-
var
|
|
13875
|
+
var import_react133, import_react_sdk70;
|
|
13972
13876
|
var init_RoleProminence = __esm({
|
|
13973
13877
|
"src/Prebuilt/components/VideoLayouts/RoleProminence.tsx"() {
|
|
13974
13878
|
"use strict";
|
|
13975
13879
|
init_define_process_env();
|
|
13976
|
-
|
|
13977
|
-
|
|
13880
|
+
import_react133 = __toESM(require("react"));
|
|
13881
|
+
import_react_sdk70 = require("@100mslive/react-sdk");
|
|
13978
13882
|
init_InsetTile();
|
|
13979
13883
|
init_Pagination2();
|
|
13980
13884
|
init_SecondaryTiles();
|
|
@@ -13986,20 +13890,20 @@ var init_RoleProminence = __esm({
|
|
|
13986
13890
|
});
|
|
13987
13891
|
|
|
13988
13892
|
// src/Prebuilt/components/ScreenshareDisplay.jsx
|
|
13989
|
-
var
|
|
13893
|
+
var import_react134, import_react_sdk71, import_react_icons59, ScreenshareDisplay;
|
|
13990
13894
|
var init_ScreenshareDisplay = __esm({
|
|
13991
13895
|
"src/Prebuilt/components/ScreenshareDisplay.jsx"() {
|
|
13992
13896
|
"use strict";
|
|
13993
13897
|
init_define_process_env();
|
|
13994
|
-
|
|
13995
|
-
|
|
13996
|
-
|
|
13898
|
+
import_react134 = __toESM(require("react"));
|
|
13899
|
+
import_react_sdk71 = require("@100mslive/react-sdk");
|
|
13900
|
+
import_react_icons59 = require("@100mslive/react-icons");
|
|
13997
13901
|
init_Button2();
|
|
13998
13902
|
init_Layout();
|
|
13999
13903
|
init_Text2();
|
|
14000
13904
|
ScreenshareDisplay = () => {
|
|
14001
|
-
const hmsActions = (0,
|
|
14002
|
-
return /* @__PURE__ */
|
|
13905
|
+
const hmsActions = (0, import_react_sdk71.useHMSActions)();
|
|
13906
|
+
return /* @__PURE__ */ import_react134.default.createElement(
|
|
14003
13907
|
Flex,
|
|
14004
13908
|
{
|
|
14005
13909
|
direction: "column",
|
|
@@ -14011,9 +13915,9 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14011
13915
|
color: "$on_surface_high"
|
|
14012
13916
|
}
|
|
14013
13917
|
},
|
|
14014
|
-
/* @__PURE__ */
|
|
14015
|
-
/* @__PURE__ */
|
|
14016
|
-
/* @__PURE__ */
|
|
13918
|
+
/* @__PURE__ */ import_react134.default.createElement(import_react_icons59.ShareScreenIcon, { width: 48, height: 48 }),
|
|
13919
|
+
/* @__PURE__ */ import_react134.default.createElement(Text, { variant: "h5", css: { m: "$8 0" } }, "You are sharing your screen"),
|
|
13920
|
+
/* @__PURE__ */ import_react134.default.createElement(
|
|
14017
13921
|
Button,
|
|
14018
13922
|
{
|
|
14019
13923
|
variant: "danger",
|
|
@@ -14023,7 +13927,7 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14023
13927
|
}),
|
|
14024
13928
|
"data-testid": "stop_screen_share_btn"
|
|
14025
13929
|
},
|
|
14026
|
-
/* @__PURE__ */
|
|
13930
|
+
/* @__PURE__ */ import_react134.default.createElement(import_react_icons59.CrossIcon, { width: 18, height: 18 }),
|
|
14027
13931
|
"\xA0 Stop screen share"
|
|
14028
13932
|
)
|
|
14029
13933
|
);
|
|
@@ -14032,16 +13936,16 @@ var init_ScreenshareDisplay = __esm({
|
|
|
14032
13936
|
});
|
|
14033
13937
|
|
|
14034
13938
|
// src/Prebuilt/components/ScreenshareTile.jsx
|
|
14035
|
-
var
|
|
13939
|
+
var import_react135, import_react_use24, import_screenfull2, import_react_sdk72, import_react_icons60, labelStyles, Tile2, ScreenshareTile, ScreenshareTile_default;
|
|
14036
13940
|
var init_ScreenshareTile = __esm({
|
|
14037
13941
|
"src/Prebuilt/components/ScreenshareTile.jsx"() {
|
|
14038
13942
|
"use strict";
|
|
14039
13943
|
init_define_process_env();
|
|
14040
|
-
|
|
14041
|
-
|
|
13944
|
+
import_react135 = __toESM(require("react"));
|
|
13945
|
+
import_react_use24 = require("react-use");
|
|
14042
13946
|
import_screenfull2 = __toESM(require("screenfull"));
|
|
14043
|
-
|
|
14044
|
-
|
|
13947
|
+
import_react_sdk72 = require("@100mslive/react-sdk");
|
|
13948
|
+
import_react_icons60 = require("@100mslive/react-icons");
|
|
14045
13949
|
init_TileMenu2();
|
|
14046
13950
|
init_Stats2();
|
|
14047
13951
|
init_Video2();
|
|
@@ -14059,31 +13963,31 @@ var init_ScreenshareTile = __esm({
|
|
|
14059
13963
|
flexShrink: 0
|
|
14060
13964
|
};
|
|
14061
13965
|
Tile2 = ({ peerId, width = "100%", height = "100%" }) => {
|
|
14062
|
-
const isLocal = (0,
|
|
14063
|
-
const track = (0,
|
|
14064
|
-
const peer = (0,
|
|
13966
|
+
const isLocal = (0, import_react_sdk72.useHMSStore)(import_react_sdk72.selectLocalPeerID) === peerId;
|
|
13967
|
+
const track = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareByPeerID)(peerId));
|
|
13968
|
+
const peer = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectPeerByID)(peerId));
|
|
14065
13969
|
const isAudioOnly = useUISettings(UI_SETTINGS.isAudioOnly);
|
|
14066
|
-
const [isMouseHovered, setIsMouseHovered] = (0,
|
|
13970
|
+
const [isMouseHovered, setIsMouseHovered] = (0, import_react135.useState)(false);
|
|
14067
13971
|
const showStatsOnTiles = useUISettings(UI_SETTINGS.showStatsOnTiles);
|
|
14068
|
-
const
|
|
14069
|
-
|
|
14070
|
-
|
|
14071
|
-
track
|
|
14072
|
-
});
|
|
14073
|
-
const fullscreenRef = (0, import_react136.useRef)(null);
|
|
14074
|
-
const [fullscreen, setFullscreen] = (0, import_react136.useState)(false);
|
|
14075
|
-
const isFullscreen = (0, import_react_use25.useFullscreen)(fullscreenRef, fullscreen, {
|
|
13972
|
+
const fullscreenRef = (0, import_react135.useRef)(null);
|
|
13973
|
+
const [fullscreen, setFullscreen] = (0, import_react135.useState)(false);
|
|
13974
|
+
const isFullscreen = (0, import_react_use24.useFullscreen)(fullscreenRef, fullscreen, {
|
|
14076
13975
|
onClose: () => setFullscreen(false)
|
|
14077
13976
|
});
|
|
14078
13977
|
const isFullScreenSupported = import_screenfull2.default.isEnabled;
|
|
14079
|
-
const audioTrack = (0,
|
|
13978
|
+
const audioTrack = (0, import_react_sdk72.useHMSStore)((0, import_react_sdk72.selectScreenShareAudioByPeerID)(peer == null ? void 0 : peer.id));
|
|
14080
13979
|
if (isLocal && !["browser", "window", "application"].includes(track == null ? void 0 : track.displaySurface)) {
|
|
14081
|
-
return /* @__PURE__ */
|
|
13980
|
+
return /* @__PURE__ */ import_react135.default.createElement(ScreenshareDisplay, null);
|
|
14082
13981
|
}
|
|
14083
13982
|
if (!peer) {
|
|
14084
13983
|
return null;
|
|
14085
13984
|
}
|
|
14086
|
-
|
|
13985
|
+
const label = getVideoTileLabel({
|
|
13986
|
+
peerName: peer == null ? void 0 : peer.name,
|
|
13987
|
+
isLocal: false,
|
|
13988
|
+
track
|
|
13989
|
+
});
|
|
13990
|
+
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
13991
|
StyledVideoTile.Container,
|
|
14088
13992
|
{
|
|
14089
13993
|
transparentBg: true,
|
|
@@ -14094,9 +13998,9 @@ var init_ScreenshareTile = __esm({
|
|
|
14094
13998
|
setIsMouseHovered(false);
|
|
14095
13999
|
}
|
|
14096
14000
|
},
|
|
14097
|
-
showStatsOnTiles ? /* @__PURE__ */
|
|
14098
|
-
isFullScreenSupported && isMouseHovered ? /* @__PURE__ */
|
|
14099
|
-
track ? /* @__PURE__ */
|
|
14001
|
+
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,
|
|
14002
|
+
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,
|
|
14003
|
+
track ? /* @__PURE__ */ import_react135.default.createElement(
|
|
14100
14004
|
Video,
|
|
14101
14005
|
{
|
|
14102
14006
|
screenShare: true,
|
|
@@ -14106,24 +14010,33 @@ var init_ScreenshareTile = __esm({
|
|
|
14106
14010
|
css: { minHeight: 0 }
|
|
14107
14011
|
}
|
|
14108
14012
|
) : null,
|
|
14109
|
-
/* @__PURE__ */
|
|
14110
|
-
isMouseHovered && !
|
|
14013
|
+
/* @__PURE__ */ import_react135.default.createElement(StyledVideoTile.Info, { css: labelStyles }, label),
|
|
14014
|
+
isMouseHovered && !peer.isLocal ? /* @__PURE__ */ import_react135.default.createElement(
|
|
14015
|
+
TileMenu_default,
|
|
14016
|
+
{
|
|
14017
|
+
isScreenshare: true,
|
|
14018
|
+
peerID: peer.id,
|
|
14019
|
+
audioTrackID: audioTrack == null ? void 0 : audioTrack.id,
|
|
14020
|
+
videoTrackID: track == null ? void 0 : track.id,
|
|
14021
|
+
enableSpotlightingPeer: false
|
|
14022
|
+
}
|
|
14023
|
+
) : null
|
|
14111
14024
|
));
|
|
14112
14025
|
};
|
|
14113
|
-
ScreenshareTile =
|
|
14026
|
+
ScreenshareTile = import_react135.default.memo(Tile2);
|
|
14114
14027
|
ScreenshareTile_default = ScreenshareTile;
|
|
14115
14028
|
}
|
|
14116
14029
|
});
|
|
14117
14030
|
|
|
14118
14031
|
// src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx
|
|
14119
|
-
var
|
|
14032
|
+
var import_react136, import_react_use25, import_react_sdk73, ScreenshareLayout;
|
|
14120
14033
|
var init_ScreenshareLayout = __esm({
|
|
14121
14034
|
"src/Prebuilt/components/VideoLayouts/ScreenshareLayout.tsx"() {
|
|
14122
14035
|
"use strict";
|
|
14123
14036
|
init_define_process_env();
|
|
14124
|
-
|
|
14125
|
-
|
|
14126
|
-
|
|
14037
|
+
import_react136 = __toESM(require("react"));
|
|
14038
|
+
import_react_use25 = require("react-use");
|
|
14039
|
+
import_react_sdk73 = require("@100mslive/react-sdk");
|
|
14127
14040
|
init_Theme();
|
|
14128
14041
|
init_Pagination2();
|
|
14129
14042
|
init_ScreenshareTile();
|
|
@@ -14133,22 +14046,22 @@ var init_ScreenshareLayout = __esm({
|
|
|
14133
14046
|
init_constants();
|
|
14134
14047
|
ScreenshareLayout = ({ peers, onPageChange, onPageSize, edgeToEdge }) => {
|
|
14135
14048
|
var _a7;
|
|
14136
|
-
const peersSharing = (0,
|
|
14049
|
+
const peersSharing = (0, import_react_sdk73.useHMSStore)(import_react_sdk73.selectPeersScreenSharing);
|
|
14137
14050
|
const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
|
|
14138
|
-
const [page, setPage] = (0,
|
|
14051
|
+
const [page, setPage] = (0, import_react136.useState)(0);
|
|
14139
14052
|
const activeSharePeer = peersSharing[page];
|
|
14140
|
-
const isMobile = (0,
|
|
14141
|
-
const secondaryPeers = (0,
|
|
14053
|
+
const isMobile = (0, import_react_use25.useMedia)(config.media.md);
|
|
14054
|
+
const secondaryPeers = (0, import_react136.useMemo)(
|
|
14142
14055
|
() => 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
14056
|
[activeSharePeer, peers, isMobile]
|
|
14144
14057
|
);
|
|
14145
|
-
(0,
|
|
14058
|
+
(0, import_react136.useEffect)(() => {
|
|
14146
14059
|
setActiveScreenSharePeer(isMobile ? "" : activeSharePeer == null ? void 0 : activeSharePeer.id);
|
|
14147
14060
|
return () => {
|
|
14148
14061
|
setActiveScreenSharePeer("");
|
|
14149
14062
|
};
|
|
14150
14063
|
}, [activeSharePeer == null ? void 0 : activeSharePeer.id, isMobile, setActiveScreenSharePeer]);
|
|
14151
|
-
return /* @__PURE__ */
|
|
14064
|
+
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
14065
|
SecondaryTiles,
|
|
14153
14066
|
{
|
|
14154
14067
|
peers: secondaryPeers,
|
|
@@ -14162,12 +14075,12 @@ var init_ScreenshareLayout = __esm({
|
|
|
14162
14075
|
});
|
|
14163
14076
|
|
|
14164
14077
|
// src/Prebuilt/common/PeersSorter.ts
|
|
14165
|
-
var
|
|
14078
|
+
var import_react_sdk74, PeersSorter, PeersSorter_default;
|
|
14166
14079
|
var init_PeersSorter = __esm({
|
|
14167
14080
|
"src/Prebuilt/common/PeersSorter.ts"() {
|
|
14168
14081
|
"use strict";
|
|
14169
14082
|
init_define_process_env();
|
|
14170
|
-
|
|
14083
|
+
import_react_sdk74 = require("@100mslive/react-sdk");
|
|
14171
14084
|
PeersSorter = class {
|
|
14172
14085
|
constructor(store) {
|
|
14173
14086
|
this.storeUnsubscribe = void 0;
|
|
@@ -14188,7 +14101,7 @@ var init_PeersSorter = __esm({
|
|
|
14188
14101
|
}
|
|
14189
14102
|
});
|
|
14190
14103
|
if (!this.storeUnsubscribe) {
|
|
14191
|
-
this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange,
|
|
14104
|
+
this.storeUnsubscribe = this.store.subscribe(this.onDominantSpeakerChange, import_react_sdk74.selectDominantSpeaker);
|
|
14192
14105
|
}
|
|
14193
14106
|
this.moveSpeakerToFront(this.speaker);
|
|
14194
14107
|
};
|
|
@@ -14251,13 +14164,13 @@ var init_PeersSorter = __esm({
|
|
|
14251
14164
|
});
|
|
14252
14165
|
|
|
14253
14166
|
// src/Prebuilt/components/VideoLayouts/GridLayout.tsx
|
|
14254
|
-
var
|
|
14167
|
+
var import_react137, import_react_sdk75, GridLayout;
|
|
14255
14168
|
var init_GridLayout = __esm({
|
|
14256
14169
|
"src/Prebuilt/components/VideoLayouts/GridLayout.tsx"() {
|
|
14257
14170
|
"use strict";
|
|
14258
14171
|
init_define_process_env();
|
|
14259
|
-
|
|
14260
|
-
|
|
14172
|
+
import_react137 = __toESM(require("react"));
|
|
14173
|
+
import_react_sdk75 = require("@100mslive/react-sdk");
|
|
14261
14174
|
init_EqualProminence();
|
|
14262
14175
|
init_RoleProminence();
|
|
14263
14176
|
init_ScreenshareLayout();
|
|
@@ -14275,23 +14188,23 @@ var init_GridLayout = __esm({
|
|
|
14275
14188
|
edge_to_edge = false,
|
|
14276
14189
|
hide_metadata_on_tile = false
|
|
14277
14190
|
}) => {
|
|
14278
|
-
const peerSharing = (0,
|
|
14191
|
+
const peerSharing = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeerScreenSharing);
|
|
14279
14192
|
const pinnedTrack = usePinnedTrack();
|
|
14280
|
-
const peers = (0,
|
|
14193
|
+
const peers = (0, import_react_sdk75.useHMSStore)(import_react_sdk75.selectPeers);
|
|
14281
14194
|
const isRoleProminence = prominentRoles.length && peers.some(
|
|
14282
14195
|
(peer) => peer.roleName && prominentRoles.includes(peer.roleName) && (peer.videoTrack || peer.audioTrack)
|
|
14283
14196
|
) || pinnedTrack;
|
|
14284
|
-
const updatedPeers = (0,
|
|
14197
|
+
const updatedPeers = (0, import_react137.useMemo)(() => {
|
|
14285
14198
|
if (isInsetEnabled && !isRoleProminence && !peerSharing) {
|
|
14286
14199
|
return peers.filter((peer) => !peer.isLocal);
|
|
14287
14200
|
}
|
|
14288
14201
|
return peers;
|
|
14289
14202
|
}, [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,
|
|
14203
|
+
const vanillaStore = (0, import_react_sdk75.useHMSVanillaStore)();
|
|
14204
|
+
const [sortedPeers, setSortedPeers] = (0, import_react137.useState)(updatedPeers);
|
|
14205
|
+
const peersSorter = (0, import_react137.useMemo)(() => new PeersSorter_default(vanillaStore), [vanillaStore]);
|
|
14206
|
+
const [pageSize, setPageSize] = (0, import_react137.useState)(0);
|
|
14207
|
+
const [mainPage, setMainPage] = (0, import_react137.useState)(0);
|
|
14295
14208
|
const tileLayout = {
|
|
14296
14209
|
enableSpotlightingPeer: enable_spotlighting_peer,
|
|
14297
14210
|
hideParticipantNameOnTile: hide_participant_name_on_tile,
|
|
@@ -14300,7 +14213,7 @@ var init_GridLayout = __esm({
|
|
|
14300
14213
|
hideMetadataOnTile: hide_metadata_on_tile,
|
|
14301
14214
|
objectFit: video_object_fit
|
|
14302
14215
|
};
|
|
14303
|
-
(0,
|
|
14216
|
+
(0, import_react137.useEffect)(() => {
|
|
14304
14217
|
if (mainPage !== 0) {
|
|
14305
14218
|
return;
|
|
14306
14219
|
}
|
|
@@ -14311,7 +14224,7 @@ var init_GridLayout = __esm({
|
|
|
14311
14224
|
peersSorter.onUpdate(setSortedPeers);
|
|
14312
14225
|
}, [mainPage, peersSorter, updatedPeers, pageSize]);
|
|
14313
14226
|
if (peerSharing) {
|
|
14314
|
-
return /* @__PURE__ */
|
|
14227
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14315
14228
|
ScreenshareLayout,
|
|
14316
14229
|
{
|
|
14317
14230
|
peers: sortedPeers,
|
|
@@ -14321,7 +14234,7 @@ var init_GridLayout = __esm({
|
|
|
14321
14234
|
}
|
|
14322
14235
|
));
|
|
14323
14236
|
} else if (isRoleProminence) {
|
|
14324
|
-
return /* @__PURE__ */
|
|
14237
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14325
14238
|
RoleProminence,
|
|
14326
14239
|
{
|
|
14327
14240
|
peers: sortedPeers,
|
|
@@ -14333,7 +14246,7 @@ var init_GridLayout = __esm({
|
|
|
14333
14246
|
}
|
|
14334
14247
|
));
|
|
14335
14248
|
}
|
|
14336
|
-
return /* @__PURE__ */
|
|
14249
|
+
return /* @__PURE__ */ import_react137.default.createElement(VideoTileContext.Provider, { value: tileLayout }, /* @__PURE__ */ import_react137.default.createElement(
|
|
14337
14250
|
EqualProminence,
|
|
14338
14251
|
{
|
|
14339
14252
|
peers: sortedPeers,
|
|
@@ -14348,50 +14261,50 @@ var init_GridLayout = __esm({
|
|
|
14348
14261
|
});
|
|
14349
14262
|
|
|
14350
14263
|
// src/Prebuilt/layouts/EmbedView.jsx
|
|
14351
|
-
var
|
|
14264
|
+
var import_react138, import_react_sdk76, EmbedView, EmbebScreenShareView, EmbedComponent;
|
|
14352
14265
|
var init_EmbedView = __esm({
|
|
14353
14266
|
"src/Prebuilt/layouts/EmbedView.jsx"() {
|
|
14354
14267
|
"use strict";
|
|
14355
14268
|
init_define_process_env();
|
|
14356
|
-
|
|
14357
|
-
|
|
14269
|
+
import_react138 = __toESM(require("react"));
|
|
14270
|
+
import_react_sdk76 = require("@100mslive/react-sdk");
|
|
14358
14271
|
init_SecondaryTiles();
|
|
14359
14272
|
init_ProminenceLayout();
|
|
14360
14273
|
init_Layout();
|
|
14361
14274
|
init_useUISettings();
|
|
14362
14275
|
init_constants();
|
|
14363
14276
|
EmbedView = () => {
|
|
14364
|
-
return /* @__PURE__ */
|
|
14277
|
+
return /* @__PURE__ */ import_react138.default.createElement(EmbebScreenShareView, null, /* @__PURE__ */ import_react138.default.createElement(EmbedComponent, null));
|
|
14365
14278
|
};
|
|
14366
14279
|
EmbebScreenShareView = ({ children }) => {
|
|
14367
|
-
const peers = (0,
|
|
14368
|
-
const peerPresenting = (0,
|
|
14280
|
+
const peers = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeers);
|
|
14281
|
+
const peerPresenting = (0, import_react_sdk76.useHMSStore)(import_react_sdk76.selectPeerScreenSharing);
|
|
14369
14282
|
const [, setActiveScreenSharePeer] = useSetAppDataByKey(APP_DATA.activeScreensharePeerId);
|
|
14370
|
-
const smallTilePeers = (0,
|
|
14283
|
+
const smallTilePeers = (0, import_react138.useMemo)(() => {
|
|
14371
14284
|
const smallTilePeers2 = peers.filter((peer) => peer.id !== (peerPresenting == null ? void 0 : peerPresenting.id));
|
|
14372
14285
|
return smallTilePeers2;
|
|
14373
14286
|
}, [peers, peerPresenting]);
|
|
14374
|
-
(0,
|
|
14287
|
+
(0, import_react138.useEffect)(() => {
|
|
14375
14288
|
setActiveScreenSharePeer(peerPresenting == null ? void 0 : peerPresenting.id);
|
|
14376
14289
|
return () => {
|
|
14377
14290
|
setActiveScreenSharePeer("");
|
|
14378
14291
|
};
|
|
14379
14292
|
}, [peerPresenting == null ? void 0 : peerPresenting.id, setActiveScreenSharePeer]);
|
|
14380
|
-
return /* @__PURE__ */
|
|
14293
|
+
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
14294
|
};
|
|
14382
14295
|
EmbedComponent = () => {
|
|
14383
|
-
const { amIScreenSharing, toggleScreenShare } = (0,
|
|
14296
|
+
const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk76.useScreenShare)(import_react_sdk76.throwErrorHandler);
|
|
14384
14297
|
const [embedConfig, setEmbedConfig] = useSetAppDataByKey(APP_DATA.embedConfig);
|
|
14385
|
-
const [wasScreenShared, setWasScreenShared] = (0,
|
|
14386
|
-
const screenShareAttemptInProgress = (0,
|
|
14298
|
+
const [wasScreenShared, setWasScreenShared] = (0, import_react138.useState)(false);
|
|
14299
|
+
const screenShareAttemptInProgress = (0, import_react138.useRef)(false);
|
|
14387
14300
|
const src = embedConfig.url;
|
|
14388
|
-
const iframeRef = (0,
|
|
14389
|
-
const resetEmbedConfig = (0,
|
|
14301
|
+
const iframeRef = (0, import_react138.useRef)();
|
|
14302
|
+
const resetEmbedConfig = (0, import_react138.useCallback)(() => {
|
|
14390
14303
|
if (src) {
|
|
14391
14304
|
setEmbedConfig({ url: "" });
|
|
14392
14305
|
}
|
|
14393
14306
|
}, [src, setEmbedConfig]);
|
|
14394
|
-
(0,
|
|
14307
|
+
(0, import_react138.useEffect)(() => {
|
|
14395
14308
|
if (embedConfig.shareScreen && !amIScreenSharing && !wasScreenShared && !screenShareAttemptInProgress.current) {
|
|
14396
14309
|
screenShareAttemptInProgress.current = true;
|
|
14397
14310
|
toggleScreenShare({
|
|
@@ -14404,7 +14317,7 @@ var init_EmbedView = __esm({
|
|
|
14404
14317
|
});
|
|
14405
14318
|
}
|
|
14406
14319
|
}, []);
|
|
14407
|
-
(0,
|
|
14320
|
+
(0, import_react138.useEffect)(() => {
|
|
14408
14321
|
if (wasScreenShared && !amIScreenSharing) {
|
|
14409
14322
|
resetEmbedConfig();
|
|
14410
14323
|
}
|
|
@@ -14415,7 +14328,7 @@ var init_EmbedView = __esm({
|
|
|
14415
14328
|
}
|
|
14416
14329
|
};
|
|
14417
14330
|
}, [wasScreenShared, amIScreenSharing, resetEmbedConfig, toggleScreenShare]);
|
|
14418
|
-
return /* @__PURE__ */
|
|
14331
|
+
return /* @__PURE__ */ import_react138.default.createElement(Box, { ref: iframeRef, css: { size: "100%" } }, /* @__PURE__ */ import_react138.default.createElement(
|
|
14419
14332
|
"iframe",
|
|
14420
14333
|
{
|
|
14421
14334
|
src,
|
|
@@ -14430,38 +14343,38 @@ var init_EmbedView = __esm({
|
|
|
14430
14343
|
});
|
|
14431
14344
|
|
|
14432
14345
|
// src/Prebuilt/layouts/PDFView.jsx
|
|
14433
|
-
var
|
|
14346
|
+
var import_react139, import_react_sdk77, PDFView, PDFEmbedComponent;
|
|
14434
14347
|
var init_PDFView = __esm({
|
|
14435
14348
|
"src/Prebuilt/layouts/PDFView.jsx"() {
|
|
14436
14349
|
"use strict";
|
|
14437
14350
|
init_define_process_env();
|
|
14438
|
-
|
|
14439
|
-
|
|
14351
|
+
import_react139 = __toESM(require("react"));
|
|
14352
|
+
import_react_sdk77 = require("@100mslive/react-sdk");
|
|
14440
14353
|
init_Layout();
|
|
14441
14354
|
init_Theme();
|
|
14442
14355
|
init_EmbedView();
|
|
14443
14356
|
init_useUISettings();
|
|
14444
14357
|
init_constants();
|
|
14445
14358
|
PDFView = () => {
|
|
14446
|
-
return /* @__PURE__ */
|
|
14359
|
+
return /* @__PURE__ */ import_react139.default.createElement(EmbebScreenShareView, null, /* @__PURE__ */ import_react139.default.createElement(PDFEmbedComponent, null));
|
|
14447
14360
|
};
|
|
14448
14361
|
PDFEmbedComponent = () => {
|
|
14449
|
-
const ref = (0,
|
|
14362
|
+
const ref = (0, import_react139.useRef)();
|
|
14450
14363
|
const themeType = useTheme().themeType;
|
|
14451
|
-
const [isPDFLoaded, setIsPDFLoaded] = (0,
|
|
14364
|
+
const [isPDFLoaded, setIsPDFLoaded] = (0, import_react139.useState)(false);
|
|
14452
14365
|
let pdfJSURL = define_process_env_default.REACT_APP_PDFJS_IFRAME_URL;
|
|
14453
|
-
const { amIScreenSharing, toggleScreenShare } = (0,
|
|
14366
|
+
const { amIScreenSharing, toggleScreenShare } = (0, import_react_sdk77.useScreenShare)(import_react_sdk77.throwErrorHandler);
|
|
14454
14367
|
const [pdfConfig, setPDFConfig] = useSetAppDataByKey(APP_DATA.pdfConfig);
|
|
14455
14368
|
if (pdfConfig.url && !pdfConfig.file) {
|
|
14456
14369
|
pdfJSURL = pdfJSURL + "?file=" + encodeURIComponent(pdfConfig.url);
|
|
14457
14370
|
}
|
|
14458
|
-
const [wasScreenShared, setWasScreenShared] = (0,
|
|
14459
|
-
const screenShareAttemptInProgress = (0,
|
|
14460
|
-
const iframeRef = (0,
|
|
14461
|
-
const resetEmbedConfig = (0,
|
|
14371
|
+
const [wasScreenShared, setWasScreenShared] = (0, import_react139.useState)(false);
|
|
14372
|
+
const screenShareAttemptInProgress = (0, import_react139.useRef)(false);
|
|
14373
|
+
const iframeRef = (0, import_react139.useRef)();
|
|
14374
|
+
const resetEmbedConfig = (0, import_react139.useCallback)(() => {
|
|
14462
14375
|
setPDFConfig({ state: false });
|
|
14463
14376
|
}, [setPDFConfig]);
|
|
14464
|
-
(0,
|
|
14377
|
+
(0, import_react139.useEffect)(() => {
|
|
14465
14378
|
if (isPDFLoaded && ref.current) {
|
|
14466
14379
|
ref.current.contentWindow.postMessage(
|
|
14467
14380
|
{
|
|
@@ -14471,7 +14384,7 @@ var init_PDFView = __esm({
|
|
|
14471
14384
|
);
|
|
14472
14385
|
}
|
|
14473
14386
|
}, [isPDFLoaded, themeType]);
|
|
14474
|
-
(0,
|
|
14387
|
+
(0, import_react139.useEffect)(() => {
|
|
14475
14388
|
if (!amIScreenSharing && !wasScreenShared && !screenShareAttemptInProgress.current) {
|
|
14476
14389
|
screenShareAttemptInProgress.current = true;
|
|
14477
14390
|
toggleScreenShare({
|
|
@@ -14485,7 +14398,7 @@ var init_PDFView = __esm({
|
|
|
14485
14398
|
});
|
|
14486
14399
|
}
|
|
14487
14400
|
}, []);
|
|
14488
|
-
(0,
|
|
14401
|
+
(0, import_react139.useEffect)(() => {
|
|
14489
14402
|
if (wasScreenShared && !amIScreenSharing) {
|
|
14490
14403
|
resetEmbedConfig();
|
|
14491
14404
|
}
|
|
@@ -14496,7 +14409,7 @@ var init_PDFView = __esm({
|
|
|
14496
14409
|
}
|
|
14497
14410
|
};
|
|
14498
14411
|
}, [wasScreenShared, amIScreenSharing, resetEmbedConfig, toggleScreenShare]);
|
|
14499
|
-
return /* @__PURE__ */
|
|
14412
|
+
return /* @__PURE__ */ import_react139.default.createElement(Box, { ref: iframeRef, css: { size: "100%" } }, /* @__PURE__ */ import_react139.default.createElement(
|
|
14500
14413
|
"iframe",
|
|
14501
14414
|
{
|
|
14502
14415
|
src: pdfJSURL,
|
|
@@ -14539,25 +14452,25 @@ var init_empty_chat = __esm({
|
|
|
14539
14452
|
});
|
|
14540
14453
|
|
|
14541
14454
|
// src/Prebuilt/components/hooks/useSetPinnedMessage.js
|
|
14542
|
-
var
|
|
14455
|
+
var import_react140, import_react_sdk78, useSetPinnedMessage;
|
|
14543
14456
|
var init_useSetPinnedMessage = __esm({
|
|
14544
14457
|
"src/Prebuilt/components/hooks/useSetPinnedMessage.js"() {
|
|
14545
14458
|
"use strict";
|
|
14546
14459
|
init_define_process_env();
|
|
14547
|
-
|
|
14548
|
-
|
|
14460
|
+
import_react140 = require("react");
|
|
14461
|
+
import_react_sdk78 = require("@100mslive/react-sdk");
|
|
14549
14462
|
init_ToastManager();
|
|
14550
14463
|
init_constants();
|
|
14551
14464
|
useSetPinnedMessage = () => {
|
|
14552
|
-
const hmsActions = (0,
|
|
14553
|
-
const vanillaStore = (0,
|
|
14554
|
-
const pinnedMessage = (0,
|
|
14555
|
-
const setPinnedMessage = (0,
|
|
14465
|
+
const hmsActions = (0, import_react_sdk78.useHMSActions)();
|
|
14466
|
+
const vanillaStore = (0, import_react_sdk78.useHMSVanillaStore)();
|
|
14467
|
+
const pinnedMessage = (0, import_react_sdk78.useHMSStore)(import_react_sdk78.selectSessionMetadata);
|
|
14468
|
+
const setPinnedMessage = (0, import_react140.useCallback)(
|
|
14556
14469
|
/**
|
|
14557
14470
|
* @param {import("@100mslive/react-sdk").HMSMessage | undefined} message
|
|
14558
14471
|
*/
|
|
14559
14472
|
(message) => __async(void 0, null, function* () {
|
|
14560
|
-
const peerName = vanillaStore.getState((0,
|
|
14473
|
+
const peerName = vanillaStore.getState((0, import_react_sdk78.selectPeerNameByID)(message == null ? void 0 : message.sender)) || (message == null ? void 0 : message.senderName);
|
|
14561
14474
|
const newPinnedMessage = message ? peerName ? `${peerName}: ${message.message}` : message.message : null;
|
|
14562
14475
|
if (newPinnedMessage !== pinnedMessage) {
|
|
14563
14476
|
yield hmsActions.sessionStore.set(SESSION_STORE_KEY.PINNED_MESSAGE, newPinnedMessage).catch((err) => ToastManager.addToast({ title: err.description }));
|
|
@@ -14571,18 +14484,18 @@ var init_useSetPinnedMessage = __esm({
|
|
|
14571
14484
|
});
|
|
14572
14485
|
|
|
14573
14486
|
// src/Prebuilt/components/Chat/ChatBody.jsx
|
|
14574
|
-
var
|
|
14487
|
+
var import_react141, import_react_intersection_observer, import_react_use26, import_react_virtualized_auto_sizer, import_react_window2, import_react_sdk79, import_react_icons61, formatTime2, MessageTypeContainer, MessageType, URL_REGEX, Link3, AnnotisedMessage, getMessageType, ChatActions, SenderName, ChatMessage, ChatList, VirtualizedChatMessages, ChatBody;
|
|
14575
14488
|
var init_ChatBody = __esm({
|
|
14576
14489
|
"src/Prebuilt/components/Chat/ChatBody.jsx"() {
|
|
14577
14490
|
"use strict";
|
|
14578
14491
|
init_define_process_env();
|
|
14579
|
-
|
|
14492
|
+
import_react141 = __toESM(require("react"));
|
|
14580
14493
|
import_react_intersection_observer = require("react-intersection-observer");
|
|
14581
|
-
|
|
14494
|
+
import_react_use26 = require("react-use");
|
|
14582
14495
|
import_react_virtualized_auto_sizer = __toESM(require("react-virtualized-auto-sizer"));
|
|
14583
14496
|
import_react_window2 = require("react-window");
|
|
14584
|
-
|
|
14585
|
-
|
|
14497
|
+
import_react_sdk79 = require("@100mslive/react-sdk");
|
|
14498
|
+
import_react_icons61 = require("@100mslive/react-icons");
|
|
14586
14499
|
init_Dropdown2();
|
|
14587
14500
|
init_IconButton2();
|
|
14588
14501
|
init_Layout();
|
|
@@ -14608,7 +14521,7 @@ var init_ChatBody = __esm({
|
|
|
14608
14521
|
return `${hours}:${mins} ${suffix}`;
|
|
14609
14522
|
};
|
|
14610
14523
|
MessageTypeContainer = ({ left, right }) => {
|
|
14611
|
-
return /* @__PURE__ */
|
|
14524
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14612
14525
|
Flex,
|
|
14613
14526
|
{
|
|
14614
14527
|
align: "center",
|
|
@@ -14620,16 +14533,16 @@ var init_ChatBody = __esm({
|
|
|
14620
14533
|
r: "$0"
|
|
14621
14534
|
}
|
|
14622
14535
|
},
|
|
14623
|
-
left && /* @__PURE__ */
|
|
14624
|
-
left && right && /* @__PURE__ */
|
|
14625
|
-
right && /* @__PURE__ */
|
|
14536
|
+
left && /* @__PURE__ */ import_react141.default.createElement(SenderName, { variant: "tiny", as: "span", css: { color: "$on_surface_medium" } }, left),
|
|
14537
|
+
left && right && /* @__PURE__ */ import_react141.default.createElement(Box, { css: { borderLeft: "1px solid $border_bright", mx: "$4", h: "$8" } }),
|
|
14538
|
+
right && /* @__PURE__ */ import_react141.default.createElement(SenderName, { as: "span", variant: "tiny", css: { textTransform: "uppercase" } }, right)
|
|
14626
14539
|
);
|
|
14627
14540
|
};
|
|
14628
14541
|
MessageType = ({ roles, hasCurrentUserSent, receiver }) => {
|
|
14629
|
-
const peerName = (0,
|
|
14630
|
-
const localPeerRoleName = (0,
|
|
14542
|
+
const peerName = (0, import_react_sdk79.useHMSStore)((0, import_react_sdk79.selectPeerNameByID)(receiver));
|
|
14543
|
+
const localPeerRoleName = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerRoleName);
|
|
14631
14544
|
if (receiver) {
|
|
14632
|
-
return /* @__PURE__ */
|
|
14545
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14633
14546
|
MessageTypeContainer,
|
|
14634
14547
|
{
|
|
14635
14548
|
left: hasCurrentUserSent ? `${peerName ? `TO ${peerName}` : ""}` : "TO YOU",
|
|
@@ -14638,7 +14551,7 @@ var init_ChatBody = __esm({
|
|
|
14638
14551
|
);
|
|
14639
14552
|
}
|
|
14640
14553
|
if (roles && roles.length) {
|
|
14641
|
-
return /* @__PURE__ */
|
|
14554
|
+
return /* @__PURE__ */ import_react141.default.createElement(MessageTypeContainer, { left: "TO", right: hasCurrentUserSent ? roles.join(",") : localPeerRoleName });
|
|
14642
14555
|
}
|
|
14643
14556
|
return null;
|
|
14644
14557
|
};
|
|
@@ -14652,10 +14565,10 @@ var init_ChatBody = __esm({
|
|
|
14652
14565
|
});
|
|
14653
14566
|
AnnotisedMessage = ({ message }) => {
|
|
14654
14567
|
if (!message) {
|
|
14655
|
-
return /* @__PURE__ */
|
|
14568
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null);
|
|
14656
14569
|
}
|
|
14657
|
-
return /* @__PURE__ */
|
|
14658
|
-
(part) => URL_REGEX.test(part) ? /* @__PURE__ */
|
|
14570
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null, message.trim().split(/(\s)/).map(
|
|
14571
|
+
(part) => URL_REGEX.test(part) ? /* @__PURE__ */ import_react141.default.createElement(Link3, { href: part, key: part, target: "_blank", rel: "noopener noreferrer" }, part) : part
|
|
14659
14572
|
));
|
|
14660
14573
|
};
|
|
14661
14574
|
getMessageType = ({ roles, receiver }) => {
|
|
@@ -14665,18 +14578,18 @@ var init_ChatBody = __esm({
|
|
|
14665
14578
|
return receiver ? "private" : "";
|
|
14666
14579
|
};
|
|
14667
14580
|
ChatActions = ({ onPin, showPinAction }) => {
|
|
14668
|
-
const [open, setOpen] = (0,
|
|
14581
|
+
const [open, setOpen] = (0, import_react141.useState)(false);
|
|
14669
14582
|
if (!showPinAction) {
|
|
14670
14583
|
return null;
|
|
14671
14584
|
}
|
|
14672
|
-
return /* @__PURE__ */
|
|
14585
|
+
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
14586
|
Dropdown.Content,
|
|
14674
14587
|
{
|
|
14675
14588
|
sideOffset: 5,
|
|
14676
14589
|
align: "end",
|
|
14677
14590
|
css: { width: "$48", backgroundColor: "$surface_bright", py: "$0", border: "1px solid $border_bright" }
|
|
14678
14591
|
},
|
|
14679
|
-
/* @__PURE__ */
|
|
14592
|
+
/* @__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
14593
|
)));
|
|
14681
14594
|
};
|
|
14682
14595
|
SenderName = styled(Text, {
|
|
@@ -14688,32 +14601,32 @@ var init_ChatBody = __esm({
|
|
|
14688
14601
|
color: "$on_surface_high",
|
|
14689
14602
|
fontWeight: "$semiBold"
|
|
14690
14603
|
});
|
|
14691
|
-
ChatMessage =
|
|
14604
|
+
ChatMessage = import_react141.default.memo(({ index, style = {}, message, setRowHeight, onPin }) => {
|
|
14692
14605
|
var _a7, _b7;
|
|
14693
14606
|
const { ref, inView } = (0, import_react_intersection_observer.useInView)({ threshold: 0.5, triggerOnce: true });
|
|
14694
|
-
const rowRef = (0,
|
|
14695
|
-
(0,
|
|
14607
|
+
const rowRef = (0, import_react141.useRef)(null);
|
|
14608
|
+
(0, import_react141.useEffect)(() => {
|
|
14696
14609
|
if (rowRef.current) {
|
|
14697
14610
|
setRowHeight(index, rowRef.current.clientHeight);
|
|
14698
14611
|
}
|
|
14699
14612
|
}, [index, setRowHeight]);
|
|
14700
|
-
const isMobile = (0,
|
|
14613
|
+
const isMobile = (0, import_react_use26.useMedia)(config.media.md);
|
|
14701
14614
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
14702
14615
|
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,
|
|
14616
|
+
const hmsActions = (0, import_react_sdk79.useHMSActions)();
|
|
14617
|
+
const localPeerId = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectLocalPeerID);
|
|
14618
|
+
const permissions = (0, import_react_sdk79.useHMSStore)(import_react_sdk79.selectPermissions);
|
|
14706
14619
|
const messageType = getMessageType({
|
|
14707
14620
|
roles: message.recipientRoles,
|
|
14708
14621
|
receiver: message.recipientPeer
|
|
14709
14622
|
});
|
|
14710
14623
|
const showPinAction = permissions.removeOthers && !messageType && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.allow_pinning_messages);
|
|
14711
|
-
(0,
|
|
14624
|
+
(0, import_react141.useEffect)(() => {
|
|
14712
14625
|
if (message.id && !message.read && inView) {
|
|
14713
14626
|
hmsActions.setMessageRead(true, message.id);
|
|
14714
14627
|
}
|
|
14715
14628
|
}, [message.read, hmsActions, inView, message.id]);
|
|
14716
|
-
return /* @__PURE__ */
|
|
14629
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14717
14630
|
Box,
|
|
14718
14631
|
{
|
|
14719
14632
|
ref,
|
|
@@ -14721,7 +14634,7 @@ var init_ChatBody = __esm({
|
|
|
14721
14634
|
css: { mb: "$10", pr: "$10", mt: "$8", "&:hover .chat_actions": { opacity: 1 } },
|
|
14722
14635
|
style
|
|
14723
14636
|
},
|
|
14724
|
-
/* @__PURE__ */
|
|
14637
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14725
14638
|
Flex,
|
|
14726
14639
|
{
|
|
14727
14640
|
ref: rowRef,
|
|
@@ -14738,7 +14651,7 @@ var init_ChatBody = __esm({
|
|
|
14738
14651
|
key: message.time,
|
|
14739
14652
|
"data-testid": "chat_msg"
|
|
14740
14653
|
},
|
|
14741
|
-
/* @__PURE__ */
|
|
14654
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14742
14655
|
Text,
|
|
14743
14656
|
{
|
|
14744
14657
|
css: {
|
|
@@ -14751,7 +14664,7 @@ var init_ChatBody = __esm({
|
|
|
14751
14664
|
},
|
|
14752
14665
|
as: "div"
|
|
14753
14666
|
},
|
|
14754
|
-
/* @__PURE__ */
|
|
14667
|
+
/* @__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
14668
|
Text,
|
|
14756
14669
|
{
|
|
14757
14670
|
as: "span",
|
|
@@ -14764,7 +14677,7 @@ var init_ChatBody = __esm({
|
|
|
14764
14677
|
},
|
|
14765
14678
|
formatTime2(message.time)
|
|
14766
14679
|
) : null),
|
|
14767
|
-
/* @__PURE__ */
|
|
14680
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14768
14681
|
MessageType,
|
|
14769
14682
|
{
|
|
14770
14683
|
hasCurrentUserSent: message.sender === localPeerId,
|
|
@@ -14772,9 +14685,9 @@ var init_ChatBody = __esm({
|
|
|
14772
14685
|
roles: message.recipientRoles
|
|
14773
14686
|
}
|
|
14774
14687
|
),
|
|
14775
|
-
!isOverlay ? /* @__PURE__ */
|
|
14688
|
+
!isOverlay ? /* @__PURE__ */ import_react141.default.createElement(ChatActions, { onPin, showPinAction }) : null
|
|
14776
14689
|
),
|
|
14777
|
-
/* @__PURE__ */
|
|
14690
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14778
14691
|
Text,
|
|
14779
14692
|
{
|
|
14780
14693
|
variant: "sm",
|
|
@@ -14788,20 +14701,20 @@ var init_ChatBody = __esm({
|
|
|
14788
14701
|
},
|
|
14789
14702
|
onClick: (e) => e.stopPropagation()
|
|
14790
14703
|
},
|
|
14791
|
-
/* @__PURE__ */
|
|
14704
|
+
/* @__PURE__ */ import_react141.default.createElement(AnnotisedMessage, { message: message.message })
|
|
14792
14705
|
)
|
|
14793
14706
|
)
|
|
14794
14707
|
);
|
|
14795
14708
|
});
|
|
14796
|
-
ChatList =
|
|
14709
|
+
ChatList = import_react141.default.forwardRef(
|
|
14797
14710
|
({ width, height, setRowHeight, getRowHeight, messages, scrollToBottom }, listRef) => {
|
|
14798
14711
|
const { setPinnedMessage } = useSetPinnedMessage();
|
|
14799
|
-
(0,
|
|
14712
|
+
(0, import_react141.useLayoutEffect)(() => {
|
|
14800
14713
|
if (listRef.current && listRef.current.scrollToItem) {
|
|
14801
14714
|
scrollToBottom(1);
|
|
14802
14715
|
}
|
|
14803
14716
|
}, [listRef]);
|
|
14804
|
-
return /* @__PURE__ */
|
|
14717
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14805
14718
|
import_react_window2.VariableSizeList,
|
|
14806
14719
|
{
|
|
14807
14720
|
ref: listRef,
|
|
@@ -14813,7 +14726,7 @@ var init_ChatBody = __esm({
|
|
|
14813
14726
|
overflowX: "hidden"
|
|
14814
14727
|
}
|
|
14815
14728
|
},
|
|
14816
|
-
({ index, style }) => /* @__PURE__ */
|
|
14729
|
+
({ index, style }) => /* @__PURE__ */ import_react141.default.createElement(
|
|
14817
14730
|
ChatMessage,
|
|
14818
14731
|
{
|
|
14819
14732
|
style,
|
|
@@ -14827,19 +14740,19 @@ var init_ChatBody = __esm({
|
|
|
14827
14740
|
);
|
|
14828
14741
|
}
|
|
14829
14742
|
);
|
|
14830
|
-
VirtualizedChatMessages =
|
|
14831
|
-
const rowHeights = (0,
|
|
14743
|
+
VirtualizedChatMessages = import_react141.default.forwardRef(({ messages, scrollToBottom }, listRef) => {
|
|
14744
|
+
const rowHeights = (0, import_react141.useRef)({});
|
|
14832
14745
|
function getRowHeight(index) {
|
|
14833
14746
|
return rowHeights.current[index] + 16 || 72;
|
|
14834
14747
|
}
|
|
14835
|
-
const setRowHeight = (0,
|
|
14748
|
+
const setRowHeight = (0, import_react141.useCallback)(
|
|
14836
14749
|
(index, size) => {
|
|
14837
14750
|
listRef.current.resetAfterIndex(0);
|
|
14838
14751
|
rowHeights.current = __spreadProps(__spreadValues({}, rowHeights.current), { [index]: size });
|
|
14839
14752
|
},
|
|
14840
14753
|
[listRef]
|
|
14841
14754
|
);
|
|
14842
|
-
return /* @__PURE__ */
|
|
14755
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14843
14756
|
Box,
|
|
14844
14757
|
{
|
|
14845
14758
|
css: {
|
|
@@ -14848,14 +14761,14 @@ var init_ChatBody = __esm({
|
|
|
14848
14761
|
},
|
|
14849
14762
|
as: "div"
|
|
14850
14763
|
},
|
|
14851
|
-
/* @__PURE__ */
|
|
14764
|
+
/* @__PURE__ */ import_react141.default.createElement(
|
|
14852
14765
|
import_react_virtualized_auto_sizer.default,
|
|
14853
14766
|
{
|
|
14854
14767
|
style: {
|
|
14855
14768
|
width: "90%"
|
|
14856
14769
|
}
|
|
14857
14770
|
},
|
|
14858
|
-
({ height, width }) => /* @__PURE__ */
|
|
14771
|
+
({ height, width }) => /* @__PURE__ */ import_react141.default.createElement(
|
|
14859
14772
|
ChatList,
|
|
14860
14773
|
{
|
|
14861
14774
|
width,
|
|
@@ -14870,15 +14783,15 @@ var init_ChatBody = __esm({
|
|
|
14870
14783
|
)
|
|
14871
14784
|
);
|
|
14872
14785
|
});
|
|
14873
|
-
ChatBody =
|
|
14786
|
+
ChatBody = import_react141.default.forwardRef(({ role, peerId, scrollToBottom }, listRef) => {
|
|
14874
14787
|
var _a7;
|
|
14875
|
-
const storeMessageSelector = role ? (0,
|
|
14876
|
-
let messages = (0,
|
|
14877
|
-
messages = (0,
|
|
14878
|
-
const isMobile = (0,
|
|
14788
|
+
const storeMessageSelector = role ? (0, import_react_sdk79.selectMessagesByRole)(role) : peerId ? (0, import_react_sdk79.selectMessagesByPeerID)(peerId) : import_react_sdk79.selectHMSMessages;
|
|
14789
|
+
let messages = (0, import_react_sdk79.useHMSStore)(storeMessageSelector);
|
|
14790
|
+
messages = (0, import_react141.useMemo)(() => (messages == null ? void 0 : messages.filter((message) => message.type === "chat")) || [], [messages]);
|
|
14791
|
+
const isMobile = (0, import_react_use26.useMedia)(config.media.md);
|
|
14879
14792
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
14880
14793
|
if (messages.length === 0 && !(isMobile && ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay))) {
|
|
14881
|
-
return /* @__PURE__ */
|
|
14794
|
+
return /* @__PURE__ */ import_react141.default.createElement(
|
|
14882
14795
|
Flex,
|
|
14883
14796
|
{
|
|
14884
14797
|
css: {
|
|
@@ -14890,7 +14803,7 @@ var init_ChatBody = __esm({
|
|
|
14890
14803
|
align: "center",
|
|
14891
14804
|
justify: "center"
|
|
14892
14805
|
},
|
|
14893
|
-
/* @__PURE__ */
|
|
14806
|
+
/* @__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
14807
|
Text,
|
|
14895
14808
|
{
|
|
14896
14809
|
variant: "sm",
|
|
@@ -14900,27 +14813,27 @@ var init_ChatBody = __esm({
|
|
|
14900
14813
|
))
|
|
14901
14814
|
);
|
|
14902
14815
|
}
|
|
14903
|
-
return /* @__PURE__ */
|
|
14816
|
+
return /* @__PURE__ */ import_react141.default.createElement(import_react141.Fragment, null, /* @__PURE__ */ import_react141.default.createElement(VirtualizedChatMessages, { messages, scrollToBottom, ref: listRef }));
|
|
14904
14817
|
});
|
|
14905
14818
|
}
|
|
14906
14819
|
});
|
|
14907
14820
|
|
|
14908
14821
|
// src/Prebuilt/components/AppData/useChatState.js
|
|
14909
|
-
var
|
|
14822
|
+
var import_react142, import_react_sdk80, useChatDraftMessage;
|
|
14910
14823
|
var init_useChatState = __esm({
|
|
14911
14824
|
"src/Prebuilt/components/AppData/useChatState.js"() {
|
|
14912
14825
|
"use strict";
|
|
14913
14826
|
init_define_process_env();
|
|
14914
|
-
|
|
14915
|
-
|
|
14827
|
+
import_react142 = require("react");
|
|
14828
|
+
import_react_sdk80 = require("@100mslive/react-sdk");
|
|
14916
14829
|
init_constants();
|
|
14917
14830
|
useChatDraftMessage = () => {
|
|
14918
|
-
const hmsActions = (0,
|
|
14919
|
-
let chatDraftMessage = (0,
|
|
14831
|
+
const hmsActions = (0, import_react_sdk80.useHMSActions)();
|
|
14832
|
+
let chatDraftMessage = (0, import_react_sdk80.useHMSStore)((0, import_react_sdk80.selectAppData)(APP_DATA.chatDraft));
|
|
14920
14833
|
if (chatDraftMessage === void 0 || chatDraftMessage === null) {
|
|
14921
14834
|
chatDraftMessage = "";
|
|
14922
14835
|
}
|
|
14923
|
-
const setDraftMessage = (0,
|
|
14836
|
+
const setDraftMessage = (0, import_react142.useCallback)(
|
|
14924
14837
|
(message) => {
|
|
14925
14838
|
hmsActions.setAppData(APP_DATA.chatDraft, message, true);
|
|
14926
14839
|
},
|
|
@@ -14932,15 +14845,15 @@ var init_useChatState = __esm({
|
|
|
14932
14845
|
});
|
|
14933
14846
|
|
|
14934
14847
|
// src/Prebuilt/components/Chat/useEmojiPickerStyles.js
|
|
14935
|
-
var
|
|
14848
|
+
var import_react143, useEmojiPickerStyles;
|
|
14936
14849
|
var init_useEmojiPickerStyles = __esm({
|
|
14937
14850
|
"src/Prebuilt/components/Chat/useEmojiPickerStyles.js"() {
|
|
14938
14851
|
"use strict";
|
|
14939
14852
|
init_define_process_env();
|
|
14940
|
-
|
|
14853
|
+
import_react143 = require("react");
|
|
14941
14854
|
useEmojiPickerStyles = (showing) => {
|
|
14942
|
-
const ref = (0,
|
|
14943
|
-
(0,
|
|
14855
|
+
const ref = (0, import_react143.useRef)(null);
|
|
14856
|
+
(0, import_react143.useEffect)(() => {
|
|
14944
14857
|
if (showing) {
|
|
14945
14858
|
setTimeout(() => {
|
|
14946
14859
|
var _a7, _b7;
|
|
@@ -14957,6 +14870,7 @@ var init_useEmojiPickerStyles = __esm({
|
|
|
14957
14870
|
font-family: var(--hms-ui-fonts-sans);
|
|
14958
14871
|
}
|
|
14959
14872
|
.sticky {
|
|
14873
|
+
top: 0.25rem;
|
|
14960
14874
|
background-color: var(--hms-ui-colors-surface_bright);
|
|
14961
14875
|
margin-top: 0.5rem;
|
|
14962
14876
|
}
|
|
@@ -14972,9 +14886,9 @@ var init_useEmojiPickerStyles = __esm({
|
|
|
14972
14886
|
|
|
14973
14887
|
// src/Prebuilt/components/Chat/ChatFooter.tsx
|
|
14974
14888
|
function EmojiPicker({ onSelect }) {
|
|
14975
|
-
const [showEmoji, setShowEmoji] = (0,
|
|
14889
|
+
const [showEmoji, setShowEmoji] = (0, import_react144.useState)(false);
|
|
14976
14890
|
const ref = useEmojiPickerStyles(showEmoji);
|
|
14977
|
-
return /* @__PURE__ */
|
|
14891
|
+
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
14892
|
Popover2.Content,
|
|
14979
14893
|
{
|
|
14980
14894
|
alignOffset: -40,
|
|
@@ -14984,7 +14898,7 @@ function EmojiPicker({ onSelect }) {
|
|
|
14984
14898
|
p: 0
|
|
14985
14899
|
}
|
|
14986
14900
|
},
|
|
14987
|
-
/* @__PURE__ */
|
|
14901
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
14988
14902
|
Box,
|
|
14989
14903
|
{
|
|
14990
14904
|
css: {
|
|
@@ -14993,21 +14907,21 @@ function EmojiPicker({ onSelect }) {
|
|
|
14993
14907
|
},
|
|
14994
14908
|
ref
|
|
14995
14909
|
},
|
|
14996
|
-
/* @__PURE__ */
|
|
14910
|
+
/* @__PURE__ */ import_react144.default.createElement(import_react145.default, { onEmojiSelect: onSelect, data: import_data.default, previewPosition: "none", skinPosition: "search" })
|
|
14997
14911
|
)
|
|
14998
14912
|
)));
|
|
14999
14913
|
}
|
|
15000
|
-
var
|
|
14914
|
+
var import_react144, import_react_use27, import_data, import_react145, import_react_sdk81, import_react_icons62, TextArea, ChatFooter;
|
|
15001
14915
|
var init_ChatFooter = __esm({
|
|
15002
14916
|
"src/Prebuilt/components/Chat/ChatFooter.tsx"() {
|
|
15003
14917
|
"use strict";
|
|
15004
14918
|
init_define_process_env();
|
|
15005
|
-
|
|
15006
|
-
|
|
14919
|
+
import_react144 = __toESM(require("react"));
|
|
14920
|
+
import_react_use27 = require("react-use");
|
|
15007
14921
|
import_data = __toESM(require("@emoji-mart/data"));
|
|
15008
|
-
|
|
15009
|
-
|
|
15010
|
-
|
|
14922
|
+
import_react145 = __toESM(require("@emoji-mart/react"));
|
|
14923
|
+
import_react_sdk81 = require("@100mslive/react-sdk");
|
|
14924
|
+
import_react_icons62 = require("@100mslive/react-icons");
|
|
15011
14925
|
init_src();
|
|
15012
14926
|
init_ToastManager();
|
|
15013
14927
|
init_useRoomLayoutScreen();
|
|
@@ -15037,13 +14951,13 @@ var init_ChatFooter = __esm({
|
|
|
15037
14951
|
children
|
|
15038
14952
|
}) => {
|
|
15039
14953
|
var _a7;
|
|
15040
|
-
const hmsActions = (0,
|
|
15041
|
-
const inputRef = (0,
|
|
14954
|
+
const hmsActions = (0, import_react_sdk81.useHMSActions)();
|
|
14955
|
+
const inputRef = (0, import_react144.useRef)(null);
|
|
15042
14956
|
const [draftMessage, setDraftMessage] = useChatDraftMessage();
|
|
15043
|
-
const isMobile = (0,
|
|
14957
|
+
const isMobile = (0, import_react_use27.useMedia)(config.media.md);
|
|
15044
14958
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15045
14959
|
const isOverlayChat = (_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay;
|
|
15046
|
-
const sendMessage = (0,
|
|
14960
|
+
const sendMessage = (0, import_react144.useCallback)(() => __async(void 0, null, function* () {
|
|
15047
14961
|
var _a8;
|
|
15048
14962
|
const message = (_a8 = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a8.value;
|
|
15049
14963
|
if (!message || !message.trim().length) {
|
|
@@ -15066,19 +14980,19 @@ var init_ChatFooter = __esm({
|
|
|
15066
14980
|
ToastManager.addToast({ title: err.message });
|
|
15067
14981
|
}
|
|
15068
14982
|
}), [role, peerId, hmsActions, onSend]);
|
|
15069
|
-
(0,
|
|
14983
|
+
(0, import_react144.useEffect)(() => {
|
|
15070
14984
|
const messageElement = inputRef.current;
|
|
15071
14985
|
if (messageElement) {
|
|
15072
14986
|
messageElement.value = draftMessage;
|
|
15073
14987
|
}
|
|
15074
14988
|
}, [draftMessage]);
|
|
15075
|
-
(0,
|
|
14989
|
+
(0, import_react144.useEffect)(() => {
|
|
15076
14990
|
const messageElement = inputRef.current;
|
|
15077
14991
|
return () => {
|
|
15078
14992
|
setDraftMessage((messageElement == null ? void 0 : messageElement.value) || "");
|
|
15079
14993
|
};
|
|
15080
14994
|
}, [setDraftMessage]);
|
|
15081
|
-
return /* @__PURE__ */
|
|
14995
|
+
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
14996
|
Flex,
|
|
15083
14997
|
{
|
|
15084
14998
|
align: "center",
|
|
@@ -15099,7 +15013,7 @@ var init_ChatFooter = __esm({
|
|
|
15099
15013
|
}
|
|
15100
15014
|
},
|
|
15101
15015
|
children,
|
|
15102
|
-
/* @__PURE__ */
|
|
15016
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
15103
15017
|
TextArea,
|
|
15104
15018
|
{
|
|
15105
15019
|
css: {
|
|
@@ -15126,7 +15040,7 @@ var init_ChatFooter = __esm({
|
|
|
15126
15040
|
onCopy: (e) => e.stopPropagation()
|
|
15127
15041
|
}
|
|
15128
15042
|
),
|
|
15129
|
-
!isMobile ? /* @__PURE__ */
|
|
15043
|
+
!isMobile ? /* @__PURE__ */ import_react144.default.createElement(
|
|
15130
15044
|
EmojiPicker,
|
|
15131
15045
|
{
|
|
15132
15046
|
onSelect: (emoji) => {
|
|
@@ -15136,7 +15050,7 @@ var init_ChatFooter = __esm({
|
|
|
15136
15050
|
}
|
|
15137
15051
|
}
|
|
15138
15052
|
) : null,
|
|
15139
|
-
/* @__PURE__ */
|
|
15053
|
+
/* @__PURE__ */ import_react144.default.createElement(
|
|
15140
15054
|
IconButton,
|
|
15141
15055
|
{
|
|
15142
15056
|
className: "send-msg",
|
|
@@ -15149,7 +15063,7 @@ var init_ChatFooter = __esm({
|
|
|
15149
15063
|
},
|
|
15150
15064
|
"data-testid": "send_msg_btn"
|
|
15151
15065
|
},
|
|
15152
|
-
/* @__PURE__ */
|
|
15066
|
+
/* @__PURE__ */ import_react144.default.createElement(import_react_icons62.SendIcon, null)
|
|
15153
15067
|
)
|
|
15154
15068
|
)));
|
|
15155
15069
|
};
|
|
@@ -15157,37 +15071,36 @@ var init_ChatFooter = __esm({
|
|
|
15157
15071
|
});
|
|
15158
15072
|
|
|
15159
15073
|
// src/Prebuilt/components/Chat/useUnreadCount.js
|
|
15160
|
-
var
|
|
15074
|
+
var import_react_sdk82, useUnreadCount;
|
|
15161
15075
|
var init_useUnreadCount = __esm({
|
|
15162
15076
|
"src/Prebuilt/components/Chat/useUnreadCount.js"() {
|
|
15163
15077
|
"use strict";
|
|
15164
15078
|
init_define_process_env();
|
|
15165
|
-
|
|
15079
|
+
import_react_sdk82 = require("@100mslive/react-sdk");
|
|
15166
15080
|
useUnreadCount = ({ role, peerId }) => {
|
|
15167
|
-
const unreadCountSelector = role ? (0,
|
|
15168
|
-
const unreadCount = (0,
|
|
15081
|
+
const unreadCountSelector = role ? (0, import_react_sdk82.selectMessagesUnreadCountByRole)(role) : peerId ? (0, import_react_sdk82.selectMessagesUnreadCountByPeerID)(peerId) : import_react_sdk82.selectUnreadHMSMessagesCount;
|
|
15082
|
+
const unreadCount = (0, import_react_sdk82.useHMSStore)(unreadCountSelector);
|
|
15169
15083
|
return unreadCount;
|
|
15170
15084
|
};
|
|
15171
15085
|
}
|
|
15172
15086
|
});
|
|
15173
15087
|
|
|
15174
15088
|
// src/Prebuilt/components/Chat/Chat.jsx
|
|
15175
|
-
var
|
|
15089
|
+
var import_react146, import_react_use28, import_react_sdk83, import_react_icons63, PINNED_MESSAGE_LENGTH, PinnedMessage, Chat, NewMessageIndicator;
|
|
15176
15090
|
var init_Chat = __esm({
|
|
15177
15091
|
"src/Prebuilt/components/Chat/Chat.jsx"() {
|
|
15178
15092
|
"use strict";
|
|
15179
15093
|
init_define_process_env();
|
|
15180
|
-
|
|
15181
|
-
|
|
15182
|
-
|
|
15183
|
-
|
|
15094
|
+
import_react146 = __toESM(require("react"));
|
|
15095
|
+
import_react_use28 = require("react-use");
|
|
15096
|
+
import_react_sdk83 = require("@100mslive/react-sdk");
|
|
15097
|
+
import_react_icons63 = require("@100mslive/react-icons");
|
|
15184
15098
|
init_Button2();
|
|
15185
15099
|
init_Layout();
|
|
15186
15100
|
init_Text2();
|
|
15187
15101
|
init_Theme();
|
|
15188
15102
|
init_ChatBody();
|
|
15189
15103
|
init_ChatFooter();
|
|
15190
|
-
init_ChatParticipantHeader();
|
|
15191
15104
|
init_useRoomLayoutScreen();
|
|
15192
15105
|
init_useUISettings();
|
|
15193
15106
|
init_useSetPinnedMessage();
|
|
@@ -15195,10 +15108,10 @@ var init_Chat = __esm({
|
|
|
15195
15108
|
init_constants();
|
|
15196
15109
|
PINNED_MESSAGE_LENGTH = 80;
|
|
15197
15110
|
PinnedMessage = ({ clearPinnedMessage }) => {
|
|
15198
|
-
const permissions = (0,
|
|
15199
|
-
const pinnedMessage = (0,
|
|
15111
|
+
const permissions = (0, import_react_sdk83.useHMSStore)(import_react_sdk83.selectPermissions);
|
|
15112
|
+
const pinnedMessage = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectSessionStore)(SESSION_STORE_KEY.PINNED_MESSAGE));
|
|
15200
15113
|
const formattedPinnedMessage = (pinnedMessage == null ? void 0 : pinnedMessage.length) && pinnedMessage.length > PINNED_MESSAGE_LENGTH ? `${pinnedMessage.slice(0, PINNED_MESSAGE_LENGTH)}...` : pinnedMessage;
|
|
15201
|
-
return pinnedMessage ? /* @__PURE__ */
|
|
15114
|
+
return pinnedMessage ? /* @__PURE__ */ import_react146.default.createElement(
|
|
15202
15115
|
Flex,
|
|
15203
15116
|
{
|
|
15204
15117
|
title: pinnedMessage,
|
|
@@ -15206,8 +15119,8 @@ var init_Chat = __esm({
|
|
|
15206
15119
|
align: "center",
|
|
15207
15120
|
justify: "between"
|
|
15208
15121
|
},
|
|
15209
|
-
/* @__PURE__ */
|
|
15210
|
-
/* @__PURE__ */
|
|
15122
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.PinIcon, null),
|
|
15123
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15211
15124
|
Box,
|
|
15212
15125
|
{
|
|
15213
15126
|
css: {
|
|
@@ -15217,34 +15130,34 @@ var init_Chat = __esm({
|
|
|
15217
15130
|
overflowY: "auto"
|
|
15218
15131
|
}
|
|
15219
15132
|
},
|
|
15220
|
-
/* @__PURE__ */
|
|
15133
|
+
/* @__PURE__ */ import_react146.default.createElement(Text, { variant: "sm" }, /* @__PURE__ */ import_react146.default.createElement(AnnotisedMessage, { message: formattedPinnedMessage }))
|
|
15221
15134
|
),
|
|
15222
|
-
permissions.removeOthers && /* @__PURE__ */
|
|
15135
|
+
permissions.removeOthers && /* @__PURE__ */ import_react146.default.createElement(
|
|
15223
15136
|
Flex,
|
|
15224
15137
|
{
|
|
15225
15138
|
onClick: () => clearPinnedMessage(),
|
|
15226
15139
|
css: { cursor: "pointer", color: "$on_surface_medium", "&:hover": { color: "$on_surface_high" } }
|
|
15227
15140
|
},
|
|
15228
|
-
/* @__PURE__ */
|
|
15141
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.CrossIcon, null)
|
|
15229
15142
|
)
|
|
15230
15143
|
) : null;
|
|
15231
15144
|
};
|
|
15232
|
-
Chat = ({ screenType
|
|
15233
|
-
var _a7, _b7
|
|
15234
|
-
const notification = (0,
|
|
15145
|
+
Chat = ({ screenType }) => {
|
|
15146
|
+
var _a7, _b7;
|
|
15147
|
+
const notification = (0, import_react_sdk83.useHMSNotifications)(import_react_sdk83.HMSNotificationTypes.PEER_LEFT);
|
|
15235
15148
|
const [peerSelector, setPeerSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.PEER_ID);
|
|
15236
15149
|
const [roleSelector, setRoleSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.ROLE);
|
|
15237
|
-
const peerName = (0,
|
|
15238
|
-
const [chatOptions, setChatOptions] = (0,
|
|
15150
|
+
const peerName = (0, import_react_sdk83.useHMSStore)((0, import_react_sdk83.selectPeerNameByID)(peerSelector));
|
|
15151
|
+
const [chatOptions, setChatOptions] = (0, import_react146.useState)({
|
|
15239
15152
|
role: roleSelector || "",
|
|
15240
15153
|
peerId: peerSelector && peerName ? peerSelector : "",
|
|
15241
15154
|
selection: roleSelector ? roleSelector : peerSelector && peerName ? peerName : "Everyone"
|
|
15242
15155
|
});
|
|
15243
|
-
const [isSelectorOpen
|
|
15244
|
-
const listRef = (0,
|
|
15245
|
-
const hmsActions = (0,
|
|
15156
|
+
const [isSelectorOpen] = (0, import_react146.useState)(false);
|
|
15157
|
+
const listRef = (0, import_react146.useRef)(null);
|
|
15158
|
+
const hmsActions = (0, import_react_sdk83.useHMSActions)();
|
|
15246
15159
|
const { setPinnedMessage } = useSetPinnedMessage();
|
|
15247
|
-
(0,
|
|
15160
|
+
(0, import_react146.useEffect)(() => {
|
|
15248
15161
|
if (notification && notification.data && peerSelector === notification.data.id) {
|
|
15249
15162
|
setPeerSelector("");
|
|
15250
15163
|
setChatOptions({
|
|
@@ -15254,16 +15167,16 @@ var init_Chat = __esm({
|
|
|
15254
15167
|
});
|
|
15255
15168
|
}
|
|
15256
15169
|
}, [notification, peerSelector, setPeerSelector]);
|
|
15257
|
-
const storeMessageSelector =
|
|
15170
|
+
const storeMessageSelector = import_react_sdk83.selectHMSMessagesCount;
|
|
15258
15171
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15259
|
-
const isMobile = (0,
|
|
15172
|
+
const isMobile = (0, import_react_use28.useMedia)(config.media.md);
|
|
15260
15173
|
let isScrolledToBottom = false;
|
|
15261
15174
|
if (listRef.current) {
|
|
15262
15175
|
const currentRef = listRef.current._outerRef;
|
|
15263
15176
|
isScrolledToBottom = currentRef.scrollHeight - currentRef.clientHeight - currentRef.scrollTop < 10;
|
|
15264
15177
|
}
|
|
15265
|
-
const messagesCount = (0,
|
|
15266
|
-
const scrollToBottom = (0,
|
|
15178
|
+
const messagesCount = (0, import_react_sdk83.useHMSStore)(storeMessageSelector) || 0;
|
|
15179
|
+
const scrollToBottom = (0, import_react146.useCallback)(
|
|
15267
15180
|
(unreadCount = 0) => {
|
|
15268
15181
|
var _a8;
|
|
15269
15182
|
if (listRef.current && listRef.current.scrollToItem && unreadCount > 0) {
|
|
@@ -15277,19 +15190,17 @@ var init_Chat = __esm({
|
|
|
15277
15190
|
},
|
|
15278
15191
|
[hmsActions, messagesCount]
|
|
15279
15192
|
);
|
|
15280
|
-
return /* @__PURE__ */
|
|
15193
|
+
return /* @__PURE__ */ import_react146.default.createElement(
|
|
15281
15194
|
Flex,
|
|
15282
15195
|
{
|
|
15283
15196
|
direction: "column",
|
|
15284
15197
|
css: {
|
|
15285
15198
|
size: "100%",
|
|
15286
|
-
gap: "$4"
|
|
15287
|
-
marginTop: hideControls && ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) ? "$17" : "0",
|
|
15288
|
-
transition: "margin 0.3s ease-in-out"
|
|
15199
|
+
gap: "$4"
|
|
15289
15200
|
}
|
|
15290
15201
|
},
|
|
15291
|
-
isMobile && ((
|
|
15292
|
-
/* @__PURE__ */
|
|
15202
|
+
isMobile && ((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) ? null : /* @__PURE__ */ import_react146.default.createElement(import_react146.default.Fragment, null, ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.allow_pinning_messages) ? /* @__PURE__ */ import_react146.default.createElement(PinnedMessage, { clearPinnedMessage: setPinnedMessage }) : null),
|
|
15203
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15293
15204
|
ChatBody,
|
|
15294
15205
|
{
|
|
15295
15206
|
role: chatOptions.role,
|
|
@@ -15299,7 +15210,7 @@ var init_Chat = __esm({
|
|
|
15299
15210
|
screenType
|
|
15300
15211
|
}
|
|
15301
15212
|
),
|
|
15302
|
-
/* @__PURE__ */
|
|
15213
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15303
15214
|
ChatFooter,
|
|
15304
15215
|
{
|
|
15305
15216
|
role: chatOptions.role,
|
|
@@ -15317,7 +15228,7 @@ var init_Chat = __esm({
|
|
|
15317
15228
|
},
|
|
15318
15229
|
peerId: chatOptions.peerId
|
|
15319
15230
|
},
|
|
15320
|
-
!isSelectorOpen && !isScrolledToBottom && /* @__PURE__ */
|
|
15231
|
+
!isSelectorOpen && !isScrolledToBottom && /* @__PURE__ */ import_react146.default.createElement(NewMessageIndicator, { role: chatOptions.role, peerId: chatOptions.peerId, scrollToBottom })
|
|
15321
15232
|
)
|
|
15322
15233
|
);
|
|
15323
15234
|
};
|
|
@@ -15326,7 +15237,7 @@ var init_Chat = __esm({
|
|
|
15326
15237
|
if (!unreadCount) {
|
|
15327
15238
|
return null;
|
|
15328
15239
|
}
|
|
15329
|
-
return /* @__PURE__ */
|
|
15240
|
+
return /* @__PURE__ */ import_react146.default.createElement(
|
|
15330
15241
|
Flex,
|
|
15331
15242
|
{
|
|
15332
15243
|
justify: "center",
|
|
@@ -15337,7 +15248,7 @@ var init_Chat = __esm({
|
|
|
15337
15248
|
position: "absolute"
|
|
15338
15249
|
}
|
|
15339
15250
|
},
|
|
15340
|
-
/* @__PURE__ */
|
|
15251
|
+
/* @__PURE__ */ import_react146.default.createElement(
|
|
15341
15252
|
Button,
|
|
15342
15253
|
{
|
|
15343
15254
|
variant: "standard",
|
|
@@ -15360,13 +15271,131 @@ var init_Chat = __esm({
|
|
|
15360
15271
|
},
|
|
15361
15272
|
"New ",
|
|
15362
15273
|
unreadCount === 1 ? "message" : "messages",
|
|
15363
|
-
/* @__PURE__ */
|
|
15274
|
+
/* @__PURE__ */ import_react146.default.createElement(import_react_icons63.ChevronDownIcon, null)
|
|
15364
15275
|
)
|
|
15365
15276
|
);
|
|
15366
15277
|
};
|
|
15367
15278
|
}
|
|
15368
15279
|
});
|
|
15369
15280
|
|
|
15281
|
+
// src/Prebuilt/components/SidePaneTabs.tsx
|
|
15282
|
+
var import_react147, import_react_use29, import_react_sdk84, import_react_icons64, tabTriggerCSS, SidePaneTabs;
|
|
15283
|
+
var init_SidePaneTabs = __esm({
|
|
15284
|
+
"src/Prebuilt/components/SidePaneTabs.tsx"() {
|
|
15285
|
+
"use strict";
|
|
15286
|
+
init_define_process_env();
|
|
15287
|
+
import_react147 = __toESM(require("react"));
|
|
15288
|
+
import_react_use29 = require("react-use");
|
|
15289
|
+
import_react_sdk84 = require("@100mslive/react-sdk");
|
|
15290
|
+
import_react_icons64 = require("@100mslive/react-icons");
|
|
15291
|
+
init_Chat();
|
|
15292
|
+
init_ParticipantList();
|
|
15293
|
+
init_src();
|
|
15294
|
+
init_useRoomLayoutScreen();
|
|
15295
|
+
init_useSidepane();
|
|
15296
|
+
init_constants();
|
|
15297
|
+
tabTriggerCSS = {
|
|
15298
|
+
color: "$on_surface_high",
|
|
15299
|
+
p: "$4",
|
|
15300
|
+
fontWeight: "$semiBold",
|
|
15301
|
+
fontSize: "$sm",
|
|
15302
|
+
w: "100%",
|
|
15303
|
+
justifyContent: "center"
|
|
15304
|
+
};
|
|
15305
|
+
SidePaneTabs = import_react147.default.memo(({ active = SIDE_PANE_OPTIONS.CHAT, screenType, hideControls }) => {
|
|
15306
|
+
var _a7;
|
|
15307
|
+
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
15308
|
+
const toggleParticipants = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
15309
|
+
const resetSidePane = useSidepaneReset();
|
|
15310
|
+
const [activeTab, setActiveTab] = (0, import_react147.useState)(active);
|
|
15311
|
+
const peerCount = (0, import_react_sdk84.useHMSStore)(import_react_sdk84.selectPeerCount);
|
|
15312
|
+
const { elements } = useRoomLayoutConferencingScreen();
|
|
15313
|
+
const showChat = !!(elements == null ? void 0 : elements.chat);
|
|
15314
|
+
const showParticipants = !!(elements == null ? void 0 : elements.participant_list);
|
|
15315
|
+
const hideTabs = !(showChat && showParticipants);
|
|
15316
|
+
const isMobile = (0, import_react_use29.useMedia)(config.media.md);
|
|
15317
|
+
const isOverlayChat = !!((_a7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a7.is_overlay) && isMobile;
|
|
15318
|
+
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
15319
|
+
(0, import_react147.useEffect)(() => {
|
|
15320
|
+
if (activeTab === SIDE_PANE_OPTIONS.CHAT && !showChat && showParticipants) {
|
|
15321
|
+
setActiveTab(SIDE_PANE_OPTIONS.PARTICIPANTS);
|
|
15322
|
+
} else if (activeTab === SIDE_PANE_OPTIONS.PARTICIPANTS && showChat && !showParticipants) {
|
|
15323
|
+
setActiveTab(SIDE_PANE_OPTIONS.CHAT);
|
|
15324
|
+
} else if (!showChat && !showParticipants) {
|
|
15325
|
+
resetSidePane();
|
|
15326
|
+
}
|
|
15327
|
+
}, [showChat, activeTab, showParticipants, resetSidePane]);
|
|
15328
|
+
(0, import_react147.useEffect)(() => {
|
|
15329
|
+
setActiveTab(active);
|
|
15330
|
+
}, [active]);
|
|
15331
|
+
return /* @__PURE__ */ import_react147.default.createElement(
|
|
15332
|
+
Flex,
|
|
15333
|
+
{
|
|
15334
|
+
direction: "column",
|
|
15335
|
+
css: {
|
|
15336
|
+
color: "$on_primary_high",
|
|
15337
|
+
h: "100%",
|
|
15338
|
+
marginTop: hideControls && isOverlayChat ? "$17" : "0",
|
|
15339
|
+
transition: "margin 0.3s ease-in-out"
|
|
15340
|
+
}
|
|
15341
|
+
},
|
|
15342
|
+
isOverlayChat && isChatOpen && showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, hideTabs ? /* @__PURE__ */ import_react147.default.createElement(import_react147.default.Fragment, null, /* @__PURE__ */ import_react147.default.createElement(Text, { variant: "sm", css: { fontWeight: "$semiBold", p: "$4", c: "$on_surface_high", pr: "$12" } }, showChat ? "Chat" : `Participants (${peerCount})`), showChat ? /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }) : /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)) : /* @__PURE__ */ import_react147.default.createElement(
|
|
15343
|
+
Tabs.Root,
|
|
15344
|
+
{
|
|
15345
|
+
value: activeTab,
|
|
15346
|
+
onValueChange: setActiveTab,
|
|
15347
|
+
css: {
|
|
15348
|
+
flexDirection: "column",
|
|
15349
|
+
size: "100%"
|
|
15350
|
+
}
|
|
15351
|
+
},
|
|
15352
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.List, { css: { w: "calc(100% - $12)", p: "$2", borderRadius: "$2", bg: "$surface_default" } }, /* @__PURE__ */ import_react147.default.createElement(
|
|
15353
|
+
Tabs.Trigger,
|
|
15354
|
+
{
|
|
15355
|
+
value: SIDE_PANE_OPTIONS.CHAT,
|
|
15356
|
+
onClick: toggleChat,
|
|
15357
|
+
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
15358
|
+
color: activeTab !== SIDE_PANE_OPTIONS.CHAT ? "$on_surface_low" : "$on_surface_high"
|
|
15359
|
+
})
|
|
15360
|
+
},
|
|
15361
|
+
"Chat"
|
|
15362
|
+
), /* @__PURE__ */ import_react147.default.createElement(
|
|
15363
|
+
Tabs.Trigger,
|
|
15364
|
+
{
|
|
15365
|
+
value: SIDE_PANE_OPTIONS.PARTICIPANTS,
|
|
15366
|
+
onClick: toggleParticipants,
|
|
15367
|
+
css: __spreadProps(__spreadValues({}, tabTriggerCSS), {
|
|
15368
|
+
color: activeTab !== SIDE_PANE_OPTIONS.PARTICIPANTS ? "$on_surface_low" : "$on_surface_high"
|
|
15369
|
+
})
|
|
15370
|
+
},
|
|
15371
|
+
"Participants (",
|
|
15372
|
+
peerCount,
|
|
15373
|
+
")"
|
|
15374
|
+
)),
|
|
15375
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.PARTICIPANTS, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(ParticipantList, null)),
|
|
15376
|
+
/* @__PURE__ */ import_react147.default.createElement(Tabs.Content, { value: SIDE_PANE_OPTIONS.CHAT, css: { p: 0 } }, /* @__PURE__ */ import_react147.default.createElement(Chat, { screenType }))
|
|
15377
|
+
)),
|
|
15378
|
+
isOverlayChat && isChatOpen ? null : /* @__PURE__ */ import_react147.default.createElement(
|
|
15379
|
+
IconButton,
|
|
15380
|
+
{
|
|
15381
|
+
css: { position: "absolute", right: "$10", top: "$11", "@md": { top: "$8", right: "$8" } },
|
|
15382
|
+
onClick: (e) => {
|
|
15383
|
+
e.stopPropagation();
|
|
15384
|
+
if (activeTab === SIDE_PANE_OPTIONS.CHAT) {
|
|
15385
|
+
toggleChat();
|
|
15386
|
+
} else {
|
|
15387
|
+
toggleParticipants();
|
|
15388
|
+
}
|
|
15389
|
+
},
|
|
15390
|
+
"data-testid": "close_chat"
|
|
15391
|
+
},
|
|
15392
|
+
/* @__PURE__ */ import_react147.default.createElement(import_react_icons64.CrossIcon, null)
|
|
15393
|
+
)
|
|
15394
|
+
);
|
|
15395
|
+
});
|
|
15396
|
+
}
|
|
15397
|
+
});
|
|
15398
|
+
|
|
15370
15399
|
// src/Prebuilt/images/rtmp.png
|
|
15371
15400
|
var rtmp_default;
|
|
15372
15401
|
var init_rtmp = __esm({
|
|
@@ -15376,13 +15405,13 @@ var init_rtmp = __esm({
|
|
|
15376
15405
|
});
|
|
15377
15406
|
|
|
15378
15407
|
// src/Prebuilt/components/Streaming/HLSStreaming.jsx
|
|
15379
|
-
var import_react148,
|
|
15408
|
+
var import_react148, import_react_sdk85, import_react_icons65, getCardData, Card, HLSStreaming, StartHLS, EndHLS;
|
|
15380
15409
|
var init_HLSStreaming = __esm({
|
|
15381
15410
|
"src/Prebuilt/components/Streaming/HLSStreaming.jsx"() {
|
|
15382
15411
|
"use strict";
|
|
15383
15412
|
init_define_process_env();
|
|
15384
15413
|
import_react148 = __toESM(require("react"));
|
|
15385
|
-
|
|
15414
|
+
import_react_sdk85 = require("@100mslive/react-sdk");
|
|
15386
15415
|
import_react_icons65 = require("@100mslive/react-icons");
|
|
15387
15416
|
init_src();
|
|
15388
15417
|
init_Common();
|
|
@@ -15453,16 +15482,16 @@ var init_HLSStreaming = __esm({
|
|
|
15453
15482
|
};
|
|
15454
15483
|
HLSStreaming = ({ onBack }) => {
|
|
15455
15484
|
const roleNames = useFilteredRoles();
|
|
15456
|
-
const roomId = (0,
|
|
15485
|
+
const roomId = (0, import_react_sdk85.useHMSStore)(import_react_sdk85.selectRoomID);
|
|
15457
15486
|
const cards = roleNames.map((roleName) => getCardData(roleName, roomId));
|
|
15458
|
-
const { isHLSRunning } = (0,
|
|
15487
|
+
const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
|
|
15459
15488
|
const [showLinks, setShowLinks] = (0, import_react148.useState)(false);
|
|
15460
15489
|
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
15490
|
};
|
|
15462
15491
|
StartHLS = () => {
|
|
15463
15492
|
const [record, setRecord] = (0, import_react148.useState)(false);
|
|
15464
15493
|
const [error, setError] = (0, import_react148.useState)(false);
|
|
15465
|
-
const hmsActions = (0,
|
|
15494
|
+
const hmsActions = (0, import_react_sdk85.useHMSActions)();
|
|
15466
15495
|
const [isHLSStarted, setHLSStarted] = useSetAppDataByKey(APP_DATA.hlsStarted);
|
|
15467
15496
|
const startHLS = (0, import_react148.useCallback)(
|
|
15468
15497
|
(variants) => __async(void 0, null, function* () {
|
|
@@ -15497,10 +15526,10 @@ var init_HLSStreaming = __esm({
|
|
|
15497
15526
|
)), /* @__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
15527
|
};
|
|
15499
15528
|
EndHLS = ({ setShowLinks }) => {
|
|
15500
|
-
const hmsActions = (0,
|
|
15529
|
+
const hmsActions = (0, import_react_sdk85.useHMSActions)();
|
|
15501
15530
|
const [inProgress, setInProgress] = (0, import_react148.useState)(false);
|
|
15502
15531
|
const [error, setError] = (0, import_react148.useState)("");
|
|
15503
|
-
const { isHLSRunning } = (0,
|
|
15532
|
+
const { isHLSRunning } = (0, import_react_sdk85.useRecordingStreaming)();
|
|
15504
15533
|
(0, import_react148.useEffect)(() => {
|
|
15505
15534
|
if (inProgress && !isHLSRunning) {
|
|
15506
15535
|
setInProgress(false);
|
|
@@ -15533,13 +15562,13 @@ var init_HLSStreaming = __esm({
|
|
|
15533
15562
|
});
|
|
15534
15563
|
|
|
15535
15564
|
// src/Prebuilt/components/Streaming/StreamingLanding.jsx
|
|
15536
|
-
var import_react149,
|
|
15565
|
+
var import_react149, import_react_sdk86, import_react_icons66, StreamingLanding;
|
|
15537
15566
|
var init_StreamingLanding = __esm({
|
|
15538
15567
|
"src/Prebuilt/components/Streaming/StreamingLanding.jsx"() {
|
|
15539
15568
|
"use strict";
|
|
15540
15569
|
init_define_process_env();
|
|
15541
15570
|
import_react149 = __toESM(require("react"));
|
|
15542
|
-
|
|
15571
|
+
import_react_sdk86 = require("@100mslive/react-sdk");
|
|
15543
15572
|
import_react_icons66 = require("@100mslive/react-icons");
|
|
15544
15573
|
init_Layout();
|
|
15545
15574
|
init_Text2();
|
|
@@ -15552,8 +15581,8 @@ var init_StreamingLanding = __esm({
|
|
|
15552
15581
|
init_constants();
|
|
15553
15582
|
StreamingLanding = () => {
|
|
15554
15583
|
const toggleStreaming = useSidepaneToggle(SIDE_PANE_OPTIONS.STREAMING);
|
|
15555
|
-
const { isHLSRunning, isRTMPRunning } = (0,
|
|
15556
|
-
const permissions = (0,
|
|
15584
|
+
const { isHLSRunning, isRTMPRunning } = (0, import_react_sdk86.useRecordingStreaming)();
|
|
15585
|
+
const permissions = (0, import_react_sdk86.useHMSStore)(import_react_sdk86.selectPermissions);
|
|
15557
15586
|
const [showHLS, setShowHLS] = (0, import_react149.useState)(isHLSRunning);
|
|
15558
15587
|
const [showRTMP, setShowRTMP] = (0, import_react149.useState)(isRTMPRunning);
|
|
15559
15588
|
if (!(permissions == null ? void 0 : permissions.hlsStreaming) && !(permissions == null ? void 0 : permissions.rtmpStreaming)) {
|
|
@@ -15599,16 +15628,15 @@ var init_StreamingLanding = __esm({
|
|
|
15599
15628
|
});
|
|
15600
15629
|
|
|
15601
15630
|
// src/Prebuilt/layouts/SidePane.tsx
|
|
15602
|
-
var import_react150, import_react_use30,
|
|
15631
|
+
var import_react150, import_react_use30, import_react_sdk87, SidePane, SidePane_default;
|
|
15603
15632
|
var init_SidePane = __esm({
|
|
15604
15633
|
"src/Prebuilt/layouts/SidePane.tsx"() {
|
|
15605
15634
|
"use strict";
|
|
15606
15635
|
init_define_process_env();
|
|
15607
15636
|
import_react150 = __toESM(require("react"));
|
|
15608
15637
|
import_react_use30 = require("react-use");
|
|
15609
|
-
|
|
15610
|
-
|
|
15611
|
-
init_ParticipantList();
|
|
15638
|
+
import_react_sdk87 = require("@100mslive/react-sdk");
|
|
15639
|
+
init_SidePaneTabs();
|
|
15612
15640
|
init_StreamingLanding();
|
|
15613
15641
|
init_VideoTile2();
|
|
15614
15642
|
init_Layout();
|
|
@@ -15622,21 +15650,26 @@ var init_SidePane = __esm({
|
|
|
15622
15650
|
}) => {
|
|
15623
15651
|
var _a7, _b7;
|
|
15624
15652
|
const isMobile = (0, import_react_use30.useMedia)(config.media.md);
|
|
15625
|
-
const sidepane = (0,
|
|
15626
|
-
const activeScreensharePeerId = (0,
|
|
15627
|
-
const trackId = (_a7 = (0,
|
|
15653
|
+
const sidepane = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.sidePane));
|
|
15654
|
+
const activeScreensharePeerId = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectAppData)(APP_DATA.activeScreensharePeerId));
|
|
15655
|
+
const trackId = (_a7 = (0, import_react_sdk87.useHMSStore)((0, import_react_sdk87.selectVideoTrackByPeerID)(activeScreensharePeerId))) == null ? void 0 : _a7.id;
|
|
15628
15656
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
15629
15657
|
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 });
|
|
15658
|
+
if (sidepane === SIDE_PANE_OPTIONS.PARTICIPANTS || sidepane === SIDE_PANE_OPTIONS.CHAT) {
|
|
15659
|
+
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(SidePaneTabs, { screenType, hideControls, active: sidepane });
|
|
15634
15660
|
} else if (sidepane === SIDE_PANE_OPTIONS.STREAMING) {
|
|
15635
15661
|
ViewComponent = /* @__PURE__ */ import_react150.default.createElement(StreamingLanding, null);
|
|
15636
15662
|
}
|
|
15637
15663
|
if (!ViewComponent && !trackId) {
|
|
15638
15664
|
return null;
|
|
15639
15665
|
}
|
|
15666
|
+
const tileLayout = {
|
|
15667
|
+
hideParticipantNameOnTile: tileProps == null ? void 0 : tileProps.hide_participant_name_on_tile,
|
|
15668
|
+
roundedVideoTile: tileProps == null ? void 0 : tileProps.rounded_video_tile,
|
|
15669
|
+
hideAudioMuteOnTile: tileProps == null ? void 0 : tileProps.hide_audio_mute_on_tile,
|
|
15670
|
+
hideMetadataOnTile: tileProps == null ? void 0 : tileProps.hide_metadata_on_tile,
|
|
15671
|
+
objectFit: tileProps == null ? void 0 : tileProps.video_object_fit
|
|
15672
|
+
};
|
|
15640
15673
|
const mwebStreamingChat = isMobile && sidepane === SIDE_PANE_OPTIONS.CHAT && ((_b7 = elements == null ? void 0 : elements.chat) == null ? void 0 : _b7.is_overlay);
|
|
15641
15674
|
return /* @__PURE__ */ import_react150.default.createElement(
|
|
15642
15675
|
Flex,
|
|
@@ -15658,9 +15691,8 @@ var init_SidePane = __esm({
|
|
|
15658
15691
|
trackId,
|
|
15659
15692
|
width: "100%",
|
|
15660
15693
|
height: 225,
|
|
15661
|
-
rootCSS: { p: 0, alignSelf: "start", flexShrink: 0 }
|
|
15662
|
-
|
|
15663
|
-
}, tileProps)
|
|
15694
|
+
rootCSS: { p: 0, alignSelf: "start", flexShrink: 0 }
|
|
15695
|
+
}, tileLayout)
|
|
15664
15696
|
),
|
|
15665
15697
|
!!ViewComponent && /* @__PURE__ */ import_react150.default.createElement(
|
|
15666
15698
|
Box,
|
|
@@ -16347,7 +16379,7 @@ var HLSView_exports = {};
|
|
|
16347
16379
|
__export(HLSView_exports, {
|
|
16348
16380
|
default: () => HLSView_default
|
|
16349
16381
|
});
|
|
16350
|
-
var import_react161, import_react_use31, import_hls_player3, import_screenfull3,
|
|
16382
|
+
var import_react161, import_react_use31, import_hls_player3, import_screenfull3, import_react_sdk88, import_react_icons72, hlsPlayer, HLSView, HLSView_default;
|
|
16351
16383
|
var init_HLSView = __esm({
|
|
16352
16384
|
"src/Prebuilt/layouts/HLSView.jsx"() {
|
|
16353
16385
|
"use strict";
|
|
@@ -16356,7 +16388,7 @@ var init_HLSView = __esm({
|
|
|
16356
16388
|
import_react_use31 = require("react-use");
|
|
16357
16389
|
import_hls_player3 = require("@100mslive/hls-player");
|
|
16358
16390
|
import_screenfull3 = __toESM(require("screenfull"));
|
|
16359
|
-
|
|
16391
|
+
import_react_sdk88 = require("@100mslive/react-sdk");
|
|
16360
16392
|
import_react_icons72 = require("@100mslive/react-icons");
|
|
16361
16393
|
init_HlsStatsOverlay();
|
|
16362
16394
|
init_HMSVideo2();
|
|
@@ -16375,9 +16407,9 @@ var init_HLSView = __esm({
|
|
|
16375
16407
|
var _a7;
|
|
16376
16408
|
const videoRef = (0, import_react161.useRef)(null);
|
|
16377
16409
|
const hlsViewRef = (0, import_react161.useRef)(null);
|
|
16378
|
-
const hlsState = (0,
|
|
16379
|
-
const enablHlsStats = (0,
|
|
16380
|
-
const hmsActions = (0,
|
|
16410
|
+
const hlsState = (0, import_react_sdk88.useHMSStore)(import_react_sdk88.selectHLSState);
|
|
16411
|
+
const enablHlsStats = (0, import_react_sdk88.useHMSStore)((0, import_react_sdk88.selectAppData)(APP_DATA.hlsStats));
|
|
16412
|
+
const hmsActions = (0, import_react_sdk88.useHMSActions)();
|
|
16381
16413
|
const { themeType, theme: theme2 } = useTheme();
|
|
16382
16414
|
const [streamEnded, setStreamEnded] = (0, import_react161.useState)(false);
|
|
16383
16415
|
let [hlsStatsState, setHlsStatsState] = (0, import_react161.useState)(null);
|
|
@@ -16695,13 +16727,13 @@ var init_HLSView = __esm({
|
|
|
16695
16727
|
});
|
|
16696
16728
|
|
|
16697
16729
|
// src/Prebuilt/layouts/VideoStreamingSection.tsx
|
|
16698
|
-
var import_react162,
|
|
16730
|
+
var import_react162, import_react_sdk89, HLSView2, VideoStreamingSection;
|
|
16699
16731
|
var init_VideoStreamingSection = __esm({
|
|
16700
16732
|
"src/Prebuilt/layouts/VideoStreamingSection.tsx"() {
|
|
16701
16733
|
"use strict";
|
|
16702
16734
|
init_define_process_env();
|
|
16703
16735
|
import_react162 = __toESM(require("react"));
|
|
16704
|
-
|
|
16736
|
+
import_react_sdk89 = require("@100mslive/react-sdk");
|
|
16705
16737
|
init_FullPageProgress();
|
|
16706
16738
|
init_GridLayout();
|
|
16707
16739
|
init_Layout();
|
|
@@ -16718,9 +16750,9 @@ var init_VideoStreamingSection = __esm({
|
|
|
16718
16750
|
hideControls = false
|
|
16719
16751
|
}) => {
|
|
16720
16752
|
var _a7, _b7;
|
|
16721
|
-
const localPeerRole = (0,
|
|
16722
|
-
const isConnected = (0,
|
|
16723
|
-
const hmsActions = (0,
|
|
16753
|
+
const localPeerRole = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectLocalPeerRoleName);
|
|
16754
|
+
const isConnected = (0, import_react_sdk89.useHMSStore)(import_react_sdk89.selectIsConnectedToRoom);
|
|
16755
|
+
const hmsActions = (0, import_react_sdk89.useHMSActions)();
|
|
16724
16756
|
const waitingViewerRole = useWaitingViewerRole();
|
|
16725
16757
|
const urlToIframe = useUrlToEmbed();
|
|
16726
16758
|
const pdfAnnotatorActive = usePDFAnnotator();
|
|
@@ -16769,30 +16801,32 @@ var init_VideoStreamingSection = __esm({
|
|
|
16769
16801
|
});
|
|
16770
16802
|
|
|
16771
16803
|
// src/Prebuilt/components/RoleChangeRequestModal.tsx
|
|
16772
|
-
var import_react163,
|
|
16804
|
+
var import_react163, import_react_sdk90, RoleChangeRequestModal, RequestDialog2;
|
|
16773
16805
|
var init_RoleChangeRequestModal = __esm({
|
|
16774
16806
|
"src/Prebuilt/components/RoleChangeRequestModal.tsx"() {
|
|
16775
16807
|
"use strict";
|
|
16776
16808
|
init_define_process_env();
|
|
16777
16809
|
import_react163 = __toESM(require("react"));
|
|
16778
|
-
|
|
16810
|
+
import_react_sdk90 = require("@100mslive/react-sdk");
|
|
16779
16811
|
init_PreviewJoin();
|
|
16780
16812
|
init_src();
|
|
16781
16813
|
init_useMetadata();
|
|
16782
16814
|
init_constants();
|
|
16783
16815
|
RoleChangeRequestModal = () => {
|
|
16784
|
-
const hmsActions = (0,
|
|
16816
|
+
const hmsActions = (0, import_react_sdk90.useHMSActions)();
|
|
16785
16817
|
const { updateMetaData } = useMyMetadata();
|
|
16786
|
-
const currentRole = (0,
|
|
16787
|
-
const roleChangeRequest = (0,
|
|
16788
|
-
const name = (0,
|
|
16789
|
-
const { sendEvent } = (0,
|
|
16818
|
+
const currentRole = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerRoleName);
|
|
16819
|
+
const roleChangeRequest = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectRoleChangeRequest);
|
|
16820
|
+
const name = (0, import_react_sdk90.useHMSStore)(import_react_sdk90.selectLocalPeerName);
|
|
16821
|
+
const { sendEvent } = (0, import_react_sdk90.useCustomEvent)({ type: ROLE_CHANGE_DECLINED });
|
|
16790
16822
|
(0, import_react163.useEffect)(() => {
|
|
16791
16823
|
if (!(roleChangeRequest == null ? void 0 : roleChangeRequest.role)) {
|
|
16792
16824
|
return;
|
|
16793
16825
|
}
|
|
16794
|
-
|
|
16795
|
-
|
|
16826
|
+
(() => __async(void 0, null, function* () {
|
|
16827
|
+
yield hmsActions.preview({ asRole: roleChangeRequest.role.name });
|
|
16828
|
+
}))();
|
|
16829
|
+
}, [hmsActions, roleChangeRequest, currentRole, updateMetaData]);
|
|
16796
16830
|
if (!(roleChangeRequest == null ? void 0 : roleChangeRequest.role)) {
|
|
16797
16831
|
return null;
|
|
16798
16832
|
}
|
|
@@ -16848,7 +16882,7 @@ var conference_exports = {};
|
|
|
16848
16882
|
__export(conference_exports, {
|
|
16849
16883
|
default: () => conference_default
|
|
16850
16884
|
});
|
|
16851
|
-
var import_react164, import_react_router_dom5, import_react_use32,
|
|
16885
|
+
var import_react164, import_react_router_dom5, import_react_use32, import_react_sdk91, Conference, conference_default;
|
|
16852
16886
|
var init_conference = __esm({
|
|
16853
16887
|
"src/Prebuilt/components/conference.jsx"() {
|
|
16854
16888
|
"use strict";
|
|
@@ -16856,7 +16890,7 @@ var init_conference = __esm({
|
|
|
16856
16890
|
import_react164 = __toESM(require("react"));
|
|
16857
16891
|
import_react_router_dom5 = require("react-router-dom");
|
|
16858
16892
|
import_react_use32 = require("react-use");
|
|
16859
|
-
|
|
16893
|
+
import_react_sdk91 = require("@100mslive/react-sdk");
|
|
16860
16894
|
init_Footer3();
|
|
16861
16895
|
init_HLSFailureModal();
|
|
16862
16896
|
init_PIPComponent();
|
|
@@ -16877,12 +16911,12 @@ var init_conference = __esm({
|
|
|
16877
16911
|
const { userName, endpoints } = useHMSPrebuiltContext();
|
|
16878
16912
|
const screenProps = useRoomLayoutConferencingScreen();
|
|
16879
16913
|
const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
|
|
16880
|
-
const roomState = (0,
|
|
16914
|
+
const roomState = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectRoomState);
|
|
16881
16915
|
const prevState = (0, import_react_use32.usePrevious)(roomState);
|
|
16882
|
-
const isConnectedToRoom = (0,
|
|
16883
|
-
const hmsActions = (0,
|
|
16916
|
+
const isConnectedToRoom = (0, import_react_sdk91.useHMSStore)(import_react_sdk91.selectIsConnectedToRoom);
|
|
16917
|
+
const hmsActions = (0, import_react_sdk91.useHMSActions)();
|
|
16884
16918
|
const [hideControls, setHideControls] = (0, import_react164.useState)(false);
|
|
16885
|
-
const dropdownList = (0,
|
|
16919
|
+
const dropdownList = (0, import_react_sdk91.useHMSStore)((0, import_react_sdk91.selectAppData)(APP_DATA.dropdownList));
|
|
16886
16920
|
const authTokenInAppData = useAuthToken();
|
|
16887
16921
|
const headerRef = (0, import_react164.useRef)();
|
|
16888
16922
|
const footerRef = (0, import_react164.useRef)();
|
|
@@ -16895,6 +16929,7 @@ var init_conference = __esm({
|
|
|
16895
16929
|
setHideControls((value) => !value);
|
|
16896
16930
|
}
|
|
16897
16931
|
};
|
|
16932
|
+
const autoRoomJoined = (0, import_react164.useRef)(isPreviewScreenEnabled);
|
|
16898
16933
|
(0, import_react164.useEffect)(() => {
|
|
16899
16934
|
let timeout = null;
|
|
16900
16935
|
dropdownListRef.current = dropdownList || [];
|
|
@@ -16918,7 +16953,7 @@ var init_conference = __esm({
|
|
|
16918
16953
|
if (!isPreviewScreenEnabled) {
|
|
16919
16954
|
return;
|
|
16920
16955
|
}
|
|
16921
|
-
if (!prevState && !(roomState ===
|
|
16956
|
+
if (!prevState && !(roomState === import_react_sdk91.HMSRoomState.Connecting || roomState === import_react_sdk91.HMSRoomState.Reconnecting || isConnectedToRoom)) {
|
|
16922
16957
|
if (role)
|
|
16923
16958
|
navigate(`/preview/${roomId || ""}/${role}`);
|
|
16924
16959
|
else
|
|
@@ -16926,7 +16961,7 @@ var init_conference = __esm({
|
|
|
16926
16961
|
}
|
|
16927
16962
|
}, [isConnectedToRoom, prevState, roomState, navigate, role, roomId, isPreviewScreenEnabled]);
|
|
16928
16963
|
(0, import_react164.useEffect)(() => {
|
|
16929
|
-
if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !==
|
|
16964
|
+
if (authTokenInAppData && !isConnectedToRoom && !isPreviewScreenEnabled && roomState !== import_react_sdk91.HMSRoomState.Connecting && !autoRoomJoined.current) {
|
|
16930
16965
|
hmsActions.join({
|
|
16931
16966
|
userName,
|
|
16932
16967
|
authToken: authTokenInAppData,
|
|
@@ -16937,6 +16972,7 @@ var init_conference = __esm({
|
|
|
16937
16972
|
speakerAutoSelectionBlacklist: ["Yeti Stereo Microphone"]
|
|
16938
16973
|
}
|
|
16939
16974
|
}).catch(console.error);
|
|
16975
|
+
autoRoomJoined.current = true;
|
|
16940
16976
|
}
|
|
16941
16977
|
}, [authTokenInAppData, endpoints == null ? void 0 : endpoints.init, hmsActions, isConnectedToRoom, isPreviewScreenEnabled, roomState, userName]);
|
|
16942
16978
|
(0, import_react164.useEffect)(() => {
|
|
@@ -17021,14 +17057,14 @@ function AppRoutes({
|
|
|
17021
17057
|
const isNotificationsDisabled = useIsNotificationDisabled();
|
|
17022
17058
|
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
17059
|
}
|
|
17024
|
-
var import_react165, import_react_router_dom6,
|
|
17060
|
+
var import_react165, import_react_router_dom6, import_react_sdk92, Conference2, HMSPrebuilt, Redirector, RouteList, BackSwipe, Router;
|
|
17025
17061
|
var init_App = __esm({
|
|
17026
17062
|
"src/Prebuilt/App.tsx"() {
|
|
17027
17063
|
"use strict";
|
|
17028
17064
|
init_define_process_env();
|
|
17029
17065
|
import_react165 = __toESM(require("react"));
|
|
17030
17066
|
import_react_router_dom6 = require("react-router-dom");
|
|
17031
|
-
|
|
17067
|
+
import_react_sdk92 = require("@100mslive/react-sdk");
|
|
17032
17068
|
init_AppData();
|
|
17033
17069
|
init_AuthToken();
|
|
17034
17070
|
init_ErrorBoundary();
|
|
@@ -17069,7 +17105,7 @@ var init_App = __esm({
|
|
|
17069
17105
|
const [hydrated, setHydrated] = import_react165.default.useState(false);
|
|
17070
17106
|
(0, import_react165.useEffect)(() => {
|
|
17071
17107
|
setHydrated(true);
|
|
17072
|
-
const hms = new
|
|
17108
|
+
const hms = new import_react_sdk92.HMSReactiveStore();
|
|
17073
17109
|
const hmsStore = hms.getStore();
|
|
17074
17110
|
const hmsActions = hms.getActions();
|
|
17075
17111
|
const hmsNotifications = hms.getNotifications();
|
|
@@ -17137,7 +17173,7 @@ var init_App = __esm({
|
|
|
17137
17173
|
}
|
|
17138
17174
|
},
|
|
17139
17175
|
/* @__PURE__ */ import_react165.default.createElement(
|
|
17140
|
-
|
|
17176
|
+
import_react_sdk92.HMSRoomProvider,
|
|
17141
17177
|
{
|
|
17142
17178
|
isHMSStatsOn: FeatureFlags.enableStatsForNerds,
|
|
17143
17179
|
actions: (_a7 = reactiveStore.current) == null ? void 0 : _a7.hmsActions,
|
|
@@ -17223,8 +17259,8 @@ var init_App = __esm({
|
|
|
17223
17259
|
)), 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
17260
|
};
|
|
17225
17261
|
BackSwipe = () => {
|
|
17226
|
-
const isConnectedToRoom = (0,
|
|
17227
|
-
const hmsActions = (0,
|
|
17262
|
+
const isConnectedToRoom = (0, import_react_sdk92.useHMSStore)(import_react_sdk92.selectIsConnectedToRoom);
|
|
17263
|
+
const hmsActions = (0, import_react_sdk92.useHMSActions)();
|
|
17228
17264
|
(0, import_react165.useEffect)(() => {
|
|
17229
17265
|
const onRouteLeave = () => __async(void 0, null, function* () {
|
|
17230
17266
|
if (isConnectedToRoom) {
|