@livepeer-frameworks/player-svelte 0.1.1 → 0.1.2

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.
Files changed (88) hide show
  1. package/dist/DevModePanel.svelte +266 -127
  2. package/dist/DevModePanel.svelte.d.ts +1 -1
  3. package/dist/DvdLogo.svelte +17 -21
  4. package/dist/Icons.svelte +5 -3
  5. package/dist/Icons.svelte.d.ts +6 -19
  6. package/dist/IdleScreen.svelte +277 -186
  7. package/dist/IdleScreen.svelte.d.ts +1 -1
  8. package/dist/LoadingScreen.svelte +190 -162
  9. package/dist/Player.svelte +244 -111
  10. package/dist/Player.svelte.d.ts +1 -1
  11. package/dist/PlayerControls.svelte +263 -168
  12. package/dist/PlayerControls.svelte.d.ts +1 -1
  13. package/dist/SeekBar.svelte +61 -35
  14. package/dist/SkipIndicator.svelte +4 -4
  15. package/dist/SkipIndicator.svelte.d.ts +1 -1
  16. package/dist/SpeedIndicator.svelte +1 -1
  17. package/dist/StatsPanel.svelte +76 -57
  18. package/dist/StatsPanel.svelte.d.ts +1 -1
  19. package/dist/StreamStateOverlay.svelte +143 -107
  20. package/dist/StreamStateOverlay.svelte.d.ts +1 -1
  21. package/dist/SubtitleRenderer.svelte +46 -43
  22. package/dist/ThumbnailOverlay.svelte +22 -19
  23. package/dist/TitleOverlay.svelte +6 -11
  24. package/dist/components/VolumeIcons.svelte +12 -6
  25. package/dist/global.d.ts +3 -3
  26. package/dist/icons/FullscreenExitIcon.svelte +1 -5
  27. package/dist/icons/FullscreenIcon.svelte +1 -5
  28. package/dist/icons/PauseIcon.svelte +1 -5
  29. package/dist/icons/PictureInPictureIcon.svelte +12 -6
  30. package/dist/icons/PlayIcon.svelte +1 -5
  31. package/dist/icons/SeekToLiveIcon.svelte +1 -5
  32. package/dist/icons/SettingsIcon.svelte +1 -5
  33. package/dist/icons/SkipBackIcon.svelte +1 -5
  34. package/dist/icons/SkipForwardIcon.svelte +1 -5
  35. package/dist/icons/StatsIcon.svelte +1 -5
  36. package/dist/icons/VolumeOffIcon.svelte +1 -5
  37. package/dist/icons/VolumeUpIcon.svelte +1 -5
  38. package/dist/icons/index.d.ts +12 -12
  39. package/dist/icons/index.js +12 -12
  40. package/dist/index.d.ts +24 -24
  41. package/dist/index.js +21 -21
  42. package/dist/stores/index.d.ts +6 -6
  43. package/dist/stores/index.js +6 -6
  44. package/dist/stores/playbackQuality.d.ts +2 -2
  45. package/dist/stores/playbackQuality.js +7 -7
  46. package/dist/stores/playerContext.d.ts +2 -2
  47. package/dist/stores/playerContext.js +17 -17
  48. package/dist/stores/playerController.d.ts +13 -4
  49. package/dist/stores/playerController.js +80 -56
  50. package/dist/stores/playerSelection.d.ts +2 -2
  51. package/dist/stores/playerSelection.js +7 -7
  52. package/dist/stores/streamState.d.ts +2 -2
  53. package/dist/stores/streamState.js +56 -56
  54. package/dist/stores/viewerEndpoints.d.ts +3 -3
  55. package/dist/stores/viewerEndpoints.js +21 -21
  56. package/dist/types.d.ts +1 -1
  57. package/dist/ui/Badge.svelte +9 -10
  58. package/dist/ui/Badge.svelte.d.ts +8 -29
  59. package/dist/ui/Button.svelte +16 -16
  60. package/dist/ui/Button.svelte.d.ts +8 -29
  61. package/dist/ui/Slider.svelte +21 -55
  62. package/dist/ui/badge.js +1 -1
  63. package/dist/ui/button.js +2 -2
  64. package/dist/ui/context-menu/ContextMenuCheckboxItem.svelte +5 -7
  65. package/dist/ui/context-menu/ContextMenuCheckboxItem.svelte.d.ts +6 -27
  66. package/dist/ui/context-menu/ContextMenuContent.svelte +2 -9
  67. package/dist/ui/context-menu/ContextMenuItem.svelte +1 -5
  68. package/dist/ui/context-menu/ContextMenuLabel.svelte +1 -5
  69. package/dist/ui/context-menu/ContextMenuRadioItem.svelte +5 -7
  70. package/dist/ui/context-menu/ContextMenuRadioItem.svelte.d.ts +6 -27
  71. package/dist/ui/context-menu/ContextMenuSeparator.svelte +2 -8
  72. package/dist/ui/context-menu/ContextMenuShortcut.svelte +2 -12
  73. package/dist/ui/context-menu/ContextMenuSubContent.svelte +1 -5
  74. package/package.json +15 -7
  75. package/src/DevModePanel.svelte +1 -0
  76. package/src/Icons.svelte +5 -3
  77. package/src/IdleScreen.svelte +21 -14
  78. package/src/LoadingScreen.svelte +20 -13
  79. package/src/Player.svelte +48 -2
  80. package/src/PlayerControls.svelte +36 -17
  81. package/src/SeekBar.svelte +33 -0
  82. package/src/StreamStateOverlay.svelte +2 -2
  83. package/src/stores/playerController.ts +39 -1
  84. package/src/stores/viewerEndpoints.ts +1 -1
  85. package/src/ui/Badge.svelte +7 -4
  86. package/src/ui/Button.svelte +13 -13
  87. package/src/ui/context-menu/ContextMenuCheckboxItem.svelte +4 -2
  88. package/src/ui/context-menu/ContextMenuRadioItem.svelte +4 -2
