@lightbird/ui 0.1.0

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 (8) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +61 -0
  3. package/dist/index.cjs +2286 -0
  4. package/dist/index.d.cts +123 -0
  5. package/dist/index.d.ts +123 -0
  6. package/dist/index.js +2247 -0
  7. package/dist/styles.css +1 -0
  8. package/package.json +99 -0
package/dist/index.cjs ADDED
@@ -0,0 +1,2286 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var React10 = require('react');
5
+ var clsx = require('clsx');
6
+ var tailwindMerge = require('tailwind-merge');
7
+ var SliderPrimitive = require('@radix-ui/react-slider');
8
+ var jsxRuntime = require('react/jsx-runtime');
9
+ var reactSlot = require('@radix-ui/react-slot');
10
+ var classVarianceAuthority = require('class-variance-authority');
11
+ var PopoverPrimitive = require('@radix-ui/react-popover');
12
+ var TooltipPrimitive = require('@radix-ui/react-tooltip');
13
+ var LabelPrimitive = require('@radix-ui/react-label');
14
+ var lucideReact = require('lucide-react');
15
+ var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
16
+ var core$1 = require('@dnd-kit/core');
17
+ var sortable = require('@dnd-kit/sortable');
18
+ var utilities = require('@dnd-kit/utilities');
19
+ var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
20
+ var SelectPrimitive = require('@radix-ui/react-select');
21
+ var core = require('@lightbird/core');
22
+ var DialogPrimitive = require('@radix-ui/react-dialog');
23
+ var react = require('@lightbird/core/react');
24
+ var ToastPrimitives = require('@radix-ui/react-toast');
25
+
26
+ function _interopNamespace(e) {
27
+ if (e && e.__esModule) return e;
28
+ var n = Object.create(null);
29
+ if (e) {
30
+ Object.keys(e).forEach(function (k) {
31
+ if (k !== 'default') {
32
+ var d = Object.getOwnPropertyDescriptor(e, k);
33
+ Object.defineProperty(n, k, d.get ? d : {
34
+ enumerable: true,
35
+ get: function () { return e[k]; }
36
+ });
37
+ }
38
+ });
39
+ }
40
+ n.default = e;
41
+ return Object.freeze(n);
42
+ }
43
+
44
+ var React10__namespace = /*#__PURE__*/_interopNamespace(React10);
45
+ var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
46
+ var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
47
+ var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
48
+ var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
49
+ var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
50
+ var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
51
+ var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
52
+ var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
53
+ var ToastPrimitives__namespace = /*#__PURE__*/_interopNamespace(ToastPrimitives);
54
+
55
+ function cn(...inputs) {
56
+ return tailwindMerge.twMerge(clsx.clsx(inputs));
57
+ }
58
+ var Slider = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
59
+ SliderPrimitive__namespace.Root,
60
+ {
61
+ ref,
62
+ className: cn(
63
+ "relative flex w-full touch-none select-none items-center",
64
+ className
65
+ ),
66
+ ...props,
67
+ children: [
68
+ /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Track, { className: "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary", children: /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Range, { className: "absolute h-full bg-primary" }) }),
69
+ /* @__PURE__ */ jsxRuntime.jsx(SliderPrimitive__namespace.Thumb, { className: "block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" })
70
+ ]
71
+ }
72
+ ));
73
+ Slider.displayName = SliderPrimitive__namespace.Root.displayName;
74
+ var buttonVariants = classVarianceAuthority.cva(
75
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
76
+ {
77
+ variants: {
78
+ variant: {
79
+ default: "bg-primary text-primary-foreground hover:bg-primary/90",
80
+ destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
81
+ outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
82
+ secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
83
+ ghost: "hover:bg-accent hover:text-accent-foreground",
84
+ link: "text-primary underline-offset-4 hover:underline"
85
+ },
86
+ size: {
87
+ default: "h-10 px-4 py-2",
88
+ sm: "h-9 rounded-md px-3",
89
+ lg: "h-11 rounded-md px-8",
90
+ icon: "h-10 w-10"
91
+ }
92
+ },
93
+ defaultVariants: {
94
+ variant: "default",
95
+ size: "default"
96
+ }
97
+ }
98
+ );
99
+ var Button = React10__namespace.forwardRef(
100
+ ({ className, variant, size, asChild = false, ...props }, ref) => {
101
+ const Comp = asChild ? reactSlot.Slot : "button";
102
+ return /* @__PURE__ */ jsxRuntime.jsx(
103
+ Comp,
104
+ {
105
+ className: cn(buttonVariants({ variant, size, className })),
106
+ ref,
107
+ ...props
108
+ }
109
+ );
110
+ }
111
+ );
112
+ Button.displayName = "Button";
113
+ var Popover = PopoverPrimitive__namespace.Root;
114
+ var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
115
+ var PopoverContent = React10__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
116
+ PopoverPrimitive__namespace.Content,
117
+ {
118
+ ref,
119
+ align,
120
+ sideOffset,
121
+ className: cn(
122
+ "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
123
+ className
124
+ ),
125
+ ...props
126
+ }
127
+ ) }));
128
+ PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
129
+ var TooltipProvider = TooltipPrimitive__namespace.Provider;
130
+ var Tooltip = TooltipPrimitive__namespace.Root;
131
+ var TooltipTrigger = TooltipPrimitive__namespace.Trigger;
132
+ var TooltipContent = React10__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
133
+ TooltipPrimitive__namespace.Content,
134
+ {
135
+ ref,
136
+ sideOffset,
137
+ className: cn(
138
+ "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
139
+ className
140
+ ),
141
+ ...props
142
+ }
143
+ ));
144
+ TooltipContent.displayName = TooltipPrimitive__namespace.Content.displayName;
145
+ var labelVariants = classVarianceAuthority.cva(
146
+ "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
147
+ );
148
+ var Label = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
149
+ LabelPrimitive__namespace.Root,
150
+ {
151
+ ref,
152
+ className: cn(labelVariants(), className),
153
+ ...props
154
+ }
155
+ ));
156
+ Label.displayName = LabelPrimitive__namespace.Root.displayName;
157
+ var RadioGroup = React10__namespace.forwardRef(({ className, ...props }, ref) => {
158
+ return /* @__PURE__ */ jsxRuntime.jsx(
159
+ RadioGroupPrimitive__namespace.Root,
160
+ {
161
+ className: cn("grid gap-2", className),
162
+ ...props,
163
+ ref
164
+ }
165
+ );
166
+ });
167
+ RadioGroup.displayName = RadioGroupPrimitive__namespace.Root.displayName;
168
+ var RadioGroupItem = React10__namespace.forwardRef(({ className, ...props }, ref) => {
169
+ return /* @__PURE__ */ jsxRuntime.jsx(
170
+ RadioGroupPrimitive__namespace.Item,
171
+ {
172
+ ref,
173
+ className: cn(
174
+ "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
175
+ className
176
+ ),
177
+ ...props,
178
+ children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
179
+ }
180
+ );
181
+ });
182
+ RadioGroupItem.displayName = RadioGroupPrimitive__namespace.Item.displayName;
183
+ var formatTime = (time) => {
184
+ if (isNaN(time)) return "00:00";
185
+ const date = /* @__PURE__ */ new Date(0);
186
+ date.setSeconds(time);
187
+ const timeString = date.toISOString().substr(11, 8);
188
+ return timeString.startsWith("00:") ? timeString.substr(3) : timeString;
189
+ };
190
+ var PlayerControls = React10__namespace.default.memo(function PlayerControls2({
191
+ isPlaying,
192
+ progress,
193
+ duration,
194
+ volume,
195
+ isMuted,
196
+ playbackRate,
197
+ loop,
198
+ isFullScreen,
199
+ filters,
200
+ zoom,
201
+ subtitles,
202
+ activeSubtitle,
203
+ audioTracks,
204
+ activeAudioTrack,
205
+ chapters = [],
206
+ currentChapter = null,
207
+ onPlayPause,
208
+ onSeek,
209
+ onVolumeChange,
210
+ onMuteToggle,
211
+ onPlaybackRateChange,
212
+ onLoopToggle,
213
+ onFullScreenToggle,
214
+ onFrameStep,
215
+ onScreenshot,
216
+ onNext,
217
+ onPrevious,
218
+ onFiltersChange,
219
+ onZoomChange,
220
+ onSubtitleChange,
221
+ onAudioTrackChange,
222
+ tracksLoading = false,
223
+ onSubtitleUpload,
224
+ onSubtitleRemove,
225
+ onShowInfo,
226
+ onOpenShortcuts,
227
+ onGoToChapter,
228
+ onTogglePiP,
229
+ isPiP = false,
230
+ pipSupported = false
231
+ }) {
232
+ const formattedProgress = React10.useMemo(() => formatTime(progress), [progress]);
233
+ const formattedDuration = React10.useMemo(() => formatTime(duration), [duration]);
234
+ const [chaptersMenuOpen, setChaptersMenuOpen] = React10.useState(false);
235
+ return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute bottom-0 left-0 right-0 p-4 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500 ease-in-out flex flex-col gap-2", children: [
236
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full", children: [
237
+ /* @__PURE__ */ jsxRuntime.jsx(
238
+ Slider,
239
+ {
240
+ value: [progress],
241
+ max: duration,
242
+ step: 1,
243
+ onValueChange: ([val]) => onSeek(val),
244
+ className: "w-full h-2"
245
+ }
246
+ ),
247
+ chapters.length > 0 && duration > 0 && chapters.slice(1).map((chapter) => /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
248
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
249
+ "div",
250
+ {
251
+ "data-testid": "chapter-tick",
252
+ style: {
253
+ position: "absolute",
254
+ left: `${chapter.startTime / duration * 100}%`,
255
+ top: 0,
256
+ width: "2px",
257
+ height: "100%",
258
+ background: "white",
259
+ opacity: 0.5,
260
+ pointerEvents: "none",
261
+ transform: "translateX(-1px)"
262
+ }
263
+ }
264
+ ) }),
265
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
266
+ chapter.title,
267
+ " \u2014 ",
268
+ formatTime(chapter.startTime)
269
+ ] }) })
270
+ ] }, chapter.index))
271
+ ] }),
272
+ currentChapter && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: currentChapter.title }),
273
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-white", children: [
274
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
275
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
276
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onPrevious, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SkipBack, {}) }) }),
277
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Previous (N)" }) })
278
+ ] }),
279
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
280
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onPlayPause, children: isPlaying ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pause, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Play, {}) }) }),
281
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
282
+ isPlaying ? "Pause" : "Play",
283
+ " (Space)"
284
+ ] }) })
285
+ ] }),
286
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
287
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onNext, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SkipForward, {}) }) }),
288
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Next (P)" }) })
289
+ ] }),
290
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
291
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
292
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onMuteToggle, children: isMuted || volume === 0 ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.VolumeX, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Volume2, {}) }) }),
293
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Mute (M)" }) })
294
+ ] }),
295
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [isMuted ? 0 : volume], max: 1, step: 0.05, onValueChange: ([val]) => onVolumeChange(val), className: "w-24" })
296
+ ] }),
297
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono text-sm", children: [
298
+ formattedProgress,
299
+ " / ",
300
+ formattedDuration
301
+ ] })
302
+ ] }),
303
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
304
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
305
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: () => onFrameStep("backward"), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Rewind, { size: 18 }) }) }),
306
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Frame Backward" }) })
307
+ ] }),
308
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
309
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: () => onFrameStep("forward"), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FastForward, { size: 18 }) }) }),
310
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Frame Forward" }) })
311
+ ] }),
312
+ /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
313
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "ghost", className: "font-mono w-16", children: [
314
+ playbackRate,
315
+ "x"
316
+ ] }) }),
317
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-40", children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroup, { value: String(playbackRate), onValueChange: (val) => onPlaybackRateChange(Number(val)), children: [0.25, 0.5, 0.75, 1, 1.25, 1.5, 2, 4].map((rate) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
318
+ /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: String(rate), id: `rate-${rate}` }),
319
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { htmlFor: `rate-${rate}`, children: [
320
+ rate,
321
+ "x"
322
+ ] })
323
+ ] }, rate)) }) })
324
+ ] }),
325
+ audioTracks.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
326
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "ghost", size: "icon", className: "relative", children: [
327
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AudioLines, {}),
328
+ tracksLoading && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "absolute top-0 right-0 h-2.5 w-2.5 animate-spin text-primary" })
329
+ ] }) }),
330
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-48 overflow-y-auto overscroll-contain pr-1", children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroup, { value: activeAudioTrack, onValueChange: onAudioTrackChange, children: audioTracks.map((track) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
331
+ /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: track.id, id: `audio-${track.id}` }),
332
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: `audio-${track.id}`, children: track.name })
333
+ ] }, track.id)) }) }) })
334
+ ] }),
335
+ /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
336
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "ghost", size: "icon", className: "relative", children: [
337
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Subtitles, {}),
338
+ tracksLoading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "absolute top-0 right-0 h-2.5 w-2.5 animate-spin text-primary" }) : activeSubtitle !== "-1" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute top-0 right-0 block h-2 w-2 rounded-full bg-primary ring-2 ring-background" })
339
+ ] }) }),
340
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-64", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
341
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
342
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-sm font-medium", children: "Subtitles" }),
343
+ /* @__PURE__ */ jsxRuntime.jsxs(
344
+ Button,
345
+ {
346
+ variant: "outline",
347
+ size: "sm",
348
+ onClick: onSubtitleUpload,
349
+ className: "h-7 px-2",
350
+ children: [
351
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-3 w-3 mr-1" }),
352
+ "Add"
353
+ ]
354
+ }
355
+ )
356
+ ] }),
357
+ subtitles.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-48 overflow-y-auto overscroll-contain pr-1", children: /* @__PURE__ */ jsxRuntime.jsxs(RadioGroup, { value: activeSubtitle, onValueChange: onSubtitleChange, children: [
358
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
359
+ /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: "-1", id: "sub-off" }),
360
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "sub-off", children: "Off" })
361
+ ] }),
362
+ subtitles.map((sub) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between space-x-2", children: [
363
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 flex-1", children: [
364
+ /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: sub.id, id: `sub-${sub.id}` }),
365
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: `sub-${sub.id}`, className: "truncate", children: sub.name })
366
+ ] }),
367
+ sub.type === "external" && onSubtitleRemove && /* @__PURE__ */ jsxRuntime.jsx(
368
+ Button,
369
+ {
370
+ variant: "ghost",
371
+ size: "sm",
372
+ onClick: () => onSubtitleRemove(sub.id),
373
+ className: "h-6 w-6 p-0",
374
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
375
+ }
376
+ )
377
+ ] }, sub.id))
378
+ ] }) }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground text-center py-2", children: "No subtitles available" })
379
+ ] }) })
380
+ ] }),
381
+ chapters.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: chaptersMenuOpen, onOpenChange: setChaptersMenuOpen, children: [
382
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
383
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", "aria-label": "Chapters", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.List, { className: "h-4 w-4" }) }) }) }),
384
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Chapters" }) })
385
+ ] }),
386
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-72 p-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col max-h-64 overflow-y-auto", children: chapters.map((chapter) => /* @__PURE__ */ jsxRuntime.jsxs(
387
+ "button",
388
+ {
389
+ className: cn(
390
+ "flex items-center justify-between px-4 py-2 text-sm hover:bg-accent transition-colors text-left",
391
+ currentChapter?.index === chapter.index && "bg-accent font-medium"
392
+ ),
393
+ onClick: () => {
394
+ onGoToChapter?.(chapter.index);
395
+ setChaptersMenuOpen(false);
396
+ },
397
+ children: [
398
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: chapter.title }),
399
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-4 font-mono text-xs text-muted-foreground shrink-0", children: formatTime(chapter.startTime) })
400
+ ]
401
+ },
402
+ chapter.index
403
+ )) }) })
404
+ ] }),
405
+ /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
406
+ /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings2, {}) }) }),
407
+ /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { className: "w-64 space-y-4", children: [
408
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
409
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
410
+ "Brightness: ",
411
+ filters.brightness,
412
+ "%"
413
+ ] }),
414
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [filters.brightness], max: 200, onValueChange: ([val]) => onFiltersChange({ ...filters, brightness: val }) })
415
+ ] }),
416
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
417
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
418
+ "Contrast: ",
419
+ filters.contrast,
420
+ "%"
421
+ ] }),
422
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [filters.contrast], max: 200, onValueChange: ([val]) => onFiltersChange({ ...filters, contrast: val }) })
423
+ ] }),
424
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
425
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
426
+ "Saturation: ",
427
+ filters.saturate,
428
+ "%"
429
+ ] }),
430
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [filters.saturate], max: 200, onValueChange: ([val]) => onFiltersChange({ ...filters, saturate: val }) })
431
+ ] }),
432
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
433
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
434
+ "Hue: ",
435
+ filters.hue,
436
+ "\xB0"
437
+ ] }),
438
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [filters.hue], max: 360, onValueChange: ([val]) => onFiltersChange({ ...filters, hue: val }) })
439
+ ] }),
440
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
441
+ /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
442
+ "Zoom: ",
443
+ Math.round(zoom * 100),
444
+ "%"
445
+ ] }),
446
+ /* @__PURE__ */ jsxRuntime.jsx(Slider, { value: [zoom], min: 1, max: 3, step: 0.1, onValueChange: ([val]) => onZoomChange(val) })
447
+ ] })
448
+ ] })
449
+ ] }),
450
+ onShowInfo && /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
451
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onShowInfo, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { className: "h-4 w-4" }) }) }),
452
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Video Information" }) })
453
+ ] }),
454
+ onOpenShortcuts && /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
455
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onOpenShortcuts, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Keyboard, { className: "h-4 w-4" }) }) }),
456
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Keyboard Shortcuts" }) })
457
+ ] }),
458
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
459
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onScreenshot, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Camera, {}) }) }),
460
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Screenshot" }) })
461
+ ] }),
462
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
463
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onLoopToggle, "data-active": loop, className: "data-[active=true]:text-primary", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RotateCcw, {}) }) }),
464
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Loop" }) })
465
+ ] }),
466
+ pipSupported && /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
467
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
468
+ Button,
469
+ {
470
+ variant: "ghost",
471
+ size: "icon",
472
+ onClick: onTogglePiP,
473
+ "aria-label": isPiP ? "Exit picture-in-picture" : "Enter picture-in-picture",
474
+ className: isPiP ? "text-primary" : "",
475
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PictureInPicture2, {})
476
+ }
477
+ ) }),
478
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: isPiP ? "Exit picture-in-picture" : "Enter picture-in-picture" }) })
479
+ ] }),
480
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
481
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "icon", onClick: onFullScreenToggle, children: isFullScreen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minimize, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize, {}) }) }),
482
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Fullscreen (F)" }) })
483
+ ] })
484
+ ] })
485
+ ] })
486
+ ] }) });
487
+ });
488
+ var player_controls_default = PlayerControls;
489
+ var ScrollArea = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
490
+ ScrollAreaPrimitive__namespace.Root,
491
+ {
492
+ ref,
493
+ className: cn("relative overflow-hidden", className),
494
+ ...props,
495
+ children: [
496
+ /* @__PURE__ */ jsxRuntime.jsx(ScrollAreaPrimitive__namespace.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
497
+ /* @__PURE__ */ jsxRuntime.jsx(ScrollBar, {}),
498
+ /* @__PURE__ */ jsxRuntime.jsx(ScrollAreaPrimitive__namespace.Corner, {})
499
+ ]
500
+ }
501
+ ));
502
+ ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
503
+ var ScrollBar = React10__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
504
+ ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
505
+ {
506
+ ref,
507
+ orientation,
508
+ className: cn(
509
+ "flex touch-none select-none transition-colors",
510
+ orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
511
+ orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
512
+ className
513
+ ),
514
+ ...props,
515
+ children: /* @__PURE__ */ jsxRuntime.jsx(ScrollAreaPrimitive__namespace.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
516
+ }
517
+ ));
518
+ ScrollBar.displayName = ScrollAreaPrimitive__namespace.ScrollAreaScrollbar.displayName;
519
+ var Input = React10__namespace.forwardRef(
520
+ ({ className, type, ...props }, ref) => {
521
+ return /* @__PURE__ */ jsxRuntime.jsx(
522
+ "input",
523
+ {
524
+ type,
525
+ className: cn(
526
+ "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
527
+ className
528
+ ),
529
+ ref,
530
+ ...props
531
+ }
532
+ );
533
+ }
534
+ );
535
+ Input.displayName = "Input";
536
+ var Select = SelectPrimitive__namespace.Root;
537
+ var SelectValue = SelectPrimitive__namespace.Value;
538
+ var SelectTrigger = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
539
+ SelectPrimitive__namespace.Trigger,
540
+ {
541
+ ref,
542
+ className: cn(
543
+ "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
544
+ className
545
+ ),
546
+ ...props,
547
+ children: [
548
+ children,
549
+ /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 opacity-50" }) })
550
+ ]
551
+ }
552
+ ));
553
+ SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
554
+ var SelectScrollUpButton = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
555
+ SelectPrimitive__namespace.ScrollUpButton,
556
+ {
557
+ ref,
558
+ className: cn(
559
+ "flex cursor-default items-center justify-center py-1",
560
+ className
561
+ ),
562
+ ...props,
563
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
564
+ }
565
+ ));
566
+ SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
567
+ var SelectScrollDownButton = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
568
+ SelectPrimitive__namespace.ScrollDownButton,
569
+ {
570
+ ref,
571
+ className: cn(
572
+ "flex cursor-default items-center justify-center py-1",
573
+ className
574
+ ),
575
+ ...props,
576
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
577
+ }
578
+ ));
579
+ SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
580
+ var SelectContent = React10__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
581
+ SelectPrimitive__namespace.Content,
582
+ {
583
+ ref,
584
+ className: cn(
585
+ "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
586
+ position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
587
+ className
588
+ ),
589
+ position,
590
+ ...props,
591
+ children: [
592
+ /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
593
+ /* @__PURE__ */ jsxRuntime.jsx(
594
+ SelectPrimitive__namespace.Viewport,
595
+ {
596
+ className: cn(
597
+ "p-1",
598
+ position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
599
+ ),
600
+ children
601
+ }
602
+ ),
603
+ /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
604
+ ]
605
+ }
606
+ ) }));
607
+ SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
608
+ var SelectLabel = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
609
+ SelectPrimitive__namespace.Label,
610
+ {
611
+ ref,
612
+ className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
613
+ ...props
614
+ }
615
+ ));
616
+ SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
617
+ var SelectItem = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
618
+ SelectPrimitive__namespace.Item,
619
+ {
620
+ ref,
621
+ className: cn(
622
+ "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
623
+ className
624
+ ),
625
+ ...props,
626
+ children: [
627
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
628
+ /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
629
+ ]
630
+ }
631
+ ));
632
+ SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
633
+ var SelectSeparator = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
634
+ SelectPrimitive__namespace.Separator,
635
+ {
636
+ ref,
637
+ className: cn("-mx-1 my-1 h-px bg-muted", className),
638
+ ...props
639
+ }
640
+ ));
641
+ SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
642
+ var SIZE_WIDTHS = {
643
+ sm: "w-60",
644
+ md: "w-80",
645
+ lg: "w-96"
646
+ };
647
+ var NEXT_SIZE = {
648
+ sm: "md",
649
+ md: "lg",
650
+ lg: "sm"
651
+ };
652
+ function formatTime2(seconds) {
653
+ if (!seconds || !isFinite(seconds)) return "";
654
+ const h = Math.floor(seconds / 3600);
655
+ const m = Math.floor(seconds % 3600 / 60);
656
+ const s = Math.floor(seconds % 60);
657
+ if (h > 0) return `${h}:${String(m).padStart(2, "0")}:${String(s).padStart(2, "0")}`;
658
+ return `${m}:${String(s).padStart(2, "0")}`;
659
+ }
660
+ var VIDEO_EXTENSIONS_RE = /\.(mp4|mkv|webm|mov|avi|wmv|flv|m4v)$/i;
661
+ function SortablePlaylistItem({ item, index, isActive, onSelect, onRemove }) {
662
+ const {
663
+ attributes,
664
+ listeners: listeners2,
665
+ setNodeRef,
666
+ transform,
667
+ transition,
668
+ isDragging
669
+ } = sortable.useSortable({ id: item.id });
670
+ const style = {
671
+ transform: utilities.CSS.Transform.toString(transform),
672
+ transition,
673
+ opacity: isDragging ? 0.5 : 1
674
+ };
675
+ const duration = formatTime2(item.duration ?? 0);
676
+ return /* @__PURE__ */ jsxRuntime.jsxs(
677
+ "div",
678
+ {
679
+ ref: setNodeRef,
680
+ style,
681
+ className: cn(
682
+ "flex items-center gap-1 p-1.5 rounded-md text-xs group",
683
+ "hover:bg-muted transition-colors",
684
+ isActive ? "bg-primary/20 text-primary-foreground" : ""
685
+ ),
686
+ children: [
687
+ /* @__PURE__ */ jsxRuntime.jsx(
688
+ "button",
689
+ {
690
+ ...attributes,
691
+ ...listeners2,
692
+ className: "shrink-0 cursor-grab active:cursor-grabbing text-muted-foreground hover:text-foreground p-0.5",
693
+ "aria-label": "Drag to reorder",
694
+ tabIndex: -1,
695
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.GripVertical, { className: "w-3 h-3" })
696
+ }
697
+ ),
698
+ /* @__PURE__ */ jsxRuntime.jsxs(
699
+ "button",
700
+ {
701
+ onClick: () => onSelect(index),
702
+ className: "flex-1 flex items-center gap-1.5 min-w-0 text-left",
703
+ "aria-label": `Play ${item.name}`,
704
+ children: [
705
+ item.type === "video" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ListVideo, { className: "w-3.5 h-3.5 shrink-0" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tv, { className: "w-3.5 h-3.5 shrink-0" }),
706
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: item.name }),
707
+ duration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground ml-auto shrink-0 pl-1", children: duration })
708
+ ]
709
+ }
710
+ ),
711
+ /* @__PURE__ */ jsxRuntime.jsx(
712
+ "button",
713
+ {
714
+ onClick: (e) => {
715
+ e.stopPropagation();
716
+ onRemove(index);
717
+ },
718
+ className: "shrink-0 opacity-0 group-hover:opacity-100 transition-opacity p-0.5",
719
+ "aria-label": "Remove from playlist",
720
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3 h-3 text-muted-foreground hover:text-destructive" })
721
+ }
722
+ )
723
+ ]
724
+ }
725
+ );
726
+ }
727
+ var PlaylistPanel = ({
728
+ playlist,
729
+ currentVideoIndex,
730
+ onSelectVideo,
731
+ onFilesAdded,
732
+ onFolderFilesAdded,
733
+ onAddStream,
734
+ onRemoveItem,
735
+ onReorder,
736
+ onImportM3U,
737
+ isOpen,
738
+ isPinned,
739
+ size,
740
+ onToggle,
741
+ onTogglePin,
742
+ onSizeChange
743
+ }) => {
744
+ const fileInputRef = React10.useRef(null);
745
+ const folderInputRef = React10.useRef(null);
746
+ const m3uInputRef = React10.useRef(null);
747
+ const [streamUrl, setStreamUrl] = React10.useState("");
748
+ const [sortKey, setSortKey] = React10.useState("");
749
+ const handleStreamUrlSubmit = (e) => {
750
+ e.preventDefault();
751
+ if (streamUrl) {
752
+ onAddStream(streamUrl);
753
+ setStreamUrl("");
754
+ }
755
+ };
756
+ const handleFolderSelect = (e) => {
757
+ const files = Array.from(e.target.files ?? []).filter((f) => VIDEO_EXTENSIONS_RE.test(f.name)).sort((a, b) => a.name.localeCompare(b.name, void 0, { numeric: true }));
758
+ if (files.length > 0) onFolderFilesAdded(files);
759
+ e.target.value = "";
760
+ };
761
+ const handleM3USelect = async (e) => {
762
+ const file = e.target.files?.[0];
763
+ if (!file) return;
764
+ const text = await file.text();
765
+ const items = core.parseM3U8(text);
766
+ if (items.length > 0) onImportM3U(items);
767
+ e.target.value = "";
768
+ };
769
+ const handleDragEnd = (event) => {
770
+ const { active, over } = event;
771
+ if (!over || active.id === over.id) return;
772
+ const oldIndex = playlist.findIndex((item) => item.id === active.id);
773
+ const newIndex = playlist.findIndex((item) => item.id === over.id);
774
+ if (oldIndex !== -1 && newIndex !== -1) {
775
+ onReorder(sortable.arrayMove(playlist, oldIndex, newIndex));
776
+ }
777
+ };
778
+ const handleSort = (value) => {
779
+ setSortKey(value);
780
+ const sorted = [...playlist].sort((a, b) => {
781
+ switch (value) {
782
+ case "name-asc":
783
+ return a.name.localeCompare(b.name, void 0, { numeric: true });
784
+ case "name-desc":
785
+ return b.name.localeCompare(a.name, void 0, { numeric: true });
786
+ case "duration-asc":
787
+ return (a.duration ?? 0) - (b.duration ?? 0);
788
+ case "duration-desc":
789
+ return (b.duration ?? 0) - (a.duration ?? 0);
790
+ default:
791
+ return 0;
792
+ }
793
+ });
794
+ onReorder(sorted);
795
+ };
796
+ return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children: !isOpen ? (
797
+ /* ── Collapsed drawer strip ── */
798
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center w-11 h-full bg-card border-l border-border shrink-0", children: [
799
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
800
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
801
+ Button,
802
+ {
803
+ variant: "ghost",
804
+ size: "icon",
805
+ className: "h-9 w-9 mt-2 shrink-0",
806
+ onClick: onToggle,
807
+ "aria-label": "Expand Playlist",
808
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" })
809
+ }
810
+ ) }),
811
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "left", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Expand Playlist" }) })
812
+ ] }),
813
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 flex items-center justify-center overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
814
+ "span",
815
+ {
816
+ className: "text-[10px] font-semibold text-muted-foreground tracking-widest uppercase select-none",
817
+ style: { writingMode: "vertical-rl", transform: "rotate(180deg)" },
818
+ children: "Playlist"
819
+ }
820
+ ) }),
821
+ playlist.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mb-3 text-[10px] font-bold text-primary bg-primary/10 rounded-full w-6 h-6 flex items-center justify-center shrink-0", children: playlist.length > 99 ? "99+" : playlist.length })
822
+ ] })
823
+ ) : (
824
+ /* ── Full panel ── */
825
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("h-full flex flex-col bg-card border-l border-border shrink-0 transition-[width] duration-200", SIZE_WIDTHS[size]), children: [
826
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border shrink-0", children: [
827
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
828
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ListVideo, { className: "h-4 w-4 text-primary shrink-0" }),
829
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-sm truncate", children: "Playlist" }),
830
+ playlist.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-muted-foreground bg-muted rounded-full px-1.5 py-0.5 shrink-0 leading-none", children: playlist.length })
831
+ ] }),
832
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [
833
+ playlist.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
834
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
835
+ Button,
836
+ {
837
+ variant: "ghost",
838
+ size: "icon",
839
+ className: "h-7 w-7",
840
+ onClick: () => core.exportPlaylist(playlist),
841
+ "aria-label": "Export Playlist",
842
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "h-3.5 w-3.5" })
843
+ }
844
+ ) }),
845
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Export as M3U8" }) })
846
+ ] }),
847
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
848
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
849
+ Button,
850
+ {
851
+ variant: "ghost",
852
+ size: "icon",
853
+ className: "h-7 w-7",
854
+ onClick: () => m3uInputRef.current?.click(),
855
+ "aria-label": "Import Playlist",
856
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "h-3.5 w-3.5" })
857
+ }
858
+ ) }),
859
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Import M3U/M3U8" }) })
860
+ ] }),
861
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
862
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
863
+ Button,
864
+ {
865
+ variant: "ghost",
866
+ size: "icon",
867
+ className: cn("h-7 w-7", isPinned && "text-primary bg-primary/10"),
868
+ onClick: onTogglePin,
869
+ "aria-label": isPinned ? "Unpin Playlist" : "Pin Playlist",
870
+ children: isPinned ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pin, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PinOff, { className: "h-3.5 w-3.5" })
871
+ }
872
+ ) }),
873
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: isPinned ? "Unpin (allow auto-hide on play)" : "Pin (keep open while playing)" }) })
874
+ ] }),
875
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
876
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
877
+ Button,
878
+ {
879
+ variant: "ghost",
880
+ size: "icon",
881
+ className: "h-7 w-7",
882
+ onClick: () => onSizeChange(NEXT_SIZE[size]),
883
+ "aria-label": "Resize Playlist",
884
+ children: size === "lg" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minimize2, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize2, { className: "h-3.5 w-3.5" })
885
+ }
886
+ ) }),
887
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: size === "lg" ? "Make smaller" : "Make larger" }) })
888
+ ] }),
889
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
890
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
891
+ Button,
892
+ {
893
+ variant: "ghost",
894
+ size: "icon",
895
+ className: "h-7 w-7",
896
+ onClick: onToggle,
897
+ "aria-label": "Collapse Playlist",
898
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
899
+ }
900
+ ) }),
901
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Collapse" }) })
902
+ ] })
903
+ ] })
904
+ ] }),
905
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-3 space-y-2 border-b border-border shrink-0", children: [
906
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1.5", children: [
907
+ /* @__PURE__ */ jsxRuntime.jsxs(Button, { onClick: () => fileInputRef.current?.click(), className: "flex-1 h-8 text-xs", children: [
908
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FilePlus, { className: "mr-1.5 h-3.5 w-3.5" }),
909
+ " Add Files"
910
+ ] }),
911
+ /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
912
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
913
+ Button,
914
+ {
915
+ variant: "outline",
916
+ size: "icon",
917
+ className: "h-8 w-8 shrink-0",
918
+ onClick: () => folderInputRef.current?.click(),
919
+ "aria-label": "Open Folder",
920
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FolderOpen, { className: "h-3.5 w-3.5" })
921
+ }
922
+ ) }),
923
+ /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Open Folder" }) })
924
+ ] })
925
+ ] }),
926
+ /* @__PURE__ */ jsxRuntime.jsx(
927
+ "input",
928
+ {
929
+ type: "file",
930
+ ref: fileInputRef,
931
+ className: "hidden",
932
+ multiple: true,
933
+ accept: "video/*,.mkv,.avi,.mov,.wmv,.flv,.webm,.vtt,.srt",
934
+ onChange: (e) => e.target.files && onFilesAdded(e.target.files)
935
+ }
936
+ ),
937
+ /* @__PURE__ */ jsxRuntime.jsx(
938
+ "input",
939
+ {
940
+ type: "file",
941
+ ref: folderInputRef,
942
+ className: "hidden",
943
+ multiple: true,
944
+ accept: "video/*",
945
+ webkitdirectory: "",
946
+ onChange: handleFolderSelect
947
+ }
948
+ ),
949
+ /* @__PURE__ */ jsxRuntime.jsx(
950
+ "input",
951
+ {
952
+ type: "file",
953
+ ref: m3uInputRef,
954
+ className: "hidden",
955
+ accept: ".m3u,.m3u8",
956
+ onChange: handleM3USelect
957
+ }
958
+ ),
959
+ /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleStreamUrlSubmit, className: "flex gap-1.5", children: [
960
+ /* @__PURE__ */ jsxRuntime.jsx(
961
+ Input,
962
+ {
963
+ type: "url",
964
+ placeholder: "Enter stream URL",
965
+ value: streamUrl,
966
+ onChange: (e) => setStreamUrl(e.target.value),
967
+ className: "h-8 text-xs"
968
+ }
969
+ ),
970
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", size: "icon", variant: "secondary", className: "h-8 w-8 shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Link, { className: "h-3.5 w-3.5" }) })
971
+ ] }),
972
+ playlist.length > 1 && /* @__PURE__ */ jsxRuntime.jsxs(Select, { value: sortKey, onValueChange: handleSort, children: [
973
+ /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-7 text-xs", "aria-label": "Sort playlist", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "Sort by\u2026" }) }),
974
+ /* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { children: [
975
+ /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "name-asc", children: "Name A\u2013Z" }),
976
+ /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "name-desc", children: "Name Z\u2013A" }),
977
+ /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "duration-asc", children: "Shortest first" }),
978
+ /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "duration-desc", children: "Longest first" })
979
+ ] })
980
+ ] })
981
+ ] }),
982
+ /* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 space-y-0.5", children: playlist.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center text-xs text-muted-foreground py-10 px-2", children: [
983
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Your playlist is empty." }),
984
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Add files or a stream URL to get started." })
985
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx(core$1.DndContext, { collisionDetection: core$1.closestCenter, onDragEnd: handleDragEnd, children: /* @__PURE__ */ jsxRuntime.jsx(
986
+ sortable.SortableContext,
987
+ {
988
+ items: playlist.map((i) => i.id),
989
+ strategy: sortable.verticalListSortingStrategy,
990
+ children: playlist.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
991
+ SortablePlaylistItem,
992
+ {
993
+ item,
994
+ index,
995
+ isActive: index === currentVideoIndex,
996
+ onSelect: onSelectVideo,
997
+ onRemove: onRemoveItem
998
+ },
999
+ item.id
1000
+ ))
1001
+ }
1002
+ ) }) }) })
1003
+ ] })
1004
+ ) });
1005
+ };
1006
+ var playlist_panel_default = PlaylistPanel;
1007
+ function VideoOverlay({ isLoading, loadingMessage, processingProgress = 0, eta, throughputMBs, onCancel }) {
1008
+ if (!isLoading && !loadingMessage) return null;
1009
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute inset-0 bg-black bg-opacity-70 flex flex-col items-center justify-center text-white z-10", children: [
1010
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-16 h-16 border-4 border-t-transparent border-primary rounded-full animate-spin" }),
1011
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-lg max-w-sm text-center", children: loadingMessage || "Processing video..." }),
1012
+ processingProgress > 0 && processingProgress < 1 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1013
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 w-64 bg-gray-700 rounded-full h-2", children: /* @__PURE__ */ jsxRuntime.jsx(
1014
+ "div",
1015
+ {
1016
+ className: "bg-primary h-2 rounded-full transition-all duration-300",
1017
+ style: { width: `${Math.round(processingProgress * 100)}%` }
1018
+ }
1019
+ ) }),
1020
+ throughputMBs !== null && throughputMBs !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "mt-1 text-sm text-white/60", children: [
1021
+ throughputMBs,
1022
+ " MB/s",
1023
+ eta !== null && eta !== void 0 && ` \xB7 ~${eta}s left`
1024
+ ] })
1025
+ ] }),
1026
+ onCancel && /* @__PURE__ */ jsxRuntime.jsx(
1027
+ "button",
1028
+ {
1029
+ onClick: onCancel,
1030
+ className: "mt-3 px-4 py-1.5 text-sm rounded border border-white/30 text-white/80 hover:bg-white/10 transition-colors",
1031
+ children: "Cancel"
1032
+ }
1033
+ )
1034
+ ] });
1035
+ }
1036
+ function PlayerErrorDisplay({ error, onRetry, onSkip, onDismiss }) {
1037
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center bg-black/80 z-10", children: [
1038
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "w-12 h-12 text-red-500 mb-4" }),
1039
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-white text-lg font-semibold mb-2", children: "Playback Error" }),
1040
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-gray-300 text-sm text-center max-w-xs mb-6", children: error.message }),
1041
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
1042
+ error.retryable && onRetry && /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: onRetry, variant: "outline", children: "Retry" }),
1043
+ onSkip && /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: onSkip, variant: "outline", children: "Skip to Next" }),
1044
+ onDismiss && /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: onDismiss, children: "Dismiss" })
1045
+ ] })
1046
+ ] });
1047
+ }
1048
+ function formatTime3(seconds) {
1049
+ if (isNaN(seconds) || seconds === 0) return "\u2014";
1050
+ const h = Math.floor(seconds / 3600);
1051
+ const m = Math.floor(seconds % 3600 / 60);
1052
+ const s = Math.floor(seconds % 60);
1053
+ if (h > 0) return `${h}:${String(m).padStart(2, "0")}:${String(s).padStart(2, "0")}`;
1054
+ return `${m}:${String(s).padStart(2, "0")}`;
1055
+ }
1056
+ function formatSize(bytes) {
1057
+ if (!bytes) return "\u2014";
1058
+ if (bytes > 1e9) return `${(bytes / 1e9).toFixed(2)} GB`;
1059
+ if (bytes > 1e6) return `${(bytes / 1e6).toFixed(1)} MB`;
1060
+ return `${(bytes / 1e3).toFixed(0)} KB`;
1061
+ }
1062
+ function formatBitrate(bps) {
1063
+ if (!bps) return "\u2014";
1064
+ return bps > 1e6 ? `${(bps / 1e6).toFixed(1)} Mbps` : `${(bps / 1e3).toFixed(0)} Kbps`;
1065
+ }
1066
+ function VideoInfoPanel({ metadata, onClose }) {
1067
+ if (!metadata) return null;
1068
+ const rows = [
1069
+ ["File", metadata.filename ? metadata.filename.split("/").pop() ?? metadata.filename : "\u2014"],
1070
+ ["Size", formatSize(metadata.fileSize)],
1071
+ ["Duration", formatTime3(metadata.duration)],
1072
+ ["Container", metadata.container || "\u2014"],
1073
+ ["Resolution", metadata.width && metadata.height ? `${metadata.width} \xD7 ${metadata.height}` : "\u2014"],
1074
+ ["Frame Rate", metadata.frameRate ? `${metadata.frameRate} fps` : "\u2014"],
1075
+ ["Video Codec", metadata.videoCodec ?? "\u2014"],
1076
+ ["Video Bitrate", formatBitrate(metadata.videoBitrate)],
1077
+ ...metadata.audioTracks.map(
1078
+ (t, i) => [
1079
+ `Audio ${i + 1}`,
1080
+ [
1081
+ t.codec ?? "?",
1082
+ t.channels ? `${t.channels}ch` : null,
1083
+ t.sampleRate ? `${(t.sampleRate / 1e3).toFixed(1)} kHz` : null
1084
+ ].filter(Boolean).join(" \xB7 ")
1085
+ ]
1086
+ )
1087
+ ];
1088
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-4 right-4 z-40 bg-black/85 text-white rounded-lg p-4 text-xs w-72", children: [
1089
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between mb-3", children: [
1090
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-sm", children: "Video Information" }),
1091
+ /* @__PURE__ */ jsxRuntime.jsx(
1092
+ "button",
1093
+ {
1094
+ onClick: onClose,
1095
+ className: "text-muted-foreground hover:text-white",
1096
+ "aria-label": "Close",
1097
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-4 h-4" })
1098
+ }
1099
+ )
1100
+ ] }),
1101
+ /* @__PURE__ */ jsxRuntime.jsx("table", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map(([label, value]) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "border-b border-white/10 last:border-0", children: [
1102
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "py-1 pr-3 text-muted-foreground whitespace-nowrap", children: label }),
1103
+ /* @__PURE__ */ jsxRuntime.jsx("td", { className: "py-1 text-right font-mono break-all", children: value || "\u2014" })
1104
+ ] }, label)) }) })
1105
+ ] });
1106
+ }
1107
+ var Dialog = DialogPrimitive__namespace.Root;
1108
+ var DialogPortal = DialogPrimitive__namespace.Portal;
1109
+ var DialogOverlay = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
1110
+ DialogPrimitive__namespace.Overlay,
1111
+ {
1112
+ ref,
1113
+ className: cn(
1114
+ "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1115
+ className
1116
+ ),
1117
+ ...props
1118
+ }
1119
+ ));
1120
+ DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
1121
+ var DialogContent = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
1122
+ /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
1123
+ /* @__PURE__ */ jsxRuntime.jsxs(
1124
+ DialogPrimitive__namespace.Content,
1125
+ {
1126
+ ref,
1127
+ className: cn(
1128
+ "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
1129
+ className
1130
+ ),
1131
+ ...props,
1132
+ children: [
1133
+ children,
1134
+ /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
1135
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
1136
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1137
+ ] })
1138
+ ]
1139
+ }
1140
+ )
1141
+ ] }));
1142
+ DialogContent.displayName = DialogPrimitive__namespace.Content.displayName;
1143
+ var DialogHeader = ({
1144
+ className,
1145
+ ...props
1146
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
1147
+ "div",
1148
+ {
1149
+ className: cn(
1150
+ "flex flex-col space-y-1.5 text-center sm:text-left",
1151
+ className
1152
+ ),
1153
+ ...props
1154
+ }
1155
+ );
1156
+ DialogHeader.displayName = "DialogHeader";
1157
+ var DialogTitle = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
1158
+ DialogPrimitive__namespace.Title,
1159
+ {
1160
+ ref,
1161
+ className: cn(
1162
+ "text-lg font-semibold leading-none tracking-tight",
1163
+ className
1164
+ ),
1165
+ ...props
1166
+ }
1167
+ ));
1168
+ DialogTitle.displayName = DialogPrimitive__namespace.Title.displayName;
1169
+ var DialogDescription = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
1170
+ DialogPrimitive__namespace.Description,
1171
+ {
1172
+ ref,
1173
+ className: cn("text-sm text-muted-foreground", className),
1174
+ ...props
1175
+ }
1176
+ ));
1177
+ DialogDescription.displayName = DialogPrimitive__namespace.Description.displayName;
1178
+ var TOAST_LIMIT = 1;
1179
+ var TOAST_REMOVE_DELAY = 1e6;
1180
+ var count = 0;
1181
+ function genId() {
1182
+ count = (count + 1) % Number.MAX_SAFE_INTEGER;
1183
+ return count.toString();
1184
+ }
1185
+ var toastTimeouts = /* @__PURE__ */ new Map();
1186
+ var addToRemoveQueue = (toastId) => {
1187
+ if (toastTimeouts.has(toastId)) {
1188
+ return;
1189
+ }
1190
+ const timeout = setTimeout(() => {
1191
+ toastTimeouts.delete(toastId);
1192
+ dispatch({
1193
+ type: "REMOVE_TOAST",
1194
+ toastId
1195
+ });
1196
+ }, TOAST_REMOVE_DELAY);
1197
+ toastTimeouts.set(toastId, timeout);
1198
+ };
1199
+ var reducer = (state, action) => {
1200
+ switch (action.type) {
1201
+ case "ADD_TOAST":
1202
+ return {
1203
+ ...state,
1204
+ toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
1205
+ };
1206
+ case "UPDATE_TOAST":
1207
+ return {
1208
+ ...state,
1209
+ toasts: state.toasts.map(
1210
+ (t) => t.id === action.toast.id ? { ...t, ...action.toast } : t
1211
+ )
1212
+ };
1213
+ case "DISMISS_TOAST": {
1214
+ const { toastId } = action;
1215
+ if (toastId) {
1216
+ addToRemoveQueue(toastId);
1217
+ } else {
1218
+ state.toasts.forEach((toast2) => {
1219
+ addToRemoveQueue(toast2.id);
1220
+ });
1221
+ }
1222
+ return {
1223
+ ...state,
1224
+ toasts: state.toasts.map(
1225
+ (t) => t.id === toastId || toastId === void 0 ? {
1226
+ ...t,
1227
+ open: false
1228
+ } : t
1229
+ )
1230
+ };
1231
+ }
1232
+ case "REMOVE_TOAST":
1233
+ if (action.toastId === void 0) {
1234
+ return {
1235
+ ...state,
1236
+ toasts: []
1237
+ };
1238
+ }
1239
+ return {
1240
+ ...state,
1241
+ toasts: state.toasts.filter((t) => t.id !== action.toastId)
1242
+ };
1243
+ }
1244
+ };
1245
+ var listeners = [];
1246
+ var memoryState = { toasts: [] };
1247
+ function dispatch(action) {
1248
+ memoryState = reducer(memoryState, action);
1249
+ listeners.forEach((listener) => {
1250
+ listener(memoryState);
1251
+ });
1252
+ }
1253
+ function toast({ ...props }) {
1254
+ const id = genId();
1255
+ const update = (props2) => dispatch({
1256
+ type: "UPDATE_TOAST",
1257
+ toast: { ...props2, id }
1258
+ });
1259
+ const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
1260
+ dispatch({
1261
+ type: "ADD_TOAST",
1262
+ toast: {
1263
+ ...props,
1264
+ id,
1265
+ open: true,
1266
+ onOpenChange: (open) => {
1267
+ if (!open) dismiss();
1268
+ }
1269
+ }
1270
+ });
1271
+ return {
1272
+ id,
1273
+ dismiss,
1274
+ update
1275
+ };
1276
+ }
1277
+ function useToast() {
1278
+ const [state, setState] = React10__namespace.useState(memoryState);
1279
+ React10__namespace.useEffect(() => {
1280
+ listeners.push(setState);
1281
+ return () => {
1282
+ const index = listeners.indexOf(setState);
1283
+ if (index > -1) {
1284
+ listeners.splice(index, 1);
1285
+ }
1286
+ };
1287
+ }, [state]);
1288
+ return {
1289
+ ...state,
1290
+ toast,
1291
+ dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
1292
+ };
1293
+ }
1294
+ function ShortcutSettingsDialog({
1295
+ shortcuts,
1296
+ onSave,
1297
+ onClose
1298
+ }) {
1299
+ const [editing, setEditing] = React10.useState(shortcuts);
1300
+ const [capturing, setCapturing] = React10.useState(null);
1301
+ const { toast: toast2 } = useToast();
1302
+ React10.useEffect(() => {
1303
+ if (!capturing) return;
1304
+ const handler = (e) => {
1305
+ e.preventDefault();
1306
+ if (e.key === "Escape") {
1307
+ setCapturing(null);
1308
+ return;
1309
+ }
1310
+ const conflict = editing.find(
1311
+ (b) => b.action !== capturing && core.matchesShortcut(e, {
1312
+ ...b,
1313
+ key: e.key,
1314
+ modifiers: {
1315
+ ctrl: e.ctrlKey,
1316
+ shift: e.shiftKey,
1317
+ alt: e.altKey
1318
+ }
1319
+ })
1320
+ );
1321
+ if (conflict) {
1322
+ toast2({
1323
+ title: `Conflicts with "${conflict.label}"`,
1324
+ variant: "destructive"
1325
+ });
1326
+ return;
1327
+ }
1328
+ setEditing(
1329
+ (prev) => prev.map(
1330
+ (b) => b.action === capturing ? {
1331
+ ...b,
1332
+ key: e.key,
1333
+ modifiers: {
1334
+ ctrl: e.ctrlKey,
1335
+ shift: e.shiftKey,
1336
+ alt: e.altKey
1337
+ }
1338
+ } : b
1339
+ )
1340
+ );
1341
+ setCapturing(null);
1342
+ };
1343
+ window.addEventListener("keydown", handler);
1344
+ return () => window.removeEventListener("keydown", handler);
1345
+ }, [capturing, editing, toast2]);
1346
+ const handleSave = () => {
1347
+ core.saveShortcuts(editing);
1348
+ onSave(editing);
1349
+ onClose();
1350
+ };
1351
+ const handleReset = () => {
1352
+ setEditing(core.DEFAULT_SHORTCUTS);
1353
+ };
1354
+ return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: true, onOpenChange: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "max-w-md", children: [
1355
+ /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: "Keyboard Shortcuts" }) }),
1356
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1 max-h-96 overflow-y-auto", children: editing.map((binding) => /* @__PURE__ */ jsxRuntime.jsxs(
1357
+ "div",
1358
+ {
1359
+ className: "flex items-center justify-between py-1 px-2 rounded hover:bg-muted",
1360
+ children: [
1361
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: binding.label }),
1362
+ /* @__PURE__ */ jsxRuntime.jsx(
1363
+ "button",
1364
+ {
1365
+ onClick: () => setCapturing(binding.action),
1366
+ className: `font-mono text-xs px-2 py-1 rounded border ${capturing === binding.action ? "border-primary animate-pulse" : "border-muted-foreground"}`,
1367
+ children: capturing === binding.action ? "Press key..." : core.formatShortcutKey(binding)
1368
+ }
1369
+ )
1370
+ ]
1371
+ },
1372
+ binding.action
1373
+ )) }),
1374
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 justify-end mt-4", children: [
1375
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", onClick: handleReset, children: "Reset to Defaults" }),
1376
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: handleSave, children: "Save" })
1377
+ ] })
1378
+ ] }) });
1379
+ }
1380
+ function SubtitleOverlay({ videoRef, activeSubtitle }) {
1381
+ const [cueText, setCueText] = React10.useState("");
1382
+ React10.useEffect(() => {
1383
+ const video = videoRef.current;
1384
+ if (!video || activeSubtitle === "-1") {
1385
+ setCueText("");
1386
+ return;
1387
+ }
1388
+ let cueChangeCleanup = null;
1389
+ function subscribeToTrack() {
1390
+ const trackElements = Array.from(video.querySelectorAll("track"));
1391
+ const targetIdx = trackElements.findIndex(
1392
+ (el) => el.getAttribute("data-id") === activeSubtitle
1393
+ );
1394
+ if (targetIdx === -1) return false;
1395
+ const textTrack = trackElements[targetIdx].track;
1396
+ if (!textTrack) return false;
1397
+ const handleCueChange = () => {
1398
+ const activeCues = textTrack.activeCues;
1399
+ if (!activeCues || activeCues.length === 0) {
1400
+ setCueText("");
1401
+ return;
1402
+ }
1403
+ const texts = [];
1404
+ for (let i = 0; i < activeCues.length; i++) {
1405
+ const cue = activeCues[i];
1406
+ const cleaned = cue.text.replace(/<br\s*\/?>/gi, "\n").replace(/<[^>]+>/g, "");
1407
+ texts.push(cleaned);
1408
+ }
1409
+ setCueText(texts.join("\n"));
1410
+ };
1411
+ function seedFromCurrentTime() {
1412
+ const allCues = textTrack.cues;
1413
+ if (!allCues) return;
1414
+ const currentTime = video.currentTime;
1415
+ const texts = [];
1416
+ for (let i = 0; i < allCues.length; i++) {
1417
+ const cue = allCues[i];
1418
+ if (cue.startTime <= currentTime && cue.endTime > currentTime) {
1419
+ texts.push(
1420
+ cue.text.replace(/<br\s*\/?>/gi, "\n").replace(/<[^>]+>/g, "")
1421
+ );
1422
+ }
1423
+ }
1424
+ setCueText(texts.join("\n"));
1425
+ }
1426
+ textTrack.addEventListener("cuechange", handleCueChange);
1427
+ const trackEl = trackElements[targetIdx];
1428
+ if (trackEl.readyState === 2) {
1429
+ seedFromCurrentTime();
1430
+ } else {
1431
+ const onLoad = () => {
1432
+ seedFromCurrentTime();
1433
+ trackEl.removeEventListener("load", onLoad);
1434
+ };
1435
+ trackEl.addEventListener("load", onLoad);
1436
+ }
1437
+ cueChangeCleanup = () => {
1438
+ textTrack.removeEventListener("cuechange", handleCueChange);
1439
+ setCueText("");
1440
+ };
1441
+ return true;
1442
+ }
1443
+ if (subscribeToTrack()) {
1444
+ return () => cueChangeCleanup?.();
1445
+ }
1446
+ const observer = new MutationObserver(() => {
1447
+ if (subscribeToTrack()) {
1448
+ observer.disconnect();
1449
+ }
1450
+ });
1451
+ observer.observe(video, { childList: true });
1452
+ return () => {
1453
+ observer.disconnect();
1454
+ cueChangeCleanup?.();
1455
+ };
1456
+ }, [videoRef, activeSubtitle]);
1457
+ if (!cueText) return null;
1458
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute left-0 right-0 bottom-4 flex justify-center pointer-events-none z-10 px-8 translate-y-0 group-hover:-translate-y-24 transition-transform duration-300 ease-in-out", children: /* @__PURE__ */ jsxRuntime.jsx(
1459
+ "div",
1460
+ {
1461
+ className: "text-white text-center whitespace-pre-line",
1462
+ style: {
1463
+ fontSize: "2em",
1464
+ lineHeight: "normal",
1465
+ fontWeight: "bolder",
1466
+ fontFamily: "Netflix Sans, Helvetica Neue, Helvetica, Arial, sans-serif",
1467
+ textShadow: "#000000 0px 0px 7px"
1468
+ },
1469
+ children: cueText
1470
+ }
1471
+ ) });
1472
+ }
1473
+ var MAX_RETRIES = 3;
1474
+ var LightBirdPlayer = () => {
1475
+ const videoRef = React10.useRef(null);
1476
+ const containerRef = React10.useRef(null);
1477
+ const canvasRef = React10.useRef(null);
1478
+ const subtitleInputRef = React10.useRef(null);
1479
+ const playerRef = React10.useRef(null);
1480
+ const subtitleFilesMapRef = React10.useRef(/* @__PURE__ */ new Map());
1481
+ const retryCountRef = React10.useRef(0);
1482
+ const retryTimerRef = React10.useRef(null);
1483
+ const streamStallDetectorRef = React10.useRef(null);
1484
+ const isStreamRef = React10.useRef(false);
1485
+ const { toast: toast2 } = useToast();
1486
+ const playlist = react.usePlaylist();
1487
+ const playback = react.useVideoPlayback(videoRef);
1488
+ const filters = react.useVideoFilters(videoRef);
1489
+ const subtitles = react.useSubtitles({
1490
+ onError: (msg) => toast2({ title: msg, variant: "destructive" }),
1491
+ onSuccess: (msg) => toast2({ title: msg })
1492
+ });
1493
+ const fullscreen = react.useFullscreen(containerRef);
1494
+ const pip = react.usePictureInPicture(videoRef);
1495
+ const { metadata: videoMetadata } = react.useVideoInfo(videoRef, playlist.currentItem?.file ?? null);
1496
+ react.useProgressPersistence(videoRef, playlist.currentItem?.name ?? null);
1497
+ const { chapters, currentChapter, goToChapter } = react.useChapters(videoRef, playerRef);
1498
+ const [shortcuts, setShortcuts] = React10.useState(() => core.loadShortcuts());
1499
+ const [showShortcutsHelp, setShowShortcutsHelp] = React10.useState(false);
1500
+ const [showShortcutsDialog, setShowShortcutsDialog] = React10.useState(false);
1501
+ const [showInfo, setShowInfo] = React10.useState(false);
1502
+ const progressEstimatorRef = React10.useRef(null);
1503
+ const [audioTracks, setAudioTracks] = React10.useState([]);
1504
+ const [activeAudioTrack, setActiveAudioTrack] = React10.useState("0");
1505
+ const [isLoading, setIsLoading] = React10.useState(false);
1506
+ const [loadingMessage, setLoadingMessage] = React10.useState("");
1507
+ const [processingProgress, setProcessingProgress] = React10.useState(0);
1508
+ const [processingEta, setProcessingEta] = React10.useState(null);
1509
+ const [processingThroughput, setProcessingThroughput] = React10.useState(null);
1510
+ const [playerError, setPlayerError] = React10.useState(null);
1511
+ const [cancellableProcessing, setCancellableProcessing] = React10.useState(false);
1512
+ const [mediaThumbnail, setMediaThumbnail] = React10.useState(null);
1513
+ const [tracksLoading, setTracksLoading] = React10.useState(false);
1514
+ const shortcutHandlers = React10.useMemo(() => ({
1515
+ "play-pause": () => playback.togglePlay(),
1516
+ "seek-forward-5": () => {
1517
+ const el = videoRef.current;
1518
+ if (el) playback.seek(el.currentTime + 5);
1519
+ },
1520
+ "seek-backward-5": () => {
1521
+ const el = videoRef.current;
1522
+ if (el) playback.seek(el.currentTime - 5);
1523
+ },
1524
+ "seek-forward-30": () => {
1525
+ const el = videoRef.current;
1526
+ if (el) playback.seek(el.currentTime + 30);
1527
+ },
1528
+ "seek-backward-30": () => {
1529
+ const el = videoRef.current;
1530
+ if (el) playback.seek(el.currentTime - 30);
1531
+ },
1532
+ "volume-up": () => {
1533
+ const el = videoRef.current;
1534
+ if (el) playback.setVolume(Math.min(1, el.volume + 0.05));
1535
+ },
1536
+ "volume-down": () => {
1537
+ const el = videoRef.current;
1538
+ if (el) playback.setVolume(Math.max(0, el.volume - 0.05));
1539
+ },
1540
+ "mute": () => playback.toggleMute(),
1541
+ "fullscreen": () => fullscreen.toggle(),
1542
+ "next-item": () => handleNext(),
1543
+ "prev-item": () => handlePrevious(),
1544
+ "screenshot": () => captureScreenshot(),
1545
+ "show-shortcuts": () => setShowShortcutsHelp((v) => !v),
1546
+ "next-chapter": () => {
1547
+ const el = videoRef.current;
1548
+ if (!el || chapters.length === 0) return;
1549
+ const next = chapters.find((c) => c.startTime > el.currentTime);
1550
+ if (next) el.currentTime = next.startTime;
1551
+ },
1552
+ "prev-chapter": () => {
1553
+ const el = videoRef.current;
1554
+ if (!el || chapters.length === 0) return;
1555
+ const cur = currentChapter;
1556
+ if (!cur) return;
1557
+ if (el.currentTime > cur.startTime + 3) {
1558
+ el.currentTime = cur.startTime;
1559
+ } else {
1560
+ const prev = chapters[cur.index - 1];
1561
+ if (prev) el.currentTime = prev.startTime;
1562
+ }
1563
+ }
1564
+ // eslint-disable-next-line react-hooks/exhaustive-deps
1565
+ }), [playback.togglePlay, playback.seek, playback.setVolume, playback.toggleMute, fullscreen.toggle, chapters, currentChapter]);
1566
+ react.useKeyboardShortcuts(shortcuts, shortcutHandlers);
1567
+ const stopStallDetection = () => {
1568
+ if (streamStallDetectorRef.current) {
1569
+ clearInterval(streamStallDetectorRef.current);
1570
+ streamStallDetectorRef.current = null;
1571
+ }
1572
+ };
1573
+ const startStallDetection = () => {
1574
+ stopStallDetection();
1575
+ let lastTime = -1;
1576
+ streamStallDetectorRef.current = setInterval(() => {
1577
+ const el = videoRef.current;
1578
+ if (!el) return;
1579
+ const current = el.currentTime;
1580
+ if (!el.paused && current === lastTime) {
1581
+ const resumeAt = current;
1582
+ el.load();
1583
+ el.addEventListener(
1584
+ "canplay",
1585
+ () => {
1586
+ el.currentTime = resumeAt;
1587
+ el.play().catch(() => {
1588
+ });
1589
+ },
1590
+ { once: true }
1591
+ );
1592
+ }
1593
+ lastTime = current;
1594
+ }, 5e3);
1595
+ };
1596
+ const clearRetryTimer = () => {
1597
+ if (retryTimerRef.current) {
1598
+ clearTimeout(retryTimerRef.current);
1599
+ retryTimerRef.current = null;
1600
+ }
1601
+ };
1602
+ const [playlistOpen, setPlaylistOpen] = React10.useState(true);
1603
+ const [playlistPinned, setPlaylistPinned] = React10.useState(false);
1604
+ const [playlistSize, setPlaylistSize] = React10.useState("md");
1605
+ const wasAutoHiddenRef = React10.useRef(false);
1606
+ const processFile = React10.useCallback(async (file, subtitleFiles = []) => {
1607
+ setIsLoading(true);
1608
+ setLoadingMessage("Initializing player...");
1609
+ setProcessingProgress(0);
1610
+ setPlayerError(null);
1611
+ setTracksLoading(false);
1612
+ progressEstimatorRef.current = new core.ProgressEstimator(file.size);
1613
+ setProcessingEta(null);
1614
+ setProcessingThroughput(null);
1615
+ retryCountRef.current = 0;
1616
+ isStreamRef.current = false;
1617
+ stopStallDetection();
1618
+ try {
1619
+ playerRef.current?.destroy();
1620
+ subtitles.reset();
1621
+ const player = core.createVideoPlayer(file, subtitleFiles, (progress) => {
1622
+ progressEstimatorRef.current?.update(progress);
1623
+ const est = progressEstimatorRef.current?.getEstimate();
1624
+ setProcessingProgress(progress);
1625
+ if (progress < 1) {
1626
+ setLoadingMessage(`Processing video\u2026 ${Math.round(progress * 100)}%`);
1627
+ setProcessingEta(est?.etaSeconds ?? null);
1628
+ setProcessingThroughput(est && est.speedMBps > 0 ? est.speedMBps : null);
1629
+ }
1630
+ });
1631
+ playerRef.current = player;
1632
+ setCancellableProcessing(true);
1633
+ try {
1634
+ if (!videoRef.current) throw new Error("Video element not available");
1635
+ setLoadingMessage("Loading video...");
1636
+ await player.initialize(videoRef.current);
1637
+ } finally {
1638
+ setCancellableProcessing(false);
1639
+ }
1640
+ subtitles.initManager(videoRef.current);
1641
+ subtitles.importSubtitles(player.getSubtitles());
1642
+ const newAudioTracks = player.getAudioTracks();
1643
+ setAudioTracks(newAudioTracks);
1644
+ setActiveAudioTrack(newAudioTracks[0]?.id || "0");
1645
+ setIsLoading(false);
1646
+ setLoadingMessage("");
1647
+ setProcessingProgress(0);
1648
+ if (player.tracksReady) {
1649
+ setTracksLoading(true);
1650
+ player.tracksReady.then(() => {
1651
+ if (playerRef.current !== player) {
1652
+ setTracksLoading(false);
1653
+ return;
1654
+ }
1655
+ subtitles.importSubtitles(player.getSubtitles());
1656
+ const updatedTracks = player.getAudioTracks();
1657
+ setAudioTracks(updatedTracks);
1658
+ setActiveAudioTrack(updatedTracks[0]?.id || "0");
1659
+ setTracksLoading(false);
1660
+ }).catch(() => {
1661
+ setTracksLoading(false);
1662
+ });
1663
+ }
1664
+ } catch (error) {
1665
+ if (!(error instanceof core.CancellationError)) {
1666
+ console.error(error);
1667
+ toast2({
1668
+ title: "Failed to process video",
1669
+ description: "There was an error loading the video file. It might be an unsupported format.",
1670
+ variant: "destructive"
1671
+ });
1672
+ }
1673
+ setIsLoading(false);
1674
+ setLoadingMessage("");
1675
+ setProcessingProgress(0);
1676
+ } finally {
1677
+ progressEstimatorRef.current = null;
1678
+ setProcessingEta(null);
1679
+ setProcessingThroughput(null);
1680
+ }
1681
+ }, [subtitles, toast2]);
1682
+ const handleCancelProcessing = React10.useCallback(() => {
1683
+ playerRef.current?.cancel?.();
1684
+ playerRef.current = null;
1685
+ setCancellableProcessing(false);
1686
+ setIsLoading(false);
1687
+ setLoadingMessage("");
1688
+ setProcessingProgress(0);
1689
+ }, []);
1690
+ const loadVideo = React10.useCallback((index) => {
1691
+ const item = playlist.playlist[index];
1692
+ if (!item) return;
1693
+ playlist.selectItem(index);
1694
+ setPlayerError(null);
1695
+ clearRetryTimer();
1696
+ retryCountRef.current = 0;
1697
+ if (item.type === "stream") {
1698
+ playerRef.current?.destroy();
1699
+ playerRef.current = null;
1700
+ if (videoRef.current) videoRef.current.src = item.url;
1701
+ subtitles.reset();
1702
+ setAudioTracks([]);
1703
+ setActiveAudioTrack("0");
1704
+ isStreamRef.current = true;
1705
+ startStallDetection();
1706
+ } else if (item.file) {
1707
+ isStreamRef.current = false;
1708
+ stopStallDetection();
1709
+ const subs = subtitleFilesMapRef.current.get(item.name) ?? [];
1710
+ processFile(item.file, subs);
1711
+ }
1712
+ }, [playlist.playlist, playlist.selectItem, subtitles, processFile]);
1713
+ const handleSkipToNext = React10.useCallback(() => {
1714
+ setPlayerError(null);
1715
+ clearRetryTimer();
1716
+ if (playlist.currentIndex !== null && playlist.playlist.length > 1) {
1717
+ loadVideo((playlist.currentIndex + 1) % playlist.playlist.length);
1718
+ }
1719
+ }, [playlist.currentIndex, playlist.playlist.length, loadVideo]);
1720
+ const handleRetry = React10.useCallback(() => {
1721
+ setPlayerError(null);
1722
+ clearRetryTimer();
1723
+ retryCountRef.current = 0;
1724
+ if (videoRef.current) {
1725
+ videoRef.current.load();
1726
+ }
1727
+ }, []);
1728
+ const handleDismissError = React10.useCallback(() => {
1729
+ setPlayerError(null);
1730
+ clearRetryTimer();
1731
+ }, []);
1732
+ React10.useEffect(() => {
1733
+ const el = videoRef.current;
1734
+ if (!el) return;
1735
+ const onError = () => {
1736
+ const parsed = core.parseMediaError(el.error ?? null);
1737
+ setPlayerError(parsed);
1738
+ if (parsed.retryable && retryCountRef.current < MAX_RETRIES) {
1739
+ const delay = Math.pow(2, retryCountRef.current) * 1e3;
1740
+ retryTimerRef.current = setTimeout(() => {
1741
+ retryCountRef.current += 1;
1742
+ el.load();
1743
+ }, delay);
1744
+ } else if (!parsed.recoverable) {
1745
+ toast2({ title: "Skipping unplayable file", description: parsed.message });
1746
+ if (playlist.currentIndex !== null && playlist.playlist.length > 1) {
1747
+ loadVideo((playlist.currentIndex + 1) % playlist.playlist.length);
1748
+ }
1749
+ }
1750
+ };
1751
+ el.addEventListener("error", onError);
1752
+ return () => el.removeEventListener("error", onError);
1753
+ }, [playlist.currentIndex, playlist.playlist.length]);
1754
+ React10.useEffect(() => {
1755
+ const el = videoRef.current;
1756
+ if (!el) return;
1757
+ const onEnded = () => {
1758
+ if (playback.loop) {
1759
+ el.currentTime = 0;
1760
+ el.play().catch(() => {
1761
+ });
1762
+ } else if (playlist.currentIndex !== null && playlist.playlist.length > 1) {
1763
+ loadVideo((playlist.currentIndex + 1) % playlist.playlist.length);
1764
+ }
1765
+ };
1766
+ el.addEventListener("ended", onEnded);
1767
+ return () => el.removeEventListener("ended", onEnded);
1768
+ }, [playback.loop, playlist.currentIndex, playlist.playlist.length, loadVideo]);
1769
+ React10.useEffect(() => {
1770
+ return () => {
1771
+ playerRef.current?.destroy();
1772
+ clearRetryTimer();
1773
+ stopStallDetection();
1774
+ };
1775
+ }, []);
1776
+ React10.useEffect(() => {
1777
+ const el = videoRef.current;
1778
+ if (!el || !playlist.currentItem) {
1779
+ setMediaThumbnail(null);
1780
+ return;
1781
+ }
1782
+ setMediaThumbnail(null);
1783
+ let cancelled = false;
1784
+ const onLoadedData = () => {
1785
+ core.captureVideoThumbnail(el).then((dataUrl) => {
1786
+ if (!cancelled) setMediaThumbnail(dataUrl);
1787
+ });
1788
+ };
1789
+ el.addEventListener("loadeddata", onLoadedData);
1790
+ return () => {
1791
+ cancelled = true;
1792
+ el.removeEventListener("loadeddata", onLoadedData);
1793
+ };
1794
+ }, [playlist.currentItem]);
1795
+ React10.useEffect(() => {
1796
+ if (playback.isPlaying) {
1797
+ if (!playlistPinned) {
1798
+ setPlaylistOpen((current) => {
1799
+ if (current) wasAutoHiddenRef.current = true;
1800
+ return current ? false : current;
1801
+ });
1802
+ }
1803
+ } else if (wasAutoHiddenRef.current) {
1804
+ setPlaylistOpen(true);
1805
+ wasAutoHiddenRef.current = false;
1806
+ }
1807
+ }, [playback.isPlaying, playlistPinned]);
1808
+ const handleFileChange = async (files) => {
1809
+ const { videoFiles, subtitleFiles } = playlist.parseFiles(files);
1810
+ if (videoFiles.length === 0) return;
1811
+ const validVideoFiles = [];
1812
+ for (const file of videoFiles) {
1813
+ const validation = core.validateFile(file);
1814
+ if (!validation.valid) {
1815
+ toast2({ title: "Cannot load file", description: validation.reason, variant: "destructive" });
1816
+ } else {
1817
+ validVideoFiles.push(file);
1818
+ }
1819
+ }
1820
+ if (validVideoFiles.length === 0) return;
1821
+ if (subtitleFiles.length > 0) {
1822
+ subtitleFilesMapRef.current.set(validVideoFiles[0].name, subtitleFiles);
1823
+ }
1824
+ const prevLen = playlist.playlist.length;
1825
+ await playlist.addFiles(validVideoFiles);
1826
+ if (playlist.currentIndex === null) {
1827
+ playlist.selectItem(prevLen);
1828
+ await processFile(validVideoFiles[0], subtitleFiles);
1829
+ }
1830
+ };
1831
+ const handleFolderFilesAdded = React10.useCallback(
1832
+ async (files) => {
1833
+ const prevLen = playlist.playlist.length;
1834
+ await playlist.addFiles(files);
1835
+ if (playlist.currentIndex === null && files.length > 0) {
1836
+ const newIndex = prevLen;
1837
+ playlist.selectItem(newIndex);
1838
+ await processFile(files[0]);
1839
+ }
1840
+ },
1841
+ [playlist, processFile]
1842
+ );
1843
+ const handleRemoveItem = React10.useCallback((index) => {
1844
+ playlist.removeItem(index);
1845
+ }, [playlist]);
1846
+ const handleReorder = React10.useCallback(
1847
+ (newPlaylist) => {
1848
+ playlist.reorderItems(newPlaylist);
1849
+ },
1850
+ [playlist]
1851
+ );
1852
+ const handleImportM3U = React10.useCallback(
1853
+ (items) => {
1854
+ items.forEach((item) => {
1855
+ playlist.appendItem({ ...item, id: crypto.randomUUID() });
1856
+ });
1857
+ if (playlist.currentIndex === null && items.length > 0) {
1858
+ const firstStream = items.find((i) => i.type === "stream");
1859
+ if (firstStream && videoRef.current) {
1860
+ playlist.selectItem(0);
1861
+ videoRef.current.src = firstStream.url;
1862
+ subtitles.reset();
1863
+ }
1864
+ }
1865
+ },
1866
+ [playlist, subtitles]
1867
+ );
1868
+ const handleAddStream = React10.useCallback((url, name) => {
1869
+ const newIndex = playlist.playlist.length;
1870
+ const newItem = {
1871
+ id: crypto.randomUUID(),
1872
+ name: name || `Stream ${newIndex + 1}`,
1873
+ url,
1874
+ type: "stream"
1875
+ };
1876
+ playlist.appendItem(newItem);
1877
+ if (playlist.currentIndex === null) {
1878
+ playlist.selectItem(newIndex);
1879
+ if (videoRef.current) videoRef.current.src = url;
1880
+ subtitles.reset();
1881
+ setAudioTracks([]);
1882
+ setActiveAudioTrack("0");
1883
+ isStreamRef.current = true;
1884
+ startStallDetection();
1885
+ }
1886
+ }, [playlist, subtitles]);
1887
+ const handleSubtitleChange = React10.useCallback(async (id) => {
1888
+ subtitles.switchSubtitle(id);
1889
+ if (playerRef.current) {
1890
+ try {
1891
+ await playerRef.current.switchSubtitle(id);
1892
+ } catch (error) {
1893
+ console.error("Player subtitle switch failed:", error);
1894
+ }
1895
+ }
1896
+ }, [subtitles]);
1897
+ const handleAudioTrackChange = React10.useCallback(async (id) => {
1898
+ if (!playerRef.current) return;
1899
+ try {
1900
+ setIsLoading(true);
1901
+ setLoadingMessage("Switching audio track...");
1902
+ await playerRef.current.switchAudioTrack(id);
1903
+ setActiveAudioTrack(id);
1904
+ } catch (error) {
1905
+ console.error("Failed to switch audio track:", error);
1906
+ toast2({ title: "Failed to switch audio track", variant: "destructive" });
1907
+ } finally {
1908
+ setIsLoading(false);
1909
+ setLoadingMessage("");
1910
+ }
1911
+ }, [toast2]);
1912
+ const captureScreenshot = React10.useCallback(() => {
1913
+ const video = videoRef.current;
1914
+ const canvas = canvasRef.current;
1915
+ if (!video || !canvas) return;
1916
+ canvas.width = video.videoWidth;
1917
+ canvas.height = video.videoHeight;
1918
+ const ctx = canvas.getContext("2d");
1919
+ if (!ctx) return;
1920
+ ctx.filter = video.style.filter;
1921
+ ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
1922
+ const dataUrl = canvas.toDataURL("image/png");
1923
+ const a = document.createElement("a");
1924
+ a.href = dataUrl;
1925
+ a.download = `lightbird-screenshot-${(/* @__PURE__ */ new Date()).toISOString()}.png`;
1926
+ a.click();
1927
+ toast2({ title: "Screenshot Saved" });
1928
+ }, [toast2]);
1929
+ const handleNext = React10.useCallback(() => {
1930
+ if (playlist.currentIndex !== null && playlist.playlist.length > 1) {
1931
+ loadVideo((playlist.currentIndex + 1) % playlist.playlist.length);
1932
+ }
1933
+ }, [playlist.currentIndex, playlist.playlist.length, loadVideo]);
1934
+ const handlePrevious = React10.useCallback(() => {
1935
+ if (playlist.currentIndex !== null && playlist.playlist.length > 1) {
1936
+ loadVideo((playlist.currentIndex - 1 + playlist.playlist.length) % playlist.playlist.length);
1937
+ }
1938
+ }, [playlist.currentIndex, playlist.playlist.length, loadVideo]);
1939
+ const handleSubtitleUpload = React10.useCallback(() => {
1940
+ subtitleInputRef.current?.click();
1941
+ }, []);
1942
+ const handleSelectVideo = React10.useCallback((index) => {
1943
+ loadVideo(index);
1944
+ }, [loadVideo]);
1945
+ const handlePlaylistToggle = () => {
1946
+ wasAutoHiddenRef.current = false;
1947
+ setPlaylistOpen((v) => !v);
1948
+ };
1949
+ const handleMediaPlay = React10.useCallback(() => {
1950
+ const el = videoRef.current;
1951
+ if (el) el.play().catch(() => {
1952
+ });
1953
+ }, []);
1954
+ const handleMediaPause = React10.useCallback(() => {
1955
+ const el = videoRef.current;
1956
+ if (el) el.pause();
1957
+ }, []);
1958
+ const handleMediaSeekForward = React10.useCallback(() => {
1959
+ const el = videoRef.current;
1960
+ if (el) playback.seek(el.currentTime + 10);
1961
+ }, [playback.seek]);
1962
+ const handleMediaSeekBackward = React10.useCallback(() => {
1963
+ const el = videoRef.current;
1964
+ if (el) playback.seek(el.currentTime - 10);
1965
+ }, [playback.seek]);
1966
+ react.useMediaSession({
1967
+ title: playlist.currentItem?.name ?? null,
1968
+ artwork: mediaThumbnail,
1969
+ onPlay: handleMediaPlay,
1970
+ onPause: handleMediaPause,
1971
+ onNext: handleNext,
1972
+ onPrev: handlePrevious,
1973
+ onSeekForward: handleMediaSeekForward,
1974
+ onSeekBackward: handleMediaSeekBackward
1975
+ });
1976
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 w-full h-full", children: [
1977
+ /* @__PURE__ */ jsxRuntime.jsxs(
1978
+ "div",
1979
+ {
1980
+ ref: containerRef,
1981
+ className: "flex-1 flex flex-col items-center justify-center bg-black relative group",
1982
+ children: [
1983
+ /* @__PURE__ */ jsxRuntime.jsx(
1984
+ "video",
1985
+ {
1986
+ ref: videoRef,
1987
+ className: cn("w-full h-full object-contain transition-all duration-300", isLoading && "invisible"),
1988
+ loop: playback.loop,
1989
+ onClick: playback.togglePlay,
1990
+ crossOrigin: "anonymous"
1991
+ }
1992
+ ),
1993
+ /* @__PURE__ */ jsxRuntime.jsx("canvas", { ref: canvasRef, className: "hidden" }),
1994
+ /* @__PURE__ */ jsxRuntime.jsx(SubtitleOverlay, { videoRef, activeSubtitle: subtitles.activeSubtitle }),
1995
+ /* @__PURE__ */ jsxRuntime.jsx(
1996
+ VideoOverlay,
1997
+ {
1998
+ isLoading,
1999
+ loadingMessage,
2000
+ processingProgress,
2001
+ eta: processingEta,
2002
+ throughputMBs: processingThroughput,
2003
+ onCancel: cancellableProcessing ? handleCancelProcessing : void 0
2004
+ }
2005
+ ),
2006
+ playerError && /* @__PURE__ */ jsxRuntime.jsx(
2007
+ PlayerErrorDisplay,
2008
+ {
2009
+ error: playerError,
2010
+ onRetry: playerError.retryable ? handleRetry : void 0,
2011
+ onSkip: handleSkipToNext,
2012
+ onDismiss: handleDismissError
2013
+ }
2014
+ ),
2015
+ showInfo && /* @__PURE__ */ jsxRuntime.jsx(
2016
+ VideoInfoPanel,
2017
+ {
2018
+ metadata: videoMetadata,
2019
+ onClose: () => setShowInfo(false)
2020
+ }
2021
+ ),
2022
+ showShortcutsHelp && /* @__PURE__ */ jsxRuntime.jsx(
2023
+ "div",
2024
+ {
2025
+ className: "absolute inset-0 bg-black/90 z-50 flex items-center justify-center",
2026
+ onClick: () => setShowShortcutsHelp(false),
2027
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
2028
+ "div",
2029
+ {
2030
+ className: "bg-card rounded-lg p-6 max-w-sm w-full",
2031
+ onClick: (e) => e.stopPropagation(),
2032
+ children: [
2033
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold mb-4", children: "Keyboard Shortcuts" }),
2034
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1 max-h-80 overflow-y-auto", children: shortcuts.map((b) => {
2035
+ const mods = [];
2036
+ if (b.modifiers?.ctrl) mods.push("Ctrl");
2037
+ if (b.modifiers?.shift) mods.push("Shift");
2038
+ if (b.modifiers?.alt) mods.push("Alt");
2039
+ const keyLabel = b.key === " " ? "Space" : b.key;
2040
+ const formatted = [...mods, keyLabel].join(" + ");
2041
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-sm", children: [
2042
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: b.label }),
2043
+ /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "font-mono bg-muted px-1.5 rounded text-xs", children: formatted })
2044
+ ] }, b.action);
2045
+ }) }),
2046
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-4", children: "Press ? or click outside to close" })
2047
+ ]
2048
+ }
2049
+ )
2050
+ }
2051
+ ),
2052
+ playlist.currentItem && /* @__PURE__ */ jsxRuntime.jsx(
2053
+ player_controls_default,
2054
+ {
2055
+ isPlaying: playback.isPlaying,
2056
+ progress: playback.progress,
2057
+ duration: playback.duration,
2058
+ volume: playback.volume,
2059
+ isMuted: playback.isMuted,
2060
+ playbackRate: playback.playbackRate,
2061
+ loop: playback.loop,
2062
+ isFullScreen: fullscreen.isFullscreen,
2063
+ filters: filters.filters,
2064
+ zoom: filters.zoom,
2065
+ subtitles: subtitles.subtitles,
2066
+ activeSubtitle: subtitles.activeSubtitle,
2067
+ audioTracks,
2068
+ activeAudioTrack,
2069
+ tracksLoading,
2070
+ onPlayPause: playback.togglePlay,
2071
+ onSeek: playback.seek,
2072
+ onVolumeChange: playback.setVolume,
2073
+ onMuteToggle: playback.toggleMute,
2074
+ onPlaybackRateChange: playback.setPlaybackRate,
2075
+ onLoopToggle: playback.toggleLoop,
2076
+ onFullScreenToggle: fullscreen.toggle,
2077
+ onFrameStep: playback.frameStep,
2078
+ onScreenshot: captureScreenshot,
2079
+ onNext: handleNext,
2080
+ onPrevious: handlePrevious,
2081
+ onFiltersChange: filters.setFilters,
2082
+ onZoomChange: filters.setZoom,
2083
+ onSubtitleChange: handleSubtitleChange,
2084
+ onAudioTrackChange: handleAudioTrackChange,
2085
+ onSubtitleUpload: handleSubtitleUpload,
2086
+ onSubtitleRemove: subtitles.removeSubtitle,
2087
+ onShowInfo: () => setShowInfo((v) => !v),
2088
+ onOpenShortcuts: () => setShowShortcutsDialog(true),
2089
+ chapters,
2090
+ currentChapter,
2091
+ onGoToChapter: goToChapter,
2092
+ onTogglePiP: pip.toggle,
2093
+ isPiP: pip.isPiP,
2094
+ pipSupported: !!pip.isSupported
2095
+ }
2096
+ ),
2097
+ showShortcutsDialog && /* @__PURE__ */ jsxRuntime.jsx(
2098
+ ShortcutSettingsDialog,
2099
+ {
2100
+ shortcuts,
2101
+ onSave: (updated) => setShortcuts(updated),
2102
+ onClose: () => setShowShortcutsDialog(false)
2103
+ }
2104
+ ),
2105
+ /* @__PURE__ */ jsxRuntime.jsx(
2106
+ "input",
2107
+ {
2108
+ type: "file",
2109
+ ref: subtitleInputRef,
2110
+ className: "hidden",
2111
+ multiple: true,
2112
+ accept: ".vtt,.srt,.ass,.ssa",
2113
+ onChange: (e) => {
2114
+ if (e.target.files) subtitles.addSubtitleFiles(Array.from(e.target.files));
2115
+ e.target.value = "";
2116
+ }
2117
+ }
2118
+ ),
2119
+ !playlist.currentItem && !isLoading && !loadingMessage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center text-muted-foreground", children: [
2120
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-semibold", children: "LightBird Player" }),
2121
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Add a local file or stream to begin." })
2122
+ ] }) })
2123
+ ]
2124
+ }
2125
+ ),
2126
+ /* @__PURE__ */ jsxRuntime.jsx(
2127
+ playlist_panel_default,
2128
+ {
2129
+ playlist: playlist.playlist,
2130
+ currentVideoIndex: playlist.currentIndex,
2131
+ onSelectVideo: handleSelectVideo,
2132
+ onFilesAdded: handleFileChange,
2133
+ onFolderFilesAdded: handleFolderFilesAdded,
2134
+ onAddStream: handleAddStream,
2135
+ onRemoveItem: handleRemoveItem,
2136
+ onReorder: handleReorder,
2137
+ onImportM3U: handleImportM3U,
2138
+ isOpen: playlistOpen,
2139
+ isPinned: playlistPinned,
2140
+ size: playlistSize,
2141
+ onToggle: handlePlaylistToggle,
2142
+ onTogglePin: () => setPlaylistPinned((v) => !v),
2143
+ onSizeChange: setPlaylistSize
2144
+ }
2145
+ )
2146
+ ] });
2147
+ };
2148
+ var lightbird_player_default = LightBirdPlayer;
2149
+ var PlayerErrorBoundary = class extends React10.Component {
2150
+ constructor() {
2151
+ super(...arguments);
2152
+ this.state = { hasError: false };
2153
+ }
2154
+ static getDerivedStateFromError() {
2155
+ return { hasError: true };
2156
+ }
2157
+ componentDidCatch(error, info) {
2158
+ console.error("[LightBird] Render error:", error, info);
2159
+ }
2160
+ render() {
2161
+ if (this.state.hasError) {
2162
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center h-screen bg-black text-white", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
2163
+ "Something went wrong with the player.",
2164
+ " ",
2165
+ /* @__PURE__ */ jsxRuntime.jsx(
2166
+ "button",
2167
+ {
2168
+ className: "underline hover:text-gray-300",
2169
+ onClick: () => this.setState({ hasError: false }),
2170
+ children: "Try again"
2171
+ }
2172
+ )
2173
+ ] }) });
2174
+ }
2175
+ return this.props.children;
2176
+ }
2177
+ };
2178
+ var ToastProvider = ToastPrimitives__namespace.Provider;
2179
+ var ToastViewport = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
2180
+ ToastPrimitives__namespace.Viewport,
2181
+ {
2182
+ ref,
2183
+ className: cn(
2184
+ "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
2185
+ className
2186
+ ),
2187
+ ...props
2188
+ }
2189
+ ));
2190
+ ToastViewport.displayName = ToastPrimitives__namespace.Viewport.displayName;
2191
+ var toastVariants = classVarianceAuthority.cva(
2192
+ "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
2193
+ {
2194
+ variants: {
2195
+ variant: {
2196
+ default: "border bg-background text-foreground",
2197
+ destructive: "destructive group border-destructive bg-destructive text-destructive-foreground"
2198
+ }
2199
+ },
2200
+ defaultVariants: {
2201
+ variant: "default"
2202
+ }
2203
+ }
2204
+ );
2205
+ var Toast = React10__namespace.forwardRef(({ className, variant, ...props }, ref) => {
2206
+ return /* @__PURE__ */ jsxRuntime.jsx(
2207
+ ToastPrimitives__namespace.Root,
2208
+ {
2209
+ ref,
2210
+ className: cn(toastVariants({ variant }), className),
2211
+ ...props
2212
+ }
2213
+ );
2214
+ });
2215
+ Toast.displayName = ToastPrimitives__namespace.Root.displayName;
2216
+ var ToastAction = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
2217
+ ToastPrimitives__namespace.Action,
2218
+ {
2219
+ ref,
2220
+ className: cn(
2221
+ "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
2222
+ className
2223
+ ),
2224
+ ...props
2225
+ }
2226
+ ));
2227
+ ToastAction.displayName = ToastPrimitives__namespace.Action.displayName;
2228
+ var ToastClose = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
2229
+ ToastPrimitives__namespace.Close,
2230
+ {
2231
+ ref,
2232
+ className: cn(
2233
+ "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
2234
+ className
2235
+ ),
2236
+ "toast-close": "",
2237
+ ...props,
2238
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
2239
+ }
2240
+ ));
2241
+ ToastClose.displayName = ToastPrimitives__namespace.Close.displayName;
2242
+ var ToastTitle = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
2243
+ ToastPrimitives__namespace.Title,
2244
+ {
2245
+ ref,
2246
+ className: cn("text-sm font-semibold", className),
2247
+ ...props
2248
+ }
2249
+ ));
2250
+ ToastTitle.displayName = ToastPrimitives__namespace.Title.displayName;
2251
+ var ToastDescription = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
2252
+ ToastPrimitives__namespace.Description,
2253
+ {
2254
+ ref,
2255
+ className: cn("text-sm opacity-90", className),
2256
+ ...props
2257
+ }
2258
+ ));
2259
+ ToastDescription.displayName = ToastPrimitives__namespace.Description.displayName;
2260
+ function Toaster() {
2261
+ const { toasts } = useToast();
2262
+ return /* @__PURE__ */ jsxRuntime.jsxs(ToastProvider, { children: [
2263
+ toasts.map(function({ id, title, description, action, ...props }) {
2264
+ return /* @__PURE__ */ jsxRuntime.jsxs(Toast, { ...props, children: [
2265
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-1", children: [
2266
+ title && /* @__PURE__ */ jsxRuntime.jsx(ToastTitle, { children: title }),
2267
+ description && /* @__PURE__ */ jsxRuntime.jsx(ToastDescription, { children: description })
2268
+ ] }),
2269
+ action,
2270
+ /* @__PURE__ */ jsxRuntime.jsx(ToastClose, {})
2271
+ ] }, id);
2272
+ }),
2273
+ /* @__PURE__ */ jsxRuntime.jsx(ToastViewport, {})
2274
+ ] });
2275
+ }
2276
+
2277
+ exports.LightBirdPlayer = lightbird_player_default;
2278
+ exports.PlayerControls = player_controls_default;
2279
+ exports.PlayerErrorBoundary = PlayerErrorBoundary;
2280
+ exports.PlayerErrorDisplay = PlayerErrorDisplay;
2281
+ exports.PlaylistPanel = playlist_panel_default;
2282
+ exports.ShortcutSettingsDialog = ShortcutSettingsDialog;
2283
+ exports.SubtitleOverlay = SubtitleOverlay;
2284
+ exports.Toaster = Toaster;
2285
+ exports.VideoInfoPanel = VideoInfoPanel;
2286
+ exports.VideoOverlay = VideoOverlay;