softbuilders-react-video-player 1.1.8 → 1.1.10
Sign up to get free protection for your applications and to get access to all the features.
- package/LICENSE +21 -21
- package/README.md +126 -126
- package/dist/components/BigPlayButton/index.js +1 -1
- package/dist/components/BigPlayButton/index.js.map +1 -1
- package/dist/components/BigPlayButton/index.tsx +33 -31
- package/dist/components/BufferTracker/index.tsx +19 -19
- package/dist/components/ChapterTooltip/index.tsx +65 -65
- package/dist/components/ChaptersPanal/index.tsx +40 -40
- package/dist/components/ControlBar/index.d.ts +2 -1
- package/dist/components/ControlBar/index.js +21 -6
- package/dist/components/ControlBar/index.js.map +1 -1
- package/dist/components/ControlBar/index.tsx +150 -127
- package/dist/components/CreateNoteMenu/index.tsx +61 -61
- package/dist/components/CurrentTimeLabel/index.tsx +13 -13
- package/dist/components/CurrentTimeTracker/index.tsx +18 -18
- package/dist/components/Menu/index.tsx +49 -49
- package/dist/components/MenuButton/index.js +1 -1
- package/dist/components/MenuButton/index.js.map +1 -1
- package/dist/components/MenuButton/index.tsx +67 -67
- package/dist/components/NoteTooltip/index.tsx +46 -46
- package/dist/components/NotesPanal/index.tsx +34 -34
- package/dist/components/QualityMenu/index.js +2 -2
- package/dist/components/QualityMenu/index.js.map +1 -1
- package/dist/components/QualityMenu/index.tsx +122 -122
- package/dist/components/Slider/index.d.ts +1 -1
- package/dist/components/Slider/index.js +3 -3
- package/dist/components/Slider/index.js.map +1 -1
- package/dist/components/Slider/index.tsx +36 -37
- package/dist/components/Slider/style.css +49 -15
- package/dist/components/SoftBuildersVideoPlayer/index.js +1 -1
- package/dist/components/SoftBuildersVideoPlayer/index.js.map +1 -1
- package/dist/components/SoftBuildersVideoPlayer/index.tsx +110 -109
- package/dist/components/SubtitleMenu/index.js +2 -2
- package/dist/components/SubtitleMenu/index.js.map +1 -1
- package/dist/components/SubtitleMenu/index.tsx +107 -108
- package/dist/components/TimeSlider/index.js +13 -13
- package/dist/components/TimeSlider/index.tsx +107 -107
- package/dist/components/TimeSliderContainer/index.tsx +35 -35
- package/dist/components/Tooltip/index.tsx +16 -16
- package/dist/components/VideoPlayerComponent/index.d.ts +2 -1
- package/dist/components/VideoPlayerComponent/index.js +54 -38
- package/dist/components/VideoPlayerComponent/index.js.map +1 -1
- package/dist/components/VideoPlayerComponent/index.tsx +271 -249
- package/dist/components/VideoPlayerComponent/provider.tsx +82 -82
- package/dist/components/VideoPlayerComponent/style/style.css +36 -36
- package/dist/components/VolumeSlider/index.d.ts +4 -2
- package/dist/components/VolumeSlider/index.js +12 -2
- package/dist/components/VolumeSlider/index.js.map +1 -1
- package/dist/components/VolumeSlider/index.tsx +91 -52
- package/dist/components/icons/SubIcon.d.ts +3 -0
- package/dist/components/icons/SubIcon.js +4 -0
- package/dist/components/icons/SubIcon.js.map +1 -0
- package/dist/components/icons/SubIcon.tsx +28 -0
- package/dist/components/icons/index.d.ts +1 -0
- package/dist/components/icons/index.js +1 -0
- package/dist/components/icons/index.js.map +1 -1
- package/dist/components/icons/index.ts +15 -14
- package/dist/images/index.d.ts +1 -0
- package/dist/images/index.js +1 -0
- package/dist/images/index.js.map +1 -1
- package/dist/index.css +78 -3
- package/dist/index.mjs +276 -169
- package/dist/styles/tailwind.css +140 -87
- package/package.json +45 -45
package/dist/index.css
CHANGED
@@ -11,6 +11,28 @@ input[type=range]::-webkit-slider-thumb {
|
|
11
11
|
input[type=range]:focus {
|
12
12
|
outline: none;
|
13
13
|
}
|
14
|
+
input[type=range]::-webkit-slider-thumb {
|
15
|
+
width: 0.95rem;
|
16
|
+
height: 0.95rem;
|
17
|
+
border-radius: 50%;
|
18
|
+
cursor: pointer;
|
19
|
+
}
|
20
|
+
input[type=range]::-moz-range-thumb {
|
21
|
+
width: 0.95rem;
|
22
|
+
height: 0.95rem;
|
23
|
+
border-radius: 50%;
|
24
|
+
cursor: pointer;
|
25
|
+
}
|
26
|
+
@media (max-width: 768px) {
|
27
|
+
input[type=range]::-webkit-slider-thumb {
|
28
|
+
width: 0.7rem;
|
29
|
+
height: 0.7rem;
|
30
|
+
}
|
31
|
+
input[type=range]::-moz-range-thumb {
|
32
|
+
width: 0.7rem;
|
33
|
+
height: 0.7rem;
|
34
|
+
}
|
35
|
+
}
|
14
36
|
|
15
37
|
/* src/components/VideoPlayerComponent/style/style.css */
|
16
38
|
.video-js .vjs-control-bar {
|
@@ -381,6 +403,9 @@ video {
|
|
381
403
|
[hidden] {
|
382
404
|
display: none;
|
383
405
|
}
|
406
|
+
.sb-static {
|
407
|
+
position: static;
|
408
|
+
}
|
384
409
|
.sb-absolute {
|
385
410
|
position: absolute;
|
386
411
|
}
|
@@ -405,6 +430,12 @@ video {
|
|
405
430
|
.sb-top-0 {
|
406
431
|
top: 0px;
|
407
432
|
}
|
433
|
+
.sb-top-1 {
|
434
|
+
top: 0.25rem;
|
435
|
+
}
|
436
|
+
.sb-top-2 {
|
437
|
+
top: 0.5rem;
|
438
|
+
}
|
408
439
|
.sb-top-\[27\%\] {
|
409
440
|
top: 27%;
|
410
441
|
}
|
@@ -432,6 +463,9 @@ video {
|
|
432
463
|
.sb-grid {
|
433
464
|
display: grid;
|
434
465
|
}
|
466
|
+
.sb-hidden {
|
467
|
+
display: none;
|
468
|
+
}
|
435
469
|
.sb-h-1 {
|
436
470
|
height: 0.25rem;
|
437
471
|
}
|
@@ -456,6 +490,9 @@ video {
|
|
456
490
|
.sb-h-full {
|
457
491
|
height: 100%;
|
458
492
|
}
|
493
|
+
.\!sb-w-16 {
|
494
|
+
width: 4rem !important;
|
495
|
+
}
|
459
496
|
.sb-w-1 {
|
460
497
|
width: 0.25rem;
|
461
498
|
}
|
@@ -471,25 +508,41 @@ video {
|
|
471
508
|
.sb-w-5 {
|
472
509
|
width: 1.25rem;
|
473
510
|
}
|
474
|
-
.sb-w-\[10\%\] {
|
475
|
-
width: 10%;
|
476
|
-
}
|
477
511
|
.sb-w-\[150px\] {
|
478
512
|
width: 150px;
|
479
513
|
}
|
480
514
|
.sb-w-\[220px\] {
|
481
515
|
width: 220px;
|
482
516
|
}
|
517
|
+
.sb-w-\[22px\] {
|
518
|
+
width: 22px;
|
519
|
+
}
|
483
520
|
.sb-w-\[30\%\] {
|
484
521
|
width: 30%;
|
485
522
|
}
|
486
523
|
.sb-w-full {
|
487
524
|
width: 100%;
|
488
525
|
}
|
526
|
+
.-sb-translate-y-2 {
|
527
|
+
--tw-translate-y: -0.5rem;
|
528
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
529
|
+
}
|
489
530
|
.sb--translate-x-1\/2 {
|
490
531
|
--tw-translate-x: -50%;
|
491
532
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
492
533
|
}
|
534
|
+
.sb-translate-y-0 {
|
535
|
+
--tw-translate-y: 0px;
|
536
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
537
|
+
}
|
538
|
+
.-sb-rotate-90 {
|
539
|
+
--tw-rotate: -90deg;
|
540
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
541
|
+
}
|
542
|
+
.sb-rotate-0 {
|
543
|
+
--tw-rotate: 0deg;
|
544
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
545
|
+
}
|
493
546
|
.sb-transform {
|
494
547
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
495
548
|
}
|
@@ -504,18 +557,33 @@ video {
|
|
504
557
|
.sb-grid-cols-12 {
|
505
558
|
grid-template-columns: repeat(12, minmax(0, 1fr));
|
506
559
|
}
|
560
|
+
.\!sb-flex-row {
|
561
|
+
flex-direction: row !important;
|
562
|
+
}
|
507
563
|
.sb-flex-row {
|
508
564
|
flex-direction: row;
|
509
565
|
}
|
510
566
|
.sb-flex-col {
|
511
567
|
flex-direction: column;
|
512
568
|
}
|
569
|
+
.sb-flex-col-reverse {
|
570
|
+
flex-direction: column-reverse;
|
571
|
+
}
|
513
572
|
.sb-items-start {
|
514
573
|
align-items: flex-start;
|
515
574
|
}
|
575
|
+
.\!sb-items-end {
|
576
|
+
align-items: flex-end !important;
|
577
|
+
}
|
578
|
+
.sb-items-end {
|
579
|
+
align-items: flex-end;
|
580
|
+
}
|
516
581
|
.sb-items-center {
|
517
582
|
align-items: center;
|
518
583
|
}
|
584
|
+
.sb-justify-start {
|
585
|
+
justify-content: flex-start;
|
586
|
+
}
|
519
587
|
.sb-justify-center {
|
520
588
|
justify-content: center;
|
521
589
|
}
|
@@ -588,6 +656,10 @@ video {
|
|
588
656
|
.sb-p-2 {
|
589
657
|
padding: 0.5rem;
|
590
658
|
}
|
659
|
+
.sb-px-2 {
|
660
|
+
padding-left: 0.5rem;
|
661
|
+
padding-right: 0.5rem;
|
662
|
+
}
|
591
663
|
.sb-px-4 {
|
592
664
|
padding-left: 1rem;
|
593
665
|
padding-right: 1rem;
|
@@ -657,6 +729,9 @@ video {
|
|
657
729
|
--tw-scale-y: 1.5;
|
658
730
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
659
731
|
}
|
732
|
+
.hover\:sb-cursor-pointer:hover {
|
733
|
+
cursor: pointer;
|
734
|
+
}
|
660
735
|
.hover\:sb-text-orange-500:hover {
|
661
736
|
--tw-text-opacity: 1;
|
662
737
|
color: rgb(249 115 22 / var(--tw-text-opacity));
|