@100mslive/roomkit-react 0.3.8-alpha.3 → 0.3.8-alpha.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{HLSView-XPK2JCMJ.js → HLSView-KESSHZG2.js} +2 -2
- package/dist/{chunk-AJQ4OUGM.js → chunk-KRTJ2T7F.js} +275 -272
- package/dist/chunk-KRTJ2T7F.js.map +7 -0
- package/dist/index.cjs.js +519 -513
- package/dist/index.cjs.js.map +4 -4
- package/dist/index.js +1 -1
- package/dist/meta.cjs.json +91 -76
- package/dist/meta.esbuild.json +96 -81
- package/package.json +6 -6
- package/src/Prebuilt/components/ConferenceScreen.tsx +2 -34
- package/src/Prebuilt/layouts/VideoStreamingSection.tsx +3 -1
- package/src/Prebuilt/plugins/CaptionsViewer.tsx +43 -9
- package/dist/chunk-AJQ4OUGM.js.map +0 -7
- /package/dist/{HLSView-XPK2JCMJ.js.map → HLSView-KESSHZG2.js.map} +0 -0
package/dist/index.cjs.js
CHANGED
|
@@ -108,7 +108,7 @@ var __async = (__this, __arguments, generator) => {
|
|
|
108
108
|
var define_process_env_default;
|
|
109
109
|
var init_define_process_env = __esm({
|
|
110
110
|
"<define:process.env>"() {
|
|
111
|
-
define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_95e0e803-aa00-49ff-9204-6d1aa1a5afdc", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.22 npm/? node/v18.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.10.8-alpha.3", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_95e0e803-aa00-49ff-9204-6d1aa1a5afdc", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.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.13.8-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.8", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", npm_package_repository_directory: "packages/roomkit-react", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.7", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/26.3.11579264", JAVA_HOME_21_X64: "/usr/lib/jvm/temurin-21-jdk-amd64", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "591", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.9", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.14/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.9/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20240414.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", GOROOT_1_22_X64: "/opt/hostedtoolcache/go/1.22.2/x64", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_dependencies__100mslive_hms_noise_cancellation: "0.0.1", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:19762", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.3.8-alpha.3", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", ACTIONS_RUNNER_ACTION_ARCHIVE_CACHE: "/opt/actionarchivecache", STATS_D: "false", GITHUB_RUN_ID: "8737636713", STATS_VMFE: "true", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_dependencies_ts_pattern: "4.3.0", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "6ee28a277707cea9f9d2733c2b334d35bae73333", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "examples/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "2de7227c5fe4ca716ab22f0aa5bc5256be564fc01239aa44cfa2be01b540832e", npm_package_exports___import: "./dist/index.js", STATS_BLT: "true", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/publish-alpha", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GITHUB_ACTION_REPOSITORY: "", npm_package_scripts_prebuilt: "cd packages/roomkit-react && yarn start", npm_package_devDependencies_postcss_loader: "^6.2.1", npm_package_devDependencies_esbuild_loader: "^4.0.2", PATH: "/tmp/yarn--1713442406728-0.8459737272145809:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713442406530-0.32115544105639793:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713442383663-0.42549147721249003:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713442383480-0.6352775637023345:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin:/snap/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/18.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_d0efe4a2-0314-40bb-9b4b-1f4b1148624f", INVOCATION_ID: "208bd9a3f7c24c77939b0686eebcf3fe", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", npm_package_repository_type: "git", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "518", GITHUB_TRIGGERING_ACTOR: "github-actions[bot]", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_lint_staged____js_ts_jsx_tsx_: "eslint", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "20 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "20 KB", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 263", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "publish-alpha", GITHUB_REPOSITORY: "100mslive/web-sdks", STATS_D_D: "false", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "400 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.10.8-alpha.3", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.3.8-alpha.3", npm_package_size_limit_4_limit: "20 KB", npm_package_size_limit_1_path: "packages/hms-video-store/dist/index.js", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_repository_url: "https://github.com/100mslive/web-sdks.git", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/roomkit-react/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "150 KB", npm_package_size_limit_3_path: "packages/roomkit-react/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "6ee28a277707cea9f9d2733c2b334d35bae73333", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "100 KB", npm_package_size_limit_4_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/publish-alpha", GITHUB_ACTOR: "github-actions[bot]", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_license: "MIT", npm_package_size_limit_5_path: "packages/hms-virtual-background/dist/index.js", npm_config_strict_ssl: "true", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_6_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_95e0e803-aa00-49ff-9204-6d1aa1a5afdc", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "41898282", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/react-icons/dist/index.js", npm_package_scripts_ybys: "yarn && yarn build --no-private && yarn storybook", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.11.2-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_95e0e803-aa00-49ff-9204-6d1aa1a5afdc", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_dependencies_react_swipeable: "^7.0.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.172+1/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_95e0e803-aa00-49ff-9204-6d1aa1a5afdc" };
|
|
111
|
+
define_process_env_default = { GITHUB_STATE: "/home/runner/work/_temp/_runner_file_commands/save_state_99ff87f3-70ec-4a4f-affe-f5887196edd9", npm_package_devDependencies_ts_node: "^10.4.0", npm_package_devDependencies__types_node: "^16.11.17", npm_package_devDependencies_rollup: "^2.70.1", npm_package_exports___require: "./dist/index.cjs.js", STATS_TRP: "true", DEPLOYMENT_BASEPATH: "/opt/runner", DOTNET_NOLOGO: "1", npm_package_dependencies_screenfull: "^5.1.0", npm_package_dependencies_react_draggable: "^4.4.5", npm_package_dependencies__radix_ui_react_switch: "1.0.0", USER: "runner", npm_package_devDependencies_jest: "26.6.0", npm_config_version_commit_hooks: "true", npm_config_user_agent: "yarn/1.22.22 npm/? node/v18.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.10.8-alpha.4", RUNNER_ENVIRONMENT: "github-hosted", GITHUB_ENV: "/home/runner/work/_temp/_runner_file_commands/set_env_99ff87f3-70ec-4a4f-affe-f5887196edd9", PIPX_HOME: "/opt/pipx", npm_node_execpath: "/opt/hostedtoolcache/node/18.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.13.8-alpha.4", 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.8", npm_package_peerDependencies_react: ">=17.0.2 <19.0.0", npm_package_devDependencies__storybook_addon_links: "^7.0.27", npm_package_files_0: "dist", HOME: "/home/runner", npm_package_devDependencies__typescript_eslint_parser: "^5.4.0", npm_package_dependencies__radix_ui_react_dialog: "1.0.4", npm_package_devDependencies__types_react_window: "^1.8.5", npm_package_files_1: "src", npm_package_repository_directory: "packages/roomkit-react", RUNNER_TEMP: "/home/runner/work/_temp", GITHUB_EVENT_PATH: "/home/runner/work/_temp/_github_workflow/event.json", npm_package_scripts_controller: "cd packages/hls-controller && yarn start", npm_package_dependencies__stitches_react: "^1.2.8", JAVA_HOME_11_X64: "/usr/lib/jvm/temurin-11-jdk-amd64", PIPX_BIN_DIR: "/opt/pipx_bin", GITHUB_REPOSITORY_OWNER: "100mslive", npm_package_engines_node: ">=16", npm_package_devDependencies_typedoc_plugin_markdown: "^3.14.0", npm_config_init_license: "MIT", GRADLE_HOME: "/usr/share/gradle-8.7", ANDROID_NDK_LATEST_HOME: "/usr/local/lib/android/sdk/ndk/26.3.11579264", JAVA_HOME_21_X64: "/usr/lib/jvm/temurin-21-jdk-amd64", STATS_RDCL: "true", GITHUB_RETENTION_DAYS: "90", YARN_WRAP_OUTPUT: "false", npm_config_version_tag_prefix: "v", GITHUB_REPOSITORY_OWNER_ID: "73883131", POWERSHELL_DISTRIBUTION_CHANNEL: "GitHub-Actions-ubuntu22", AZURE_EXTENSION_DIR: "/opt/az/azcliextensions", GITHUB_HEAD_REF: "", npm_package_scripts_lint_fix: "yarn lint --fix", npm_config_userconfig: "/home/runner/work/_temp/.npmrc", npm_package_devDependencies__storybook_addon_a11y: "^7.0.27", SYSTEMD_EXEC_PID: "597", npm_package_scripts_postinstall: "husky install && lerna bootstrap", npm_package_devDependencies_husky: "^6.0.0", npm_package_dependencies_recordrtc: "^5.6.2", npm_package_dependencies_eventemitter2: "^6.4.9", npm_package_dependencies__radix_ui_react_label: "1.0.0", npm_package_dependencies__radix_ui_react_dropdown_menu: "2.0.5", npm_package_keywords_0: "100mslive", GITHUB_GRAPHQL_URL: "https://api.github.com/graphql", npm_package_description: "100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.", npm_package_devDependencies_typescript: "~4.7.4", npm_package_devDependencies_typedoc: "^0.24.8", npm_package_devDependencies_babel_loader: "^8.2.5", npm_package_devDependencies__rollup_plugin_image: "^3.0.2", npm_package_keywords_1: "react", GOROOT_1_20_X64: "/opt/hostedtoolcache/go/1.20.14/x64", NVM_DIR: "/home/runner/.nvm", npm_package_readmeFilename: "README.md", npm_package_devDependencies_react: "^18.1.0", npm_package_devDependencies__babel_preset_env: "^7.22.5", npm_package_keywords_2: "prebuilt", DOTNET_SKIP_FIRST_TIME_EXPERIENCE: "1", GOROOT_1_21_X64: "/opt/hostedtoolcache/go/1.21.9/x64", JAVA_HOME_17_X64: "/usr/lib/jvm/temurin-17-jdk-amd64", ImageVersion: "20240414.1.0", npm_package_devDependencies_prettier: "^2.4.1", npm_package_devDependencies_babel_jest: "^26.6.0", npm_package_scripts_dev: "node ../../scripts/dev", npm_package_keywords_3: "roomkit", RUNNER_OS: "Linux", GITHUB_API_URL: "https://api.github.com", GOROOT_1_22_X64: "/opt/hostedtoolcache/go/1.22.2/x64", SWIFT_PATH: "/usr/share/swift/usr/bin", FORCE_COLOR: "true", npm_package_dependencies__radix_ui_react_toast: "1.0.0", npm_package_dependencies__radix_ui_react_radio_group: "1.0.0", npm_package_dependencies__100mslive_hms_noise_cancellation: "0.0.1", npm_package_devDependencies__babel_preset_typescript: "^7.22.5", npm_package_exports___default: "./dist/index.js", RUNNER_USER: "runner", STATS_V3PS: "true", CHROMEWEBDRIVER: "/usr/local/share/chromedriver-linux64", JOURNAL_STREAM: "8:17353", GITHUB_WORKFLOW: "Publish Packages", _: "/usr/local/bin/yarn", npm_package_devDependencies_ts_jest: "26.5.6", npm_package_devDependencies_lerna: "^5.6.2", npm_package_devDependencies__types_jest: "^27.0.3", npm_package_devDependencies__commitlint_config_conventional: "^15.0.0", npm_package_private: "true", npm_package_dependencies__radix_ui_react_accordion: "1.0.0", npm_package_devDependencies__rollup_plugin_commonjs: "^21.0.3", npm_package_devDependencies__babel_preset_react: "^7.22.5", npm_package_module: "dist/index.js", npm_package_scripts_lint: "eslint -c .eslintrc --no-error-on-unmatched-pattern src --ext .js --ext .jsx --ext .ts --ext .tsx", npm_package_devDependencies__typescript_eslint_eslint_plugin: "^5.4.0", npm_config_registry: "https://registry.yarnpkg.com", npm_package_dependencies_react_window: "^1.8.7", npm_package_dependencies__100mslive_hls_player: "0.3.8-alpha.4", npm_package_devDependencies__types_lodash_merge: "^4.6.6", npm_package_devDependencies__storybook_cli: "^7.0.27", npm_package_devDependencies__rollup_plugin_json: "^6.0.0", ACTIONS_RUNNER_ACTION_ARCHIVE_CACHE: "/opt/actionarchivecache", STATS_D: "false", GITHUB_RUN_ID: "8749330041", STATS_VMFE: "true", npm_package_workspaces_0: "packages/*", npm_package_scripts_store: "cd packages/hms-video-store && yarn start", npm_package_devDependencies__babel_core: "^7.18.2", npm_package_dependencies_ts_pattern: "4.3.0", npm_package_devDependencies__storybook_addon_interactions: "^7.0.27", npm_package_devDependencies__storybook_addon_actions: "^7.0.27", GITHUB_REF_TYPE: "branch", BOOTSTRAP_HASKELL_NONINTERACTIVE: "1", GITHUB_WORKFLOW_SHA: "1ac0f11a034d8e0aed06479e20671c86bffd77f8", GITHUB_BASE_REF: "", ImageOS: "ubuntu22", npm_package_workspaces_1: "examples/*", npm_package_scripts_start: 'concurrently "yarn dev" "yarn types"', npm_config_ignore_scripts: "", NX_TASK_HASH: "fca5e903c9a2399e3cdd373a0e29fd3a22d2c47d2154454f738eee43975db61a", npm_package_exports___import: "./dist/index.js", GITHUB_WORKFLOW_REF: "100mslive/web-sdks/.github/workflows/publish.yml@refs/heads/publish-alpha", PERFLOG_LOCATION_SETTING: "RUNNER_PERFLOG", GITHUB_ACTION_REPOSITORY: "", npm_package_scripts_prebuilt: "cd packages/roomkit-react && yarn start", npm_package_devDependencies_postcss_loader: "^6.2.1", npm_package_devDependencies_esbuild_loader: "^4.0.2", PATH: "/tmp/yarn--1713507861459-0.8404529433065979:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713507861261-0.435899755627573:/home/runner/work/web-sdks/web-sdks/packages/roomkit-react/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713507839160-0.06303379929561603:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/tmp/yarn--1713507838975-0.7068313429725521:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/home/runner/.config/yarn/link/node_modules/.bin:/home/runner/work/web-sdks/web-sdks/node_modules/.bin:/opt/hostedtoolcache/node/18.20.2/x64/libexec/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/lib/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin/node_modules/npm/bin/node-gyp-bin:/opt/hostedtoolcache/node/18.20.2/x64/bin:/snap/bin:/home/runner/.local/bin:/opt/pipx_bin:/home/runner/.cargo/bin:/home/runner/.config/composer/vendor/bin:/usr/local/.ghcup/bin:/home/runner/.dotnet/tools:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin", NODE: "/opt/hostedtoolcache/node/18.20.2/x64/bin/node", ANT_HOME: "/usr/share/ant", DOTNET_MULTILEVEL_LOOKUP: "0", RUNNER_TRACKING_ID: "github_613f38a3-ba05-4673-afed-2c4e52ebfa99", INVOCATION_ID: "9934528957ed4a47acf8a3a1df0d25e2", NPM_CONFIG_USERCONFIG: "/home/runner/work/_temp/.npmrc", RUNNER_TOOL_CACHE: "/opt/hostedtoolcache", npm_package_scripts_size: "size-limit", npm_package_devDependencies_size_limit: "^5.0.3", npm_package_name: "@100mslive/roomkit-react", npm_package_devDependencies__storybook_react_webpack5: "^7.0.27", npm_package_repository_type: "git", GITHUB_ACTION: "__run_3", GITHUB_RUN_NUMBER: "519", GITHUB_TRIGGERING_ACTOR: "github-actions[bot]", RUNNER_ARCH: "X64", XDG_RUNTIME_DIR: "/run/user/1001", AGENT_TOOLSDIRECTORY: "/opt/hostedtoolcache", npm_package_lint_staged____js_ts_jsx_tsx_: "eslint", npm_package_devDependencies_babel_plugin_istanbul: "^6.1.1", LERNA_PACKAGE_NAME: "@100mslive/roomkit-react", npm_package_dependencies__radix_ui_react_select: "1.0.0", npm_package_size_limit_0_limit: "20 KB", npm_package_devDependencies__commitlint_cli: "^15.0.0", npm_package_devDependencies__rollup_plugin_typescript: "^8.3.1", LANG: "C.UTF-8", VCPKG_INSTALLATION_ROOT: "/usr/local/share/vcpkg", npm_package_size_limit_1_limit: "20 KB", npm_package_devDependencies_eslint_plugin_simple_import_sort: "^8.0.0", npm_package_devDependencies_eslint: "^8.9.0", npm_package_dependencies_react_intersection_observer: "^9.4.3", npm_package_devDependencies_rollup_plugin_terser: "^7.0.2", npm_package_devDependencies__types_mdx: "2.0.2", CONDA: "/usr/share/miniconda", RUNNER_NAME: "GitHub Actions 262", XDG_CONFIG_HOME: "/home/runner/.config", STATS_VMD: "true", GITHUB_REF_NAME: "publish-alpha", GITHUB_REPOSITORY: "100mslive/web-sdks", STATS_D_D: "false", npm_lifecycle_script: "rm -rf dist && node ../../scripts/build-webapp", npm_package_size_limit_2_limit: "400 KB", npm_package_resolutions_loader_utils: "^2.0.4", npm_package_devDependencies_dotenv: "^14.2.0", npm_package_dependencies__radix_ui_react_slider: "1.0.0", npm_package_devDependencies_rollup_plugin_import_css: "^3.3.1", npm_package_scripts_types_build: "tsc -p tsconfig.json", npm_package_main: "dist/index.cjs.js", STATS_UE: "true", ANDROID_NDK_ROOT: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_ACTION_REF: "", DEBIAN_FRONTEND: "noninteractive", npm_package_size_limit_3_limit: "20 KB", npm_package_size_limit_0_path: "packages/hms-video-store/dist/index.cjs.js", npm_package_scripts_cypress_open: "cypress open", npm_package_scripts_lerna_publish: "lerna publish from-package --dist-tag $PUBLISH_FLAG --yes --no-verify-access", npm_package_scripts_test: "yarn build --no-private && lerna run test", npm_package_devDependencies_concurrently: "^6.4.0", npm_config_version_git_message: "v%s", npm_package_dependencies__radix_ui_react_checkbox: "1.0.0", npm_package_dependencies__100mslive_react_icons: "0.10.8-alpha.4", npm_package_scripts_types: "tsc -w", GITHUB_REPOSITORY_ID: "429826515", GITHUB_ACTIONS: "true", npm_lifecycle_event: "build:only", npm_package_version: "0.3.8-alpha.4", npm_package_size_limit_4_limit: "20 KB", npm_package_size_limit_1_path: "packages/hms-video-store/dist/index.js", npm_package_scripts_build_only: "rm -rf dist && node ../../scripts/build-webapp", npm_package_devDependencies__types_react: "^18.1.0", npm_package_sideEffects: "false", npm_package_repository_url: "https://github.com/100mslive/web-sdks.git", npm_package_source: "src/index.ts", GITHUB_REF_PROTECTED: "true", npm_config_argv: '{"remain":[],"cooked":["run","test"],"original":["test"]}', npm_package_size_limit_5_limit: "20 KB", npm_package_size_limit_2_path: "packages/roomkit-react/dist/index.cjs.js", npm_package_scripts_build: "yarn build:only && yarn types:build", npm_package_devDependencies_tslib: "^2.2.0", npm_package_devDependencies_nx: "^14.5.1", npm_package_devDependencies_lint_staged: "^12.0.3", NX_CLI_SET: "true", npm_package_dependencies_uuid: "^8.3.2", npm_package_dependencies_react_virtualized_auto_sizer: "^1.0.7", npm_package_dependencies_lodash_merge: "^4.6.2", npm_package_dependencies_emoji_mart: "^5.2.2", GITHUB_WORKSPACE: "/home/runner/work/web-sdks/web-sdks", ACCEPT_EULA: "Y", GITHUB_JOB: "publish_packages", RUNNER_PERFLOG: "/home/runner/perflog", npm_package_size_limit_6_limit: "150 KB", npm_package_size_limit_3_path: "packages/roomkit-react/dist/index.js", npm_package_devDependencies_cypress: "^9.5.2", npm_package_devDependencies_rollup_plugin_esbuild: "^5.0.0", GITHUB_SHA: "1ac0f11a034d8e0aed06479e20671c86bffd77f8", GITHUB_RUN_ATTEMPT: "1", npm_package_size_limit_7_limit: "100 KB", npm_package_size_limit_4_path: "packages/hms-virtual-background/dist/index.cjs.js", npm_config_version_git_tag: "true", npm_config_version_git_sign: "", npm_package_dependencies_qrcode_react: "^3.1.0", GITHUB_REF: "refs/heads/publish-alpha", GITHUB_ACTOR: "github-actions[bot]", ANDROID_SDK_ROOT: "/usr/local/lib/android/sdk", npm_package_license: "MIT", npm_package_size_limit_5_path: "packages/hms-virtual-background/dist/index.js", npm_config_strict_ssl: "true", LEIN_HOME: "/usr/local/lib/lein", npm_package_size_limit_6_path: "packages/react-icons/dist/index.cjs.js", npm_package_scripts_format: "prettier -w src/**", npm_package_devDependencies_eslint_plugin_prettier: "^4.0.0", npm_package_devDependencies_eslint_config_react_app: "^7.0.0", NX_TASK_TARGET_PROJECT: "@100mslive/roomkit-react", GITHUB_PATH: "/home/runner/work/_temp/_runner_file_commands/add_path_99ff87f3-70ec-4a4f-affe-f5887196edd9", JAVA_HOME: "/usr/lib/jvm/temurin-11-jdk-amd64", PWD: "/home/runner/work/web-sdks/web-sdks/packages/roomkit-react", GITHUB_ACTOR_ID: "41898282", RUNNER_WORKSPACE: "/home/runner/work/web-sdks", npm_execpath: "/usr/local/lib/node_modules/yarn/bin/yarn.js", npm_package_size_limit_7_path: "packages/react-icons/dist/index.js", npm_package_scripts_ybys: "yarn && yarn build --no-private && yarn storybook", npm_package_dependencies__radix_ui_react_progress: "1.0.0", HOMEBREW_CLEANUP_PERIODIC_FULL_DAYS: "3650", STATS_TIS: "mining", GITHUB_EVENT_NAME: "workflow_dispatch", HOMEBREW_NO_AUTO_UPDATE: "1", ANDROID_HOME: "/usr/local/lib/android/sdk", GITHUB_SERVER_URL: "https://github.com", GECKOWEBDRIVER: "/usr/local/share/gecko_driver", LEIN_JAR: "/usr/local/lib/lein/self-installs/leiningen-2.11.2-standalone.jar", GHCUP_INSTALL_BASE_PREFIX: "/usr/local", GITHUB_OUTPUT: "/home/runner/work/_temp/_runner_file_commands/set_output_99ff87f3-70ec-4a4f-affe-f5887196edd9", npm_package_scripts_prestart: "rm -rf dist && yarn types:build", npm_package_author_name: "100ms", EDGEWEBDRIVER: "/usr/local/share/edge_driver", STATS_EXT: "true", npm_package_scripts_build_storybook: "sb build", npm_package_devDependencies_postcss: "^8.4.5", npm_package_devDependencies_esbuild: "^0.18.13", npm_config_save_prefix: "^", npm_config_ignore_optional: "", npm_package_dependencies_worker_timers: "^7.0.40", npm_package_typings: "dist/index.d.ts", ANDROID_NDK: "/usr/local/lib/android/sdk/ndk/25.2.9519653", SGX_AESM_ADDR: "1", CHROME_BIN: "/usr/bin/google-chrome", npm_package_scripts_storybook: "sb dev -p 6006", npm_package_devDependencies_esbuild_plugin_postcss2: "0.1.1", npm_package_dependencies_react_swipeable: "^7.0.1", npm_package_devDependencies_babel_plugin_react_require: "3.1.3", npm_package_devDependencies__storybook_testing_library: "^0.2.0", npm_package_devDependencies__storybook_addon_essentials: "^7.0.27", SELENIUM_JAR_PATH: "/usr/share/java/selenium-server.jar", STATS_EXTP: "https://provjobdsettingscdn.blob.core.windows.net/settings/provjobdsettings-0.5.172+1/provjobd.data", npm_package_scripts_reactsdk: "cd packages/react-sdk && yarn start", npm_package_dependencies_react_use: "^17.4.0", npm_package_dependencies__radix_ui_react_collapsible: "1.0.0", npm_package_devDependencies_storybook_dark_mode: "^3.0.0", npm_package_devDependencies__storybook_react: "^7.0.27", INIT_CWD: "/home/runner/work/web-sdks/web-sdks", ANDROID_NDK_HOME: "/usr/local/lib/android/sdk/ndk/25.2.9519653", GITHUB_STEP_SUMMARY: "/home/runner/work/_temp/_runner_file_commands/step_summary_99ff87f3-70ec-4a4f-affe-f5887196edd9" };
|
|
112
112
|
}
|
|
113
113
|
});
|
|
114
114
|
|
|
@@ -19631,7 +19631,7 @@ var init_dist = __esm({
|
|
|
19631
19631
|
};
|
|
19632
19632
|
_a7 = (a2, e) => () => (e || a2((e = { exports: {} }).exports, e), e.exports);
|
|
19633
19633
|
nr = _a7((yc, Wa) => {
|
|
19634
|
-
Wa.exports = { version: "0.12.8-alpha.
|
|
19634
|
+
Wa.exports = { version: "0.12.8-alpha.4", license: "MIT", repository: { type: "git", url: "https://github.com/100mslive/web-sdks.git", directory: "packages/hms-video-store" }, main: "dist/index.cjs.js", module: "dist/index.js", typings: "dist/index.d.ts", files: ["dist", "src"], engines: { node: ">=12" }, exports: { ".": { require: "./dist/index.cjs.js", import: "./dist/index.js", default: "./dist/index.js" } }, sideEffects: false, scripts: { prestart: "rm -rf dist && yarn types:build", start: 'concurrently "yarn dev" "yarn types"', dev: "node ../../scripts/dev", "build:only": "node ../../scripts/build", build: "yarn build:only && yarn types:build", types: "tsc -w", "types:build": "tsc -p tsconfig.json", format: "prettier --write src/**/*.ts", test: "jest --maxWorkers=1", "test:watch": "jest --watch", "test:coverage": "jest --coverage", lint: "eslint -c ../../.eslintrc .", "lint:fix": "yarn lint --fix", prepare: "yarn build", size: "size-limit", analyze: "size-limit --why", docs: "rm -rf ./docs && typedoc && rm -f ./docs/README.md && mkdir ./docs/home &&mv ./docs/modules.md ./docs/home/content.md && node ../../scripts/docs-store && npx prettier --write './docs/**/*'" }, name: "@100mslive/hms-video-store", author: "100ms", dependencies: { eventemitter2: "^6.4.9", immer: "^9.0.6", "lodash.isequal": "^4.5.0", reselect: "4.0.0", "sdp-transform": "^2.14.1", "ua-parser-js": "^1.0.1", uuid: "^8.3.2", "webrtc-adapter": "^8.0.0", zustand: "3.5.7" }, devDependencies: { "@types/dom-screen-wake-lock": "^1.0.1", "@types/lodash.isequal": "^4.5.8", "@types/sdp-transform": "^2.4.4", "@types/ua-parser-js": "^0.7.36", "@types/uuid": "^8.3.0", "jest-canvas-mock": "^2.3.1", "jsdom-worker": "^0.3.0", tslib: "^2.2.0" }, description: "@100mslive Core SDK which abstracts the complexities of webRTC while providing a reactive store for data management with a unidirectional data flow", keywords: ["video", "webrtc", "conferencing", "100ms"] };
|
|
19635
19635
|
});
|
|
19636
19636
|
er = ((n) => (n.Disconnected = "Disconnected", n.Preview = "Preview", n.Connecting = "Connecting", n.Connected = "Connected", n.Reconnecting = "Reconnecting", n.Disconnecting = "Disconnecting", n.Failed = "Failed", n))(er || {});
|
|
19637
19637
|
Na = ((e) => (e.CHAT = "chat", e))(Na || {});
|
|
@@ -30730,18 +30730,244 @@ var init_WaitingView = __esm({
|
|
|
30730
30730
|
}
|
|
30731
30731
|
});
|
|
30732
30732
|
|
|
30733
|
+
// src/Prebuilt/plugins/CaptionsViewer.tsx
|
|
30734
|
+
var import_react182, import_react_use40, import_react_sdk97, SimpleQueue, Queue, CaptionMaintainerQueue, TranscriptView, CaptionsViewer;
|
|
30735
|
+
var init_CaptionsViewer = __esm({
|
|
30736
|
+
"src/Prebuilt/plugins/CaptionsViewer.tsx"() {
|
|
30737
|
+
"use strict";
|
|
30738
|
+
init_define_process_env();
|
|
30739
|
+
import_react182 = __toESM(require("react"));
|
|
30740
|
+
import_react_use40 = require("react-use");
|
|
30741
|
+
import_react_sdk97 = require("@100mslive/react-sdk");
|
|
30742
|
+
init_Layout();
|
|
30743
|
+
init_Text2();
|
|
30744
|
+
init_Theme();
|
|
30745
|
+
init_useSidepane();
|
|
30746
|
+
init_useUISettings();
|
|
30747
|
+
init_useRoomLayoutScreen();
|
|
30748
|
+
init_constants();
|
|
30749
|
+
SimpleQueue = class {
|
|
30750
|
+
constructor(capacity = 3, MAX_STORAGE_TIME = 5e3) {
|
|
30751
|
+
this.capacity = capacity;
|
|
30752
|
+
this.MAX_STORAGE_TIME = MAX_STORAGE_TIME;
|
|
30753
|
+
this.storage = [];
|
|
30754
|
+
}
|
|
30755
|
+
enqueue(data3) {
|
|
30756
|
+
var _a8;
|
|
30757
|
+
if (this.size() === this.capacity && this.storage[this.size() - 1].final) {
|
|
30758
|
+
this.dequeue(this.storage[this.size() - 1]);
|
|
30759
|
+
}
|
|
30760
|
+
if (this.size() === 0) {
|
|
30761
|
+
this.storage.push(data3);
|
|
30762
|
+
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
30763
|
+
return;
|
|
30764
|
+
}
|
|
30765
|
+
if (this.size() > 0 && ((_a8 = this.storage[this.size() - 1]) == null ? void 0 : _a8.final) === true) {
|
|
30766
|
+
this.storage.push(data3);
|
|
30767
|
+
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
30768
|
+
return;
|
|
30769
|
+
}
|
|
30770
|
+
this.storage[this.size() - 1].transcript = data3.transcript;
|
|
30771
|
+
this.storage[this.size() - 1].final = data3.final;
|
|
30772
|
+
this.storage[this.size() - 1].end = data3.end;
|
|
30773
|
+
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
30774
|
+
}
|
|
30775
|
+
addTimeout(item, isFinal) {
|
|
30776
|
+
if (!isFinal) {
|
|
30777
|
+
return;
|
|
30778
|
+
}
|
|
30779
|
+
item.timeout = setTimeout(() => {
|
|
30780
|
+
this.dequeue(item);
|
|
30781
|
+
}, this.MAX_STORAGE_TIME);
|
|
30782
|
+
}
|
|
30783
|
+
dequeue(item) {
|
|
30784
|
+
const index = this.storage.indexOf(item);
|
|
30785
|
+
if (index === -1) {
|
|
30786
|
+
return void 0;
|
|
30787
|
+
}
|
|
30788
|
+
const removedItem = this.storage.splice(index, 1);
|
|
30789
|
+
if (removedItem.length <= 0) {
|
|
30790
|
+
return void 0;
|
|
30791
|
+
}
|
|
30792
|
+
this.clearTimeout(removedItem[0]);
|
|
30793
|
+
return item;
|
|
30794
|
+
}
|
|
30795
|
+
clearTimeout(item) {
|
|
30796
|
+
if (!item.timeout) {
|
|
30797
|
+
return;
|
|
30798
|
+
}
|
|
30799
|
+
clearTimeout(item.timeout);
|
|
30800
|
+
}
|
|
30801
|
+
peek() {
|
|
30802
|
+
if (this.size() <= 0) {
|
|
30803
|
+
return void 0;
|
|
30804
|
+
}
|
|
30805
|
+
return this.storage[0];
|
|
30806
|
+
}
|
|
30807
|
+
getTranscription() {
|
|
30808
|
+
let script = "";
|
|
30809
|
+
this.storage.forEach((value) => script += value.transcript + " ");
|
|
30810
|
+
return script;
|
|
30811
|
+
}
|
|
30812
|
+
reset() {
|
|
30813
|
+
this.storage.length = 0;
|
|
30814
|
+
}
|
|
30815
|
+
size() {
|
|
30816
|
+
return this.storage.length;
|
|
30817
|
+
}
|
|
30818
|
+
};
|
|
30819
|
+
Queue = class {
|
|
30820
|
+
constructor(capacity = 3) {
|
|
30821
|
+
this.capacity = capacity;
|
|
30822
|
+
this.storage = {};
|
|
30823
|
+
}
|
|
30824
|
+
enqueue(data3) {
|
|
30825
|
+
if (this.size() === this.capacity) {
|
|
30826
|
+
this.dequeue();
|
|
30827
|
+
}
|
|
30828
|
+
if (!this.storage[data3.peer_id]) {
|
|
30829
|
+
this.storage[data3.peer_id] = {
|
|
30830
|
+
peer_id: data3.peer_id,
|
|
30831
|
+
transcript: data3.transcript,
|
|
30832
|
+
final: data3.final,
|
|
30833
|
+
transcriptQueue: new SimpleQueue(),
|
|
30834
|
+
start: data3.start,
|
|
30835
|
+
end: data3.end
|
|
30836
|
+
};
|
|
30837
|
+
this.storage[data3.peer_id].transcriptQueue.enqueue(data3);
|
|
30838
|
+
return;
|
|
30839
|
+
}
|
|
30840
|
+
this.storage[data3.peer_id].transcriptQueue.enqueue(data3);
|
|
30841
|
+
}
|
|
30842
|
+
dequeue() {
|
|
30843
|
+
const key = Object.keys(this.storage).shift() || "";
|
|
30844
|
+
const captionData = this.storage[key];
|
|
30845
|
+
captionData.transcriptQueue.reset();
|
|
30846
|
+
delete this.storage[key];
|
|
30847
|
+
return captionData;
|
|
30848
|
+
}
|
|
30849
|
+
peek() {
|
|
30850
|
+
if (this.size() <= 0)
|
|
30851
|
+
return void 0;
|
|
30852
|
+
const key = Object.keys(this.storage).shift() || "";
|
|
30853
|
+
return this.storage[key];
|
|
30854
|
+
}
|
|
30855
|
+
findPeerData() {
|
|
30856
|
+
const keys = Object.keys(this.storage);
|
|
30857
|
+
const data3 = keys.map((key) => {
|
|
30858
|
+
const data4 = this.storage[key];
|
|
30859
|
+
const word = data4.transcriptQueue.getTranscription();
|
|
30860
|
+
return { [key]: word };
|
|
30861
|
+
});
|
|
30862
|
+
return data3;
|
|
30863
|
+
}
|
|
30864
|
+
size() {
|
|
30865
|
+
return Object.keys(this.storage).length;
|
|
30866
|
+
}
|
|
30867
|
+
};
|
|
30868
|
+
CaptionMaintainerQueue = class {
|
|
30869
|
+
constructor() {
|
|
30870
|
+
this.captionData = new Queue();
|
|
30871
|
+
}
|
|
30872
|
+
push(data3 = []) {
|
|
30873
|
+
data3.forEach((value) => {
|
|
30874
|
+
this.captionData.enqueue(value);
|
|
30875
|
+
});
|
|
30876
|
+
}
|
|
30877
|
+
};
|
|
30878
|
+
TranscriptView = ({ peer_id, data: data3 }) => {
|
|
30879
|
+
const peerName = (0, import_react_sdk97.useHMSStore)((0, import_react_sdk97.selectPeerNameByID)(peer_id)) || "Participant";
|
|
30880
|
+
data3 = data3.trim();
|
|
30881
|
+
if (!data3)
|
|
30882
|
+
return null;
|
|
30883
|
+
return /* @__PURE__ */ import_react182.default.createElement(
|
|
30884
|
+
Text,
|
|
30885
|
+
{
|
|
30886
|
+
variant: "body2",
|
|
30887
|
+
css: {
|
|
30888
|
+
fontWeight: "$normal"
|
|
30889
|
+
}
|
|
30890
|
+
},
|
|
30891
|
+
/* @__PURE__ */ import_react182.default.createElement("b", null, peerName, ": "),
|
|
30892
|
+
data3
|
|
30893
|
+
);
|
|
30894
|
+
};
|
|
30895
|
+
CaptionsViewer = () => {
|
|
30896
|
+
var _a8;
|
|
30897
|
+
const { elements, screenType } = useRoomLayoutConferencingScreen();
|
|
30898
|
+
const isMobile = (0, import_react_use40.useMedia)(config.media.md);
|
|
30899
|
+
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
30900
|
+
const showCaptionAtTop = ((_a8 = elements == null ? void 0 : elements.chat) == null ? void 0 : _a8.is_overlay) && isChatOpen && isMobile;
|
|
30901
|
+
const [captionQueue] = (0, import_react182.useState)(new CaptionMaintainerQueue());
|
|
30902
|
+
const [currentData, setCurrentData] = (0, import_react182.useState)([]);
|
|
30903
|
+
const isCaptionEnabled = useIsCaptionEnabled();
|
|
30904
|
+
(0, import_react182.useEffect)(() => {
|
|
30905
|
+
const timeInterval = setInterval(() => {
|
|
30906
|
+
var _a9;
|
|
30907
|
+
if (!captionQueue) {
|
|
30908
|
+
return;
|
|
30909
|
+
}
|
|
30910
|
+
const data3 = (_a9 = captionQueue.captionData) == null ? void 0 : _a9.findPeerData();
|
|
30911
|
+
setCurrentData(data3);
|
|
30912
|
+
}, 1e3);
|
|
30913
|
+
return () => clearInterval(timeInterval);
|
|
30914
|
+
}, [captionQueue]);
|
|
30915
|
+
(0, import_react_sdk97.useTranscript)({
|
|
30916
|
+
onTranscript: (data3) => {
|
|
30917
|
+
captionQueue && captionQueue.push(data3);
|
|
30918
|
+
}
|
|
30919
|
+
});
|
|
30920
|
+
const dataToShow = currentData.filter((data3) => {
|
|
30921
|
+
const key = Object.keys(data3)[0];
|
|
30922
|
+
if (data3[key]) {
|
|
30923
|
+
return true;
|
|
30924
|
+
}
|
|
30925
|
+
return false;
|
|
30926
|
+
});
|
|
30927
|
+
if (dataToShow.length <= 0 || screenType === "hls_live_streaming" || !isCaptionEnabled) {
|
|
30928
|
+
return null;
|
|
30929
|
+
}
|
|
30930
|
+
return /* @__PURE__ */ import_react182.default.createElement(
|
|
30931
|
+
Box,
|
|
30932
|
+
{
|
|
30933
|
+
css: {
|
|
30934
|
+
position: "absolute",
|
|
30935
|
+
w: isMobile ? "100%" : "40%",
|
|
30936
|
+
bottom: showCaptionAtTop ? "" : "0",
|
|
30937
|
+
top: showCaptionAtTop ? "0" : "",
|
|
30938
|
+
left: isMobile ? 0 : "50%",
|
|
30939
|
+
transform: isMobile ? "" : "translateX(-50%)",
|
|
30940
|
+
background: "#000000A3",
|
|
30941
|
+
overflow: "clip",
|
|
30942
|
+
zIndex: 10,
|
|
30943
|
+
height: "fit-content",
|
|
30944
|
+
r: "$1",
|
|
30945
|
+
p: "$6",
|
|
30946
|
+
transition: "bottom 0.3s ease-in-out",
|
|
30947
|
+
"&:empty": { display: "none" }
|
|
30948
|
+
}
|
|
30949
|
+
},
|
|
30950
|
+
/* @__PURE__ */ import_react182.default.createElement(Flex, { direction: "column" }, dataToShow.map((data3, index) => {
|
|
30951
|
+
const key = Object.keys(data3)[0];
|
|
30952
|
+
return /* @__PURE__ */ import_react182.default.createElement(TranscriptView, { key: index, peer_id: key, data: data3[key] });
|
|
30953
|
+
}))
|
|
30954
|
+
);
|
|
30955
|
+
};
|
|
30956
|
+
}
|
|
30957
|
+
});
|
|
30958
|
+
|
|
30733
30959
|
// src/Prebuilt/components/hooks/useCloseScreenshareWhiteboard.tsx
|
|
30734
|
-
var
|
|
30960
|
+
var import_react183, import_react_sdk98, useCloseScreenshareWhiteboard;
|
|
30735
30961
|
var init_useCloseScreenshareWhiteboard = __esm({
|
|
30736
30962
|
"src/Prebuilt/components/hooks/useCloseScreenshareWhiteboard.tsx"() {
|
|
30737
30963
|
"use strict";
|
|
30738
30964
|
init_define_process_env();
|
|
30739
|
-
|
|
30740
|
-
|
|
30965
|
+
import_react183 = require("react");
|
|
30966
|
+
import_react_sdk98 = require("@100mslive/react-sdk");
|
|
30741
30967
|
useCloseScreenshareWhiteboard = () => {
|
|
30742
|
-
const peerSharing = (0,
|
|
30743
|
-
const { isOwner: isWhiteboardOwner, toggle: toggleWhiteboard } = (0,
|
|
30744
|
-
(0,
|
|
30968
|
+
const peerSharing = (0, import_react_sdk98.useHMSStore)(import_react_sdk98.selectPeerScreenSharing);
|
|
30969
|
+
const { isOwner: isWhiteboardOwner, toggle: toggleWhiteboard } = (0, import_react_sdk98.useWhiteboard)();
|
|
30970
|
+
(0, import_react183.useEffect)(() => {
|
|
30745
30971
|
if (isWhiteboardOwner && peerSharing) {
|
|
30746
30972
|
toggleWhiteboard == null ? void 0 : toggleWhiteboard();
|
|
30747
30973
|
}
|
|
@@ -30753,7 +30979,7 @@ var init_useCloseScreenshareWhiteboard = __esm({
|
|
|
30753
30979
|
// src/Prebuilt/components/HlsStatsOverlay.jsx
|
|
30754
30980
|
function HlsStatsOverlay({ hlsStatsState, onClose }) {
|
|
30755
30981
|
var _a8, _b7, _c;
|
|
30756
|
-
return /* @__PURE__ */
|
|
30982
|
+
return /* @__PURE__ */ import_react184.default.createElement(
|
|
30757
30983
|
Flex,
|
|
30758
30984
|
{
|
|
30759
30985
|
css: {
|
|
@@ -30767,8 +30993,8 @@ function HlsStatsOverlay({ hlsStatsState, onClose }) {
|
|
|
30767
30993
|
},
|
|
30768
30994
|
direction: "column"
|
|
30769
30995
|
},
|
|
30770
|
-
/* @__PURE__ */
|
|
30771
|
-
/* @__PURE__ */
|
|
30996
|
+
/* @__PURE__ */ import_react184.default.createElement(IconButton_default, { css: { position: "absolute", top: "$2", right: "$2" }, onClick: onClose }, /* @__PURE__ */ import_react184.default.createElement(import_react_icons86.CrossIcon, null)),
|
|
30997
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "URL" }, /* @__PURE__ */ import_react184.default.createElement(Flex, { align: "center" }, /* @__PURE__ */ import_react184.default.createElement(
|
|
30772
30998
|
"a",
|
|
30773
30999
|
{
|
|
30774
31000
|
style: { cursor: "pointer", textDecoration: "underline" },
|
|
@@ -30778,12 +31004,12 @@ function HlsStatsOverlay({ hlsStatsState, onClose }) {
|
|
|
30778
31004
|
},
|
|
30779
31005
|
"Stream url"
|
|
30780
31006
|
))),
|
|
30781
|
-
/* @__PURE__ */
|
|
30782
|
-
/* @__PURE__ */
|
|
30783
|
-
/* @__PURE__ */
|
|
30784
|
-
/* @__PURE__ */
|
|
30785
|
-
/* @__PURE__ */
|
|
30786
|
-
/* @__PURE__ */
|
|
31007
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "Video size" }, ` ${(_a8 = hlsStatsState == null ? void 0 : hlsStatsState.videoSize) == null ? void 0 : _a8.width}x${(_b7 = hlsStatsState == null ? void 0 : hlsStatsState.videoSize) == null ? void 0 : _b7.height}`),
|
|
31008
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "Buffer duration" }, (_c = hlsStatsState == null ? void 0 : hlsStatsState.bufferedDuration) == null ? void 0 : _c.toFixed(2), " "),
|
|
31009
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "Connection speed" }, `${((hlsStatsState == null ? void 0 : hlsStatsState.bandwidthEstimate) / (1e3 * 1e3)).toFixed(2)} Mbps`),
|
|
31010
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "Bitrate" }, `${((hlsStatsState == null ? void 0 : hlsStatsState.bitrate) / (1e3 * 1e3)).toFixed(2)} Mbps`),
|
|
31011
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "distance from live" }, getDurationFromSeconds(hlsStatsState.distanceFromLive / 1e3)),
|
|
31012
|
+
/* @__PURE__ */ import_react184.default.createElement(HlsStatsRow, { label: "Dropped frames" }, hlsStatsState == null ? void 0 : hlsStatsState.droppedFrames)
|
|
30787
31013
|
);
|
|
30788
31014
|
}
|
|
30789
31015
|
function getDurationFromSeconds(timeInSeconds) {
|
|
@@ -30801,18 +31027,18 @@ function getDurationFromSeconds(timeInSeconds) {
|
|
|
30801
31027
|
}
|
|
30802
31028
|
return videoTimeStr;
|
|
30803
31029
|
}
|
|
30804
|
-
var
|
|
31030
|
+
var import_react184, import_react_icons86, HlsStatsRow;
|
|
30805
31031
|
var init_HlsStatsOverlay = __esm({
|
|
30806
31032
|
"src/Prebuilt/components/HlsStatsOverlay.jsx"() {
|
|
30807
31033
|
"use strict";
|
|
30808
31034
|
init_define_process_env();
|
|
30809
|
-
|
|
31035
|
+
import_react184 = __toESM(require("react"));
|
|
30810
31036
|
import_react_icons86 = require("@100mslive/react-icons");
|
|
30811
31037
|
init_Layout();
|
|
30812
31038
|
init_Text2();
|
|
30813
31039
|
init_IconButton3();
|
|
30814
|
-
HlsStatsRow = (0,
|
|
30815
|
-
return /* @__PURE__ */
|
|
31040
|
+
HlsStatsRow = (0, import_react184.memo)(({ label, children }) => {
|
|
31041
|
+
return /* @__PURE__ */ import_react184.default.createElement(Flex, { gap: 4, justify: "center", css: { width: "100%" } }, /* @__PURE__ */ import_react184.default.createElement(
|
|
30816
31042
|
Text,
|
|
30817
31043
|
{
|
|
30818
31044
|
css: {
|
|
@@ -30823,7 +31049,7 @@ var init_HlsStatsOverlay = __esm({
|
|
|
30823
31049
|
}
|
|
30824
31050
|
},
|
|
30825
31051
|
label
|
|
30826
|
-
), /* @__PURE__ */
|
|
31052
|
+
), /* @__PURE__ */ import_react184.default.createElement(
|
|
30827
31053
|
Text,
|
|
30828
31054
|
{
|
|
30829
31055
|
css: {
|
|
@@ -30870,16 +31096,16 @@ var init_Controls = __esm({
|
|
|
30870
31096
|
});
|
|
30871
31097
|
|
|
30872
31098
|
// src/Prebuilt/components/HMSVideo/HMSVideo.jsx
|
|
30873
|
-
var
|
|
31099
|
+
var import_react185, HMSVideo;
|
|
30874
31100
|
var init_HMSVideo = __esm({
|
|
30875
31101
|
"src/Prebuilt/components/HMSVideo/HMSVideo.jsx"() {
|
|
30876
31102
|
"use strict";
|
|
30877
31103
|
init_define_process_env();
|
|
30878
|
-
|
|
31104
|
+
import_react185 = __toESM(require("react"));
|
|
30879
31105
|
init_Layout();
|
|
30880
|
-
HMSVideo = (0,
|
|
31106
|
+
HMSVideo = (0, import_react185.forwardRef)((_a8, videoRef) => {
|
|
30881
31107
|
var _b7 = _a8, { children } = _b7, props = __objRest(_b7, ["children"]);
|
|
30882
|
-
return /* @__PURE__ */
|
|
31108
|
+
return /* @__PURE__ */ import_react185.default.createElement(
|
|
30883
31109
|
Flex,
|
|
30884
31110
|
__spreadValues({
|
|
30885
31111
|
"data-testid": "hms-video",
|
|
@@ -30914,7 +31140,7 @@ var init_HMSVideo = __esm({
|
|
|
30914
31140
|
},
|
|
30915
31141
|
direction: "column"
|
|
30916
31142
|
}, props),
|
|
30917
|
-
/* @__PURE__ */
|
|
31143
|
+
/* @__PURE__ */ import_react185.default.createElement(
|
|
30918
31144
|
"video",
|
|
30919
31145
|
{
|
|
30920
31146
|
style: {
|
|
@@ -30936,29 +31162,29 @@ var init_HMSVideo = __esm({
|
|
|
30936
31162
|
});
|
|
30937
31163
|
|
|
30938
31164
|
// src/Prebuilt/components/HMSVideo/PlayerContext.tsx
|
|
30939
|
-
var
|
|
31165
|
+
var import_react186, HMSPlayerContext, useHMSPlayerContext;
|
|
30940
31166
|
var init_PlayerContext = __esm({
|
|
30941
31167
|
"src/Prebuilt/components/HMSVideo/PlayerContext.tsx"() {
|
|
30942
31168
|
"use strict";
|
|
30943
31169
|
init_define_process_env();
|
|
30944
|
-
|
|
30945
|
-
HMSPlayerContext =
|
|
31170
|
+
import_react186 = __toESM(require("react"));
|
|
31171
|
+
HMSPlayerContext = import_react186.default.createContext({
|
|
30946
31172
|
hlsPlayer: void 0
|
|
30947
31173
|
});
|
|
30948
31174
|
useHMSPlayerContext = () => {
|
|
30949
|
-
const context = (0,
|
|
31175
|
+
const context = (0, import_react186.useContext)(HMSPlayerContext);
|
|
30950
31176
|
return context;
|
|
30951
31177
|
};
|
|
30952
31178
|
}
|
|
30953
31179
|
});
|
|
30954
31180
|
|
|
30955
31181
|
// src/Prebuilt/components/HMSVideo/PlayPauseButton.tsx
|
|
30956
|
-
var
|
|
31182
|
+
var import_react187, import_react_icons87, PlayPauseButton;
|
|
30957
31183
|
var init_PlayPauseButton = __esm({
|
|
30958
31184
|
"src/Prebuilt/components/HMSVideo/PlayPauseButton.tsx"() {
|
|
30959
31185
|
"use strict";
|
|
30960
31186
|
init_define_process_env();
|
|
30961
|
-
|
|
31187
|
+
import_react187 = __toESM(require("react"));
|
|
30962
31188
|
import_react_icons87 = require("@100mslive/react-icons");
|
|
30963
31189
|
init_src();
|
|
30964
31190
|
init_PlayerContext();
|
|
@@ -30972,18 +31198,18 @@ var init_PlayPauseButton = __esm({
|
|
|
30972
31198
|
event == null ? void 0 : event.stopPropagation();
|
|
30973
31199
|
isPaused ? yield hlsPlayer2 == null ? void 0 : hlsPlayer2.play() : hlsPlayer2 == null ? void 0 : hlsPlayer2.pause();
|
|
30974
31200
|
});
|
|
30975
|
-
return /* @__PURE__ */
|
|
31201
|
+
return /* @__PURE__ */ import_react187.default.createElement(Tooltip, { title: isPaused ? "Play" : "Pause", side: "top" }, /* @__PURE__ */ import_react187.default.createElement(IconButton, { onClick, "data-testid": "play_pause_btn" }, isPaused ? /* @__PURE__ */ import_react187.default.createElement(import_react_icons87.PlayIcon, { width, height }) : /* @__PURE__ */ import_react187.default.createElement(import_react_icons87.PauseIcon, { width, height })));
|
|
30976
31202
|
};
|
|
30977
31203
|
}
|
|
30978
31204
|
});
|
|
30979
31205
|
|
|
30980
31206
|
// src/Prebuilt/components/HMSVideo/SeekControl.tsx
|
|
30981
|
-
var
|
|
31207
|
+
var import_react188, SeekControl;
|
|
30982
31208
|
var init_SeekControl = __esm({
|
|
30983
31209
|
"src/Prebuilt/components/HMSVideo/SeekControl.tsx"() {
|
|
30984
31210
|
"use strict";
|
|
30985
31211
|
init_define_process_env();
|
|
30986
|
-
|
|
31212
|
+
import_react188 = __toESM(require("react"));
|
|
30987
31213
|
init_src();
|
|
30988
31214
|
SeekControl = ({
|
|
30989
31215
|
title,
|
|
@@ -30991,19 +31217,19 @@ var init_SeekControl = __esm({
|
|
|
30991
31217
|
children,
|
|
30992
31218
|
css: css2
|
|
30993
31219
|
}) => {
|
|
30994
|
-
return /* @__PURE__ */
|
|
31220
|
+
return /* @__PURE__ */ import_react188.default.createElement(Tooltip, { title, side: "top" }, /* @__PURE__ */ import_react188.default.createElement(IconButton, { onClick, "data-testid": "backward_forward_arrow_btn", css: css2 }, children));
|
|
30995
31221
|
};
|
|
30996
31222
|
}
|
|
30997
31223
|
});
|
|
30998
31224
|
|
|
30999
31225
|
// src/Prebuilt/components/HMSVideo/PlayPauseSeekControls.tsx
|
|
31000
|
-
var
|
|
31226
|
+
var import_react189, import_react_use41, import_react_icons88, PlayPauseSeekControls, PlayPauseSeekOverlayControls;
|
|
31001
31227
|
var init_PlayPauseSeekControls = __esm({
|
|
31002
31228
|
"src/Prebuilt/components/HMSVideo/PlayPauseSeekControls.tsx"() {
|
|
31003
31229
|
"use strict";
|
|
31004
31230
|
init_define_process_env();
|
|
31005
|
-
|
|
31006
|
-
|
|
31231
|
+
import_react189 = __toESM(require("react"));
|
|
31232
|
+
import_react_use41 = require("react-use");
|
|
31007
31233
|
import_react_icons88 = require("@100mslive/react-icons");
|
|
31008
31234
|
init_Layout();
|
|
31009
31235
|
init_Text2();
|
|
@@ -31015,7 +31241,7 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31015
31241
|
isPaused,
|
|
31016
31242
|
onSeekTo
|
|
31017
31243
|
}) => {
|
|
31018
|
-
return /* @__PURE__ */
|
|
31244
|
+
return /* @__PURE__ */ import_react189.default.createElement(import_react189.default.Fragment, null, /* @__PURE__ */ import_react189.default.createElement(
|
|
31019
31245
|
SeekControl,
|
|
31020
31246
|
{
|
|
31021
31247
|
onClick: (e) => {
|
|
@@ -31024,8 +31250,8 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31024
31250
|
},
|
|
31025
31251
|
title: "backward"
|
|
31026
31252
|
},
|
|
31027
|
-
/* @__PURE__ */
|
|
31028
|
-
), /* @__PURE__ */
|
|
31253
|
+
/* @__PURE__ */ import_react189.default.createElement(import_react_icons88.BackwardArrowIcon, { width: 20, height: 20 })
|
|
31254
|
+
), /* @__PURE__ */ import_react189.default.createElement(PlayPauseButton, { isPaused }), /* @__PURE__ */ import_react189.default.createElement(
|
|
31029
31255
|
SeekControl,
|
|
31030
31256
|
{
|
|
31031
31257
|
onClick: (e) => {
|
|
@@ -31034,7 +31260,7 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31034
31260
|
},
|
|
31035
31261
|
title: "forward"
|
|
31036
31262
|
},
|
|
31037
|
-
/* @__PURE__ */
|
|
31263
|
+
/* @__PURE__ */ import_react189.default.createElement(import_react_icons88.ForwardArrowIcon, { width: 20, height: 20 })
|
|
31038
31264
|
));
|
|
31039
31265
|
};
|
|
31040
31266
|
PlayPauseSeekOverlayControls = ({
|
|
@@ -31042,10 +31268,10 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31042
31268
|
showControls,
|
|
31043
31269
|
hoverControlsVisible
|
|
31044
31270
|
}) => {
|
|
31045
|
-
const isMobile = (0,
|
|
31271
|
+
const isMobile = (0, import_react_use41.useMedia)(config.media.md);
|
|
31046
31272
|
const isLandscape = useIsLandscape();
|
|
31047
31273
|
if (!isMobile && !isLandscape) {
|
|
31048
|
-
return /* @__PURE__ */
|
|
31274
|
+
return /* @__PURE__ */ import_react189.default.createElement(import_react189.default.Fragment, null, /* @__PURE__ */ import_react189.default.createElement(
|
|
31049
31275
|
Flex,
|
|
31050
31276
|
{
|
|
31051
31277
|
css: {
|
|
@@ -31058,9 +31284,9 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31058
31284
|
direction: "column",
|
|
31059
31285
|
align: "center"
|
|
31060
31286
|
},
|
|
31061
|
-
/* @__PURE__ */
|
|
31062
|
-
/* @__PURE__ */
|
|
31063
|
-
), /* @__PURE__ */
|
|
31287
|
+
/* @__PURE__ */ import_react189.default.createElement(SeekControl, { title: "backward" }, /* @__PURE__ */ import_react189.default.createElement(import_react_icons88.BackwardArrowIcon, { width: 52, height: 52 })),
|
|
31288
|
+
/* @__PURE__ */ import_react189.default.createElement(Text, { variant: "body2", css: { fontWeight: "$regular" } }, "10 secs")
|
|
31289
|
+
), /* @__PURE__ */ import_react189.default.createElement(
|
|
31064
31290
|
Box,
|
|
31065
31291
|
{
|
|
31066
31292
|
css: {
|
|
@@ -31070,8 +31296,8 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31070
31296
|
opacity: hoverControlsVisible.pausePlay ? `1` : "0"
|
|
31071
31297
|
}
|
|
31072
31298
|
},
|
|
31073
|
-
/* @__PURE__ */
|
|
31074
|
-
), /* @__PURE__ */
|
|
31299
|
+
/* @__PURE__ */ import_react189.default.createElement(PlayPauseButton, { isPaused, width: 48, height: 48 })
|
|
31300
|
+
), /* @__PURE__ */ import_react189.default.createElement(
|
|
31075
31301
|
Flex,
|
|
31076
31302
|
{
|
|
31077
31303
|
css: {
|
|
@@ -31084,11 +31310,11 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31084
31310
|
direction: "column",
|
|
31085
31311
|
align: "center"
|
|
31086
31312
|
},
|
|
31087
|
-
/* @__PURE__ */
|
|
31088
|
-
/* @__PURE__ */
|
|
31313
|
+
/* @__PURE__ */ import_react189.default.createElement(SeekControl, { title: "forward" }, /* @__PURE__ */ import_react189.default.createElement(import_react_icons88.ForwardArrowIcon, { width: 52, height: 52 })),
|
|
31314
|
+
/* @__PURE__ */ import_react189.default.createElement(Text, { variant: "body2", css: { fontWeight: "$regular" } }, "10 secs")
|
|
31089
31315
|
));
|
|
31090
31316
|
}
|
|
31091
|
-
return /* @__PURE__ */
|
|
31317
|
+
return /* @__PURE__ */ import_react189.default.createElement(
|
|
31092
31318
|
Flex,
|
|
31093
31319
|
{
|
|
31094
31320
|
align: "center",
|
|
@@ -31104,7 +31330,7 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31104
31330
|
opacity: showControls ? `1` : "0"
|
|
31105
31331
|
}
|
|
31106
31332
|
},
|
|
31107
|
-
/* @__PURE__ */
|
|
31333
|
+
/* @__PURE__ */ import_react189.default.createElement(
|
|
31108
31334
|
SeekControl,
|
|
31109
31335
|
{
|
|
31110
31336
|
title: "backward",
|
|
@@ -31113,9 +31339,9 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31113
31339
|
opacity: hoverControlsVisible.seekBackward ? `1` : "0"
|
|
31114
31340
|
}
|
|
31115
31341
|
},
|
|
31116
|
-
/* @__PURE__ */
|
|
31342
|
+
/* @__PURE__ */ import_react189.default.createElement(import_react_icons88.BackwardArrowIcon, { width: 32, height: 32 })
|
|
31117
31343
|
),
|
|
31118
|
-
/* @__PURE__ */
|
|
31344
|
+
/* @__PURE__ */ import_react189.default.createElement(
|
|
31119
31345
|
Box,
|
|
31120
31346
|
{
|
|
31121
31347
|
css: {
|
|
@@ -31123,9 +31349,9 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31123
31349
|
r: "$round"
|
|
31124
31350
|
}
|
|
31125
31351
|
},
|
|
31126
|
-
/* @__PURE__ */
|
|
31352
|
+
/* @__PURE__ */ import_react189.default.createElement(PlayPauseButton, { isPaused, width: 48, height: 48 })
|
|
31127
31353
|
),
|
|
31128
|
-
/* @__PURE__ */
|
|
31354
|
+
/* @__PURE__ */ import_react189.default.createElement(
|
|
31129
31355
|
SeekControl,
|
|
31130
31356
|
{
|
|
31131
31357
|
title: "forward",
|
|
@@ -31134,7 +31360,7 @@ var init_PlayPauseSeekControls = __esm({
|
|
|
31134
31360
|
opacity: hoverControlsVisible.seekForward ? `1` : "0"
|
|
31135
31361
|
}
|
|
31136
31362
|
},
|
|
31137
|
-
/* @__PURE__ */
|
|
31363
|
+
/* @__PURE__ */ import_react189.default.createElement(import_react_icons88.ForwardArrowIcon, { width: 32, height: 32 })
|
|
31138
31364
|
)
|
|
31139
31365
|
);
|
|
31140
31366
|
};
|
|
@@ -31177,12 +31403,12 @@ var init_utils6 = __esm({
|
|
|
31177
31403
|
});
|
|
31178
31404
|
|
|
31179
31405
|
// src/Prebuilt/components/HMSVideo/VideoProgress.tsx
|
|
31180
|
-
var
|
|
31406
|
+
var import_react190, VideoProgress;
|
|
31181
31407
|
var init_VideoProgress = __esm({
|
|
31182
31408
|
"src/Prebuilt/components/HMSVideo/VideoProgress.tsx"() {
|
|
31183
31409
|
"use strict";
|
|
31184
31410
|
init_define_process_env();
|
|
31185
|
-
|
|
31411
|
+
import_react190 = __toESM(require("react"));
|
|
31186
31412
|
init_src();
|
|
31187
31413
|
init_PlayerContext();
|
|
31188
31414
|
init_utils6();
|
|
@@ -31191,10 +31417,10 @@ var init_VideoProgress = __esm({
|
|
|
31191
31417
|
setSeekProgress
|
|
31192
31418
|
}) => {
|
|
31193
31419
|
const { hlsPlayer: hlsPlayer2 } = useHMSPlayerContext();
|
|
31194
|
-
const [videoProgress, setVideoProgress] = (0,
|
|
31195
|
-
const [bufferProgress, setBufferProgress] = (0,
|
|
31420
|
+
const [videoProgress, setVideoProgress] = (0, import_react190.useState)(0);
|
|
31421
|
+
const [bufferProgress, setBufferProgress] = (0, import_react190.useState)(0);
|
|
31196
31422
|
const videoEl = hlsPlayer2 == null ? void 0 : hlsPlayer2.getVideoElement();
|
|
31197
|
-
const setProgress = (0,
|
|
31423
|
+
const setProgress = (0, import_react190.useCallback)(() => {
|
|
31198
31424
|
var _a8;
|
|
31199
31425
|
if (!videoEl) {
|
|
31200
31426
|
return;
|
|
@@ -31212,13 +31438,13 @@ var init_VideoProgress = __esm({
|
|
|
31212
31438
|
setBufferProgress(bufferProgress2);
|
|
31213
31439
|
}
|
|
31214
31440
|
}, [videoEl]);
|
|
31215
|
-
const timeupdateHandler = (0,
|
|
31441
|
+
const timeupdateHandler = (0, import_react190.useCallback)(() => {
|
|
31216
31442
|
if (!videoEl || seekProgress) {
|
|
31217
31443
|
return;
|
|
31218
31444
|
}
|
|
31219
31445
|
setProgress();
|
|
31220
31446
|
}, [seekProgress, setProgress, videoEl]);
|
|
31221
|
-
(0,
|
|
31447
|
+
(0, import_react190.useEffect)(() => {
|
|
31222
31448
|
if (!videoEl) {
|
|
31223
31449
|
return;
|
|
31224
31450
|
}
|
|
@@ -31243,7 +31469,7 @@ var init_VideoProgress = __esm({
|
|
|
31243
31469
|
if (!videoEl) {
|
|
31244
31470
|
return null;
|
|
31245
31471
|
}
|
|
31246
|
-
return /* @__PURE__ */
|
|
31472
|
+
return /* @__PURE__ */ import_react190.default.createElement(Flex, { align: "center", css: { cursor: "pointer", h: "$2", alignSelf: "stretch" } }, /* @__PURE__ */ import_react190.default.createElement(
|
|
31247
31473
|
Slider,
|
|
31248
31474
|
{
|
|
31249
31475
|
id: "video-actual-rest",
|
|
@@ -31263,7 +31489,7 @@ var init_VideoProgress = __esm({
|
|
|
31263
31489
|
onPointerUp: () => setSeekProgress(false),
|
|
31264
31490
|
thumbStyles: { w: "$6", h: "$6" }
|
|
31265
31491
|
}
|
|
31266
|
-
), /* @__PURE__ */
|
|
31492
|
+
), /* @__PURE__ */ import_react190.default.createElement(
|
|
31267
31493
|
Box,
|
|
31268
31494
|
{
|
|
31269
31495
|
id: "video-buffer",
|
|
@@ -31282,20 +31508,20 @@ var init_VideoProgress = __esm({
|
|
|
31282
31508
|
});
|
|
31283
31509
|
|
|
31284
31510
|
// src/Prebuilt/components/HMSVideo/VideoTime.tsx
|
|
31285
|
-
var
|
|
31511
|
+
var import_react191, import_hls_player2, VideoTime;
|
|
31286
31512
|
var init_VideoTime = __esm({
|
|
31287
31513
|
"src/Prebuilt/components/HMSVideo/VideoTime.tsx"() {
|
|
31288
31514
|
"use strict";
|
|
31289
31515
|
init_define_process_env();
|
|
31290
|
-
|
|
31516
|
+
import_react191 = __toESM(require("react"));
|
|
31291
31517
|
import_hls_player2 = require("@100mslive/hls-player");
|
|
31292
31518
|
init_Text2();
|
|
31293
31519
|
init_PlayerContext();
|
|
31294
31520
|
init_utils6();
|
|
31295
31521
|
VideoTime = () => {
|
|
31296
31522
|
const { hlsPlayer: hlsPlayer2 } = useHMSPlayerContext();
|
|
31297
|
-
const [videoTime, setVideoTime] = (0,
|
|
31298
|
-
const updateTime = (0,
|
|
31523
|
+
const [videoTime, setVideoTime] = (0, import_react191.useState)(getDurationFromSeconds2(0));
|
|
31524
|
+
const updateTime = (0, import_react191.useCallback)(
|
|
31299
31525
|
(currentTime) => {
|
|
31300
31526
|
const videoEl = hlsPlayer2 == null ? void 0 : hlsPlayer2.getVideoElement();
|
|
31301
31527
|
if (videoEl) {
|
|
@@ -31307,7 +31533,7 @@ var init_VideoTime = __esm({
|
|
|
31307
31533
|
},
|
|
31308
31534
|
[hlsPlayer2]
|
|
31309
31535
|
);
|
|
31310
|
-
(0,
|
|
31536
|
+
(0, import_react191.useEffect)(() => {
|
|
31311
31537
|
const timeupdateHandler = (currentTime) => {
|
|
31312
31538
|
updateTime(currentTime);
|
|
31313
31539
|
};
|
|
@@ -31320,7 +31546,7 @@ var init_VideoTime = __esm({
|
|
|
31320
31546
|
hlsPlayer2 == null ? void 0 : hlsPlayer2.off(import_hls_player2.HMSHLSPlayerEvents.CURRENT_TIME, timeupdateHandler);
|
|
31321
31547
|
};
|
|
31322
31548
|
}, [hlsPlayer2, updateTime]);
|
|
31323
|
-
return hlsPlayer2 ? /* @__PURE__ */
|
|
31549
|
+
return hlsPlayer2 ? /* @__PURE__ */ import_react191.default.createElement(
|
|
31324
31550
|
Text,
|
|
31325
31551
|
{
|
|
31326
31552
|
variant: "body1",
|
|
@@ -31340,21 +31566,21 @@ var init_VideoTime = __esm({
|
|
|
31340
31566
|
});
|
|
31341
31567
|
|
|
31342
31568
|
// src/Prebuilt/components/HMSVideo/VolumeControl.tsx
|
|
31343
|
-
var
|
|
31569
|
+
var import_react192, import_react_icons89, VolumeControl, VolumeIcon;
|
|
31344
31570
|
var init_VolumeControl = __esm({
|
|
31345
31571
|
"src/Prebuilt/components/HMSVideo/VolumeControl.tsx"() {
|
|
31346
31572
|
"use strict";
|
|
31347
31573
|
init_define_process_env();
|
|
31348
|
-
|
|
31574
|
+
import_react192 = __toESM(require("react"));
|
|
31349
31575
|
import_react_icons89 = require("@100mslive/react-icons");
|
|
31350
31576
|
init_src();
|
|
31351
31577
|
init_PlayerContext();
|
|
31352
31578
|
VolumeControl = () => {
|
|
31353
31579
|
var _a8;
|
|
31354
31580
|
const { hlsPlayer: hlsPlayer2 } = useHMSPlayerContext();
|
|
31355
|
-
const [volume, setVolume] = (0,
|
|
31356
|
-
const [showSlider, setShowSlider] = (0,
|
|
31357
|
-
return /* @__PURE__ */
|
|
31581
|
+
const [volume, setVolume] = (0, import_react192.useState)((_a8 = hlsPlayer2 == null ? void 0 : hlsPlayer2.volume) != null ? _a8 : 100);
|
|
31582
|
+
const [showSlider, setShowSlider] = (0, import_react192.useState)(false);
|
|
31583
|
+
return /* @__PURE__ */ import_react192.default.createElement(
|
|
31358
31584
|
Flex,
|
|
31359
31585
|
{
|
|
31360
31586
|
align: "center",
|
|
@@ -31368,7 +31594,7 @@ var init_VolumeControl = __esm({
|
|
|
31368
31594
|
setShowSlider(false);
|
|
31369
31595
|
}
|
|
31370
31596
|
},
|
|
31371
|
-
/* @__PURE__ */
|
|
31597
|
+
/* @__PURE__ */ import_react192.default.createElement(
|
|
31372
31598
|
VolumeIcon,
|
|
31373
31599
|
{
|
|
31374
31600
|
volume,
|
|
@@ -31383,7 +31609,7 @@ var init_VolumeControl = __esm({
|
|
|
31383
31609
|
}
|
|
31384
31610
|
}
|
|
31385
31611
|
),
|
|
31386
|
-
/* @__PURE__ */
|
|
31612
|
+
/* @__PURE__ */ import_react192.default.createElement(
|
|
31387
31613
|
Slider,
|
|
31388
31614
|
{
|
|
31389
31615
|
css: {
|
|
@@ -31411,9 +31637,9 @@ var init_VolumeControl = __esm({
|
|
|
31411
31637
|
};
|
|
31412
31638
|
VolumeIcon = ({ volume, onClick }) => {
|
|
31413
31639
|
if (volume === 0) {
|
|
31414
|
-
return /* @__PURE__ */
|
|
31640
|
+
return /* @__PURE__ */ import_react192.default.createElement(import_react_icons89.VolumeZeroIcon, { style: { cursor: "pointer", transition: "color 0.3s" }, onClick });
|
|
31415
31641
|
}
|
|
31416
|
-
return volume < 50 ? /* @__PURE__ */
|
|
31642
|
+
return volume < 50 ? /* @__PURE__ */ import_react192.default.createElement(import_react_icons89.VolumeOneIcon, { style: { cursor: "pointer", transition: "color 0.3s" }, onClick }) : /* @__PURE__ */ import_react192.default.createElement(import_react_icons89.VolumeTwoIcon, { style: { cursor: "pointer", transition: "color 0.3s" }, onClick });
|
|
31417
31643
|
};
|
|
31418
31644
|
}
|
|
31419
31645
|
});
|
|
@@ -31449,16 +31675,16 @@ var init_HMSVideo2 = __esm({
|
|
|
31449
31675
|
});
|
|
31450
31676
|
|
|
31451
31677
|
// src/Prebuilt/components/HMSVideo/FullscreenButton.tsx
|
|
31452
|
-
var
|
|
31678
|
+
var import_react193, import_react_icons90, FullScreenButton2;
|
|
31453
31679
|
var init_FullscreenButton = __esm({
|
|
31454
31680
|
"src/Prebuilt/components/HMSVideo/FullscreenButton.tsx"() {
|
|
31455
31681
|
"use strict";
|
|
31456
31682
|
init_define_process_env();
|
|
31457
|
-
|
|
31683
|
+
import_react193 = __toESM(require("react"));
|
|
31458
31684
|
import_react_icons90 = require("@100mslive/react-icons");
|
|
31459
31685
|
init_src();
|
|
31460
31686
|
FullScreenButton2 = ({ isFullScreen, onToggle }) => {
|
|
31461
|
-
return /* @__PURE__ */
|
|
31687
|
+
return /* @__PURE__ */ import_react193.default.createElement(Tooltip, { title: `${isFullScreen ? "Exit" : "Go"} fullscreen`, side: "top" }, /* @__PURE__ */ import_react193.default.createElement(IconButton, { css: { margin: "0px" }, onClick: onToggle, key: "fullscreen_btn", "data-testid": "fullscreen_btn" }, /* @__PURE__ */ import_react193.default.createElement(Flex, null, isFullScreen ? /* @__PURE__ */ import_react193.default.createElement(import_react_icons90.ShrinkIcon, null) : /* @__PURE__ */ import_react193.default.createElement(import_react_icons90.ExpandIcon, null))));
|
|
31462
31688
|
};
|
|
31463
31689
|
}
|
|
31464
31690
|
});
|
|
@@ -31469,9 +31695,9 @@ function HLSAutoplayBlockedPrompt({
|
|
|
31469
31695
|
unblockAutoPlay
|
|
31470
31696
|
}) {
|
|
31471
31697
|
const isLandscape = useIsLandscape();
|
|
31472
|
-
const isMobile = (0,
|
|
31698
|
+
const isMobile = (0, import_react_use42.useMedia)(config.media.md);
|
|
31473
31699
|
if ((isMobile || isLandscape) && open) {
|
|
31474
|
-
return /* @__PURE__ */
|
|
31700
|
+
return /* @__PURE__ */ import_react194.default.createElement(
|
|
31475
31701
|
IconButton,
|
|
31476
31702
|
{
|
|
31477
31703
|
css: {
|
|
@@ -31484,8 +31710,8 @@ function HLSAutoplayBlockedPrompt({
|
|
|
31484
31710
|
return yield unblockAutoPlay();
|
|
31485
31711
|
})
|
|
31486
31712
|
},
|
|
31487
|
-
/* @__PURE__ */
|
|
31488
|
-
/* @__PURE__ */
|
|
31713
|
+
/* @__PURE__ */ import_react194.default.createElement(import_react_icons91.VolumeTwoIcon, { width: "32", height: "32" }),
|
|
31714
|
+
/* @__PURE__ */ import_react194.default.createElement(
|
|
31489
31715
|
Text,
|
|
31490
31716
|
{
|
|
31491
31717
|
variant: "body1",
|
|
@@ -31499,7 +31725,7 @@ function HLSAutoplayBlockedPrompt({
|
|
|
31499
31725
|
)
|
|
31500
31726
|
);
|
|
31501
31727
|
}
|
|
31502
|
-
return /* @__PURE__ */
|
|
31728
|
+
return /* @__PURE__ */ import_react194.default.createElement(
|
|
31503
31729
|
Dialog.Root,
|
|
31504
31730
|
{
|
|
31505
31731
|
open,
|
|
@@ -31509,7 +31735,7 @@ function HLSAutoplayBlockedPrompt({
|
|
|
31509
31735
|
}
|
|
31510
31736
|
})
|
|
31511
31737
|
},
|
|
31512
|
-
/* @__PURE__ */
|
|
31738
|
+
/* @__PURE__ */ import_react194.default.createElement(DialogContent, { title: "Attention", closeable: false }, /* @__PURE__ */ import_react194.default.createElement(DialogRow, null, /* @__PURE__ */ import_react194.default.createElement(Text, { variant: "md" }, 'The browser wants us to get a confirmation for playing the HLS Stream. Please click "play stream" to proceed.')), /* @__PURE__ */ import_react194.default.createElement(DialogRow, { justify: "end" }, /* @__PURE__ */ import_react194.default.createElement(
|
|
31513
31739
|
Button,
|
|
31514
31740
|
{
|
|
31515
31741
|
variant: "primary",
|
|
@@ -31521,13 +31747,13 @@ function HLSAutoplayBlockedPrompt({
|
|
|
31521
31747
|
)))
|
|
31522
31748
|
);
|
|
31523
31749
|
}
|
|
31524
|
-
var
|
|
31750
|
+
var import_react194, import_react_use42, import_react_icons91;
|
|
31525
31751
|
var init_HLSAutoplayBlockedPrompt = __esm({
|
|
31526
31752
|
"src/Prebuilt/components/HMSVideo/HLSAutoplayBlockedPrompt.tsx"() {
|
|
31527
31753
|
"use strict";
|
|
31528
31754
|
init_define_process_env();
|
|
31529
|
-
|
|
31530
|
-
|
|
31755
|
+
import_react194 = __toESM(require("react"));
|
|
31756
|
+
import_react_use42 = require("react-use");
|
|
31531
31757
|
import_react_icons91 = require("@100mslive/react-icons");
|
|
31532
31758
|
init_src();
|
|
31533
31759
|
init_DialogContent2();
|
|
@@ -31538,14 +31764,14 @@ var init_HLSAutoplayBlockedPrompt = __esm({
|
|
|
31538
31764
|
// src/Prebuilt/components/HMSVideo/HLSCaptionSelector.tsx
|
|
31539
31765
|
function HLSCaptionSelector({ isEnabled }) {
|
|
31540
31766
|
const { hlsPlayer: hlsPlayer2 } = useHMSPlayerContext();
|
|
31541
|
-
return /* @__PURE__ */
|
|
31767
|
+
return /* @__PURE__ */ import_react195.default.createElement(Tooltip, { title: "Subtitles/closed captions", side: "top" }, /* @__PURE__ */ import_react195.default.createElement(IconButton, { css: { p: "$2" }, onClick: () => hlsPlayer2 == null ? void 0 : hlsPlayer2.toggleCaption() }, isEnabled ? /* @__PURE__ */ import_react195.default.createElement(import_react_icons92.ClosedCaptionIcon, { width: "20", height: "20px" }) : /* @__PURE__ */ import_react195.default.createElement(import_react_icons92.OpenCaptionIcon, { width: "20", height: "20px" })));
|
|
31542
31768
|
}
|
|
31543
|
-
var
|
|
31769
|
+
var import_react195, import_react_icons92;
|
|
31544
31770
|
var init_HLSCaptionSelector = __esm({
|
|
31545
31771
|
"src/Prebuilt/components/HMSVideo/HLSCaptionSelector.tsx"() {
|
|
31546
31772
|
"use strict";
|
|
31547
31773
|
init_define_process_env();
|
|
31548
|
-
|
|
31774
|
+
import_react195 = __toESM(require("react"));
|
|
31549
31775
|
import_react_icons92 = require("@100mslive/react-icons");
|
|
31550
31776
|
init_src();
|
|
31551
31777
|
init_PlayerContext();
|
|
@@ -31562,13 +31788,13 @@ function HLSQualitySelector({
|
|
|
31562
31788
|
isAuto,
|
|
31563
31789
|
containerRef
|
|
31564
31790
|
}) {
|
|
31565
|
-
const isMobile = (0,
|
|
31791
|
+
const isMobile = (0, import_react_use43.useMedia)(config.media.md);
|
|
31566
31792
|
const isLandscape = useIsLandscape();
|
|
31567
31793
|
if (layers.length === 0) {
|
|
31568
31794
|
return null;
|
|
31569
31795
|
}
|
|
31570
31796
|
if (isMobile || isLandscape) {
|
|
31571
|
-
return /* @__PURE__ */
|
|
31797
|
+
return /* @__PURE__ */ import_react196.default.createElement(Sheet.Root, { open, onOpenChange }, /* @__PURE__ */ import_react196.default.createElement(Sheet.Trigger, { asChild: true, "data-testid": "quality_selector" }, /* @__PURE__ */ import_react196.default.createElement(
|
|
31572
31798
|
Flex,
|
|
31573
31799
|
{
|
|
31574
31800
|
css: {
|
|
@@ -31578,15 +31804,15 @@ function HLSQualitySelector({
|
|
|
31578
31804
|
p: "$2"
|
|
31579
31805
|
}
|
|
31580
31806
|
},
|
|
31581
|
-
/* @__PURE__ */
|
|
31582
|
-
)), /* @__PURE__ */
|
|
31807
|
+
/* @__PURE__ */ import_react196.default.createElement(import_react_icons93.SettingsIcon, null)
|
|
31808
|
+
)), /* @__PURE__ */ import_react196.default.createElement(
|
|
31583
31809
|
Sheet.Content,
|
|
31584
31810
|
{
|
|
31585
31811
|
container: containerRef,
|
|
31586
31812
|
css: { bg: "$surface_default", pb: "$1" },
|
|
31587
31813
|
onClick: () => onOpenChange(false)
|
|
31588
31814
|
},
|
|
31589
|
-
/* @__PURE__ */
|
|
31815
|
+
/* @__PURE__ */ import_react196.default.createElement(
|
|
31590
31816
|
Sheet.Title,
|
|
31591
31817
|
{
|
|
31592
31818
|
css: {
|
|
@@ -31603,10 +31829,10 @@ function HLSQualitySelector({
|
|
|
31603
31829
|
}
|
|
31604
31830
|
},
|
|
31605
31831
|
"Quality",
|
|
31606
|
-
/* @__PURE__ */
|
|
31832
|
+
/* @__PURE__ */ import_react196.default.createElement(Sheet.Close, { css: { color: "$on_surface_high" }, onClick: () => onOpenChange(false) }, /* @__PURE__ */ import_react196.default.createElement(import_react_icons93.CrossIcon, null))
|
|
31607
31833
|
),
|
|
31608
31834
|
layers.map((layer) => {
|
|
31609
|
-
return /* @__PURE__ */
|
|
31835
|
+
return /* @__PURE__ */ import_react196.default.createElement(
|
|
31610
31836
|
Flex,
|
|
31611
31837
|
{
|
|
31612
31838
|
align: "center",
|
|
@@ -31624,12 +31850,12 @@ function HLSQualitySelector({
|
|
|
31624
31850
|
key: layer.width,
|
|
31625
31851
|
onClick: () => onQualityChange(layer)
|
|
31626
31852
|
},
|
|
31627
|
-
/* @__PURE__ */
|
|
31628
|
-
/* @__PURE__ */
|
|
31629
|
-
!isAuto && layer.width === (selection == null ? void 0 : selection.width) && layer.height === (selection == null ? void 0 : selection.height) && /* @__PURE__ */
|
|
31853
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { fontWeight: "$semiBold" } }, getQualityText(layer)),
|
|
31854
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { flex: "1 1 0", c: "$on_surface_low", pl: "$2" } }, getBitrateText(layer)),
|
|
31855
|
+
!isAuto && layer.width === (selection == null ? void 0 : selection.width) && layer.height === (selection == null ? void 0 : selection.height) && /* @__PURE__ */ import_react196.default.createElement(import_react_icons93.CheckIcon, { width: "16px", height: "16px" })
|
|
31630
31856
|
);
|
|
31631
31857
|
}),
|
|
31632
|
-
/* @__PURE__ */
|
|
31858
|
+
/* @__PURE__ */ import_react196.default.createElement(
|
|
31633
31859
|
Flex,
|
|
31634
31860
|
{
|
|
31635
31861
|
align: "center",
|
|
@@ -31647,12 +31873,12 @@ function HLSQualitySelector({
|
|
|
31647
31873
|
key: "auto",
|
|
31648
31874
|
onClick: () => onQualityChange({ height: "auto" })
|
|
31649
31875
|
},
|
|
31650
|
-
/* @__PURE__ */
|
|
31651
|
-
isAuto && /* @__PURE__ */
|
|
31876
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { fontWeight: "$semiBold", flex: "1 1 0" } }, "Auto"),
|
|
31877
|
+
isAuto && /* @__PURE__ */ import_react196.default.createElement(import_react_icons93.CheckIcon, { width: "16px", height: "16px" })
|
|
31652
31878
|
)
|
|
31653
31879
|
));
|
|
31654
31880
|
}
|
|
31655
|
-
return /* @__PURE__ */
|
|
31881
|
+
return /* @__PURE__ */ import_react196.default.createElement(Dropdown.Root, { open, onOpenChange: (value) => onOpenChange(value), modal: false }, /* @__PURE__ */ import_react196.default.createElement(Dropdown.Trigger, { asChild: true, "data-testid": "quality_selector" }, /* @__PURE__ */ import_react196.default.createElement(
|
|
31656
31882
|
Flex,
|
|
31657
31883
|
{
|
|
31658
31884
|
css: {
|
|
@@ -31662,7 +31888,7 @@ function HLSQualitySelector({
|
|
|
31662
31888
|
p: "$2"
|
|
31663
31889
|
}
|
|
31664
31890
|
},
|
|
31665
|
-
/* @__PURE__ */
|
|
31891
|
+
/* @__PURE__ */ import_react196.default.createElement(Tooltip, { title: "Select Quality", side: "top" }, /* @__PURE__ */ import_react196.default.createElement(Flex, { align: "center" }, /* @__PURE__ */ import_react196.default.createElement(
|
|
31666
31892
|
Box,
|
|
31667
31893
|
{
|
|
31668
31894
|
css: {
|
|
@@ -31673,8 +31899,8 @@ function HLSQualitySelector({
|
|
|
31673
31899
|
c: "$on_surface_high"
|
|
31674
31900
|
}
|
|
31675
31901
|
},
|
|
31676
|
-
/* @__PURE__ */
|
|
31677
|
-
), /* @__PURE__ */
|
|
31902
|
+
/* @__PURE__ */ import_react196.default.createElement(import_react_icons93.SettingsIcon, null)
|
|
31903
|
+
), /* @__PURE__ */ import_react196.default.createElement(
|
|
31678
31904
|
Text,
|
|
31679
31905
|
{
|
|
31680
31906
|
variant: {
|
|
@@ -31684,7 +31910,7 @@ function HLSQualitySelector({
|
|
|
31684
31910
|
},
|
|
31685
31911
|
css: { display: "flex", alignItems: "center", ml: "$2", c: "$on_surface_medium" }
|
|
31686
31912
|
},
|
|
31687
|
-
isAuto && /* @__PURE__ */
|
|
31913
|
+
isAuto && /* @__PURE__ */ import_react196.default.createElement(import_react196.default.Fragment, null, "Auto", /* @__PURE__ */ import_react196.default.createElement(
|
|
31688
31914
|
Box,
|
|
31689
31915
|
{
|
|
31690
31916
|
css: {
|
|
@@ -31699,7 +31925,7 @@ function HLSQualitySelector({
|
|
|
31699
31925
|
selection && Math.min(selection.width || 0, selection.height || 0),
|
|
31700
31926
|
"p"
|
|
31701
31927
|
)))
|
|
31702
|
-
)), /* @__PURE__ */
|
|
31928
|
+
)), /* @__PURE__ */ import_react196.default.createElement(Dropdown.Portal, { container: containerRef }, /* @__PURE__ */ import_react196.default.createElement(
|
|
31703
31929
|
Dropdown.Content,
|
|
31704
31930
|
{
|
|
31705
31931
|
sideOffset: 5,
|
|
@@ -31715,7 +31941,7 @@ function HLSQualitySelector({
|
|
|
31715
31941
|
}
|
|
31716
31942
|
},
|
|
31717
31943
|
layers.map((layer) => {
|
|
31718
|
-
return /* @__PURE__ */
|
|
31944
|
+
return /* @__PURE__ */ import_react196.default.createElement(
|
|
31719
31945
|
Dropdown.Item,
|
|
31720
31946
|
{
|
|
31721
31947
|
onClick: () => onQualityChange(layer),
|
|
@@ -31730,12 +31956,12 @@ function HLSQualitySelector({
|
|
|
31730
31956
|
gap: "$2"
|
|
31731
31957
|
}
|
|
31732
31958
|
},
|
|
31733
|
-
/* @__PURE__ */
|
|
31734
|
-
/* @__PURE__ */
|
|
31735
|
-
!isAuto && layer.width === (selection == null ? void 0 : selection.width) && layer.height === (selection == null ? void 0 : selection.height) && /* @__PURE__ */
|
|
31959
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { fontWeight: "$semiBold" } }, getQualityText(layer)),
|
|
31960
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { flex: "1 1 0", c: "$on_surface_low", pl: "$2" } }, getBitrateText(layer)),
|
|
31961
|
+
!isAuto && layer.width === (selection == null ? void 0 : selection.width) && layer.height === (selection == null ? void 0 : selection.height) && /* @__PURE__ */ import_react196.default.createElement(import_react_icons93.CheckIcon, { width: "16px", height: "16px" })
|
|
31736
31962
|
);
|
|
31737
31963
|
}),
|
|
31738
|
-
/* @__PURE__ */
|
|
31964
|
+
/* @__PURE__ */ import_react196.default.createElement(
|
|
31739
31965
|
Dropdown.Item,
|
|
31740
31966
|
{
|
|
31741
31967
|
onClick: () => onQualityChange({ height: "auto" }),
|
|
@@ -31750,18 +31976,18 @@ function HLSQualitySelector({
|
|
|
31750
31976
|
gap: "$2"
|
|
31751
31977
|
}
|
|
31752
31978
|
},
|
|
31753
|
-
/* @__PURE__ */
|
|
31754
|
-
isAuto && /* @__PURE__ */
|
|
31979
|
+
/* @__PURE__ */ import_react196.default.createElement(Text, { variant: "caption", css: { fontWeight: "$semiBold", flex: "1 1 0" } }, "Auto"),
|
|
31980
|
+
isAuto && /* @__PURE__ */ import_react196.default.createElement(import_react_icons93.CheckIcon, { width: "16px", height: "16px" })
|
|
31755
31981
|
)
|
|
31756
31982
|
)));
|
|
31757
31983
|
}
|
|
31758
|
-
var
|
|
31984
|
+
var import_react196, import_react_use43, import_react_icons93, getQualityText, getBitrateText;
|
|
31759
31985
|
var init_HLSQualitySelector = __esm({
|
|
31760
31986
|
"src/Prebuilt/components/HMSVideo/HLSQualitySelector.tsx"() {
|
|
31761
31987
|
"use strict";
|
|
31762
31988
|
init_define_process_env();
|
|
31763
|
-
|
|
31764
|
-
|
|
31989
|
+
import_react196 = __toESM(require("react"));
|
|
31990
|
+
import_react_use43 = require("react-use");
|
|
31765
31991
|
import_react_icons93 = require("@100mslive/react-icons");
|
|
31766
31992
|
init_src();
|
|
31767
31993
|
init_Sheet2();
|
|
@@ -31773,12 +31999,12 @@ var init_HLSQualitySelector = __esm({
|
|
|
31773
31999
|
});
|
|
31774
32000
|
|
|
31775
32001
|
// src/Prebuilt/components/HMSVideo/MwebHLSViewTitle.tsx
|
|
31776
|
-
var
|
|
32002
|
+
var import_react197, import_react_icons94, HLSViewTitle;
|
|
31777
32003
|
var init_MwebHLSViewTitle = __esm({
|
|
31778
32004
|
"src/Prebuilt/components/HMSVideo/MwebHLSViewTitle.tsx"() {
|
|
31779
32005
|
"use strict";
|
|
31780
32006
|
init_define_process_env();
|
|
31781
|
-
|
|
32007
|
+
import_react197 = __toESM(require("react"));
|
|
31782
32008
|
import_react_icons94 = require("@100mslive/react-icons");
|
|
31783
32009
|
init_Layout();
|
|
31784
32010
|
init_Text2();
|
|
@@ -31792,7 +32018,7 @@ var init_MwebHLSViewTitle = __esm({
|
|
|
31792
32018
|
const toggleDetailsPane = useSidepaneToggle(SIDE_PANE_OPTIONS.ROOM_DETAILS);
|
|
31793
32019
|
const isDetailSidepaneOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.ROOM_DETAILS);
|
|
31794
32020
|
if (isDetailSidepaneOpen) {
|
|
31795
|
-
return /* @__PURE__ */
|
|
32021
|
+
return /* @__PURE__ */ import_react197.default.createElement(
|
|
31796
32022
|
Flex,
|
|
31797
32023
|
{
|
|
31798
32024
|
gap: "4",
|
|
@@ -31807,8 +32033,8 @@ var init_MwebHLSViewTitle = __esm({
|
|
|
31807
32033
|
backgroundColor: "$surface_dim"
|
|
31808
32034
|
}
|
|
31809
32035
|
},
|
|
31810
|
-
/* @__PURE__ */
|
|
31811
|
-
/* @__PURE__ */
|
|
32036
|
+
/* @__PURE__ */ import_react197.default.createElement(Text, { variant: "sub2", css: { fontWeight: "$semiBold" } }, "About Session"),
|
|
32037
|
+
/* @__PURE__ */ import_react197.default.createElement(
|
|
31812
32038
|
Flex,
|
|
31813
32039
|
{
|
|
31814
32040
|
onClick: toggleDetailsPane,
|
|
@@ -31818,11 +32044,11 @@ var init_MwebHLSViewTitle = __esm({
|
|
|
31818
32044
|
"&:hover": { opacity: "0.8" }
|
|
31819
32045
|
}
|
|
31820
32046
|
},
|
|
31821
|
-
/* @__PURE__ */
|
|
32047
|
+
/* @__PURE__ */ import_react197.default.createElement(import_react_icons94.ChevronDownIcon, null)
|
|
31822
32048
|
)
|
|
31823
32049
|
);
|
|
31824
32050
|
}
|
|
31825
|
-
return /* @__PURE__ */
|
|
32051
|
+
return /* @__PURE__ */ import_react197.default.createElement(
|
|
31826
32052
|
Flex,
|
|
31827
32053
|
{
|
|
31828
32054
|
gap: "4",
|
|
@@ -31836,8 +32062,8 @@ var init_MwebHLSViewTitle = __esm({
|
|
|
31836
32062
|
backgroundColor: "$surface_dim"
|
|
31837
32063
|
}
|
|
31838
32064
|
},
|
|
31839
|
-
/* @__PURE__ */
|
|
31840
|
-
/* @__PURE__ */
|
|
32065
|
+
/* @__PURE__ */ import_react197.default.createElement(Logo, null),
|
|
32066
|
+
/* @__PURE__ */ import_react197.default.createElement(Flex, { direction: "column" }, title ? /* @__PURE__ */ import_react197.default.createElement(Text, { variant: "sub2", css: { fontWeight: "$semiBold" } }, title) : null, /* @__PURE__ */ import_react197.default.createElement(Flex, null, /* @__PURE__ */ import_react197.default.createElement(RoomDetailsRow, { details }), description ? /* @__PURE__ */ import_react197.default.createElement(Text, { variant: "caption", css: { color: "$on_surface_medium" }, onClick: toggleDetailsPane }, "\xA0...more") : null))
|
|
31841
32067
|
);
|
|
31842
32068
|
};
|
|
31843
32069
|
}
|
|
@@ -31848,17 +32074,17 @@ var HLSView_exports = {};
|
|
|
31848
32074
|
__export(HLSView_exports, {
|
|
31849
32075
|
default: () => HLSView_default
|
|
31850
32076
|
});
|
|
31851
|
-
var
|
|
32077
|
+
var import_react198, import_react_use44, import_hls_player3, import_screenfull3, import_ts_pattern12, import_react_sdk99, import_react_icons95, hlsPlayer, toastMap, ToggleChat, HLSView, HLSView_default;
|
|
31852
32078
|
var init_HLSView = __esm({
|
|
31853
32079
|
"src/Prebuilt/layouts/HLSView.jsx"() {
|
|
31854
32080
|
"use strict";
|
|
31855
32081
|
init_define_process_env();
|
|
31856
|
-
|
|
31857
|
-
|
|
32082
|
+
import_react198 = __toESM(require("react"));
|
|
32083
|
+
import_react_use44 = require("react-use");
|
|
31858
32084
|
import_hls_player3 = require("@100mslive/hls-player");
|
|
31859
32085
|
import_screenfull3 = __toESM(require("screenfull"));
|
|
31860
32086
|
import_ts_pattern12 = require("ts-pattern");
|
|
31861
|
-
|
|
32087
|
+
import_react_sdk99 = require("@100mslive/react-sdk");
|
|
31862
32088
|
import_react_icons95 = require("@100mslive/react-icons");
|
|
31863
32089
|
init_ChatToggle();
|
|
31864
32090
|
init_HlsStatsOverlay();
|
|
@@ -31885,12 +32111,12 @@ var init_HLSView = __esm({
|
|
|
31885
32111
|
toastMap = {};
|
|
31886
32112
|
ToggleChat = ({ isFullScreen = false }) => {
|
|
31887
32113
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
31888
|
-
const sidepane = (0,
|
|
32114
|
+
const sidepane = (0, import_react_sdk99.useHMSStore)((0, import_react_sdk99.selectAppData)(APP_DATA.sidePane));
|
|
31889
32115
|
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
31890
32116
|
const showChat = !!(elements == null ? void 0 : elements.chat);
|
|
31891
|
-
const isMobile = (0,
|
|
31892
|
-
const hmsActions = (0,
|
|
31893
|
-
(0,
|
|
32117
|
+
const isMobile = (0, import_react_use44.useMedia)(config.media.md);
|
|
32118
|
+
const hmsActions = (0, import_react_sdk99.useHMSActions)();
|
|
32119
|
+
(0, import_react198.useEffect)(() => {
|
|
31894
32120
|
(0, import_ts_pattern12.match)({ sidepane, isMobile, showChat, isFullScreen }).with({ isFullScreen: true }, () => {
|
|
31895
32121
|
hmsActions.setAppData(APP_DATA.sidePane, "");
|
|
31896
32122
|
}).with({ isMobile: true, showChat: true, sidepane: import_ts_pattern12.P.when((value) => !value) }, () => {
|
|
@@ -31904,48 +32130,48 @@ var init_HLSView = __esm({
|
|
|
31904
32130
|
};
|
|
31905
32131
|
HLSView = () => {
|
|
31906
32132
|
var _a8, _b7, _c, _d, _e, _f, _g;
|
|
31907
|
-
const videoRef = (0,
|
|
31908
|
-
const hlsViewRef = (0,
|
|
32133
|
+
const videoRef = (0, import_react198.useRef)(null);
|
|
32134
|
+
const hlsViewRef = (0, import_react198.useRef)();
|
|
31909
32135
|
const { elements } = useRoomLayoutConferencingScreen();
|
|
31910
|
-
const hlsState = (0,
|
|
31911
|
-
const enablHlsStats = (0,
|
|
31912
|
-
const notification = (0,
|
|
31913
|
-
const hmsActions = (0,
|
|
32136
|
+
const hlsState = (0, import_react_sdk99.useHMSStore)(import_react_sdk99.selectHLSState);
|
|
32137
|
+
const enablHlsStats = (0, import_react_sdk99.useHMSStore)((0, import_react_sdk99.selectAppData)(APP_DATA.hlsStats));
|
|
32138
|
+
const notification = (0, import_react_sdk99.useHMSNotifications)(import_react_sdk99.HMSNotificationTypes.POLL_STOPPED);
|
|
32139
|
+
const hmsActions = (0, import_react_sdk99.useHMSActions)();
|
|
31914
32140
|
const { themeType } = useTheme();
|
|
31915
|
-
const [streamEnded, setStreamEnded] = (0,
|
|
31916
|
-
let [hlsStatsState, setHlsStatsState] = (0,
|
|
32141
|
+
const [streamEnded, setStreamEnded] = (0, import_react198.useState)(false);
|
|
32142
|
+
let [hlsStatsState, setHlsStatsState] = (0, import_react198.useState)(null);
|
|
31917
32143
|
const hlsUrl = (_a8 = hlsState.variants[0]) == null ? void 0 : _a8.url;
|
|
31918
|
-
const [availableLayers, setAvailableLayers] = (0,
|
|
31919
|
-
const [isVideoLive, setIsVideoLive] = (0,
|
|
31920
|
-
const [isCaptionEnabled, setIsCaptionEnabled] = (0,
|
|
31921
|
-
const [hasCaptions, setHasCaptions] = (0,
|
|
31922
|
-
const [currentSelectedQuality, setCurrentSelectedQuality] = (0,
|
|
31923
|
-
const [isHlsAutoplayBlocked, setIsHlsAutoplayBlocked] = (0,
|
|
31924
|
-
const [hoverControlsVisible, setHoverControlsVisible] = (0,
|
|
32144
|
+
const [availableLayers, setAvailableLayers] = (0, import_react198.useState)([]);
|
|
32145
|
+
const [isVideoLive, setIsVideoLive] = (0, import_react198.useState)(true);
|
|
32146
|
+
const [isCaptionEnabled, setIsCaptionEnabled] = (0, import_react198.useState)(true);
|
|
32147
|
+
const [hasCaptions, setHasCaptions] = (0, import_react198.useState)(false);
|
|
32148
|
+
const [currentSelectedQuality, setCurrentSelectedQuality] = (0, import_react198.useState)(null);
|
|
32149
|
+
const [isHlsAutoplayBlocked, setIsHlsAutoplayBlocked] = (0, import_react198.useState)(false);
|
|
32150
|
+
const [hoverControlsVisible, setHoverControlsVisible] = (0, import_react198.useState)({
|
|
31925
32151
|
seekForward: false,
|
|
31926
32152
|
pausePlay: false,
|
|
31927
32153
|
seekBackward: false
|
|
31928
32154
|
});
|
|
31929
|
-
const [isPaused, setIsPaused] = (0,
|
|
31930
|
-
const [show, toggle] = (0,
|
|
31931
|
-
const lastHlsUrl = (0,
|
|
31932
|
-
const vanillaStore = (0,
|
|
31933
|
-
const [controlsVisible, setControlsVisible] = (0,
|
|
31934
|
-
const [isUserSelectedAuto, setIsUserSelectedAuto] = (0,
|
|
31935
|
-
const [qualityDropDownOpen, setQualityDropDownOpen] = (0,
|
|
31936
|
-
const controlsRef = (0,
|
|
31937
|
-
const controlsTimerRef = (0,
|
|
31938
|
-
const [seekProgress, setSeekProgress] = (0,
|
|
32155
|
+
const [isPaused, setIsPaused] = (0, import_react198.useState)(false);
|
|
32156
|
+
const [show, toggle] = (0, import_react_use44.useToggle)(false);
|
|
32157
|
+
const lastHlsUrl = (0, import_react_use44.usePrevious)(hlsUrl);
|
|
32158
|
+
const vanillaStore = (0, import_react_sdk99.useHMSVanillaStore)();
|
|
32159
|
+
const [controlsVisible, setControlsVisible] = (0, import_react198.useState)(true);
|
|
32160
|
+
const [isUserSelectedAuto, setIsUserSelectedAuto] = (0, import_react198.useState)(true);
|
|
32161
|
+
const [qualityDropDownOpen, setQualityDropDownOpen] = (0, import_react198.useState)(false);
|
|
32162
|
+
const controlsRef = (0, import_react198.useRef)(null);
|
|
32163
|
+
const controlsTimerRef = (0, import_react198.useRef)();
|
|
32164
|
+
const [seekProgress, setSeekProgress] = (0, import_react198.useState)(false);
|
|
31939
32165
|
const isFullScreenSupported = import_screenfull3.default.isEnabled;
|
|
31940
32166
|
const toggleChat = useSidepaneToggle(SIDE_PANE_OPTIONS.CHAT);
|
|
31941
32167
|
const showChat = !!(elements == null ? void 0 : elements.chat);
|
|
31942
|
-
const isMobile = (0,
|
|
32168
|
+
const isMobile = (0, import_react_use44.useMedia)(config.media.md);
|
|
31943
32169
|
const isLandscape = useIsLandscape();
|
|
31944
|
-
const isFullScreen = (0,
|
|
32170
|
+
const isFullScreen = (0, import_react_use44.useFullscreen)(hlsViewRef, show, {
|
|
31945
32171
|
onClose: () => toggle(false)
|
|
31946
32172
|
});
|
|
31947
|
-
const [showLoader, setShowLoader] = (0,
|
|
31948
|
-
(0,
|
|
32173
|
+
const [showLoader, setShowLoader] = (0, import_react198.useState)(false);
|
|
32174
|
+
(0, import_react198.useEffect)(() => {
|
|
31949
32175
|
const videoEl = videoRef.current;
|
|
31950
32176
|
const showLoader2 = () => setShowLoader(true);
|
|
31951
32177
|
const hideLoader = () => setShowLoader(false);
|
|
@@ -31956,12 +32182,12 @@ var init_HLSView = __esm({
|
|
|
31956
32182
|
videoEl == null ? void 0 : videoEl.removeEventListener("waiting", showLoader2);
|
|
31957
32183
|
};
|
|
31958
32184
|
}, []);
|
|
31959
|
-
(0,
|
|
32185
|
+
(0, import_react198.useEffect)(() => {
|
|
31960
32186
|
if (streamEnded && lastHlsUrl !== hlsUrl) {
|
|
31961
32187
|
setStreamEnded(false);
|
|
31962
32188
|
}
|
|
31963
32189
|
}, [hlsUrl, streamEnded, lastHlsUrl]);
|
|
31964
|
-
(0,
|
|
32190
|
+
(0, import_react198.useEffect)(() => {
|
|
31965
32191
|
if (!notification)
|
|
31966
32192
|
return;
|
|
31967
32193
|
const toastID = toastMap == null ? void 0 : toastMap[notification.data.id];
|
|
@@ -31970,7 +32196,7 @@ var init_HLSView = __esm({
|
|
|
31970
32196
|
delete toastMap[notification.data.id];
|
|
31971
32197
|
}
|
|
31972
32198
|
}, [notification]);
|
|
31973
|
-
(0,
|
|
32199
|
+
(0, import_react198.useEffect)(() => {
|
|
31974
32200
|
const videoElem = videoRef.current;
|
|
31975
32201
|
const setStreamEndedCallback = () => {
|
|
31976
32202
|
setStreamEnded(true);
|
|
@@ -31981,7 +32207,7 @@ var init_HLSView = __esm({
|
|
|
31981
32207
|
videoElem == null ? void 0 : videoElem.removeEventListener("ended", setStreamEndedCallback);
|
|
31982
32208
|
};
|
|
31983
32209
|
}, [hlsUrl]);
|
|
31984
|
-
const handleQuality = (0,
|
|
32210
|
+
const handleQuality = (0, import_react198.useCallback)(
|
|
31985
32211
|
(quality) => {
|
|
31986
32212
|
var _a9;
|
|
31987
32213
|
if (hlsPlayer) {
|
|
@@ -31992,7 +32218,7 @@ var init_HLSView = __esm({
|
|
|
31992
32218
|
[availableLayers]
|
|
31993
32219
|
//eslint-disable-line
|
|
31994
32220
|
);
|
|
31995
|
-
(0,
|
|
32221
|
+
(0, import_react198.useEffect)(() => {
|
|
31996
32222
|
let videoEl = videoRef.current;
|
|
31997
32223
|
const manifestLoadedHandler = ({ layers }) => {
|
|
31998
32224
|
setAvailableLayers(layers);
|
|
@@ -32015,12 +32241,12 @@ var init_HLSView = __esm({
|
|
|
32015
32241
|
const parsedPayload = parsePayload(payload);
|
|
32016
32242
|
if (parsedPayload.startsWith("poll:")) {
|
|
32017
32243
|
const pollId = parsedPayload.substr(parsedPayload.indexOf(":") + 1);
|
|
32018
|
-
const poll = vanillaStore.getState((0,
|
|
32019
|
-
const pollStartedBy = vanillaStore.getState((0,
|
|
32244
|
+
const poll = vanillaStore.getState((0, import_react_sdk99.selectPollByID)(pollId));
|
|
32245
|
+
const pollStartedBy = vanillaStore.getState((0, import_react_sdk99.selectPeerNameByID)(poll.startedBy)) || "Participant";
|
|
32020
32246
|
if (!toastMap[pollId]) {
|
|
32021
32247
|
const toastID = ToastManager.addToast({
|
|
32022
32248
|
title: `${pollStartedBy} started a ${poll.type}: ${poll.title}`,
|
|
32023
|
-
action: /* @__PURE__ */
|
|
32249
|
+
action: /* @__PURE__ */ import_react198.default.createElement(
|
|
32024
32250
|
Button,
|
|
32025
32251
|
{
|
|
32026
32252
|
onClick: () => {
|
|
@@ -32105,7 +32331,7 @@ var init_HLSView = __esm({
|
|
|
32105
32331
|
};
|
|
32106
32332
|
}
|
|
32107
32333
|
}, [hlsUrl, vanillaStore, hmsActions]);
|
|
32108
|
-
(0,
|
|
32334
|
+
(0, import_react198.useEffect)(() => {
|
|
32109
32335
|
const onHLSStats = (state) => setHlsStatsState(state);
|
|
32110
32336
|
if (enablHlsStats) {
|
|
32111
32337
|
hlsPlayer == null ? void 0 : hlsPlayer.on(import_hls_player3.HMSHLSPlayerEvents.STATS, onHLSStats);
|
|
@@ -32127,7 +32353,7 @@ var init_HLSView = __esm({
|
|
|
32127
32353
|
const sfnOverlayClose = () => {
|
|
32128
32354
|
hmsActions.setAppData(APP_DATA.hlsStats, !enablHlsStats);
|
|
32129
32355
|
};
|
|
32130
|
-
(0,
|
|
32356
|
+
(0, import_react198.useEffect)(() => {
|
|
32131
32357
|
if (controlsVisible && isFullScreen && !qualityDropDownOpen) {
|
|
32132
32358
|
if (controlsTimerRef.current) {
|
|
32133
32359
|
clearTimeout(controlsTimerRef.current);
|
|
@@ -32147,7 +32373,7 @@ var init_HLSView = __esm({
|
|
|
32147
32373
|
}
|
|
32148
32374
|
};
|
|
32149
32375
|
}, [controlsVisible, isFullScreen, seekProgress, qualityDropDownOpen]);
|
|
32150
|
-
const onSeekTo = (0,
|
|
32376
|
+
const onSeekTo = (0, import_react198.useCallback)(
|
|
32151
32377
|
(seek) => {
|
|
32152
32378
|
var _a9;
|
|
32153
32379
|
(0, import_ts_pattern12.match)({ isLandscape, isMobile, seek }).with({ seek: -10, isMobile: false, isLandscape: false }, () => {
|
|
@@ -32169,10 +32395,10 @@ var init_HLSView = __esm({
|
|
|
32169
32395
|
},
|
|
32170
32396
|
[hoverControlsVisible, isLandscape, isMobile]
|
|
32171
32397
|
);
|
|
32172
|
-
const onDoubleClickHandler = (0,
|
|
32398
|
+
const onDoubleClickHandler = (0, import_react198.useCallback)(
|
|
32173
32399
|
(event) => {
|
|
32174
32400
|
var _a9;
|
|
32175
|
-
if (!(isMobile || isLandscape) || ((_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type) !==
|
|
32401
|
+
if (!(isMobile || isLandscape) || ((_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type) !== import_react_sdk99.HLSPlaylistType.DVR) {
|
|
32176
32402
|
return;
|
|
32177
32403
|
}
|
|
32178
32404
|
const sidePercentage = event.screenX * 100 / event.target.clientWidth;
|
|
@@ -32196,9 +32422,9 @@ var init_HLSView = __esm({
|
|
|
32196
32422
|
},
|
|
32197
32423
|
[hlsState == null ? void 0 : hlsState.variants, hoverControlsVisible, isLandscape, isMobile, onSeekTo]
|
|
32198
32424
|
);
|
|
32199
|
-
const onClickHandler = (0,
|
|
32425
|
+
const onClickHandler = (0, import_react198.useCallback)(() => __async(void 0, null, function* () {
|
|
32200
32426
|
var _a9;
|
|
32201
|
-
(0, import_ts_pattern12.match)({ isMobile, isLandscape, playlist_type: (_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type }).with({ playlist_type:
|
|
32427
|
+
(0, import_ts_pattern12.match)({ isMobile, isLandscape, playlist_type: (_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type }).with({ playlist_type: import_react_sdk99.HLSPlaylistType.DVR, isMobile: false, isLandscape: false }, () => __async(void 0, null, function* () {
|
|
32202
32428
|
if (isPaused) {
|
|
32203
32429
|
yield hlsPlayer == null ? void 0 : hlsPlayer.play();
|
|
32204
32430
|
} else {
|
|
@@ -32214,7 +32440,7 @@ var init_HLSView = __esm({
|
|
|
32214
32440
|
}
|
|
32215
32441
|
).otherwise(() => null);
|
|
32216
32442
|
}), [hlsState == null ? void 0 : hlsState.variants, isLandscape, isMobile, isPaused]);
|
|
32217
|
-
const onHoverHandler = (0,
|
|
32443
|
+
const onHoverHandler = (0, import_react198.useCallback)(
|
|
32218
32444
|
(event) => {
|
|
32219
32445
|
event.preventDefault();
|
|
32220
32446
|
if (isMobile || isLandscape) {
|
|
@@ -32237,7 +32463,7 @@ var init_HLSView = __esm({
|
|
|
32237
32463
|
);
|
|
32238
32464
|
const keyHandler = useKeyboardHandler(isPaused, hlsPlayer);
|
|
32239
32465
|
if (!hlsUrl || streamEnded) {
|
|
32240
|
-
return /* @__PURE__ */
|
|
32466
|
+
return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, /* @__PURE__ */ import_react198.default.createElement(ToggleChat, null), hlsViewRef.current && (isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(Box, { css: { position: "fixed", left: "$4", top: "$4", zIndex: 11 } }, /* @__PURE__ */ import_react198.default.createElement(LeaveRoom, { screenType: "hls_live_streaming", container: hlsViewRef.current })), /* @__PURE__ */ import_react198.default.createElement(
|
|
32241
32467
|
Flex,
|
|
32242
32468
|
{
|
|
32243
32469
|
key: "hls-viewer",
|
|
@@ -32249,10 +32475,10 @@ var init_HLSView = __esm({
|
|
|
32249
32475
|
flex: isLandscape ? "2 1 0" : "1 1 0"
|
|
32250
32476
|
}
|
|
32251
32477
|
},
|
|
32252
|
-
/* @__PURE__ */
|
|
32478
|
+
/* @__PURE__ */ import_react198.default.createElement(Flex, { align: "center", justify: "center", direction: "column", css: { size: "100%", px: "$10" } }, /* @__PURE__ */ import_react198.default.createElement(Flex, { css: { c: "$on_surface_high", r: "$round", bg: "$surface_default", p: "$2" } }, streamEnded ? /* @__PURE__ */ import_react198.default.createElement(import_react_icons95.ColoredHandIcon, { height: 56, width: 56 }) : /* @__PURE__ */ import_react198.default.createElement(import_react_icons95.GoLiveIcon, { height: 56, width: 56 })), /* @__PURE__ */ import_react198.default.createElement(Text, { variant: "h5", css: { c: "$on_surface_high", mt: "$10", mb: 0, textAlign: "center" } }, streamEnded ? "Stream has ended" : "Stream yet to start"), /* @__PURE__ */ import_react198.default.createElement(Text, { variant: "md", css: { textAlign: "center", mt: "$4", c: "$on_surface_medium" } }, streamEnded ? "Have a nice day!" : "Sit back and relax"))
|
|
32253
32479
|
));
|
|
32254
32480
|
}
|
|
32255
|
-
return /* @__PURE__ */
|
|
32481
|
+
return /* @__PURE__ */ import_react198.default.createElement(
|
|
32256
32482
|
Flex,
|
|
32257
32483
|
{
|
|
32258
32484
|
key: "hls-viewer",
|
|
@@ -32270,8 +32496,8 @@ var init_HLSView = __esm({
|
|
|
32270
32496
|
}
|
|
32271
32497
|
}
|
|
32272
32498
|
},
|
|
32273
|
-
hlsViewRef.current && (isMobile || isLandscape) && /* @__PURE__ */
|
|
32274
|
-
/* @__PURE__ */
|
|
32499
|
+
hlsViewRef.current && (isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(Box, { css: { position: "fixed", left: "$4", top: "$4", zIndex: 11 } }, /* @__PURE__ */ import_react198.default.createElement(LeaveRoom, { screenType: "hls_live_streaming", container: hlsViewRef.current })),
|
|
32500
|
+
/* @__PURE__ */ import_react198.default.createElement(HMSPlayerContext.Provider, { value: { hlsPlayer } }, (hlsStatsState == null ? void 0 : hlsStatsState.url) && enablHlsStats && !(isMobile || isLandscape) ? /* @__PURE__ */ import_react198.default.createElement(HlsStatsOverlay, { hlsStatsState, onClose: sfnOverlayClose }) : null, /* @__PURE__ */ import_react198.default.createElement(
|
|
32275
32501
|
Flex,
|
|
32276
32502
|
{
|
|
32277
32503
|
id: "hls-player-container",
|
|
@@ -32287,14 +32513,14 @@ var init_HLSView = __esm({
|
|
|
32287
32513
|
},
|
|
32288
32514
|
onKeyDown: (event) => __async(void 0, null, function* () {
|
|
32289
32515
|
var _a9;
|
|
32290
|
-
if (((_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type) ===
|
|
32516
|
+
if (((_a9 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a9.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR) {
|
|
32291
32517
|
yield keyHandler(event);
|
|
32292
32518
|
}
|
|
32293
32519
|
}),
|
|
32294
32520
|
tabIndex: "0"
|
|
32295
32521
|
},
|
|
32296
|
-
!(isMobile || isLandscape) && /* @__PURE__ */
|
|
32297
|
-
showLoader && /* @__PURE__ */
|
|
32522
|
+
!(isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(HLSAutoplayBlockedPrompt, { open: isHlsAutoplayBlocked, unblockAutoPlay }),
|
|
32523
|
+
showLoader && /* @__PURE__ */ import_react198.default.createElement(
|
|
32298
32524
|
Flex,
|
|
32299
32525
|
{
|
|
32300
32526
|
align: "center",
|
|
@@ -32303,9 +32529,9 @@ var init_HLSView = __esm({
|
|
|
32303
32529
|
position: "absolute"
|
|
32304
32530
|
}
|
|
32305
32531
|
},
|
|
32306
|
-
/* @__PURE__ */
|
|
32532
|
+
/* @__PURE__ */ import_react198.default.createElement(Loading, { width: 72, height: 72 })
|
|
32307
32533
|
),
|
|
32308
|
-
/* @__PURE__ */
|
|
32534
|
+
/* @__PURE__ */ import_react198.default.createElement(
|
|
32309
32535
|
HMSVideoPlayer.Root,
|
|
32310
32536
|
{
|
|
32311
32537
|
ref: videoRef,
|
|
@@ -32317,7 +32543,7 @@ var init_HLSView = __esm({
|
|
|
32317
32543
|
onDoubleClickHandler(e);
|
|
32318
32544
|
}
|
|
32319
32545
|
},
|
|
32320
|
-
/* @__PURE__ */
|
|
32546
|
+
/* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, !(isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(
|
|
32321
32547
|
Flex,
|
|
32322
32548
|
{
|
|
32323
32549
|
align: "center",
|
|
@@ -32331,7 +32557,7 @@ var init_HLSView = __esm({
|
|
|
32331
32557
|
size: "100%"
|
|
32332
32558
|
}
|
|
32333
32559
|
},
|
|
32334
|
-
!showLoader && ((_b7 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _b7.playlist_type) ===
|
|
32560
|
+
!showLoader && ((_b7 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _b7.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR && /* @__PURE__ */ import_react198.default.createElement(
|
|
32335
32561
|
HMSVideoPlayer.PlayPauseSeekControls.Overlay,
|
|
32336
32562
|
{
|
|
32337
32563
|
isPaused,
|
|
@@ -32339,14 +32565,14 @@ var init_HLSView = __esm({
|
|
|
32339
32565
|
hoverControlsVisible
|
|
32340
32566
|
}
|
|
32341
32567
|
)
|
|
32342
|
-
), isMobile || isLandscape ? /* @__PURE__ */
|
|
32568
|
+
), isMobile || isLandscape ? /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, !showLoader && ((_c = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _c.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR && /* @__PURE__ */ import_react198.default.createElement(
|
|
32343
32569
|
HMSVideoPlayer.PlayPauseSeekControls.Overlay,
|
|
32344
32570
|
{
|
|
32345
32571
|
isPaused,
|
|
32346
32572
|
showControls: controlsVisible,
|
|
32347
32573
|
hoverControlsVisible
|
|
32348
32574
|
}
|
|
32349
|
-
), /* @__PURE__ */
|
|
32575
|
+
), /* @__PURE__ */ import_react198.default.createElement(
|
|
32350
32576
|
Flex,
|
|
32351
32577
|
{
|
|
32352
32578
|
ref: controlsRef,
|
|
@@ -32364,7 +32590,7 @@ var init_HLSView = __esm({
|
|
|
32364
32590
|
opacity: controlsVisible ? `1` : "0"
|
|
32365
32591
|
}
|
|
32366
32592
|
},
|
|
32367
|
-
/* @__PURE__ */
|
|
32593
|
+
/* @__PURE__ */ import_react198.default.createElement(
|
|
32368
32594
|
HMSVideoPlayer.Controls.Root,
|
|
32369
32595
|
{
|
|
32370
32596
|
css: {
|
|
@@ -32372,7 +32598,7 @@ var init_HLSView = __esm({
|
|
|
32372
32598
|
},
|
|
32373
32599
|
onClick: (e) => e.stopPropagation()
|
|
32374
32600
|
},
|
|
32375
|
-
/* @__PURE__ */
|
|
32601
|
+
/* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Controls.Right, null, (isLandscape || isMobile && isFullScreen) && showChat && /* @__PURE__ */ import_react198.default.createElement(
|
|
32376
32602
|
ChatToggle,
|
|
32377
32603
|
{
|
|
32378
32604
|
onClick: () => {
|
|
@@ -32384,7 +32610,7 @@ var init_HLSView = __esm({
|
|
|
32384
32610
|
}, 0);
|
|
32385
32611
|
}
|
|
32386
32612
|
}
|
|
32387
|
-
), hasCaptions && !isHlsAutoplayBlocked && /* @__PURE__ */
|
|
32613
|
+
), hasCaptions && !isHlsAutoplayBlocked && /* @__PURE__ */ import_react198.default.createElement(HLSCaptionSelector, { isEnabled: isCaptionEnabled }), hlsViewRef.current && availableLayers.length > 0 && !isHlsAutoplayBlocked ? /* @__PURE__ */ import_react198.default.createElement(
|
|
32388
32614
|
HLSQualitySelector,
|
|
32389
32615
|
{
|
|
32390
32616
|
layers: availableLayers,
|
|
@@ -32395,9 +32621,9 @@ var init_HLSView = __esm({
|
|
|
32395
32621
|
isAuto: isUserSelectedAuto,
|
|
32396
32622
|
containerRef: hlsViewRef.current
|
|
32397
32623
|
}
|
|
32398
|
-
) : null, /* @__PURE__ */
|
|
32624
|
+
) : null, /* @__PURE__ */ import_react198.default.createElement(HLSAutoplayBlockedPrompt, { open: isHlsAutoplayBlocked, unblockAutoPlay }))
|
|
32399
32625
|
)
|
|
32400
|
-
)) : null, controlsVisible && /* @__PURE__ */
|
|
32626
|
+
)) : null, controlsVisible && /* @__PURE__ */ import_react198.default.createElement(
|
|
32401
32627
|
Flex,
|
|
32402
32628
|
{
|
|
32403
32629
|
ref: controlsRef,
|
|
@@ -32406,7 +32632,7 @@ var init_HLSView = __esm({
|
|
|
32406
32632
|
align: "start",
|
|
32407
32633
|
css: {
|
|
32408
32634
|
position: "absolute",
|
|
32409
|
-
bottom: isFullScreen && ((_d = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _d.playlist_type) ===
|
|
32635
|
+
bottom: isFullScreen && ((_d = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _d.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR ? "$8" : "0",
|
|
32410
32636
|
left: "0",
|
|
32411
32637
|
zIndex: 1,
|
|
32412
32638
|
background: isMobile || isLandscape ? "" : `linear-gradient(180deg, ${theme.colors.background_dim.value}00 29.46%, ${theme.colors.background_dim.value}A3 100%);`,
|
|
@@ -32416,8 +32642,8 @@ var init_HLSView = __esm({
|
|
|
32416
32642
|
transition: "visibility 0s 0.5s, opacity 0.5s linear"
|
|
32417
32643
|
}
|
|
32418
32644
|
},
|
|
32419
|
-
((_e = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _e.playlist_type) ===
|
|
32420
|
-
/* @__PURE__ */
|
|
32645
|
+
((_e = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _e.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR ? /* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Progress, { seekProgress, setSeekProgress }) : null,
|
|
32646
|
+
/* @__PURE__ */ import_react198.default.createElement(
|
|
32421
32647
|
HMSVideoPlayer.Controls.Root,
|
|
32422
32648
|
{
|
|
32423
32649
|
css: {
|
|
@@ -32425,7 +32651,7 @@ var init_HLSView = __esm({
|
|
|
32425
32651
|
},
|
|
32426
32652
|
onClick: (e) => e.stopPropagation()
|
|
32427
32653
|
},
|
|
32428
|
-
/* @__PURE__ */
|
|
32654
|
+
/* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Controls.Left, null, !(isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, ((_f = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _f.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR ? /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, /* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.PlayPauseSeekControls.Button, { isPaused, onSeekTo }), !isVideoLive ? /* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Duration, null) : null) : null, /* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Volume, null)), /* @__PURE__ */ import_react198.default.createElement(
|
|
32429
32655
|
IconButton,
|
|
32430
32656
|
{
|
|
32431
32657
|
css: { px: "$2" },
|
|
@@ -32437,7 +32663,7 @@ var init_HLSView = __esm({
|
|
|
32437
32663
|
key: "jump-to-live_btn",
|
|
32438
32664
|
"data-testid": "jump-to-live_btn"
|
|
32439
32665
|
},
|
|
32440
|
-
/* @__PURE__ */
|
|
32666
|
+
/* @__PURE__ */ import_react198.default.createElement(Tooltip, { title: isVideoLive ? "Live" : "Go to Live", side: "top" }, /* @__PURE__ */ import_react198.default.createElement(Flex, { justify: "center", gap: 2, align: "center" }, /* @__PURE__ */ import_react198.default.createElement(
|
|
32441
32667
|
Box,
|
|
32442
32668
|
{
|
|
32443
32669
|
css: {
|
|
@@ -32447,7 +32673,7 @@ var init_HLSView = __esm({
|
|
|
32447
32673
|
r: "$1"
|
|
32448
32674
|
}
|
|
32449
32675
|
}
|
|
32450
|
-
), /* @__PURE__ */
|
|
32676
|
+
), /* @__PURE__ */ import_react198.default.createElement(
|
|
32451
32677
|
Text,
|
|
32452
32678
|
{
|
|
32453
32679
|
variant: "$body1",
|
|
@@ -32458,8 +32684,8 @@ var init_HLSView = __esm({
|
|
|
32458
32684
|
},
|
|
32459
32685
|
isVideoLive ? "LIVE" : "GO LIVE"
|
|
32460
32686
|
)))
|
|
32461
|
-
), (isMobile || isLandscape) && !isVideoLive && ((_g = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _g.playlist_type) ===
|
|
32462
|
-
/* @__PURE__ */
|
|
32687
|
+
), (isMobile || isLandscape) && !isVideoLive && ((_g = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _g.playlist_type) === import_react_sdk99.HLSPlaylistType.DVR ? /* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Duration, null) : null),
|
|
32688
|
+
/* @__PURE__ */ import_react198.default.createElement(HMSVideoPlayer.Controls.Right, null, hasCaptions && !(isMobile || isLandscape) && /* @__PURE__ */ import_react198.default.createElement(HLSCaptionSelector, { isEnabled: isCaptionEnabled }), availableLayers.length > 0 && !(isMobile || isLandscape) ? /* @__PURE__ */ import_react198.default.createElement(
|
|
32463
32689
|
HLSQualitySelector,
|
|
32464
32690
|
{
|
|
32465
32691
|
layers: availableLayers,
|
|
@@ -32469,13 +32695,13 @@ var init_HLSView = __esm({
|
|
|
32469
32695
|
onQualityChange: handleQuality,
|
|
32470
32696
|
isAuto: isUserSelectedAuto
|
|
32471
32697
|
}
|
|
32472
|
-
) : null, isFullScreenSupported ? /* @__PURE__ */
|
|
32698
|
+
) : null, isFullScreenSupported ? /* @__PURE__ */ import_react198.default.createElement(FullScreenButton2, { isFullScreen, onToggle: toggle }) : null)
|
|
32473
32699
|
)
|
|
32474
32700
|
))
|
|
32475
32701
|
)
|
|
32476
32702
|
)),
|
|
32477
|
-
/* @__PURE__ */
|
|
32478
|
-
isMobile && !isFullScreen && /* @__PURE__ */
|
|
32703
|
+
/* @__PURE__ */ import_react198.default.createElement(ToggleChat, { isFullScreen }),
|
|
32704
|
+
isMobile && !isFullScreen && /* @__PURE__ */ import_react198.default.createElement(HLSViewTitle, null)
|
|
32479
32705
|
);
|
|
32480
32706
|
};
|
|
32481
32707
|
HLSView_default = HLSView;
|
|
@@ -32483,14 +32709,14 @@ var init_HLSView = __esm({
|
|
|
32483
32709
|
});
|
|
32484
32710
|
|
|
32485
32711
|
// src/Prebuilt/layouts/VideoStreamingSection.tsx
|
|
32486
|
-
var
|
|
32712
|
+
var import_react199, import_ts_pattern13, import_react_sdk100, HLSView2, VideoStreamingSection;
|
|
32487
32713
|
var init_VideoStreamingSection = __esm({
|
|
32488
32714
|
"src/Prebuilt/layouts/VideoStreamingSection.tsx"() {
|
|
32489
32715
|
"use strict";
|
|
32490
32716
|
init_define_process_env();
|
|
32491
|
-
|
|
32717
|
+
import_react199 = __toESM(require("react"));
|
|
32492
32718
|
import_ts_pattern13 = require("ts-pattern");
|
|
32493
|
-
|
|
32719
|
+
import_react_sdk100 = require("@100mslive/react-sdk");
|
|
32494
32720
|
init_FullPageProgress();
|
|
32495
32721
|
init_GridLayout();
|
|
32496
32722
|
init_Layout();
|
|
@@ -32498,26 +32724,27 @@ var init_VideoStreamingSection = __esm({
|
|
|
32498
32724
|
init_PDFView();
|
|
32499
32725
|
init_SidePane();
|
|
32500
32726
|
init_WaitingView();
|
|
32727
|
+
init_CaptionsViewer();
|
|
32501
32728
|
init_useUISettings();
|
|
32502
32729
|
init_useCloseScreenshareWhiteboard();
|
|
32503
32730
|
init_hooks();
|
|
32504
|
-
HLSView2 =
|
|
32731
|
+
HLSView2 = import_react199.default.lazy(() => Promise.resolve().then(() => (init_HLSView(), HLSView_exports)));
|
|
32505
32732
|
VideoStreamingSection = ({
|
|
32506
32733
|
screenType,
|
|
32507
32734
|
elements,
|
|
32508
32735
|
hideControls = false
|
|
32509
32736
|
}) => {
|
|
32510
32737
|
var _a8;
|
|
32511
|
-
const localPeerRole = (0,
|
|
32512
|
-
const isConnected = (0,
|
|
32513
|
-
const hmsActions = (0,
|
|
32738
|
+
const localPeerRole = (0, import_react_sdk100.useHMSStore)(import_react_sdk100.selectLocalPeerRoleName);
|
|
32739
|
+
const isConnected = (0, import_react_sdk100.useHMSStore)(import_react_sdk100.selectIsConnectedToRoom);
|
|
32740
|
+
const hmsActions = (0, import_react_sdk100.useHMSActions)();
|
|
32514
32741
|
const waitingViewerRole = useWaitingViewerRole();
|
|
32515
32742
|
const urlToIframe = useUrlToEmbed();
|
|
32516
32743
|
const pdfAnnotatorActive = usePDFConfig();
|
|
32517
32744
|
const isMobileHLSStream = useMobileHLSStream();
|
|
32518
32745
|
const isLandscapeHLSStream = useLandscapeHLSStream();
|
|
32519
32746
|
useCloseScreenshareWhiteboard();
|
|
32520
|
-
(0,
|
|
32747
|
+
(0, import_react199.useEffect)(() => {
|
|
32521
32748
|
if (!isConnected) {
|
|
32522
32749
|
return;
|
|
32523
32750
|
}
|
|
@@ -32532,7 +32759,7 @@ var init_VideoStreamingSection = __esm({
|
|
|
32532
32759
|
if (!localPeerRole) {
|
|
32533
32760
|
return null;
|
|
32534
32761
|
}
|
|
32535
|
-
return /* @__PURE__ */
|
|
32762
|
+
return /* @__PURE__ */ import_react199.default.createElement(import_react199.Suspense, { fallback: /* @__PURE__ */ import_react199.default.createElement(FullPageProgress_default, null) }, /* @__PURE__ */ import_react199.default.createElement(
|
|
32536
32763
|
Flex,
|
|
32537
32764
|
{
|
|
32538
32765
|
css: {
|
|
@@ -32546,21 +32773,22 @@ var init_VideoStreamingSection = __esm({
|
|
|
32546
32773
|
{
|
|
32547
32774
|
screenType: "hls_live_streaming"
|
|
32548
32775
|
},
|
|
32549
|
-
() => /* @__PURE__ */
|
|
32776
|
+
() => /* @__PURE__ */ import_react199.default.createElement(HLSView2, null)
|
|
32550
32777
|
).when(
|
|
32551
32778
|
({ localPeerRole: localPeerRole2 }) => localPeerRole2 === waitingViewerRole,
|
|
32552
|
-
() => /* @__PURE__ */
|
|
32779
|
+
() => /* @__PURE__ */ import_react199.default.createElement(WaitingView, null)
|
|
32553
32780
|
).when(
|
|
32554
32781
|
({ pdfAnnotatorActive: pdfAnnotatorActive2 }) => !!pdfAnnotatorActive2,
|
|
32555
|
-
() => /* @__PURE__ */
|
|
32782
|
+
() => /* @__PURE__ */ import_react199.default.createElement(PDFView, null)
|
|
32556
32783
|
).when(
|
|
32557
32784
|
({ urlToIframe: urlToIframe2 }) => !!urlToIframe2,
|
|
32558
|
-
() => /* @__PURE__ */
|
|
32785
|
+
() => /* @__PURE__ */ import_react199.default.createElement(EmbedView, null)
|
|
32559
32786
|
).otherwise(() => {
|
|
32560
32787
|
var _a9;
|
|
32561
|
-
return /* @__PURE__ */
|
|
32788
|
+
return /* @__PURE__ */ import_react199.default.createElement(GridLayout, __spreadValues({}, (_a9 = elements == null ? void 0 : elements.video_tile_layout) == null ? void 0 : _a9.grid));
|
|
32562
32789
|
}),
|
|
32563
|
-
/* @__PURE__ */
|
|
32790
|
+
/* @__PURE__ */ import_react199.default.createElement(CaptionsViewer, null),
|
|
32791
|
+
/* @__PURE__ */ import_react199.default.createElement(
|
|
32564
32792
|
Box,
|
|
32565
32793
|
{
|
|
32566
32794
|
css: {
|
|
@@ -32572,7 +32800,7 @@ var init_VideoStreamingSection = __esm({
|
|
|
32572
32800
|
overflowY: "clip"
|
|
32573
32801
|
}
|
|
32574
32802
|
},
|
|
32575
|
-
/* @__PURE__ */
|
|
32803
|
+
/* @__PURE__ */ import_react199.default.createElement(
|
|
32576
32804
|
SidePane_default,
|
|
32577
32805
|
{
|
|
32578
32806
|
screenType,
|
|
@@ -32587,13 +32815,13 @@ var init_VideoStreamingSection = __esm({
|
|
|
32587
32815
|
});
|
|
32588
32816
|
|
|
32589
32817
|
// src/Prebuilt/components/Header/RoomDetailsHeader.tsx
|
|
32590
|
-
var
|
|
32818
|
+
var import_react200, import_react_use45, import_react_icons96, RoomDetailsHeader;
|
|
32591
32819
|
var init_RoomDetailsHeader = __esm({
|
|
32592
32820
|
"src/Prebuilt/components/Header/RoomDetailsHeader.tsx"() {
|
|
32593
32821
|
"use strict";
|
|
32594
32822
|
init_define_process_env();
|
|
32595
|
-
|
|
32596
|
-
|
|
32823
|
+
import_react200 = __toESM(require("react"));
|
|
32824
|
+
import_react_use45 = require("react-use");
|
|
32597
32825
|
import_react_icons96 = require("@100mslive/react-icons");
|
|
32598
32826
|
init_Layout();
|
|
32599
32827
|
init_Text2();
|
|
@@ -32604,33 +32832,33 @@ var init_RoomDetailsHeader = __esm({
|
|
|
32604
32832
|
init_constants();
|
|
32605
32833
|
RoomDetailsHeader = () => {
|
|
32606
32834
|
const { title, description } = useRoomLayoutHeader();
|
|
32607
|
-
const isMobile = (0,
|
|
32835
|
+
const isMobile = (0, import_react_use45.useMedia)(config.media.md);
|
|
32608
32836
|
const clipLength = 30;
|
|
32609
32837
|
const toggleDetailsPane = useSidepaneToggle(SIDE_PANE_OPTIONS.ROOM_DETAILS);
|
|
32610
32838
|
const toggleDetailsSheet = useSheetToggle(SHEET_OPTIONS.ROOM_DETAILS);
|
|
32611
32839
|
if (!title && !description || isMobile && !title) {
|
|
32612
32840
|
return null;
|
|
32613
32841
|
}
|
|
32614
|
-
return /* @__PURE__ */
|
|
32842
|
+
return /* @__PURE__ */ import_react200.default.createElement(Flex, { direction: isMobile ? "row" : "column", css: { ml: "$8", alignItems: isMobile ? "center" : "start" } }, /* @__PURE__ */ import_react200.default.createElement(Text, { variant: "sm", css: { c: "$on_surface_high", fontWeight: "$semiBold" } }, title), !isMobile && /* @__PURE__ */ import_react200.default.createElement(Flex, { align: "end", css: { color: "$on_surface_high" } }, /* @__PURE__ */ import_react200.default.createElement(Text, { variant: "xs", css: { c: "$on_surface_medium" } }, description.slice(0, clipLength)), description.length > clipLength ? /* @__PURE__ */ import_react200.default.createElement(
|
|
32615
32843
|
"span",
|
|
32616
32844
|
{
|
|
32617
32845
|
style: { fontWeight: "600", fontSize: "12px", cursor: "pointer", lineHeight: "1rem" },
|
|
32618
32846
|
onClick: toggleDetailsPane
|
|
32619
32847
|
},
|
|
32620
32848
|
"\xA0...more"
|
|
32621
|
-
) : null), isMobile && description ? /* @__PURE__ */
|
|
32849
|
+
) : null), isMobile && description ? /* @__PURE__ */ import_react200.default.createElement(Flex, { css: { color: "$on_surface_medium" } }, /* @__PURE__ */ import_react200.default.createElement(import_react_icons96.ChevronRightIcon, { height: 16, width: 16, onClick: toggleDetailsSheet })) : null);
|
|
32622
32850
|
};
|
|
32623
32851
|
}
|
|
32624
32852
|
});
|
|
32625
32853
|
|
|
32626
32854
|
// src/Prebuilt/components/Header/common.jsx
|
|
32627
|
-
var
|
|
32855
|
+
var import_react201, import_react_sdk101, import_react_icons97, CamaraFlipActions, AudioActions, AudioSelectionSheet, SelectWithLabel;
|
|
32628
32856
|
var init_common2 = __esm({
|
|
32629
32857
|
"src/Prebuilt/components/Header/common.jsx"() {
|
|
32630
32858
|
"use strict";
|
|
32631
32859
|
init_define_process_env();
|
|
32632
|
-
|
|
32633
|
-
|
|
32860
|
+
import_react201 = __toESM(require("react"));
|
|
32861
|
+
import_react_sdk101 = require("@100mslive/react-sdk");
|
|
32634
32862
|
import_react_icons97 = require("@100mslive/react-icons");
|
|
32635
32863
|
init_Divider2();
|
|
32636
32864
|
init_Label2();
|
|
@@ -32640,16 +32868,16 @@ var init_common2 = __esm({
|
|
|
32640
32868
|
init_IconButton3();
|
|
32641
32869
|
init_ToastManager();
|
|
32642
32870
|
CamaraFlipActions = () => {
|
|
32643
|
-
const actions = (0,
|
|
32644
|
-
const { allDevices } = (0,
|
|
32871
|
+
const actions = (0, import_react_sdk101.useHMSActions)();
|
|
32872
|
+
const { allDevices } = (0, import_react_sdk101.useDevices)();
|
|
32645
32873
|
const { videoInput } = allDevices;
|
|
32646
|
-
const isVideoOn = (0,
|
|
32647
|
-
const videoTrackId = (0,
|
|
32648
|
-
const localVideoTrack = (0,
|
|
32874
|
+
const isVideoOn = (0, import_react_sdk101.useHMSStore)(import_react_sdk101.selectIsLocalVideoEnabled);
|
|
32875
|
+
const videoTrackId = (0, import_react_sdk101.useHMSStore)(import_react_sdk101.selectLocalVideoTrackID);
|
|
32876
|
+
const localVideoTrack = (0, import_react_sdk101.useHMSStore)((0, import_react_sdk101.selectVideoTrackByID)(videoTrackId));
|
|
32649
32877
|
if (!videoInput || !(videoInput == null ? void 0 : videoInput.length) || !(localVideoTrack == null ? void 0 : localVideoTrack.facingMode)) {
|
|
32650
32878
|
return null;
|
|
32651
32879
|
}
|
|
32652
|
-
return /* @__PURE__ */
|
|
32880
|
+
return /* @__PURE__ */ import_react201.default.createElement(Box, null, /* @__PURE__ */ import_react201.default.createElement(
|
|
32653
32881
|
IconButton_default,
|
|
32654
32882
|
{
|
|
32655
32883
|
disabled: !isVideoOn,
|
|
@@ -32664,11 +32892,11 @@ var init_common2 = __esm({
|
|
|
32664
32892
|
}
|
|
32665
32893
|
})
|
|
32666
32894
|
},
|
|
32667
|
-
/* @__PURE__ */
|
|
32895
|
+
/* @__PURE__ */ import_react201.default.createElement(import_react_icons97.CameraFlipIcon, null)
|
|
32668
32896
|
));
|
|
32669
32897
|
};
|
|
32670
32898
|
AudioActions = () => {
|
|
32671
|
-
const { allDevices, selectedDeviceIDs, updateDevice } = (0,
|
|
32899
|
+
const { allDevices, selectedDeviceIDs, updateDevice } = (0, import_react_sdk101.useDevices)();
|
|
32672
32900
|
const shouldShowAudioOutput = "setSinkId" in HTMLMediaElement.prototype;
|
|
32673
32901
|
const { audioInput, audioOutput } = allDevices;
|
|
32674
32902
|
let availableAudioDevices = audioInput;
|
|
@@ -32677,19 +32905,19 @@ var init_common2 = __esm({
|
|
|
32677
32905
|
availableAudioDevices = audioOutput;
|
|
32678
32906
|
selectedAudio = selectedDeviceIDs.audioOutput;
|
|
32679
32907
|
}
|
|
32680
|
-
const hmsActions = (0,
|
|
32908
|
+
const hmsActions = (0, import_react_sdk101.useHMSActions)();
|
|
32681
32909
|
const audioFiltered = availableAudioDevices == null ? void 0 : availableAudioDevices.find((item) => !!item.label);
|
|
32682
32910
|
const currentSelection = availableAudioDevices == null ? void 0 : availableAudioDevices.find((item) => item.deviceId === selectedAudio);
|
|
32683
32911
|
if (!audioFiltered) {
|
|
32684
32912
|
return null;
|
|
32685
32913
|
}
|
|
32686
|
-
let AudioIcon = /* @__PURE__ */
|
|
32914
|
+
let AudioIcon = /* @__PURE__ */ import_react201.default.createElement(import_react_icons97.SpeakerIcon, null);
|
|
32687
32915
|
if (currentSelection && currentSelection.label.toLowerCase().includes("bluetooth")) {
|
|
32688
|
-
AudioIcon = /* @__PURE__ */
|
|
32916
|
+
AudioIcon = /* @__PURE__ */ import_react201.default.createElement(import_react_icons97.BluetoothIcon, null);
|
|
32689
32917
|
} else if (currentSelection && currentSelection.label.toLowerCase().includes("wired")) {
|
|
32690
|
-
AudioIcon = /* @__PURE__ */
|
|
32918
|
+
AudioIcon = /* @__PURE__ */ import_react201.default.createElement(import_react_icons97.HeadphonesIcon, null);
|
|
32691
32919
|
}
|
|
32692
|
-
return /* @__PURE__ */
|
|
32920
|
+
return /* @__PURE__ */ import_react201.default.createElement(
|
|
32693
32921
|
AudioSelectionSheet,
|
|
32694
32922
|
{
|
|
32695
32923
|
audioDevices: availableAudioDevices,
|
|
@@ -32698,7 +32926,7 @@ var init_common2 = __esm({
|
|
|
32698
32926
|
try {
|
|
32699
32927
|
yield updateDevice({
|
|
32700
32928
|
deviceId,
|
|
32701
|
-
deviceType: shouldShowAudioOutput ?
|
|
32929
|
+
deviceType: shouldShowAudioOutput ? import_react_sdk101.DeviceType.audioOutput : import_react_sdk101.DeviceType.audioInput
|
|
32702
32930
|
});
|
|
32703
32931
|
} catch (e) {
|
|
32704
32932
|
ToastManager.addToast({
|
|
@@ -32708,19 +32936,19 @@ var init_common2 = __esm({
|
|
|
32708
32936
|
}
|
|
32709
32937
|
})
|
|
32710
32938
|
},
|
|
32711
|
-
/* @__PURE__ */
|
|
32939
|
+
/* @__PURE__ */ import_react201.default.createElement(
|
|
32712
32940
|
Box,
|
|
32713
32941
|
{
|
|
32714
32942
|
onClick: () => __async(void 0, null, function* () {
|
|
32715
32943
|
yield hmsActions.refreshDevices();
|
|
32716
32944
|
})
|
|
32717
32945
|
},
|
|
32718
|
-
/* @__PURE__ */
|
|
32946
|
+
/* @__PURE__ */ import_react201.default.createElement(IconButton_default, null, AudioIcon, " ")
|
|
32719
32947
|
)
|
|
32720
32948
|
);
|
|
32721
32949
|
};
|
|
32722
32950
|
AudioSelectionSheet = ({ audioDevices, audioSelected, onChange, children }) => {
|
|
32723
|
-
return /* @__PURE__ */
|
|
32951
|
+
return /* @__PURE__ */ import_react201.default.createElement(Sheet.Root, null, /* @__PURE__ */ import_react201.default.createElement(Sheet.Trigger, { asChild: true }, children), /* @__PURE__ */ import_react201.default.createElement(Sheet.Content, null, /* @__PURE__ */ import_react201.default.createElement(Sheet.Title, { css: { py: "$10", px: "$8", alignItems: "center" } }, /* @__PURE__ */ import_react201.default.createElement(Flex, { direction: "row", justify: "between", css: { w: "100%" } }, /* @__PURE__ */ import_react201.default.createElement(Text, { variant: "h6", css: { display: "flex" } }, "Audio"), /* @__PURE__ */ import_react201.default.createElement(Sheet.Close, null, /* @__PURE__ */ import_react201.default.createElement(IconButton_default, { as: "div", "data-testid": "dialog_cross_icon" }, /* @__PURE__ */ import_react201.default.createElement(import_react_icons97.CrossIcon, null))))), /* @__PURE__ */ import_react201.default.createElement(HorizontalDivider, null), /* @__PURE__ */ import_react201.default.createElement(
|
|
32724
32952
|
Flex,
|
|
32725
32953
|
{
|
|
32726
32954
|
direction: "column",
|
|
@@ -32731,7 +32959,7 @@ var init_common2 = __esm({
|
|
|
32731
32959
|
}
|
|
32732
32960
|
},
|
|
32733
32961
|
audioDevices.map((audioDevice) => {
|
|
32734
|
-
return /* @__PURE__ */
|
|
32962
|
+
return /* @__PURE__ */ import_react201.default.createElement(
|
|
32735
32963
|
SelectWithLabel,
|
|
32736
32964
|
{
|
|
32737
32965
|
key: audioDevice.deviceId,
|
|
@@ -32744,8 +32972,8 @@ var init_common2 = __esm({
|
|
|
32744
32972
|
})
|
|
32745
32973
|
)));
|
|
32746
32974
|
};
|
|
32747
|
-
SelectWithLabel = ({ label, icon = /* @__PURE__ */
|
|
32748
|
-
return /* @__PURE__ */
|
|
32975
|
+
SelectWithLabel = ({ label, icon = /* @__PURE__ */ import_react201.default.createElement(import_react201.default.Fragment, null), checked, id, onChange }) => {
|
|
32976
|
+
return /* @__PURE__ */ import_react201.default.createElement(
|
|
32749
32977
|
Flex,
|
|
32750
32978
|
{
|
|
32751
32979
|
align: "center",
|
|
@@ -32757,7 +32985,7 @@ var init_common2 = __esm({
|
|
|
32757
32985
|
},
|
|
32758
32986
|
onClick: onChange
|
|
32759
32987
|
},
|
|
32760
|
-
/* @__PURE__ */
|
|
32988
|
+
/* @__PURE__ */ import_react201.default.createElement(
|
|
32761
32989
|
Label3,
|
|
32762
32990
|
{
|
|
32763
32991
|
htmlFor: id,
|
|
@@ -32775,33 +33003,33 @@ var init_common2 = __esm({
|
|
|
32775
33003
|
icon,
|
|
32776
33004
|
label
|
|
32777
33005
|
),
|
|
32778
|
-
checked && /* @__PURE__ */
|
|
33006
|
+
checked && /* @__PURE__ */ import_react201.default.createElement(import_react_icons97.CheckIcon, { width: 24, height: 24 })
|
|
32779
33007
|
);
|
|
32780
33008
|
};
|
|
32781
33009
|
}
|
|
32782
33010
|
});
|
|
32783
33011
|
|
|
32784
33012
|
// src/Prebuilt/components/Header/Header.tsx
|
|
32785
|
-
var
|
|
33013
|
+
var import_react202, import_react_use46, import_react_sdk102, Header2;
|
|
32786
33014
|
var init_Header = __esm({
|
|
32787
33015
|
"src/Prebuilt/components/Header/Header.tsx"() {
|
|
32788
33016
|
"use strict";
|
|
32789
33017
|
init_define_process_env();
|
|
32790
|
-
|
|
32791
|
-
|
|
32792
|
-
|
|
33018
|
+
import_react202 = __toESM(require("react"));
|
|
33019
|
+
import_react_use46 = require("react-use");
|
|
33020
|
+
import_react_sdk102 = require("@100mslive/react-sdk");
|
|
32793
33021
|
init_src();
|
|
32794
33022
|
init_HeaderComponents();
|
|
32795
33023
|
init_RoomDetailsHeader();
|
|
32796
33024
|
init_StreamActions();
|
|
32797
33025
|
init_common2();
|
|
32798
33026
|
Header2 = () => {
|
|
32799
|
-
const roomState = (0,
|
|
32800
|
-
const isMobile = (0,
|
|
32801
|
-
if (roomState !==
|
|
32802
|
-
return /* @__PURE__ */
|
|
33027
|
+
const roomState = (0, import_react_sdk102.useHMSStore)(import_react_sdk102.selectRoomState);
|
|
33028
|
+
const isMobile = (0, import_react_use46.useMedia)(config.media.md);
|
|
33029
|
+
if (roomState !== import_react_sdk102.HMSRoomState.Connected) {
|
|
33030
|
+
return /* @__PURE__ */ import_react202.default.createElement(import_react202.default.Fragment, null);
|
|
32803
33031
|
}
|
|
32804
|
-
return /* @__PURE__ */
|
|
33032
|
+
return /* @__PURE__ */ import_react202.default.createElement(Flex, { justify: "between", align: "center", css: { position: "relative", height: "100%" } }, /* @__PURE__ */ import_react202.default.createElement(Flex, { align: "center", gap: "2", css: { position: "absolute", left: "$10" } }, /* @__PURE__ */ import_react202.default.createElement(Logo, null), /* @__PURE__ */ import_react202.default.createElement(RoomDetailsHeader, null), /* @__PURE__ */ import_react202.default.createElement(SpeakerTag, null), isMobile && /* @__PURE__ */ import_react202.default.createElement(Flex, { align: "center", css: { gap: "$4" } }, /* @__PURE__ */ import_react202.default.createElement(LiveStatus, null), /* @__PURE__ */ import_react202.default.createElement(RecordingStatus, null), /* @__PURE__ */ import_react202.default.createElement(RecordingPauseStatus, null))), /* @__PURE__ */ import_react202.default.createElement(
|
|
32805
33033
|
Flex,
|
|
32806
33034
|
{
|
|
32807
33035
|
align: "center",
|
|
@@ -32811,8 +33039,8 @@ var init_Header = __esm({
|
|
|
32811
33039
|
gap: "$4"
|
|
32812
33040
|
}
|
|
32813
33041
|
},
|
|
32814
|
-
/* @__PURE__ */
|
|
32815
|
-
isMobile ? /* @__PURE__ */
|
|
33042
|
+
/* @__PURE__ */ import_react202.default.createElement(StreamActions, null),
|
|
33043
|
+
isMobile ? /* @__PURE__ */ import_react202.default.createElement(import_react202.default.Fragment, null, /* @__PURE__ */ import_react202.default.createElement(CamaraFlipActions, null), /* @__PURE__ */ import_react202.default.createElement(AudioActions, null)) : null
|
|
32816
33044
|
));
|
|
32817
33045
|
};
|
|
32818
33046
|
}
|
|
@@ -32828,25 +33056,25 @@ var init_Header2 = __esm({
|
|
|
32828
33056
|
});
|
|
32829
33057
|
|
|
32830
33058
|
// src/Prebuilt/components/PreviousRoleInMetadata.tsx
|
|
32831
|
-
var
|
|
33059
|
+
var import_react203, import_react_sdk103, PreviousRoleInMetadata;
|
|
32832
33060
|
var init_PreviousRoleInMetadata = __esm({
|
|
32833
33061
|
"src/Prebuilt/components/PreviousRoleInMetadata.tsx"() {
|
|
32834
33062
|
"use strict";
|
|
32835
33063
|
init_define_process_env();
|
|
32836
|
-
|
|
32837
|
-
|
|
33064
|
+
import_react203 = require("react");
|
|
33065
|
+
import_react_sdk103 = require("@100mslive/react-sdk");
|
|
32838
33066
|
init_useMetadata();
|
|
32839
33067
|
PreviousRoleInMetadata = () => {
|
|
32840
|
-
const vanillaStore = (0,
|
|
33068
|
+
const vanillaStore = (0, import_react_sdk103.useHMSVanillaStore)();
|
|
32841
33069
|
const { updateMetaData } = useMyMetadata();
|
|
32842
|
-
(0,
|
|
32843
|
-
let previousRole = vanillaStore.getState(
|
|
33070
|
+
(0, import_react203.useEffect)(() => {
|
|
33071
|
+
let previousRole = vanillaStore.getState(import_react_sdk103.selectLocalPeerRoleName);
|
|
32844
33072
|
const unsubscribe = vanillaStore.subscribe((currentRole) => {
|
|
32845
33073
|
if (previousRole !== currentRole && currentRole) {
|
|
32846
33074
|
updateMetaData({ prevRole: previousRole });
|
|
32847
33075
|
previousRole = currentRole;
|
|
32848
33076
|
}
|
|
32849
|
-
},
|
|
33077
|
+
}, import_react_sdk103.selectLocalPeerRoleName);
|
|
32850
33078
|
return unsubscribe;
|
|
32851
33079
|
}, [vanillaStore]);
|
|
32852
33080
|
return null;
|
|
@@ -32854,207 +33082,13 @@ var init_PreviousRoleInMetadata = __esm({
|
|
|
32854
33082
|
}
|
|
32855
33083
|
});
|
|
32856
33084
|
|
|
32857
|
-
// src/Prebuilt/plugins/CaptionsViewer.tsx
|
|
32858
|
-
var import_react203, import_react_sdk103, SimpleQueue, Queue, CaptionMaintainerQueue, TranscriptView, CaptionsViewer;
|
|
32859
|
-
var init_CaptionsViewer = __esm({
|
|
32860
|
-
"src/Prebuilt/plugins/CaptionsViewer.tsx"() {
|
|
32861
|
-
"use strict";
|
|
32862
|
-
init_define_process_env();
|
|
32863
|
-
import_react203 = __toESM(require("react"));
|
|
32864
|
-
import_react_sdk103 = require("@100mslive/react-sdk");
|
|
32865
|
-
init_Layout();
|
|
32866
|
-
init_Text2();
|
|
32867
|
-
SimpleQueue = class {
|
|
32868
|
-
constructor(capacity = 3, MAX_STORAGE_TIME = 5e3) {
|
|
32869
|
-
this.capacity = capacity;
|
|
32870
|
-
this.MAX_STORAGE_TIME = MAX_STORAGE_TIME;
|
|
32871
|
-
this.storage = [];
|
|
32872
|
-
}
|
|
32873
|
-
enqueue(data3) {
|
|
32874
|
-
var _a8;
|
|
32875
|
-
if (this.size() === this.capacity && this.storage[this.size() - 1].final) {
|
|
32876
|
-
this.dequeue(this.storage[this.size() - 1]);
|
|
32877
|
-
}
|
|
32878
|
-
if (this.size() === 0) {
|
|
32879
|
-
this.storage.push(data3);
|
|
32880
|
-
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
32881
|
-
return;
|
|
32882
|
-
}
|
|
32883
|
-
if (this.size() > 0 && ((_a8 = this.storage[this.size() - 1]) == null ? void 0 : _a8.final) === true) {
|
|
32884
|
-
this.storage.push(data3);
|
|
32885
|
-
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
32886
|
-
return;
|
|
32887
|
-
}
|
|
32888
|
-
this.storage[this.size() - 1].transcript = data3.transcript;
|
|
32889
|
-
this.storage[this.size() - 1].final = data3.final;
|
|
32890
|
-
this.storage[this.size() - 1].end = data3.end;
|
|
32891
|
-
this.addTimeout(this.storage[this.size() - 1], data3.final);
|
|
32892
|
-
}
|
|
32893
|
-
addTimeout(item, isFinal) {
|
|
32894
|
-
if (!isFinal) {
|
|
32895
|
-
return;
|
|
32896
|
-
}
|
|
32897
|
-
item.timeout = setTimeout(() => {
|
|
32898
|
-
this.dequeue(item);
|
|
32899
|
-
}, this.MAX_STORAGE_TIME);
|
|
32900
|
-
}
|
|
32901
|
-
dequeue(item) {
|
|
32902
|
-
const index = this.storage.indexOf(item);
|
|
32903
|
-
if (index === -1) {
|
|
32904
|
-
return void 0;
|
|
32905
|
-
}
|
|
32906
|
-
const removedItem = this.storage.splice(index, 1);
|
|
32907
|
-
if (removedItem.length <= 0) {
|
|
32908
|
-
return void 0;
|
|
32909
|
-
}
|
|
32910
|
-
this.clearTimeout(removedItem[0]);
|
|
32911
|
-
return item;
|
|
32912
|
-
}
|
|
32913
|
-
clearTimeout(item) {
|
|
32914
|
-
if (!item.timeout) {
|
|
32915
|
-
return;
|
|
32916
|
-
}
|
|
32917
|
-
clearTimeout(item.timeout);
|
|
32918
|
-
}
|
|
32919
|
-
peek() {
|
|
32920
|
-
if (this.size() <= 0) {
|
|
32921
|
-
return void 0;
|
|
32922
|
-
}
|
|
32923
|
-
return this.storage[0];
|
|
32924
|
-
}
|
|
32925
|
-
getTranscription() {
|
|
32926
|
-
let script = "";
|
|
32927
|
-
this.storage.forEach((value) => script += value.transcript + " ");
|
|
32928
|
-
return script;
|
|
32929
|
-
}
|
|
32930
|
-
reset() {
|
|
32931
|
-
this.storage.length = 0;
|
|
32932
|
-
}
|
|
32933
|
-
size() {
|
|
32934
|
-
return this.storage.length;
|
|
32935
|
-
}
|
|
32936
|
-
};
|
|
32937
|
-
Queue = class {
|
|
32938
|
-
constructor(capacity = 3) {
|
|
32939
|
-
this.capacity = capacity;
|
|
32940
|
-
this.storage = {};
|
|
32941
|
-
}
|
|
32942
|
-
enqueue(data3) {
|
|
32943
|
-
if (this.size() === this.capacity) {
|
|
32944
|
-
this.dequeue();
|
|
32945
|
-
}
|
|
32946
|
-
if (!this.storage[data3.peer_id]) {
|
|
32947
|
-
this.storage[data3.peer_id] = {
|
|
32948
|
-
peer_id: data3.peer_id,
|
|
32949
|
-
transcript: data3.transcript,
|
|
32950
|
-
final: data3.final,
|
|
32951
|
-
transcriptQueue: new SimpleQueue(),
|
|
32952
|
-
start: data3.start,
|
|
32953
|
-
end: data3.end
|
|
32954
|
-
};
|
|
32955
|
-
this.storage[data3.peer_id].transcriptQueue.enqueue(data3);
|
|
32956
|
-
return;
|
|
32957
|
-
}
|
|
32958
|
-
this.storage[data3.peer_id].transcriptQueue.enqueue(data3);
|
|
32959
|
-
}
|
|
32960
|
-
dequeue() {
|
|
32961
|
-
const key = Object.keys(this.storage).shift() || "";
|
|
32962
|
-
const captionData = this.storage[key];
|
|
32963
|
-
captionData.transcriptQueue.reset();
|
|
32964
|
-
delete this.storage[key];
|
|
32965
|
-
return captionData;
|
|
32966
|
-
}
|
|
32967
|
-
peek() {
|
|
32968
|
-
if (this.size() <= 0)
|
|
32969
|
-
return void 0;
|
|
32970
|
-
const key = Object.keys(this.storage).shift() || "";
|
|
32971
|
-
return this.storage[key];
|
|
32972
|
-
}
|
|
32973
|
-
findPeerData() {
|
|
32974
|
-
const keys = Object.keys(this.storage);
|
|
32975
|
-
const data3 = keys.map((key) => {
|
|
32976
|
-
const data4 = this.storage[key];
|
|
32977
|
-
const word = data4.transcriptQueue.getTranscription();
|
|
32978
|
-
return { [key]: word };
|
|
32979
|
-
});
|
|
32980
|
-
return data3;
|
|
32981
|
-
}
|
|
32982
|
-
size() {
|
|
32983
|
-
return Object.keys(this.storage).length;
|
|
32984
|
-
}
|
|
32985
|
-
};
|
|
32986
|
-
CaptionMaintainerQueue = class {
|
|
32987
|
-
constructor() {
|
|
32988
|
-
this.captionData = new Queue();
|
|
32989
|
-
}
|
|
32990
|
-
push(data3 = []) {
|
|
32991
|
-
data3.forEach((value) => {
|
|
32992
|
-
this.captionData.enqueue(value);
|
|
32993
|
-
});
|
|
32994
|
-
}
|
|
32995
|
-
};
|
|
32996
|
-
TranscriptView = ({ peer_id, data: data3 }) => {
|
|
32997
|
-
const peerName = (0, import_react_sdk103.useHMSStore)((0, import_react_sdk103.selectPeerNameByID)(peer_id)) || "Participant";
|
|
32998
|
-
data3 = data3.trim();
|
|
32999
|
-
if (!data3)
|
|
33000
|
-
return null;
|
|
33001
|
-
return /* @__PURE__ */ import_react203.default.createElement(
|
|
33002
|
-
Text,
|
|
33003
|
-
{
|
|
33004
|
-
variant: "body2",
|
|
33005
|
-
css: {
|
|
33006
|
-
fontWeight: "$normal"
|
|
33007
|
-
}
|
|
33008
|
-
},
|
|
33009
|
-
/* @__PURE__ */ import_react203.default.createElement("b", null, peerName, ": "),
|
|
33010
|
-
data3
|
|
33011
|
-
);
|
|
33012
|
-
};
|
|
33013
|
-
CaptionsViewer = () => {
|
|
33014
|
-
const [captionQueue] = (0, import_react203.useState)(new CaptionMaintainerQueue());
|
|
33015
|
-
const [currentData, setCurrentData] = (0, import_react203.useState)([]);
|
|
33016
|
-
(0, import_react203.useEffect)(() => {
|
|
33017
|
-
const timeInterval = setInterval(() => {
|
|
33018
|
-
var _a8;
|
|
33019
|
-
if (!captionQueue) {
|
|
33020
|
-
return;
|
|
33021
|
-
}
|
|
33022
|
-
const data3 = (_a8 = captionQueue.captionData) == null ? void 0 : _a8.findPeerData();
|
|
33023
|
-
setCurrentData(data3);
|
|
33024
|
-
}, 1e3);
|
|
33025
|
-
return () => clearInterval(timeInterval);
|
|
33026
|
-
}, [captionQueue]);
|
|
33027
|
-
(0, import_react_sdk103.useTranscript)({
|
|
33028
|
-
onTranscript: (data3) => {
|
|
33029
|
-
captionQueue && captionQueue.push(data3);
|
|
33030
|
-
}
|
|
33031
|
-
});
|
|
33032
|
-
const dataToShow = currentData.filter((data3) => {
|
|
33033
|
-
const key = Object.keys(data3)[0];
|
|
33034
|
-
if (data3[key]) {
|
|
33035
|
-
return true;
|
|
33036
|
-
}
|
|
33037
|
-
return false;
|
|
33038
|
-
});
|
|
33039
|
-
if (dataToShow.length <= 0) {
|
|
33040
|
-
return null;
|
|
33041
|
-
}
|
|
33042
|
-
return /* @__PURE__ */ import_react203.default.createElement(Flex, { direction: "column" }, dataToShow.map((data3, index) => {
|
|
33043
|
-
const key = Object.keys(data3)[0];
|
|
33044
|
-
return /* @__PURE__ */ import_react203.default.createElement(TranscriptView, { key: index, peer_id: key, data: data3[key] });
|
|
33045
|
-
}));
|
|
33046
|
-
};
|
|
33047
|
-
}
|
|
33048
|
-
});
|
|
33049
|
-
|
|
33050
33085
|
// src/Prebuilt/components/ConferenceScreen.tsx
|
|
33051
|
-
var import_react204,
|
|
33086
|
+
var import_react204, import_uuid12, import_react_sdk104, ConferenceScreen;
|
|
33052
33087
|
var init_ConferenceScreen = __esm({
|
|
33053
33088
|
"src/Prebuilt/components/ConferenceScreen.tsx"() {
|
|
33054
33089
|
"use strict";
|
|
33055
33090
|
init_define_process_env();
|
|
33056
33091
|
import_react204 = __toESM(require("react"));
|
|
33057
|
-
import_react_use46 = require("react-use");
|
|
33058
33092
|
import_uuid12 = require("uuid");
|
|
33059
33093
|
import_react_sdk104 = require("@100mslive/react-sdk");
|
|
33060
33094
|
init_Footer3();
|
|
@@ -33064,7 +33098,6 @@ var init_ConferenceScreen = __esm({
|
|
|
33064
33098
|
init_PIPManager();
|
|
33065
33099
|
init_RoleChangeRequestModal();
|
|
33066
33100
|
init_Layout();
|
|
33067
|
-
init_Theme();
|
|
33068
33101
|
init_AppContext();
|
|
33069
33102
|
init_VideoStreamingSection();
|
|
33070
33103
|
init_EmojiReaction();
|
|
@@ -33072,16 +33105,13 @@ var init_ConferenceScreen = __esm({
|
|
|
33072
33105
|
init_Header2();
|
|
33073
33106
|
init_PreviousRoleInMetadata();
|
|
33074
33107
|
init_RaiseHand();
|
|
33075
|
-
init_CaptionsViewer();
|
|
33076
33108
|
init_useRoomLayoutScreen();
|
|
33077
|
-
init_useSidepane();
|
|
33078
33109
|
init_useUISettings();
|
|
33079
33110
|
init_hooks();
|
|
33080
33111
|
init_constants();
|
|
33081
33112
|
ConferenceScreen = () => {
|
|
33082
|
-
var _a8, _b7, _c, _d, _e, _f
|
|
33113
|
+
var _a8, _b7, _c, _d, _e, _f;
|
|
33083
33114
|
const { userName, endpoints, onJoin: onJoinFunc } = useHMSPrebuiltContext();
|
|
33084
|
-
const isMobile = (0, import_react_use46.useMedia)(config.media.md);
|
|
33085
33115
|
const screenProps = useRoomLayoutConferencingScreen();
|
|
33086
33116
|
const { isPreviewScreenEnabled } = useRoomLayoutPreviewScreen();
|
|
33087
33117
|
const roomState = (0, import_react_sdk104.useHMSStore)(import_react_sdk104.selectRoomState);
|
|
@@ -33100,9 +33130,6 @@ var init_ConferenceScreen = __esm({
|
|
|
33100
33130
|
const isMobileHLSStream = useMobileHLSStream();
|
|
33101
33131
|
const isLandscapeHLSStream = useLandscapeHLSStream();
|
|
33102
33132
|
const isMwebHLSStream = isMobileHLSStream || isLandscapeHLSStream;
|
|
33103
|
-
const isCaptionEnabled = useIsCaptionEnabled();
|
|
33104
|
-
const isChatOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.CHAT);
|
|
33105
|
-
const showCaptionAtTop = ((_c = (_b7 = screenProps.elements) == null ? void 0 : _b7.chat) == null ? void 0 : _c.is_overlay) && isChatOpen && isMobile;
|
|
33106
33133
|
const toggleControls = () => {
|
|
33107
33134
|
var _a9;
|
|
33108
33135
|
if (((_a9 = dropdownListRef.current) == null ? void 0 : _a9.length) === 0 && isMobileDevice && !isMwebHLSStream) {
|
|
@@ -33149,35 +33176,14 @@ var init_ConferenceScreen = __esm({
|
|
|
33149
33176
|
return /* @__PURE__ */ import_react204.default.createElement(FullPageProgress_default, { text: roomState === import_react_sdk104.HMSRoomState.Connecting ? "Joining..." : "" });
|
|
33150
33177
|
}
|
|
33151
33178
|
const hideControlsForStreaming = isMwebHLSStream ? true : hideControls;
|
|
33152
|
-
return /* @__PURE__ */ import_react204.default.createElement(import_react204.default.Fragment, null, isHLSStarted ? /* @__PURE__ */ import_react204.default.createElement(Box, { css: { position: "fixed", zIndex: 100, w: "100%", h: "100%", left: 0, top: 0 } }, /* @__PURE__ */ import_react204.default.createElement(FullPageProgress_default, { text: "Starting live stream...", css: { opacity: 0.8, bg: "$background_dim" } })) : null,
|
|
33153
|
-
Box,
|
|
33154
|
-
{
|
|
33155
|
-
css: {
|
|
33156
|
-
position: "fixed",
|
|
33157
|
-
w: isMobile ? "100%" : "40%",
|
|
33158
|
-
bottom: showCaptionAtTop ? "" : hideControlsForStreaming ? "5%" : "10%",
|
|
33159
|
-
top: showCaptionAtTop ? hideControlsForStreaming ? "5%" : "10%" : "",
|
|
33160
|
-
left: isMobile ? 0 : "50%",
|
|
33161
|
-
transform: isMobile ? "" : "translateX(-50%)",
|
|
33162
|
-
background: "#000000A3",
|
|
33163
|
-
overflow: "clip",
|
|
33164
|
-
zIndex: 10,
|
|
33165
|
-
height: "fit-content",
|
|
33166
|
-
r: "$1",
|
|
33167
|
-
p: "$6",
|
|
33168
|
-
transition: "bottom 0.3s ease-in-out",
|
|
33169
|
-
"&:empty": { display: "none" }
|
|
33170
|
-
}
|
|
33171
|
-
},
|
|
33172
|
-
/* @__PURE__ */ import_react204.default.createElement(CaptionsViewer, null)
|
|
33173
|
-
), /* @__PURE__ */ import_react204.default.createElement(Flex, { css: { size: "100%", overflow: "hidden" }, direction: "column" }, !(screenProps.hideSections.includes("header") || isMwebHLSStream) && /* @__PURE__ */ import_react204.default.createElement(
|
|
33179
|
+
return /* @__PURE__ */ import_react204.default.createElement(import_react204.default.Fragment, null, isHLSStarted ? /* @__PURE__ */ import_react204.default.createElement(Box, { css: { position: "fixed", zIndex: 100, w: "100%", h: "100%", left: 0, top: 0 } }, /* @__PURE__ */ import_react204.default.createElement(FullPageProgress_default, { text: "Starting live stream...", css: { opacity: 0.8, bg: "$background_dim" } })) : null, /* @__PURE__ */ import_react204.default.createElement(Flex, { css: { size: "100%", overflow: "hidden" }, direction: "column" }, !(screenProps.hideSections.includes("header") || isMwebHLSStream) && /* @__PURE__ */ import_react204.default.createElement(
|
|
33174
33180
|
Box,
|
|
33175
33181
|
{
|
|
33176
33182
|
ref: headerRef,
|
|
33177
33183
|
css: {
|
|
33178
33184
|
h: "$18",
|
|
33179
33185
|
transition: "margin 0.3s ease-in-out",
|
|
33180
|
-
marginTop: hideControlsForStreaming ? `-${(
|
|
33186
|
+
marginTop: hideControlsForStreaming ? `-${(_b7 = headerRef.current) == null ? void 0 : _b7.clientHeight}px` : "none",
|
|
33181
33187
|
"@md": {
|
|
33182
33188
|
h: "$17"
|
|
33183
33189
|
}
|
|
@@ -33193,7 +33199,7 @@ var init_ConferenceScreen = __esm({
|
|
|
33193
33199
|
flex: "1 1 0",
|
|
33194
33200
|
minHeight: 0,
|
|
33195
33201
|
// @ts-ignore
|
|
33196
|
-
px: ((
|
|
33202
|
+
px: ((_e = (_d = (_c = screenProps == null ? void 0 : screenProps.elements) == null ? void 0 : _c.video_tile_layout) == null ? void 0 : _d.grid) == null ? void 0 : _e.edge_to_edge) ? 0 : "$10",
|
|
33197
33203
|
// TODO: padding to be controlled by section/element
|
|
33198
33204
|
paddingBottom: "env(safe-area-inset-bottom)",
|
|
33199
33205
|
"@lg": {
|
|
@@ -33221,7 +33227,7 @@ var init_ConferenceScreen = __esm({
|
|
|
33221
33227
|
maxHeight: "$24",
|
|
33222
33228
|
transition: "margin 0.3s ease-in-out",
|
|
33223
33229
|
bg: "$background_dim",
|
|
33224
|
-
marginBottom: hideControlsForStreaming ? `-${(
|
|
33230
|
+
marginBottom: hideControlsForStreaming ? `-${(_f = footerRef.current) == null ? void 0 : _f.clientHeight}px` : void 0,
|
|
33225
33231
|
"@md": {
|
|
33226
33232
|
maxHeight: "unset",
|
|
33227
33233
|
bg: screenProps.screenType === "hls_live_streaming" ? "transparent" : "$background_dim"
|