@100mslive/roomkit-react 0.2.6-alpha.6 → 0.2.6-alpha.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (11) hide show
  1. package/dist/{HLSView-4B4DD2HF.js → HLSView-XYQZRLID.js} +4 -12
  2. package/dist/{HLSView-4B4DD2HF.js.map → HLSView-XYQZRLID.js.map} +2 -2
  3. package/dist/{chunk-EMFS7SME.js → chunk-YHMYZQEP.js} +4 -4
  4. package/dist/{chunk-EMFS7SME.js.map → chunk-YHMYZQEP.js.map} +2 -2
  5. package/dist/index.cjs.js +4 -12
  6. package/dist/index.cjs.js.map +2 -2
  7. package/dist/index.js +1 -1
  8. package/dist/meta.cjs.json +5 -5
  9. package/dist/meta.esbuild.json +14 -14
  10. package/package.json +6 -6
  11. package/src/Prebuilt/layouts/HLSView.jsx +70 -83
package/dist/index.js CHANGED
@@ -62,7 +62,7 @@ import {
62
62
  theme,
63
63
  useBorderAudioLevel,
64
64
  useTheme
65
- } from "./chunk-EMFS7SME.js";
65
+ } from "./chunk-YHMYZQEP.js";
66
66
  export {
67
67
  Accordion,
68
68
  AudioLevel,
package/dist/meta.cjs.json CHANGED
@@ -10741,7 +10741,7 @@
10741
10741
  "format": "esm"
10742
10742
  },
10743
10743
  "src/Prebuilt/layouts/HLSView.jsx": {
10744
- "bytes": 18115,
10744
+ "bytes": 17554,
10745
10745
  "imports": [
10746
10746
  {
10747
10747
  "path": "react",
@@ -12790,7 +12790,7 @@
12790
12790
  "imports": [],
12791
12791
  "exports": [],
12792
12792
  "inputs": {},
12793
- "bytes": 3168374
12793
+ "bytes": 3167600
12794
12794
  },
12795
12795
  "dist/index.cjs.js": {
12796
12796
  "imports": [
@@ -15499,7 +15499,7 @@
15499
15499
  "entryPoint": "src/index.ts",
15500
15500
  "inputs": {
15501
15501
  "<define:process.env>": {
15502
- "bytesInOutput": 18178
15502
+ "bytesInOutput": 18167
15503
15503
  },
15504
15504
  "src/Theme/base.config.ts": {
15505
15505
  "bytesInOutput": 6104
@@ -16378,7 +16378,7 @@
16378
16378
  "bytesInOutput": 4598
16379
16379
  },
16380
16380
  "src/Prebuilt/layouts/HLSView.jsx": {
16381
- "bytesInOutput": 21671
16381
+ "bytesInOutput": 21219
16382
16382
  },
16383
16383
  "src/Prebuilt/layouts/VideoStreamingSection.tsx": {
16384
16384
  "bytesInOutput": 4111
@@ -16507,7 +16507,7 @@
16507
16507
  "bytesInOutput": 2980
16508
16508
  }
16509
16509
  },
16510
- "bytes": 1489182
16510
+ "bytes": 1488719
16511
16511
  }
16512
16512
  }
16513
16513
  }
package/dist/meta.esbuild.json CHANGED
@@ -10741,7 +10741,7 @@
10741
10741
  "format": "esm"
10742
10742
  },