@@ -1,4 +1,4 @@
1
- import { type StreamInfo, type MistStreamInfo, type PlaybackMode } from '@livepeer-frameworks/player-core';
1
+ import { type StreamInfo, type MistStreamInfo, type PlaybackMode } from "@livepeer-frameworks/player-core";
2
2
  interface Props {
3
3
  /** Callback when user selects a combo (one-shot selection) */
4
4
  onSettingsChange: (settings: {
@@ -3,7 +3,7 @@
3
3
  Port of src/components/DvdLogo.tsx
4
4
  -->
5
5
  <script lang="ts">
6
- import { onMount, onDestroy } from 'svelte';
6
+ import { onMount, onDestroy } from "svelte";
7
7
 
8
8
  interface Props {
9
9
  parentRef: HTMLElement | undefined;
@@ -21,18 +21,18 @@
21
21
  const ASPECT_RATIO = ORIGINAL_WIDTH / ORIGINAL_HEIGHT;
22
22
 
23
23
  const COLORS = [
24
- '#7aa2f7',
25
- '#bb9af7',
26
- '#9ece6a',
27
- '#73daca',
28
- '#7dcfff',
29
- '#f7768e',
30
- '#e0af68',
31
- '#2ac3de',
24
+ "#7aa2f7",
25
+ "#bb9af7",
26
+ "#9ece6a",
27
+ "#73daca",
28
+ "#7dcfff",
29
+ "#f7768e",
30
+ "#e0af68",
31
+ "#2ac3de",
32
32
  ];
33
33
 
34
34
  function pickNextColor(current?: string): string {
35
- if (COLORS.length === 0) return current ?? '#ffffff';
35
+ if (COLORS.length === 0) return current ?? "#ffffff";
36
36
  if (COLORS.length === 1) return COLORS[0];
37
37
 
38
38
  let next: string;
@@ -156,13 +156,13 @@
156
156
 
157
157
  recalculateDimensions();
158
158
 
159
- if (typeof ResizeObserver !== 'undefined') {
159
+ if (typeof ResizeObserver !== "undefined") {
160
160
  resizeObserver = new ResizeObserver(() => recalculateDimensions());
161
161
  resizeObserver.observe(parentRef);
162
162
  } else {
163
163
  const onResize = () => recalculateDimensions();
164
- window.addEventListener('resize', onResize);
165
- return () => window.removeEventListener('resize', onResize);
164
+ window.addEventListener("resize", onResize);
165
+ return () => window.removeEventListener("resize", onResize);
166
166
  }
167
167
 
168
168
  return () => {
@@ -199,15 +199,11 @@
199
199
  height: {dimensions.height}px;
200
200
  "
201
201
  >
202
- <svg
203
- width="100%"
204
- height="100%"
205
- viewBox="0 0 153 69"
206
- fill={color}
207
- class="select-none"
208
- >
202
+ <svg width="100%" height="100%" viewBox="0 0 153 69" fill={color} class="select-none">
209
203
  <g>
210
- <path d="M140.186,63.52h-1.695l-0.692,5.236h-0.847l0.77-5.236h-1.693l0.076-0.694h4.158L140.186,63.52L140.186,63.52z M146.346,68.756h-0.848v-4.545l0,0l-2.389,4.545l-1-4.545l0,0l-1.462,4.545h-0.771l1.924-5.931h0.695l0.924,4.006l2.078-4.006 h0.848V68.756L146.346,68.756z M126.027,0.063H95.352c0,0-8.129,9.592-9.654,11.434c-8.064,9.715-9.523,12.32-9.779,13.02 c0.063-0.699-0.256-3.304-3.686-13.148C71.282,8.7,68.359,0.062,68.359,0.062H57.881V0L32.35,0.063H13.169l-1.97,8.131 l14.543,0.062h3.365c9.336,0,15.055,3.747,13.467,10.354c-1.717,7.24-9.91,10.416-18.545,10.416h-3.24l4.191-17.783H10.502 L4.34,37.219h20.578c15.432,0,30.168-8.13,32.709-18.608c0.508-1.906,0.443-6.67-0.764-9.527c0-0.127-0.063-0.191-0.127-0.444 c-0.064-0.063-0.127-0.509,0.127-0.571c0.128-0.062,0.383,0.189,0.445,0.254c0.127,0.317,0.19,0.57,0.19,0.57l13.083,36.965 l33.344-37.6h14.1h3.365c9.337,0,15.055,3.747,13.528,10.354c-1.778,7.24-9.972,10.416-18.608,10.416h-3.238l4.191-17.783h-14.481 l-6.159,25.976h20.576c15.434,0,30.232-8.13,32.709-18.608C152.449,8.193,141.523,0.063,126.027,0.063L126.027,0.063z M71.091,45.981c-39.123,0-70.816,4.512-70.816,10.035c0,5.59,31.693,10.034,70.816,10.034c39.121,0,70.877-4.444,70.877-10.034 C141.968,50.493,110.212,45.981,71.091,45.981L71.091,45.981z M68.55,59.573c-8.956,0-16.196-1.523-16.196-3.365 c0-1.84,7.239-3.303,16.196-3.303c8.955,0,16.195,1.463,16.195,3.303C84.745,58.050,77.505,59.573,68.55,59.573L68.55,59.573z" />
204
+ <path
205
+ d="M140.186,63.52h-1.695l-0.692,5.236h-0.847l0.77-5.236h-1.693l0.076-0.694h4.158L140.186,63.52L140.186,63.52z M146.346,68.756h-0.848v-4.545l0,0l-2.389,4.545l-1-4.545l0,0l-1.462,4.545h-0.771l1.924-5.931h0.695l0.924,4.006l2.078-4.006 h0.848V68.756L146.346,68.756z M126.027,0.063H95.352c0,0-8.129,9.592-9.654,11.434c-8.064,9.715-9.523,12.32-9.779,13.02 c0.063-0.699-0.256-3.304-3.686-13.148C71.282,8.7,68.359,0.062,68.359,0.062H57.881V0L32.35,0.063H13.169l-1.97,8.131 l14.543,0.062h3.365c9.336,0,15.055,3.747,13.467,10.354c-1.717,7.24-9.91,10.416-18.545,10.416h-3.24l4.191-17.783H10.502 L4.34,37.219h20.578c15.432,0,30.168-8.13,32.709-18.608c0.508-1.906,0.443-6.67-0.764-9.527c0-0.127-0.063-0.191-0.127-0.444 c-0.064-0.063-0.127-0.509,0.127-0.571c0.128-0.062,0.383,0.189,0.445,0.254c0.127,0.317,0.19,0.57,0.19,0.57l13.083,36.965 l33.344-37.6h14.1h3.365c9.337,0,15.055,3.747,13.528,10.354c-1.778,7.24-9.972,10.416-18.608,10.416h-3.238l4.191-17.783h-14.481 l-6.159,25.976h20.576c15.434,0,30.232-8.13,32.709-18.608C152.449,8.193,141.523,0.063,126.027,0.063L126.027,0.063z M71.091,45.981c-39.123,0-70.816,4.512-70.816,10.035c0,5.59,31.693,10.034,70.816,10.034c39.121,0,70.877-4.444,70.877-10.034 C141.968,50.493,110.212,45.981,71.091,45.981L71.091,45.981z M68.55,59.573c-8.956,0-16.196-1.523-16.196-3.365 c0-1.84,7.239-3.303,16.196-3.303c8.955,0,16.195,1.463,16.195,3.303C84.745,58.050,77.505,59.573,68.55,59.573L68.55,59.573z"
206
+ />
211
207
  </g>
212
208
  </svg>
213
209
  </div>
package/dist/Icons.svelte CHANGED
@@ -10,7 +10,7 @@
10
10
  <PlayIcon size={24} />
11
11
  <VolumeIcon isMuted={false} />
12
12
  -->
13
- <script context="module" lang="ts">
13
+ <script module lang="ts">
14
14
  export interface IconProps {
15
15
  size?: number;
16
16
  color?: string;
@@ -19,9 +19,11 @@
19
19
  </script>
20
20
 
21
21
  <script lang="ts">
22
- // This file exports components via context="module" script
22
+ import type { Snippet } from "svelte";
23
+ // This file exports components via module script
23
24
  // The default export is a placeholder - use the named exports
25
+ let { children }: { children?: Snippet } = $props();
24
26
  </script>
25
27
 
26
28
  <!-- This component itself is not rendered - use the exported icon components below -->
27
- <slot />
29
+ {@render children?.()}
@@ -3,23 +3,10 @@ export interface IconProps {
3
3
  color?: string;
4
4
  class?: string;
5
5
  }
6
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
7
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
8
- $$bindings?: Bindings;
9
- } & Exports;
10
- (internal: unknown, props: {
11
- $$events?: Events;
12
- $$slots?: Slots;
13
- }): Exports & {
14
- $set?: any;
15
- $on?: any;
16
- };
17
- z_$$bindings?: Bindings;
18
- }
19
- declare const Icons: $$__sveltets_2_IsomorphicComponent<any, {
20
- [evt: string]: CustomEvent<any>;
21
- }, {
22
- default: {};
23
- }, {}, string>;
24
- type Icons = InstanceType<typeof Icons>;
6
+ import type { Snippet } from "svelte";
7
+ type $$ComponentProps = {
8
+ children?: Snippet;
9
+ };
10
+ declare const Icons: import("svelte").Component<$$ComponentProps, {}, "">;
11
+ type Icons = ReturnType<typeof Icons>;
25
12
  export default Icons;