@100mslive/roomkit-react 0.1.6-alpha.1 → 0.1.6-alpha.3
Sign up to get free protection for your applications and to get access to all the features.
- 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) {
|