10743
10743
  "src/Prebuilt/layouts/HLSView.jsx": {
10744
- "bytes": 18115,
10744
+ "bytes": 17554,
10745
10745
  "imports": [
10746
10746
  {
10747
10747
  "path": "react",
@@ -12795,7 +12795,7 @@
12795
12795
  "dist/index.js": {
12796
12796
  "imports": [
12797
12797
  {
12798
- "path": "dist/chunk-EMFS7SME.js",
12798
+ "path": "dist/chunk-YHMYZQEP.js",
12799
12799
  "kind": "import-statement"
12800
12800
  }
12801
12801
  ],
@@ -12868,16 +12868,16 @@
12868
12868
  "inputs": {},
12869
12869
  "bytes": 1822
12870
12870
  },
12871
- "dist/HLSView-4B4DD2HF.js.map": {
12871
+ "dist/HLSView-XYQZRLID.js.map": {
12872
12872
  "imports": [],
12873
12873
  "exports": [],
12874
12874
  "inputs": {},
12875
- "bytes": 59619
12875
+ "bytes": 58854
12876
12876
  },
12877
- "dist/HLSView-4B4DD2HF.js": {
12877
+ "dist/HLSView-XYQZRLID.js": {
12878
12878
  "imports": [
12879
12879
  {
12880
- "path": "dist/chunk-EMFS7SME.js",
12880
+ "path": "dist/chunk-YHMYZQEP.js",
12881
12881
  "kind": "import-statement"
12882
12882
  },
12883
12883
  {
@@ -12997,7 +12997,7 @@
12997
12997
  "entryPoint": "src/Prebuilt/layouts/HLSView.jsx",
12998
12998
  "inputs": {
12999
12999
  "src/Prebuilt/layouts/HLSView.jsx": {
13000
- "bytesInOutput": 17725
13000
+ "bytesInOutput": 17353
13001
13001
  },
13002
13002
  "src/Prebuilt/components/HlsStatsOverlay.jsx": {
13003
13003
  "bytesInOutput": 3521
@@ -13039,15 +13039,15 @@
13039
13039
  "bytesInOutput": 3992
13040
13040
  }
13041
13041
  },
13042
- "bytes": 37344
13042
+ "bytes": 36972
13043
13043
  },
13044
- "dist/chunk-EMFS7SME.js.map": {
13044
+ "dist/chunk-YHMYZQEP.js.map": {
13045
13045
  "imports": [],
13046
13046
  "exports": [],
13047
13047
  "inputs": {},
13048
- "bytes": 3104539
13048
+ "bytes": 3104535
13049
13049
  },
13050
- "dist/chunk-EMFS7SME.js": {
13050
+ "dist/chunk-YHMYZQEP.js": {
13051
13051
  "imports": [
13052
13052
  {
13053
13053
  "path": "react",
@@ -15300,7 +15300,7 @@
15300
15300
  "external": true
15301
15301
  },
15302
15302
  {
15303
- "path": "dist/HLSView-4B4DD2HF.js",
15303
+ "path": "dist/HLSView-XYQZRLID.js",
15304
15304
  "kind": "dynamic-import"
15305
15305
  },
15306
15306
  {
@@ -15722,7 +15722,7 @@
15722
15722
  ],
15723
15723
  "inputs": {
15724
15724
  "<define:process.env>": {
15725
- "bytesInOutput": 18178
15725
+ "bytesInOutput": 18167
15726
15726
  },
15727
15727
  "../../node_modules/lodash/lodash.js": {
15728
15728
  "bytesInOutput": 224267
@@ -16649,7 +16649,7 @@
16649
16649
  "bytesInOutput": 651
16650
16650
  }
16651
16651
  },
16652
- "bytes": 1266711
16652
+ "bytes": 1266700
16653
16653
  }
16654
16654
  }
16655
16655
  }
package/package.json CHANGED
@@ -10,7 +10,7 @@
10
10
  "prebuilt",
11
11
  "roomkit"
12
12
  ],
13
- "version": "0.2.6-alpha.6",
13
+ "version": "0.2.6-alpha.7",
14
14
  "author": "100ms",
15
15
  "license": "MIT",
16
16
  "repository": {
@@ -82,10 +82,10 @@
82
82
  "react": ">=17.0.2 <19.0.0"
83
83
  },
84
84
  "dependencies": {
85
- "@100mslive/hls-player": "0.2.6-alpha.6",
86
- "@100mslive/hms-virtual-background": "1.12.6-alpha.6",
87
- "@100mslive/react-icons": "0.9.6-alpha.6",
88
- "@100mslive/react-sdk": "0.9.6-alpha.6",
85
+ "@100mslive/hls-player": "0.2.6-alpha.7",
86
+ "@100mslive/hms-virtual-background": "1.12.6-alpha.7",
87
+ "@100mslive/react-icons": "0.9.6-alpha.7",
88
+ "@100mslive/react-sdk": "0.9.6-alpha.7",
89
89
  "@100mslive/types-prebuilt": "0.12.6",
90
90
  "@emoji-mart/data": "^1.0.6",
91
91
  "@emoji-mart/react": "^1.0.1",
@@ -120,5 +120,5 @@
120
120
  "uuid": "^8.3.2",
121
121
  "worker-timers": "^7.0.40"
122
122
  },
123
- "gitHead": "8ddd1423edf4da888a64da4f3ae1becbd5f11b62"
123
+ "gitHead": "bfc59894d860031e9aac66d839b0b3febdc3961b"
124
124
  }
package/src/Prebuilt/layouts/HLSView.jsx CHANGED
@@ -351,7 +351,6 @@ const HLSView = () => {
351
351
  </IconButton>
352
352
  </Box>
353
353
  )}
354
-
355
354
  <Flex
356
355
  ref={controlsRef}
357
356
  direction="column"
@@ -371,90 +370,78 @@ const HLSView = () => {
371
370
  }}
372
371
  >
373
372
  {!isMobile && (
374
- <Flex direction="column">
375
- <Box>
376
- {hlsPlayer && (
377
- <HMSVideoPlayer.Progress
378
- hlsPlayer={hlsPlayer}
379
- onValueChange={time => {
380
- hlsPlayer.seekTo(time);
381
- }}
382
- />
373
+ <HMSVideoPlayer.Controls.Root
374
+ css={{
375
+ p: '$4 $8',
376
+ }}
377
+ >
378
+ <HMSVideoPlayer.Controls.Left>
379
+ <HMSVideoPlayer.PlayButton
380
+ onClick={async () => {
381
+ isPaused ? await hlsPlayer?.play() : hlsPlayer?.pause();
382
+ }}
383
+ isPaused={isPaused}
384
+ />
385
+ <HMSVideoPlayer.Duration hlsPlayer={hlsPlayer} />
386
+ <HMSVideoPlayer.Volume hlsPlayer={hlsPlayer} />
387
+ <IconButton
388
+ variant="standard"
389
+ css={{ px: '$2' }}
390
+ onClick={async () => {
391
+ await hlsPlayer.seekToLivePosition();
392
+ setIsVideoLive(true);
393
+ }}
394
+ key="jump-to-live_btn"
395
+ data-testid="jump-to-live_btn"
396
+ >
397
+ <Tooltip title="Go to Live" side="top">
398
+ <Flex justify="center" gap={2} align="center">
399
+ <Box
400
+ css={{
401
+ height: '$4',
402
+ width: '$4',
403
+ background: isVideoLive ? '$alert_error_default' : '$on_primary_medium',
404
+ r: '$1',
405
+ }}
406
+ />
407
+ <Text
408
+ variant={{
409
+ '@sm': 'xs',
410
+ }}
411
+ css={{
412
+ c: isVideoLive ? '$on_surface_high' : '$on_surface_medium',
413
+ }}
414
+ >
415
+ {isVideoLive ? 'LIVE' : 'GO LIVE'}
416
+ </Text>
417
+ </Flex>
418
+ </Tooltip>
419
+ </IconButton>
420
+ </HMSVideoPlayer.Controls.Left>
421
+
422
+ <HMSVideoPlayer.Controls.Right>
423
+ {hasCaptions && (
424
+ <HLSCaptionSelector onClick={() => hlsPlayer?.toggleCaption()} isEnabled={isCaptionEnabled} />
383
425
  )}
384
- </Box>
385
- <HMSVideoPlayer.Controls.Root
386
- css={{
387
- p: '$4 $8',
388
- }}
389
- >
390
- <HMSVideoPlayer.Controls.Left>
391
- <HMSVideoPlayer.PlayButton
392
- onClick={async () => {
393
- isPaused ? await hlsPlayer?.play() : hlsPlayer?.pause();
394
- }}
395
- isPaused={isPaused}
426
+ {availableLayers.length > 0 ? (
427
+ <HLSQualitySelector
428
+ layers={availableLayers}
429
+ onOpen={setQualityDropDownOpen}
430
+ open={qualityDropDownOpen}
431
+ selection={currentSelectedQuality}
432
+ onQualityChange={handleQuality}
433
+ isAuto={isUserSelectedAuto}
396
434
  />
397
- <HMSVideoPlayer.Duration hlsPlayer={hlsPlayer} />
398
- <HMSVideoPlayer.Volume hlsPlayer={hlsPlayer} />
399
- <IconButton
400
- variant="standard"
401
- css={{ px: '$2' }}
402
- onClick={async () => {
403
- await hlsPlayer.seekToLivePosition();
404
- setIsVideoLive(true);
405
- }}
406
- key="jump-to-live_btn"
407
- data-testid="jump-to-live_btn"
408
- >
409
- <Tooltip title="Go to Live" side="top">
410
- <Flex justify="center" gap={2} align="center">
411
- <Box
412
- css={{
413
- height: '$4',
414
- width: '$4',
415
- background: isVideoLive ? '$alert_error_default' : '$on_primary_medium',
416
- r: '$1',
417
- }}
418
- />
419
- <Text
420
- variant={{
421
- '@sm': 'xs',
422
- }}
423
- css={{
424
- c: isVideoLive ? '$on_surface_high' : '$on_surface_medium',
425
- }}
426
- >
427
- {isVideoLive ? 'LIVE' : 'GO LIVE'}
428
- </Text>
429
- </Flex>
430
- </Tooltip>
431
- </IconButton>
432
- </HMSVideoPlayer.Controls.Left>
433
-
434
- <HMSVideoPlayer.Controls.Right>
435
- {hasCaptions && (
436
- <HLSCaptionSelector onClick={() => hlsPlayer?.toggleCaption()} isEnabled={isCaptionEnabled} />
437
- )}
438
- {availableLayers.length > 0 ? (
439
- <HLSQualitySelector
440
- layers={availableLayers}
441
- onOpen={setQualityDropDownOpen}
442
- open={qualityDropDownOpen}
443
- selection={currentSelectedQuality}
444
- onQualityChange={handleQuality}
445
- isAuto={isUserSelectedAuto}
446
- />
447
- ) : null}
448
- {isFullScreenSupported ? (
449
- <FullScreenButton
450
- isFullScreen={isFullScreen}
451
- onToggle={toggle}
452
- icon={isFullScreen ? <ShrinkIcon /> : <ExpandIcon />}
453
- />
454
- ) : null}
455
- </HMSVideoPlayer.Controls.Right>
456
- </HMSVideoPlayer.Controls.Root>
457
- </Flex>
435
+ ) : null}
436
+ {isFullScreenSupported ? (
437
+ <FullScreenButton
438
+ isFullScreen={isFullScreen}
439
+ onToggle={toggle}
440
+ icon={isFullScreen ? <ShrinkIcon /> : <ExpandIcon />}
441
+ />
442
+ ) : null}
443
+ </HMSVideoPlayer.Controls.Right>
444
+ </HMSVideoPlayer.Controls.Root>
458
445
  )}
459
446
  </Flex>
460
447
  </HMSVideoPlayer.Root>