@aigamo/hydrangean-diva 0.0.1-alpha.70 → 0.0.1-alpha.71

package/dist/index.es.js

@@ -1,850 +1,179 @@
-import { Fragment as e, jsx as t, jsxs as n } from "@emotion/react/jsx-runtime";
-import { createContext as r, memo as i, useCallback as a, useContext as o, useEffect as s, useLayoutEffect as c, useMemo as l, useRef as u, useState as d } from "react";
-import ee from "ajv";
-import { action as f, computed as p, makeObservable as m, observable as h, reaction as te } from "mobx";
-import { useLocalStorageState as ne } from "@aigamo/route-sphere";
-import { pull as re } from "lodash-es";
-import { NostalgicDiva as ie, NostalgicDivaProvider as ae, findVideoService as oe, nullPlayerController as se, useNostalgicDiva as g } from "@aigamo/nostalgic-diva";
-import { EuiBottomBar as ce, EuiButton as _, EuiButtonEmpty as v, EuiButtonIcon as y, EuiCheckbox as b, EuiConfirmModal as le, EuiContextMenu as x, EuiEmptyPrompt as ue, EuiFieldText as S, EuiFlexGroup as C, EuiFlexItem as w, EuiForm as de, EuiFormRow as T, EuiHideFor as E, EuiIcon as D, EuiLink as fe, EuiModal as pe, EuiModalBody as me, EuiModalFooter as he, EuiModalHeader as ge, EuiModalHeaderTitle as _e, EuiPageTemplate as O, EuiPopover as k, EuiRange as ve, EuiShowFor as ye, EuiSpacer as be, EuiTable as xe, EuiTableHeader as Se, EuiTableHeaderCell as A, EuiTableHeaderCellCheckbox as Ce, EuiTableHeaderMobile as we, EuiTableRow as Te, EuiTableRowCell as j, EuiTableRowCellCheckbox as Ee, useEuiTheme as M, useGeneratedHtmlId as De } from "@elastic/eui";
-import { observer as N } from "mobx-react-lite";
-import { AddRegular as P, ArrowDownloadRegular as Oe, ArrowRepeat1Filled as ke, ArrowRepeatAllFilled as Ae, ArrowRepeatAllOffFilled as je, ArrowShuffleFilled as Me, ArrowShuffleOffFilled as Ne, ArrowUploadRegular as Pe, DeleteRegular as Fe, DismissRegular as F, MoreHorizontalFilled as I, NavigationPlayRegular as Ie, NextFilled as Le, OpenRegular as Re, PauseFilled as ze, PlayFilled as Be, PlayRegular as L, PreviousFilled as Ve, RenameRegular as He, SkipBack10Regular as Ue, SkipForward30Regular as We, Speaker2Regular as Ge, TopSpeedRegular as Ke } from "@fluentui/react-icons";
-import R from "ez-modal-react";
-import { ReactSortable as qe } from "react-sortablejs";
-import { useRouter as Je } from "@tanstack/react-router";
-//#region src/features/common/helpers/bottomBarHeight.ts
-var Ye = 81, z = new Map(Object.entries({
-	Audio: "",
-	Dailymotion: "https://www.dailymotion.com/favicon.ico",
-	Niconico: "https://www.nicovideo.jp/favicon.ico",
-	SoundCloud: "https://soundcloud.com/favicon.ico",
-	Spotify: "https://storage.googleapis.com/pr-newsroom-wp/1/2023/05/Spotify_Primary_Logo_RGB_Green.png",
-	Twitch: "https://www.twitch.tv/favicon.ico",
-	Vimeo: "https://vimeo.com/favicon.ico",
-	YouTube: "https://www.youtube.com/favicon.ico"
-})), Xe = ({ components: n = [], children: r }) => /* @__PURE__ */ t(e, { children: n.reduceRight((e, n) => /* @__PURE__ */ t(n, { children: e }), r) }), B = {
-	playQueue: "PlayQueueStore",
-	bottomBar: "BottomBarStore",
-	playlistList: "PlaylistListStore",
-	playlist: (e) => `PlaylistStore/${e}`
-}, Ze = r(void 0), V = () => o(Ze), Qe = new ee({ coerceTypes: !0 });
-function $e(e, t) {
-	let n;
-	if (n = Qe.getSchema(t), n === void 0 && (Qe.addSchema(e, t), n = Qe.getSchema(t)), n === void 0 || n.schema !== e) throw Error(`Invalid schema. Expected: '${JSON.stringify(e)}', but got '${JSON.stringify(n?.schema)}'.`);
-	return n;
-}
-//#endregion
-//#region src/features/media-player.play-queue.abstractions/interfaces/RepeatMode.ts
-var H = /* @__PURE__ */ function(e) {
-	return e.Off = "Off", e.All = "All", e.One = "One", e;
-}({});
-//#endregion
-//#region \0@oxc-project+runtime@0.130.0/helpers/decorate.js
-function U(e, t, n, r) {
-	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
-	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
-	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
-	return i > 3 && a && Object.defineProperty(t, n, a), a;
-}
-//#endregion
-//#region src/features/media-player.bottom-bar/stores/BottomBarStore.ts
-var et = {
-	type: "object",
-	properties: {
-		repeat: {
-			type: "string",
-			enum: Object.values(H),
-			nullable: !0
-		},
-		shuffle: {
-			type: "boolean",
-			nullable: !0
-		}
-	}
-}, tt = class {
-	bottomBar;
-	constructor(e) {
-		this.bottomBar = e, m(this);
-	}
-	get state() {
-		return {
-			repeat: this.bottomBar.repeat,
-			shuffle: this.bottomBar.shuffle
-		};
-	}
-	set state(e) {
-		this.bottomBar.repeat = e.repeat ?? H.Off, this.bottomBar.shuffle = e.shuffle ?? !1;
-	}
-	validateState(e) {
-		return $e(et, "BottomBarLocalStorageState")(e);
-	}
-};
-U([p.struct], tt.prototype, "state", null);
-var W = class {
-	player;
-	playQueue;
-	localStorageState;
-	repeat = H.Off;
-	shuffle = !1;
-	constructor(e, t) {
-		this.player = e, this.playQueue = t, m(this), this.localStorageState = new tt(this);
-	}
-	get controller() {
-		return this.player.controller;
-	}
-	get playing() {
-		return this.player.playing;
-	}
-	get percent() {
-		return this.player.percent;
-	}
-	get canSeek() {
-		return !this.playQueue.isEmpty && this.controller.supports("setCurrentTime");
-	}
-	get currentItem() {
-		return this.playQueue.currentItem;
-	}
-	get canToggleRepeat() {
-		return !0;
-	}
-	get canToggleShuffle() {
-		return !1;
-	}
-	get canPlay() {
-		return this.playQueue.canPlay && this.controller.supports("play");
-	}
-	get canPause() {
-		return this.playQueue.canPause && this.controller.supports("pause");
-	}
-	get canPrevious() {
-		return !this.playQueue.isEmpty;
-	}
-	get canNext() {
-		return this.playQueue.hasNextItem;
-	}
-	get canSkipBack10() {
-		return this.canSeek;
-	}
-	get canSkipForward30() {
-		return this.canSeek;
-	}
-	get canRemoveFromPlayQueue() {
-		return !this.playQueue.isEmpty;
-	}
-	setPercent(e) {
-		this.player.setPercent(e);
-	}
-	setSeeking(e) {
-		this.player.setSeeking(e);
-	}
-	toggleRepeat() {
-		switch (this.repeat) {
-			case H.Off:
-				this.repeat = H.All;
-				break;
-			case H.All:
-				this.repeat = H.One;
-				break;
-			case H.One:
-				this.repeat = H.Off;
-				break;
-		}
-	}
-	toggleShuffle() {
-		this.shuffle = !this.shuffle;
-	}
-	play() {
-		return this.controller.play();
-	}
-	pause() {
-		return this.controller.pause();
-	}
-	async previous() {
-		if (this.playQueue.hasPreviousItem) {
-			let e = await this.controller.getCurrentTime();
-			e === void 0 || e < 5 ? await this.playQueue.previous() : await this.controller.setCurrentTime(0);
-		} else await this.controller.setCurrentTime(0);
-	}
-	next() {
-		return this.playQueue.next();
-	}
-	async skipBack10() {
-		let e = await this.controller.getCurrentTime();
-		e !== void 0 && await this.controller.setCurrentTime(e - 10);
-	}
-	async skipForward30() {
-		let e = await this.controller.getCurrentTime();
-		e !== void 0 && await this.controller.setCurrentTime(e + 30);
-	}
-	async removeFromPlayQueue() {
-		this.currentItem !== void 0 && await this.playQueue.removeItems([this.currentItem]);
-	}
-};
-U([h], W.prototype, "repeat", void 0), U([h], W.prototype, "shuffle", void 0), U([p], W.prototype, "controller", null), U([p], W.prototype, "playing", null), U([p], W.prototype, "percent", null), U([p], W.prototype, "canSeek", null), U([p], W.prototype, "currentItem", null), U([p], W.prototype, "canToggleRepeat", null), U([p], W.prototype, "canToggleShuffle", null), U([p], W.prototype, "canPlay", null), U([p], W.prototype, "canPause", null), U([p], W.prototype, "canPrevious", null), U([p], W.prototype, "canNext", null), U([p], W.prototype, "canSkipBack10", null), U([p], W.prototype, "canSkipForward30", null), U([p], W.prototype, "canRemoveFromPlayQueue", null), U([f.bound], W.prototype, "setPercent", null), U([f.bound], W.prototype, "setSeeking", null), U([f.bound], W.prototype, "toggleRepeat", null), U([f.bound], W.prototype, "toggleShuffle", null), U([f.bound], W.prototype, "play", null), U([f.bound], W.prototype, "pause", null), U([f.bound], W.prototype, "previous", null), U([f.bound], W.prototype, "next", null), U([f.bound], W.prototype, "skipBack10", null), U([f.bound], W.prototype, "skipForward30", null), U([f.bound], W.prototype, "removeFromPlayQueue", null);
-//#endregion
-//#region src/features/media-player.play-queue.abstractions/contexts/PlayQueueContext.ts
-var nt = r(void 0), G = () => o(nt), rt = r(void 0), it = () => o(rt), at = ({ children: e }) => {
-	let n = it(), r = G(), [i] = d(() => new W(n, r));
-	return ne(B.bottomBar, i.localStorageState), /* @__PURE__ */ t(Ze.Provider, {
-		value: i,
-		children: e
-	});
-}, ot = r(void 0), st = () => o(ot), K = class {
-	player;
-	playQueue;
-	bottomBar;
-	constructor(e, t, n) {
-		this.player = e, this.playQueue = t, this.bottomBar = n, m(this);
-	}
-	get interacted() {
-		return this.playQueue.interacted;
-	}
-	get controller() {
-		return this.player.controller;
-	}
-	get currentItem() {
-		return this.playQueue.currentItem;
-	}
-	async onLoaded() {
-		this.interacted && await this.controller.play();
-	}
-	onPlay() {
-		this.player.onPlay();
-	}
-	onPause() {
-		this.player.onPause();
-	}
-	async onEnded() {
-		switch (this.bottomBar.repeat) {
-			case H.One:
-				await this.controller.setCurrentTime(0);
-				break;
-			case H.Off:
-			case H.All:
-				if (this.playQueue.isLastItem) switch (this.bottomBar.repeat) {
-					case H.Off:
-						this.player.onEnded();
-						break;
-					case H.All:
-						this.playQueue.hasMultipleItems ? await this.playQueue.goToFirst() : await this.controller.setCurrentTime(0);
-						break;
-				}
-				else await this.playQueue.next();
-				break;
-		}
-	}
-	onTimeUpdate(e) {
-		this.player.onTimeUpdate(e);
-	}
-	onControllerChange(e) {
-		this.player.onControllerChange(e);
-	}
-};
-U([p], K.prototype, "interacted", null), U([p], K.prototype, "controller", null), U([p], K.prototype, "currentItem", null), U([f.bound], K.prototype, "onLoaded", null), U([f.bound], K.prototype, "onPlay", null), U([f.bound], K.prototype, "onPause", null), U([f.bound], K.prototype, "onEnded", null), U([f.bound], K.prototype, "onTimeUpdate", null), U([f.bound], K.prototype, "onControllerChange", null);
-//#endregion
-//#region src/features/media-player.mini-player/components/MiniPlayerProvider.tsx
-var ct = ({ children: e }) => {
-	let n = it(), r = G(), i = V(), [a] = d(() => new K(n, r, i));
-	return /* @__PURE__ */ t(ot.Provider, {
-		value: a,
-		children: e
-	});
-}, lt = {
-	type: "object",
-	properties: {
-		url: { type: "string" },
-		type: { type: "string" },
-		videoId: { type: "string" },
-		title: { type: "string" }
-	},
-	required: [
-		"url",
-		"type",
-		"videoId",
-		"title"
-	]
-}, ut = {
-	type: "object",
-	properties: {
-		version: {
-			type: "string",
-			nullable: !0
-		},
-		repeat: {
-			type: "string",
-			enum: Object.values(H),
-			nullable: !0
-		},
-		shuffle: {
-			type: "boolean",
-			nullable: !0
-		},
-		items: {
-			type: "array",
-			nullable: !0,
-			items: lt
-		},
-		currentIndex: {
-			type: "integer",
-			nullable: !0
-		}
-	}
-}, q = class e {
-	playQueue;
-	dto;
-	static nextId = 1;
-	id;
-	isSelected = !1;
-	constructor(t, n) {
-		this.playQueue = t, this.dto = n, m(this), this.id = e.nextId++;
-	}
-	static fromDto(t, n) {
-		return new e(t, n);
-	}
-	get url() {
-		return this.dto.url;
-	}
-	get type() {
-		return this.dto.type;
-	}
-	get videoId() {
-		return this.dto.videoId;
-	}
-	get title() {
-		return this.dto.title;
-	}
-	get isCurrent() {
-		return this.playQueue.currentItem === this;
-	}
-	get index() {
-		return this.playQueue.items.indexOf(this);
-	}
-	get isFirst() {
-		return this.index === 0;
-	}
-	get isLast() {
-		return this.index === this.playQueue.items.length - 1;
-	}
-	get canMoveToTop() {
-		return !this.isFirst;
-	}
-	get canMoveToBottom() {
-		return !this.isLast;
-	}
-	get canRemoveToTop() {
-		return !this.isFirst;
-	}
-	get canRemoveOthers() {
-		return this.playQueue.hasMultipleItems;
-	}
-	clone() {
-		return this.playQueue.createItemFromDto(this.dto);
-	}
-	unselect() {
-		this.isSelected = !1;
-	}
-	select() {
-		this.isSelected = !0;
-	}
-	toggleSelected() {
-		this.isSelected = !this.isSelected;
-	}
-	play() {
-		return this.playQueue.setCurrentItem(this), Promise.resolve();
-	}
-	remove() {
-		return this.playQueue.removeItems([this]);
-	}
-	playFirst() {
-		return this.playQueue.playFirst([this.clone()]);
-	}
-	playNext() {
-		return this.playQueue.playNext([this.clone()]);
-	}
-	addToPlayQueue() {
-		return this.playQueue.addItems([this.clone()]);
-	}
-	moveToTop() {
-		this.playQueue.moveItem(this, 0);
-	}
-	moveToBottom() {
-		this.playQueue.moveItem(this, this.playQueue.items.length - 1);
-	}
-	removeToTop() {
-		return this.playQueue.removeItemsAbove(this);
-	}
-	removeOthers() {
-		return this.playQueue.removeOtherItems(this);
-	}
-};
-U([h], q.prototype, "isSelected", void 0), U([p], q.prototype, "isCurrent", null), U([p], q.prototype, "index", null), U([p], q.prototype, "isFirst", null), U([p], q.prototype, "isLast", null), U([p], q.prototype, "canMoveToTop", null), U([p], q.prototype, "canMoveToBottom", null), U([p], q.prototype, "canRemoveToTop", null), U([p], q.prototype, "canRemoveOthers", null), U([f.bound], q.prototype, "unselect", null), U([f.bound], q.prototype, "select", null), U([f.bound], q.prototype, "toggleSelected", null), U([f.bound], q.prototype, "play", null), U([f.bound], q.prototype, "remove", null), U([f.bound], q.prototype, "playFirst", null), U([f.bound], q.prototype, "playNext", null), U([f.bound], q.prototype, "addToPlayQueue", null), U([f.bound], q.prototype, "moveToTop", null), U([f.bound], q.prototype, "moveToBottom", null), U([f.bound], q.prototype, "removeToTop", null), U([f.bound], q.prototype, "removeOthers", null);
-//#endregion
-//#region src/features/media-player.play-queue/stores/PlayQueueStore.ts
-var dt = class {
-	playQueue;
-	constructor(e) {
-		this.playQueue = e, m(this);
-	}
-	get state() {
-		return {
-			version: "1.0",
-			items: this.playQueue.items.map((e) => e.dto),
-			currentIndex: this.playQueue.currentIndex
-		};
-	}
-	set state(e) {
-		this.playQueue.items = e.items?.map((e) => this.playQueue.createItemFromDto(e)) ?? [], this.playQueue.currentIndex = e.currentIndex;
-	}
-	validateState(e) {
-		return $e(ut, "PlayQueueDto")(e);
-	}
-};
-U([p.struct], dt.prototype, "state", null);
-var J = class {
-	interacted = !1;
-	localStorageState;
-	items = [];
-	currentId;
-	constructor() {
-		m(this), this.localStorageState = new dt(this);
-	}
-	createItemFromDto(e) {
-		return q.fromDto(this, {
-			url: e.url,
-			type: e.type,
-			videoId: e.videoId,
-			title: e.title
-		});
-	}
-	get isEmpty() {
-		return this.items.length === 0;
-	}
-	get canClear() {
-		return !this.isEmpty;
-	}
-	get currentItem() {
-		return this.items.find((e) => e.id === this.currentId);
-	}
-	get canPlay() {
-		return this.currentItem !== void 0;
-	}
-	get canPause() {
-		return this.currentItem !== void 0;
-	}
-	get hasMultipleItems() {
-		return this.items.length > 1;
-	}
-	get currentIndex() {
-		return this.currentId === void 0 ? void 0 : this.items.findIndex((e) => e.id === this.currentId);
-	}
-	set currentIndex(e) {
-		this.currentId = e === void 0 ? void 0 : this.items.at(e)?.id;
-	}
-	get hasPreviousItem() {
-		return this.hasMultipleItems && this.currentIndex !== void 0 && this.currentIndex > 0;
-	}
-	get hasNextItem() {
-		return this.hasMultipleItems && this.currentIndex !== void 0 && this.currentIndex < this.items.length - 1;
-	}
-	get isLastItem() {
-		return this.currentIndex !== void 0 && this.currentIndex === this.items.length - 1;
-	}
-	get selectedItems() {
-		return this.items.filter((e) => e.isSelected);
-	}
-	get allItemsSelected() {
-		return this.selectedItems.length === this.items.length;
-	}
-	get hasSelectedItems() {
-		return this.selectedItems.length > 0;
-	}
-	get selectedItemsOrAllItems() {
-		return this.hasSelectedItems ? this.selectedItems : this.items;
-	}
-	get canAddSelectedItems() {
-		return !this.isEmpty && this.hasSelectedItems;
-	}
-	get canPlaySelectedItemsNext() {
-		return !this.isEmpty && this.hasSelectedItems;
-	}
-	get canRemoveSelectedItems() {
-		return !this.isEmpty && this.hasSelectedItems;
-	}
-	setItems(e) {
-		this.items = e;
-	}
-	interact() {
-		this.interacted = !0;
-	}
-	clear() {
-		this.interact(), this.currentIndex = void 0, this.items = [];
-	}
-	unselectAll() {
-		for (let e of this.items) e.unselect();
-	}
-	selectAll() {
-		for (let e of this.items) e.select();
-	}
-	setCurrentItem(e) {
-		this.interact(), this.currentId = e?.id;
-	}
-	setNextItems(e) {
-		this.currentIndex !== void 0 && this.items.splice(this.currentIndex + 1, 0, ...e);
-	}
-	clearAndSetItems(e) {
-		this.clear(), this.setCurrentItem(e[0]), this.setNextItems(e);
-	}
-	async playNext(e) {
-		if (this.isEmpty) {
-			this.clearAndSetItems(e);
-			return;
-		}
-		this.setNextItems(e);
-	}
-	async playSelectedItemsNext() {
-		await this.playNext(this.selectedItemsOrAllItems.map((e) => e.clone())), this.unselectAll();
-	}
-	async addItems(e) {
-		if (this.isEmpty) {
-			this.clearAndSetItems(e);
-			return;
-		}
-		this.items.push(...e);
-	}
-	async addSelectedItems() {
-		await this.addItems(this.selectedItemsOrAllItems.map((e) => e.clone())), this.unselectAll();
-	}
-	async playFirst(e) {
-		if (this.isEmpty) {
-			this.clearAndSetItems(e);
-			return;
-		}
-		let { currentIndex: t } = this;
-		t !== void 0 && (this.interact(), this.items.splice(t, 0, ...e), this.currentIndex = t);
-	}
-	moveItem(e, t) {
-		let n = this.items.splice(this.items.indexOf(e), 1)[0];
-		this.items.splice(t, 0, n);
-	}
-	async goToFirst() {
-		this.currentIndex !== void 0 && (this.currentIndex = 0);
-	}
-	async removeItems(e) {
-		let { currentItem: t } = this;
-		re(this.items, ...e.filter((e) => e !== t));
-		let { currentIndex: n, isLastItem: r } = this;
-		re(this.items, e.find((e) => e === t)), this.currentItem !== t && (this.interact(), r ? await this.goToFirst() : this.currentIndex = n);
-	}
-	async removeSelectedItems() {
-		await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
-	}
-	async removeOtherItems(e) {
-		let t = e.id;
-		return this.removeItems(this.items.filter((e) => e.id !== t));
-	}
-	async removeItemsAbove(e) {
-		let t = this.items.indexOf(e);
-		return this.removeItems(this.items.filter((e, n) => n < t));
-	}
-	async previous() {
-		this.currentIndex !== void 0 && this.hasPreviousItem && (this.interact(), this.currentIndex--);
-	}
-	async next() {
-		this.currentIndex !== void 0 && this.hasNextItem && (this.interact(), this.currentIndex++);
-	}
-	addItemFromDto(e) {
-		let t = this.createItemFromDto(e);
-		return this.addItems([t]);
-	}
-};
-U([h], J.prototype, "interacted", void 0), U([h], J.prototype, "items", void 0), U([h], J.prototype, "currentId", void 0), U([p], J.prototype, "isEmpty", null), U([p], J.prototype, "canClear", null), U([p], J.prototype, "currentItem", null), U([p], J.prototype, "canPlay", null), U([p], J.prototype, "canPause", null), U([p], J.prototype, "hasMultipleItems", null), U([p], J.prototype, "currentIndex", null), U([p], J.prototype, "hasPreviousItem", null), U([p], J.prototype, "hasNextItem", null), U([p], J.prototype, "isLastItem", null), U([p], J.prototype, "selectedItems", null), U([p], J.prototype, "allItemsSelected", null), U([p], J.prototype, "hasSelectedItems", null), U([p], J.prototype, "selectedItemsOrAllItems", null), U([p], J.prototype, "canAddSelectedItems", null), U([p], J.prototype, "canPlaySelectedItemsNext", null), U([p], J.prototype, "canRemoveSelectedItems", null), U([f.bound], J.prototype, "setItems", null), U([f.bound], J.prototype, "interact", null), U([f.bound], J.prototype, "clear", null), U([f.bound], J.prototype, "unselectAll", null), U([f.bound], J.prototype, "selectAll", null), U([f.bound], J.prototype, "setCurrentItem", null), U([f.bound], J.prototype, "setNextItems", null), U([f.bound], J.prototype, "clearAndSetItems", null), U([f.bound], J.prototype, "playNext", null), U([f.bound], J.prototype, "playSelectedItemsNext", null), U([f.bound], J.prototype, "addItems", null), U([f.bound], J.prototype, "addSelectedItems", null), U([f.bound], J.prototype, "playFirst", null), U([f.bound], J.prototype, "moveItem", null), U([f.bound], J.prototype, "goToFirst", null), U([f.bound], J.prototype, "removeItems", null), U([f.bound], J.prototype, "removeSelectedItems", null), U([f.bound], J.prototype, "removeOtherItems", null), U([f.bound], J.prototype, "removeItemsAbove", null), U([f.bound], J.prototype, "previous", null), U([f.bound], J.prototype, "next", null), U([f.bound], J.prototype, "addItemFromDto", null);
-//#endregion
-//#region src/features/media-player.play-queue/components/PlayQueueProvider.tsx
-var ft = ({ children: e }) => {
-	let [n] = d(() => new J());
-	ne(B.playQueue, n.localStorageState);
-	let r = g();
-	return s(() => te(() => n.currentItem, async (e, t) => {
-		e === void 0 || t === void 0 || e.type === t.type && e.videoId === t.videoId && await r.setCurrentTime(0);
-	}), [n, r]), /* @__PURE__ */ t(nt.Provider, {
-		value: n,
-		children: e
-	});
-}, Y = class {
-	controller = se;
-	playing = !1;
-	percent = 0;
-	seeking = !1;
-	constructor() {
-		m(this);
-	}
-	setPlaying(e) {
-		this.playing = e;
-	}
-	setPercent(e) {
-		this.percent = e;
-	}
-	setSeeking(e) {
-		this.seeking = e;
-	}
-	onControllerChange(e) {
-		this.controller = e;
-	}
-	onPlay() {
-		this.playing = !0;
-	}
-	onPause() {
-		this.playing = !1;
-	}
-	onEnded() {
-		this.playing = !1;
-	}
-	onTimeUpdate({ percent: e }) {
-		e !== void 0 && (this.seeking || (this.percent = e));
-	}
-};
-U([h], Y.prototype, "controller", void 0), U([h], Y.prototype, "playing", void 0), U([h], Y.prototype, "percent", void 0), U([h], Y.prototype, "seeking", void 0), U([f.bound], Y.prototype, "setPlaying", null), U([f.bound], Y.prototype, "setPercent", null), U([f.bound], Y.prototype, "setSeeking", null), U([f.bound], Y.prototype, "onControllerChange", null), U([f.bound], Y.prototype, "onPlay", null), U([f.bound], Y.prototype, "onPause", null), U([f.bound], Y.prototype, "onEnded", null), U([f.bound], Y.prototype, "onTimeUpdate", null);
-//#endregion
-//#region src/features/media-player.player/components/PlayerProvider.tsx
-var pt = ({ children: e }) => {
-	let [n] = d(() => new Y());
-	return /* @__PURE__ */ t(rt.Provider, {
-		value: n,
-		children: e
-	});
-}, mt = r(void 0), ht = () => o(mt), X = class {
-	playlistList;
-	id;
-	name;
-	constructor(e, t, n) {
-		this.playlistList = e, m(this), this.id = t, this.name = n;
-	}
-	async rename(e) {
-		this.name = e;
-	}
-	remove() {
-		return this.playlistList.removeItem(this);
-	}
-};
-U([h], X.prototype, "id", void 0), U([h], X.prototype, "name", void 0), U([f.bound], X.prototype, "rename", null), U([f.bound], X.prototype, "remove", null);
-//#endregion
-//#region src/features/media-player.playlists/stores/PlaylistListStore.ts
-var gt = class {
-	playlistList;
-	constructor(e) {
-		this.playlistList = e, m(this);
-	}
-	get state() {
-		return { items: this.playlistList.items.map((e) => ({
-			id: e.id,
-			name: e.name
-		})) };
-	}
-	set state(e) {
-		this.playlistList.items = e.items?.map((e) => new X(this.playlistList, e.id, e.name)) ?? [];
-	}
-	validateState(e) {
-		return !0;
-	}
-};
-U([p.struct], gt.prototype, "state", null);
-var Z = class {
-	localStorageState;
-	items = [];
-	constructor() {
-		m(this), this.localStorageState = new gt(this);
-	}
-	createItem(e) {
-		return new X(this, crypto.randomUUID(), e);
-	}
-	setItems(e) {
-		this.items = e;
-	}
-	async addItem(e) {
-		this.items.push(e);
-	}
-	async removeItem(e) {
-		re(this.items, e);
-	}
-};
-U([h], Z.prototype, "items", void 0), U([f.bound], Z.prototype, "setItems", null), U([f.bound], Z.prototype, "addItem", null), U([f.bound], Z.prototype, "removeItem", null);
-//#endregion
-//#region src/features/media-player.playlists/components/PlaylistListProvider.tsx
-var _t = ({ children: e }) => {
-	let [n] = d(() => new Z());
-	return ne(B.playlistList, n.localStorageState), /* @__PURE__ */ t(mt.Provider, {
-		value: n,
-		children: e
-	});
-}, vt = ({ children: e, nostalgicDivaProps: n }) => /* @__PURE__ */ t(ae, {
-	...n,
-	children: /* @__PURE__ */ t(Xe, {
-		components: [
-			pt,
-			ft,
-			at,
-			ct,
-			_t
-		],
-		children: e
-	})
-}), yt = {
-	width: 400,
-	height: 225
-}, bt = N(({ children: e }) => /* @__PURE__ */ n(O, {
-	panelled: !0,
-	style: { minBlockSize: "max(460px, 100vh - 81px)" },
-	children: [e, !G().isEmpty && /* @__PURE__ */ t(be, { style: { blockSize: yt.height } })]
-})), xt = N(() => {
+import { createContext as e, memo as t, useCallback as n, useContext as r, useEffect as i, useLayoutEffect as a, useMemo as o, useRef as s, useState as c } from "react";
+import { EuiBottomBar as l, EuiButton as u, EuiButtonEmpty as d, EuiButtonIcon as f, EuiCheckbox as p, EuiConfirmModal as ee, EuiContextMenu as m, EuiEmptyPrompt as te, EuiFieldText as ne, EuiFlexGroup as h, EuiFlexItem as g, EuiForm as re, EuiFormRow as _, EuiHideFor as v, EuiIcon as y, EuiLink as ie, EuiModal as ae, EuiModalBody as oe, EuiModalFooter as se, EuiModalHeader as ce, EuiModalHeaderTitle as le, EuiPageTemplate as b, EuiPopover as x, EuiRange as ue, EuiShowFor as de, EuiSpacer as fe, EuiTable as pe, EuiTableHeader as me, EuiTableHeaderCell as S, EuiTableHeaderCellCheckbox as he, EuiTableHeaderMobile as ge, EuiTableRow as _e, EuiTableRowCell as C, EuiTableRowCellCheckbox as ve, useEuiTheme as w, useGeneratedHtmlId as ye } from "@elastic/eui";
+import { AddRegular as T, ArrowDownloadRegular as be, ArrowRepeat1Filled as xe, ArrowRepeatAllFilled as Se, ArrowRepeatAllOffFilled as Ce, ArrowShuffleFilled as we, ArrowShuffleOffFilled as Te, ArrowUploadRegular as Ee, DeleteRegular as De, DismissRegular as E, MoreHorizontalFilled as D, NavigationPlayRegular as Oe, NextFilled as ke, OpenRegular as Ae, PauseFilled as je, PlayFilled as Me, PlayRegular as O, PreviousFilled as Ne, RenameRegular as Pe, SkipBack10Regular as Fe, SkipForward30Regular as Ie, Speaker2Regular as Le, TopSpeedRegular as Re } from "@fluentui/react-icons";
+import { observer as k } from "mobx-react-lite";
+import { Fragment as A, jsx as j, jsxs as M } from "@emotion/react/jsx-runtime";
+import { NostalgicDiva as ze, NostalgicDivaProvider as Be, findVideoService as Ve, findVideoService as He, nullPlayerController as Ue, useNostalgicDiva as N } from "@aigamo/nostalgic-diva";
+import P from "ez-modal-react";
+import { ReactSortable as We } from "react-sortablejs";
+import { useRouter as Ge } from "@tanstack/react-router";
+import { action as F, computed as I, makeObservable as L, observable as R, reaction as Ke } from "mobx";
+import qe from "ajv";
+import { pull as z } from "lodash-es";
+import { useLocalStorageState as B } from "@aigamo/route-sphere";
+//#region src/features/media-player/contexts/BottomBarContext.ts
+var Je = e(void 0), V = () => r(Je), H = /* @__PURE__ */ function(e) {
+	return e.Off = "Off", e.All = "All", e.One = "One", e;
+}({}), Ye = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
 		"aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
-		iconType: e.shuffle ? Me : Ne,
+		iconType: e.shuffle ? we : Te,
 		size: "s",
 		iconSize: "l",
 		onClick: e.toggleShuffle,
 		disabled: !e.canToggleShuffle
 	});
-}), St = N(() => {
+}), Xe = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Previous",
 		"aria-label": "Previous",
-		iconType: Ve,
+		iconType: Ne,
 		size: "s",
 		iconSize: "l",
 		onClick: e.previous,
 		disabled: !e.canPrevious
 	});
-}), Ct = N(() => {
+}), Ze = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Skip back 10 seconds",
 		"aria-label": "Skip back 10 seconds",
-		iconType: Ue,
+		iconType: Fe,
 		size: "s",
 		iconSize: "l",
 		onClick: e.skipBack10,
 		disabled: !e.canSkipBack10
 	});
-}), wt = N(() => {
+}), Qe = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Pause",
 		"aria-label": "Pause",
-		iconType: ze,
+		iconType: je,
 		size: "s",
 		iconSize: "l",
 		onClick: e.pause,
 		disabled: !e.canPause
 	});
-}), Tt = N(() => {
+}), $e = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Play",
 		"aria-label": "Play",
-		iconType: Be,
+		iconType: Me,
 		size: "s",
 		iconSize: "l",
 		onClick: e.play,
 		disabled: !e.canPlay
 	});
-}), Et = N(() => {
+}), et = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Skip forward 30 seconds",
 		"aria-label": "Skip forward 30 seconds",
-		iconType: We,
+		iconType: Ie,
 		size: "s",
 		iconSize: "l",
 		onClick: e.skipForward30,
 		disabled: !e.canSkipForward30
 	});
-}), Dt = N(() => {
+}), tt = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: "Next",
 		"aria-label": "Next",
-		iconType: Le,
+		iconType: ke,
 		size: "s",
 		iconSize: "l",
 		onClick: e.next,
 		disabled: !e.canNext
 	});
-}), Ot = {
-	[H.Off]: je,
-	[H.All]: Ae,
-	[H.One]: ke
-}, kt = N(() => {
+}), nt = {
+	[H.Off]: Ce,
+	[H.All]: Se,
+	[H.One]: xe
+}, rt = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(y, {
+	return /* @__PURE__ */ j(f, {
 		title: `Repeat: ${e.repeat === H.All ? "All" : e.repeat === H.One ? "One" : "Off"}`,
 		"aria-label": `Repeat: ${e.repeat === H.All ? "All" : e.repeat === H.One ? "One" : "Off"}`,
-		iconType: Ot[e.repeat],
+		iconType: nt[e.repeat],
 		size: "s",
 		iconSize: "l",
 		onClick: e.toggleRepeat,
 		disabled: !e.canToggleRepeat
 	});
-}), At = N(() => {
+}), it = k(() => {
 	let e = V();
-	return /* @__PURE__ */ n(C, {
+	return /* @__PURE__ */ M(h, {
 		responsive: !1,
 		gutterSize: "s",
 		justifyContent: "center",
 		alignItems: "center",
 		children: [
-			/* @__PURE__ */ t(E, {
+			/* @__PURE__ */ j(v, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(xt, {})
+				children: /* @__PURE__ */ j(Ye, {})
 			}),
-			/* @__PURE__ */ t(St, {}),
-			/* @__PURE__ */ t(E, {
+			/* @__PURE__ */ j(Xe, {}),
+			/* @__PURE__ */ j(v, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Ct, {})
+				children: /* @__PURE__ */ j(Ze, {})
 			}),
-			e.playing ? /* @__PURE__ */ t(wt, {}) : /* @__PURE__ */ t(Tt, {}),
-			/* @__PURE__ */ t(E, {
+			e.playing ? /* @__PURE__ */ j(Qe, {}) : /* @__PURE__ */ j($e, {}),
+			/* @__PURE__ */ j(v, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Et, {})
+				children: /* @__PURE__ */ j(et, {})
 			}),
-			/* @__PURE__ */ t(Dt, {}),
-			/* @__PURE__ */ t(E, {
+			/* @__PURE__ */ j(tt, {}),
+			/* @__PURE__ */ j(v, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(kt, {})
+				children: /* @__PURE__ */ j(rt, {})
 			})
 		]
 	});
-}), jt = i(({ item: e, closePopover: n }) => {
-	let r = a(({ name: e, icon: t, onClick: r }) => ({
+}), at = new Map(Object.entries({
+	Audio: "",
+	Dailymotion: "https://www.dailymotion.com/favicon.ico",
+	Niconico: "https://www.nicovideo.jp/favicon.ico",
+	SoundCloud: "https://soundcloud.com/favicon.ico",
+	Spotify: "https://storage.googleapis.com/pr-newsroom-wp/1/2023/05/Spotify_Primary_Logo_RGB_Green.png",
+	Twitch: "https://www.twitch.tv/favicon.ico",
+	Vimeo: "https://vimeo.com/favicon.ico",
+	YouTube: "https://www.youtube.com/favicon.ico"
+})), ot = t(({ item: e, closePopover: t }) => {
+	let r = n(({ name: e, icon: n, onClick: r }) => ({
 		name: e,
-		icon: t,
+		icon: n,
 		onClick: async (e) => {
-			n(), r(e);
+			t(), r(e);
 		}
-	}), [n]);
-	return /* @__PURE__ */ t(x, {
+	}), [t]);
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Open in new tab",
-					icon: /* @__PURE__ */ t(D, { type: Re }),
+					icon: /* @__PURE__ */ j(y, { type: Ae }),
 					onClick: async () => {
 						window.open(e.dto.url, "_blank");
 					}
 				}),
 				r({
 					name: "Copy link address",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: async () => {
 						await navigator.clipboard.writeText(e.dto.url);
 					}
 				}),
 				r({
 					name: "Copy link text",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: async () => {
 						await navigator.clipboard.writeText(e.dto.title);
 					}
@@ -852,97 +181,97 @@ var _t = ({ children: e }) => {
 			]
 		}], [r, e])
 	});
-}), Mt = i(({ item: e }) => {
-	let [n, r] = d(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
-	return /* @__PURE__ */ t(k, {
-		button: /* @__PURE__ */ t(v, {
-			iconType: z.get(e.type),
+}), st = t(({ item: e }) => {
+	let [t, r] = c(!1), i = n(() => r(!t), [t]), a = n(() => r(!1), []);
+	return /* @__PURE__ */ j(x, {
+		button: /* @__PURE__ */ j(d, {
+			iconType: at.get(e.type),
 			size: "s",
 			onClick: i,
 			children: e.title
 		}),
-		isOpen: n,
-		closePopover: o,
+		isOpen: t,
+		closePopover: a,
 		panelPaddingSize: "none",
 		anchorPosition: "upLeft",
-		children: /* @__PURE__ */ t(jt, {
+		children: /* @__PURE__ */ j(ot, {
 			item: e,
-			closePopover: o
+			closePopover: a
 		})
 	});
-}), Nt = N(() => {
+}), ct = k(() => {
 	let e = V();
-	return /* @__PURE__ */ t(C, {
+	return /* @__PURE__ */ j(h, {
 		responsive: !1,
 		gutterSize: "s",
 		justifyContent: "flexStart",
 		alignItems: "center",
-		children: e.currentItem && /* @__PURE__ */ t(Mt, { item: e.currentItem })
+		children: e.currentItem && /* @__PURE__ */ j(st, { item: e.currentItem })
 	});
-}), Pt = N(() => /* @__PURE__ */ t(y, {
+}), lt = k(() => /* @__PURE__ */ j(f, {
 	title: "Mute",
 	"aria-label": "Mute",
-	iconType: Ge,
+	iconType: Le,
 	size: "s",
 	iconSize: "l",
 	disabled: !V().controller.supports("setMuted")
-})), Ft = N(({ button: e, isOpen: r, closePopover: i }) => {
-	let o = V(), [s, l] = d("0"), u = g();
-	c(() => {
-		r && u.getVolume().then((e) => {
-			e !== void 0 && l(Math.floor(e * 100).toString());
+})), ut = k(({ button: e, isOpen: t, closePopover: r }) => {
+	let i = V(), [o, s] = c("0"), l = N();
+	a(() => {
+		t && l.getVolume().then((e) => {
+			e !== void 0 && s(Math.floor(e * 100).toString());
 		});
-	}, [r, u]);
-	let ee = a(async (e) => {
-		l(e.currentTarget.value), await u.setVolume(Number(e.currentTarget.value) / 100);
-	}, [u]);
-	return /* @__PURE__ */ t(k, {
+	}, [t, l]);
+	let u = n(async (e) => {
+		s(e.currentTarget.value), await l.setVolume(Number(e.currentTarget.value) / 100);
+	}, [l]);
+	return /* @__PURE__ */ j(x, {
 		button: e,
-		isOpen: r,
-		closePopover: i,
+		isOpen: t,
+		closePopover: r,
 		anchorPosition: "upRight",
-		children: /* @__PURE__ */ t(T, { children: /* @__PURE__ */ n(C, {
+		children: /* @__PURE__ */ j(_, { children: /* @__PURE__ */ M(h, {
 			responsive: !1,
 			gutterSize: "s",
 			justifyContent: "center",
 			alignItems: "center",
-			children: [/* @__PURE__ */ t(Pt, {}), /* @__PURE__ */ t(ve, {
+			children: [/* @__PURE__ */ j(lt, {}), /* @__PURE__ */ j(ue, {
 				min: 0,
 				max: 100,
 				step: 1,
-				value: s,
-				onChange: ee,
+				value: o,
+				onChange: u,
 				css: { blockSize: 32 },
-				disabled: !o.controller.supports("setVolume")
+				disabled: !i.controller.supports("setVolume")
 			})]
 		}) })
 	});
-}), It = N(() => {
-	let e = V(), [n, r] = d(!1);
-	return /* @__PURE__ */ t(Ft, {
-		button: /* @__PURE__ */ t(y, {
+}), dt = k(() => {
+	let e = V(), [t, n] = c(!1);
+	return /* @__PURE__ */ j(ut, {
+		button: /* @__PURE__ */ j(f, {
 			title: "Volume",
 			"aria-label": "Volume",
-			iconType: Ge,
+			iconType: Le,
 			size: "s",
 			iconSize: "l",
-			onClick: () => r(!n),
+			onClick: () => n(!t),
 			disabled: !e.controller.supports("getVolume")
 		}),
-		isOpen: n,
-		closePopover: () => r(!1)
+		isOpen: t,
+		closePopover: () => n(!1)
 	});
-}), Lt = ({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(y, {
+}), ft = ({ onClickPlayQueueButton: e }) => /* @__PURE__ */ j(f, {
 	title: "Play queue",
 	"aria-label": "Play queue",
-	iconType: Ie,
+	iconType: Oe,
 	size: "s",
 	iconSize: "l",
 	onClick: e
-}), Rt = N(({ closePopover: e }) => {
-	let n = V(), r = g(), [i, o] = d(), s = a(async () => {
-		await n.controller.getPlaybackRate().then((e) => o(e));
-	}, [n]), c = a(({ name: t, icon: n, onClick: r, disabled: i, className: a }) => ({
+}), pt = k(({ closePopover: e }) => {
+	let t = V(), r = N(), [i, a] = c(), s = n(async () => {
+		await t.controller.getPlaybackRate().then((e) => a(e));
+	}, [t]), l = n(({ name: t, icon: n, onClick: r, disabled: i, className: a }) => ({
 		name: t,
 		icon: n,
 		onClick: async () => {
@@ -951,50 +280,50 @@ var _t = ({ children: e }) => {
 		disabled: i,
 		className: a
 	}), [e]);
-	return /* @__PURE__ */ t(x, {
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				{
 					name: "Speed",
-					icon: /* @__PURE__ */ t(D, { type: Ke }),
+					icon: /* @__PURE__ */ j(y, { type: Re }),
 					panel: 1,
 					onClick: s,
-					disabled: !n.controller.supports("getPlaybackRate")
+					disabled: !t.controller.supports("getPlaybackRate")
 				},
-				c({
+				l({
 					name: "Skip back 10 seconds",
-					icon: /* @__PURE__ */ t(D, { type: Ue }),
-					onClick: n.skipBack10,
-					disabled: !n.canSkipBack10
+					icon: /* @__PURE__ */ j(y, { type: Fe }),
+					onClick: t.skipBack10,
+					disabled: !t.canSkipBack10
 				}),
-				c({
+				l({
 					name: "Skip forward 30 seconds",
-					icon: /* @__PURE__ */ t(D, { type: We }),
-					onClick: n.skipForward30,
-					disabled: !n.canSkipForward30
+					icon: /* @__PURE__ */ j(y, { type: Ie }),
+					onClick: t.skipForward30,
+					disabled: !t.canSkipForward30
 				}),
-				c({
-					name: `Shuffle: ${n.shuffle ? "On" : "Off"}`,
-					icon: /* @__PURE__ */ t(D, { type: n.shuffle ? Me : Ne }),
-					onClick: n.toggleShuffle,
-					disabled: !n.canToggleShuffle,
+				l({
+					name: `Shuffle: ${t.shuffle ? "On" : "Off"}`,
+					icon: /* @__PURE__ */ j(y, { type: t.shuffle ? we : Te }),
+					onClick: t.toggleShuffle,
+					disabled: !t.canToggleShuffle,
 					className: "eui-showFor--xs--flex"
 				}),
-				c({
-					name: `Repeat: ${n.repeat === H.All ? "All" : n.repeat === H.One ? "One" : "Off"}`,
-					icon: /* @__PURE__ */ t(D, { type: Ot[n.repeat] }),
-					onClick: n.toggleRepeat,
-					disabled: !n.canToggleRepeat,
+				l({
+					name: `Repeat: ${t.repeat === H.All ? "All" : t.repeat === H.One ? "One" : "Off"}`,
+					icon: /* @__PURE__ */ j(y, { type: nt[t.repeat] }),
+					onClick: t.toggleRepeat,
+					disabled: !t.canToggleRepeat,
 					className: "eui-showFor--xs--flex"
 				}),
 				{ isSeparator: !0 },
-				c({
+				l({
 					name: "Remove from play queue",
-					icon: /* @__PURE__ */ t(D, { type: F }),
-					onClick: n.removeFromPlayQueue,
-					disabled: !n.canRemoveFromPlayQueue
+					icon: /* @__PURE__ */ j(y, { type: E }),
+					onClick: t.removeFromPlayQueue,
+					disabled: !t.canRemoveFromPlayQueue
 				})
 			]
 		}, {
@@ -1009,271 +338,278 @@ var _t = ({ children: e }) => {
 				1.5,
 				1.75,
 				2
-			].map((e) => c({
+			].map((e) => l({
 				name: e.toString(),
 				onClick: () => r.setPlaybackRate(e),
 				icon: e === i ? "check" : "empty",
-				disabled: !n.controller.supports("setPlaybackRate")
+				disabled: !t.controller.supports("setPlaybackRate")
 			}))
 		}], [
-			n,
-			c,
+			t,
+			l,
 			s,
 			r,
 			i
 		])
 	});
-}), zt = i(({ button: e, isOpen: n, closePopover: r }) => /* @__PURE__ */ t(k, {
+}), mt = t(({ button: e, isOpen: t, closePopover: n }) => /* @__PURE__ */ j(x, {
 	button: e,
-	isOpen: n,
-	closePopover: r,
+	isOpen: t,
+	closePopover: n,
 	panelPaddingSize: "none",
 	anchorPosition: "upRight",
-	children: /* @__PURE__ */ t(Rt, { closePopover: r })
-})), Bt = i(() => {
-	let [e, n] = d(!1);
-	return /* @__PURE__ */ t(zt, {
-		button: /* @__PURE__ */ t(y, {
+	children: /* @__PURE__ */ j(pt, { closePopover: n })
+})), ht = t(() => {
+	let [e, t] = c(!1);
+	return /* @__PURE__ */ j(mt, {
+		button: /* @__PURE__ */ j(f, {
 			title: "More options",
 			"aria-label": "More options",
-			iconType: I,
+			iconType: D,
 			size: "s",
 			iconSize: "l",
-			onClick: () => n(!e)
+			onClick: () => t(!e)
 		}),
 		isOpen: e,
-		closePopover: () => n(!1)
+		closePopover: () => t(!1)
 	});
-}), Vt = i(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ n(C, {
+}), gt = t(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ M(h, {
 	responsive: !1,
 	gutterSize: "s",
 	justifyContent: "flexEnd",
 	alignItems: "center",
 	children: [
-		/* @__PURE__ */ t(It, {}),
-		e && /* @__PURE__ */ t(Lt, { onClickPlayQueueButton: e }),
-		/* @__PURE__ */ t(Bt, {})
+		/* @__PURE__ */ j(dt, {}),
+		e && /* @__PURE__ */ j(ft, { onClickPlayQueueButton: e }),
+		/* @__PURE__ */ j(ht, {})
 	]
-})), Ht = N(() => {
-	let e = V(), n = g(), r = a((t) => {
+})), _t = k(() => {
+	let e = V(), t = N(), r = n((t) => {
 		let n = Number(t.currentTarget.value) / 100;
 		e.setPercent(n);
-	}, [e]), i = a((t) => {
+	}, [e]), i = n((t) => {
 		t.button === 0 && e.setSeeking(!0);
-	}, [e]), o = a(async (t) => {
-		if (t.button === 0) {
-			let r = Number(t.currentTarget.value) / 100;
+	}, [e]), a = n(async (n) => {
+		if (n.button === 0) {
+			let r = Number(n.currentTarget.value) / 100;
 			e.setSeeking(!1);
-			let i = await n.getDuration();
-			i !== void 0 && await n.setCurrentTime(i * r);
+			let i = await t.getDuration();
+			i !== void 0 && await t.setCurrentTime(i * r);
 		}
-	}, [e, n]);
-	return /* @__PURE__ */ t(ve, {
+	}, [e, t]);
+	return /* @__PURE__ */ j(ue, {
 		min: 0,
 		max: 100,
 		step: 1e-7,
 		value: e.percent * 100,
 		onChange: r,
 		onMouseDown: i,
-		onMouseUp: o,
+		onMouseUp: a,
 		fullWidth: !0,
 		showRange: !0,
 		css: { blockSize: 32 },
 		disabled: !e.canSeek
 	});
-}), Ut = N(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(ce, {
+}), vt = k(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ j(l, {
 	paddingSize: "s",
-	children: /* @__PURE__ */ n(C, {
+	children: /* @__PURE__ */ M(h, {
 		direction: "column",
 		gutterSize: "none",
-		children: [/* @__PURE__ */ t(w, { children: /* @__PURE__ */ t(Ht, {}) }), /* @__PURE__ */ t(w, { children: /* @__PURE__ */ n(C, {
+		children: [/* @__PURE__ */ j(g, { children: /* @__PURE__ */ j(_t, {}) }), /* @__PURE__ */ j(g, { children: /* @__PURE__ */ M(h, {
 			responsive: !1,
 			children: [
-				/* @__PURE__ */ t(w, {
+				/* @__PURE__ */ j(g, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(Nt, {})
+					children: /* @__PURE__ */ j(ct, {})
 				}),
-				/* @__PURE__ */ t(w, {
+				/* @__PURE__ */ j(g, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(At, {})
+					children: /* @__PURE__ */ j(it, {})
 				}),
-				/* @__PURE__ */ t(w, {
+				/* @__PURE__ */ j(g, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(Vt, { onClickPlayQueueButton: e })
+					children: /* @__PURE__ */ j(gt, { onClickPlayQueueButton: e })
 				})
 			]
 		}) })]
 	})
-})), Wt = N(() => {
-	let e = st(), n = l(() => ({
+})), yt = e(void 0), U = () => r(yt), bt = 81, xt = {
+	width: 400,
+	height: 225
+}, St = k(({ children: e }) => /* @__PURE__ */ M(b, {
+	panelled: !0,
+	style: { minBlockSize: "max(460px, 100vh - 81px)" },
+	children: [e, !U().isEmpty && /* @__PURE__ */ j(fe, { style: { blockSize: xt.height } })]
+})), Ct = e(void 0), wt = () => r(Ct), Tt = k(() => {
+	let e = wt(), t = o(() => ({
 		onLoaded: e.onLoaded,
 		onPlay: e.onPlay,
 		onPause: e.onPause,
 		onEnded: e.onEnded,
 		onTimeUpdate: e.onTimeUpdate
 	}), [e]);
-	return /* @__PURE__ */ t("div", {
+	return /* @__PURE__ */ j("div", {
 		css: {
 			position: "fixed",
 			right: 0,
 			bottom: 81,
-			width: yt.width,
-			height: yt.height,
+			width: xt.width,
+			height: xt.height,
 			zIndex: 998,
 			backgroundColor: "rgb(39, 39, 39)",
 			display: "flex",
 			flexDirection: "column"
 		},
-		children: /* @__PURE__ */ t("div", {
+		children: /* @__PURE__ */ j("div", {
 			css: {
 				flexGrow: 1,
 				backgroundColor: "black"
 			},
-			children: e.currentItem && /* @__PURE__ */ t(ie, {
+			children: e.currentItem && /* @__PURE__ */ j(ze, {
 				src: e.currentItem.url,
-				options: n,
+				options: t,
 				onControllerChange: e.onControllerChange
 			})
 		})
 	});
 });
 //#endregion
-//#region src/features/media-player.play-queue/helpers/isNoembedResult.ts
-function Gt(e) {
+//#region src/features/media-player/helpers/isNoembedResult.ts
+function Et(e) {
 	return typeof e == "object" && !!e && "title" in e && typeof e.title == "string";
 }
 //#endregion
-//#region src/features/media-player.play-queue/components/AddVideoModal.tsx
-var Kt = R.create(({ remove: e, resolve: r }) => {
-	let i = De({ prefix: "modalForm" }), [a, o] = d(""), [s, c] = d(""), [l, u] = d(!1);
-	return /* @__PURE__ */ n(pe, {
+//#region src/features/media-player/components/AddVideoModal.tsx
+var Dt = P.create(({ remove: e, resolve: t }) => {
+	let n = ye({ prefix: "modalForm" }), [r, i] = c(""), [a, o] = c(""), [s, l] = c(!1);
+	return /* @__PURE__ */ M(ae, {
 		onClose: e,
 		initialFocus: "[name=url]",
 		children: [
-			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Add video" }) }),
-			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ n(de, {
-				id: i,
+			/* @__PURE__ */ j(ce, { children: /* @__PURE__ */ j(le, { children: "Add video" }) }),
+			/* @__PURE__ */ j(oe, { children: /* @__PURE__ */ M(re, {
+				id: n,
 				component: "form",
-				onSubmit: async (t) => {
-					t.preventDefault();
+				onSubmit: async (n) => {
+					n.preventDefault();
 					try {
-						u(!0);
-						let t = oe(a);
-						if (t === void 0) return;
-						let n = t.extractVideoId(a);
+						l(!0);
+						let n = He(r);
 						if (n === void 0) return;
-						let i = await (await fetch(`https://noembed.com/embed?url=${encodeURIComponent(a)}`)).json();
-						r({
-							url: a,
-							type: t.type,
-							videoId: n,
-							title: s || (Gt(i) ? i.title : n)
+						let i = n.extractVideoId(r);
+						if (i === void 0) return;
+						let o = await (await fetch(`https://noembed.com/embed?url=${encodeURIComponent(r)}`)).json();
+						t({
+							url: r,
+							type: n.type,
+							videoId: i,
+							title: a || (Et(o) ? o.title : i)
 						}), e();
 					} finally {
-						u(!1);
+						l(!1);
 					}
 				},
-				children: [/* @__PURE__ */ t(T, {
+				children: [/* @__PURE__ */ j(_, {
 					label: "URL",
-					children: /* @__PURE__ */ t(S, {
+					children: /* @__PURE__ */ j(ne, {
 						name: "url",
-						value: a,
-						onChange: (e) => o(e.target.value)
+						value: r,
+						onChange: (e) => i(e.target.value)
 					})
-				}), /* @__PURE__ */ t(T, {
+				}), /* @__PURE__ */ j(_, {
 					label: "Title",
-					children: /* @__PURE__ */ t(S, {
+					children: /* @__PURE__ */ j(ne, {
 						name: "title",
-						value: s,
-						onChange: (e) => c(e.target.value)
+						value: a,
+						onChange: (e) => o(e.target.value)
 					})
 				})]
 			}) }),
-			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
+			/* @__PURE__ */ M(se, { children: [/* @__PURE__ */ j(d, {
 				onClick: e,
 				children: "Cancel"
-			}), /* @__PURE__ */ t(_, {
+			}), /* @__PURE__ */ j(u, {
 				type: "submit",
-				form: i,
+				form: n,
 				fill: !0,
-				disabled: a.trim().length === 0,
-				isLoading: l,
+				disabled: r.trim().length === 0,
+				isLoading: s,
 				children: "Add video"
 			})] })
 		]
 	});
-}), qt = i(({ onFulfilled: e }) => /* @__PURE__ */ t(_, {
-	onClick: () => R.show(Kt).then(e),
-	iconType: P,
+}), Ot = t(({ onFulfilled: e }) => /* @__PURE__ */ j(u, {
+	onClick: () => P.show(Dt).then(e),
+	iconType: T,
 	color: "primary",
 	children: "Add video"
-})), Jt = N(({ playQueue: e }) => /* @__PURE__ */ t(_, {
-	iconType: P,
+})), kt = k(({ playQueue: e }) => /* @__PURE__ */ j(u, {
+	iconType: T,
 	onClick: e.addSelectedItems,
 	disabled: !e.canAddSelectedItems,
 	children: "Add to play queue"
-})), Yt = N(({ playQueue: e, closePopover: n }) => {
-	let r = a(({ name: e, icon: t, disabled: r, onClick: i }) => ({
+})), At = k(({ playQueue: e, closePopover: t }) => {
+	let r = n(({ name: e, icon: n, disabled: r, onClick: i }) => ({
 		name: e,
-		icon: t,
+		icon: n,
 		disabled: r,
 		onClick: async (e) => {
-			n(), i(e);
+			t(), i(e);
 		}
-	}), [n]);
-	return /* @__PURE__ */ t(x, {
+	}), [t]);
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Play next",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					disabled: !e.canPlaySelectedItemsNext,
 					onClick: e.playSelectedItemsNext
 				}),
 				r({
 					name: "Add to play queue",
-					icon: /* @__PURE__ */ t(D, { type: P }),
+					icon: /* @__PURE__ */ j(y, { type: T }),
 					onClick: e.addSelectedItems,
 					disabled: !e.canAddSelectedItems
 				}),
 				r({
 					name: "Remove",
-					icon: /* @__PURE__ */ t(D, { type: F }),
+					icon: /* @__PURE__ */ j(y, { type: E }),
 					onClick: e.removeSelectedItems,
 					disabled: !e.canRemoveSelectedItems
 				}),
 				r({
 					name: "Clear",
-					icon: /* @__PURE__ */ t(D, { type: Fe }),
+					icon: /* @__PURE__ */ j(y, { type: De }),
 					onClick: e.clear,
 					disabled: !e.canClear
 				})
 			]
 		}], [r, e])
 	});
-}), Xt = i(({ playQueue: e }) => {
-	let [n, r] = d(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
-	return /* @__PURE__ */ t(k, {
-		button: /* @__PURE__ */ t(y, {
+}), jt = t(({ playQueue: e }) => {
+	let [t, r] = c(!1), i = n(() => r(!t), [t]), a = n(() => r(!1), []);
+	return /* @__PURE__ */ j(x, {
+		button: /* @__PURE__ */ j(f, {
 			display: "base",
 			size: "m",
-			iconType: I,
+			iconType: D,
 			onClick: i
 		}),
-		isOpen: n,
-		closePopover: o,
+		isOpen: t,
+		closePopover: a,
 		panelPaddingSize: "none",
 		anchorPosition: "downLeft",
-		children: /* @__PURE__ */ t(Yt, {
+		children: /* @__PURE__ */ j(At, {
 			playQueue: e,
-			closePopover: o
+			closePopover: a
 		})
 	});
-}), Zt = N(({ playQueue: e }) => {
-	let { euiTheme: r } = M();
-	return /* @__PURE__ */ n(C, {
+}), Mt = k(({ playQueue: e }) => {
+	let { euiTheme: t } = w();
+	return /* @__PURE__ */ M(h, {
 		alignItems: "center",
 		gutterSize: "m",
 		responsive: !1,
@@ -1281,37 +617,37 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 			position: "sticky",
 			top: 48,
 			zIndex: 998,
-			background: r.colors.backgroundBasePlain
+			background: t.colors.backgroundBasePlain
 		},
 		children: [
-			/* @__PURE__ */ n(E, {
+			/* @__PURE__ */ M(v, {
 				sizes: ["xs"],
 				children: [
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(_, {
+						children: /* @__PURE__ */ j(u, {
 							disabled: !e.canPlaySelectedItemsNext,
 							onClick: e.playSelectedItemsNext,
 							children: "Play next"
 						})
 					}),
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(Jt, { playQueue: e })
+						children: /* @__PURE__ */ j(kt, { playQueue: e })
 					}),
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(_, {
-							iconType: F,
+						children: /* @__PURE__ */ j(u, {
+							iconType: E,
 							onClick: e.removeSelectedItems,
 							disabled: !e.canRemoveSelectedItems,
 							children: "Remove"
 						})
 					}),
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(_, {
-							iconType: Fe,
+						children: /* @__PURE__ */ j(u, {
+							iconType: De,
 							onClick: e.clear,
 							disabled: !e.canClear,
 							children: "Clear"
@@ -1319,342 +655,342 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 					})
 				]
 			}),
-			/* @__PURE__ */ t(ye, {
+			/* @__PURE__ */ j(de, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Xt, { playQueue: e })
+				children: /* @__PURE__ */ j(jt, { playQueue: e })
 			}),
-			/* @__PURE__ */ t(w, { grow: !0 }),
-			/* @__PURE__ */ t(w, {
+			/* @__PURE__ */ j(g, { grow: !0 }),
+			/* @__PURE__ */ j(g, {
 				grow: !1,
-				children: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
+				children: /* @__PURE__ */ j(Ot, { onFulfilled: e.addItemFromDto })
 			})
 		]
 	});
-}), Qt = N(({ playQueue: r }) => {
-	let { euiTheme: i } = M();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(we, { children: /* @__PURE__ */ t(C, {
+}), Nt = k(({ playQueue: e }) => {
+	let { euiTheme: t } = w();
+	return /* @__PURE__ */ M(A, { children: [/* @__PURE__ */ j(ge, { children: /* @__PURE__ */ j(h, {
 		responsive: !1,
 		justifyContent: "spaceBetween",
 		alignItems: "baseline",
-		children: /* @__PURE__ */ t(w, {
+		children: /* @__PURE__ */ j(g, {
 			grow: !1,
-			children: /* @__PURE__ */ t(b, {
+			children: /* @__PURE__ */ j(p, {
 				id: "",
-				checked: r.allItemsSelected,
-				onChange: (e) => {
-					e.target.checked ? r.selectAll() : r.unselectAll();
+				checked: e.allItemsSelected,
+				onChange: (t) => {
+					t.target.checked ? e.selectAll() : e.unselectAll();
 				}
 			})
 		})
-	}) }), /* @__PURE__ */ n(Se, {
+	}) }), /* @__PURE__ */ M(me, {
 		style: {
 			position: "sticky",
 			top: 112,
 			zIndex: 998,
-			background: i.colors.backgroundBasePlain
+			background: t.colors.backgroundBasePlain
 		},
 		children: [
-			/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(b, {
+			/* @__PURE__ */ j(he, { children: /* @__PURE__ */ j(p, {
 				id: "",
-				checked: r.allItemsSelected,
-				onChange: (e) => {
-					e.target.checked ? r.selectAll() : r.unselectAll();
+				checked: e.allItemsSelected,
+				onChange: (t) => {
+					t.target.checked ? e.selectAll() : e.unselectAll();
 				}
 			}) }),
-			/* @__PURE__ */ t(A, { width: 24 }),
-			/* @__PURE__ */ t(A, { children: "Title" }),
-			/* @__PURE__ */ t(A, {})
+			/* @__PURE__ */ j(S, { width: 24 }),
+			/* @__PURE__ */ j(S, { children: "Title" }),
+			/* @__PURE__ */ j(S, {})
 		]
 	})] });
-}), $t = N(({ item: e, closePopover: n }) => {
-	let r = a(({ name: e, icon: t, disabled: r, onClick: i, className: a }) => ({
+}), Pt = k(({ item: e, closePopover: t }) => {
+	let r = n(({ name: e, icon: n, disabled: r, onClick: i, className: a }) => ({
 		name: e,
-		icon: t,
+		icon: n,
 		disabled: r,
 		onClick: async (e) => {
-			n(), i(e);
+			t(), i(e);
 		},
 		className: a
-	}), [n]);
-	return /* @__PURE__ */ t(x, {
+	}), [t]);
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Play",
-					icon: /* @__PURE__ */ t(D, { type: L }),
+					icon: /* @__PURE__ */ j(y, { type: O }),
 					onClick: e.play,
 					className: "eui-showFor--xs--flex"
 				}),
 				r({
 					name: "Play first",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.playFirst
 				}),
 				r({
 					name: "Play next",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.playNext
 				}),
 				r({
 					name: "Add to play queue",
-					icon: /* @__PURE__ */ t(D, { type: P }),
+					icon: /* @__PURE__ */ j(y, { type: T }),
 					onClick: e.addToPlayQueue
 				}),
 				{ isSeparator: !0 },
 				r({
 					name: "Move to the top",
-					icon: /* @__PURE__ */ t(D, { type: Pe }),
+					icon: /* @__PURE__ */ j(y, { type: Ee }),
 					onClick: e.moveToTop,
 					disabled: !e.canMoveToTop
 				}),
 				r({
 					name: "Move to the bottom",
-					icon: /* @__PURE__ */ t(D, { type: Oe }),
+					icon: /* @__PURE__ */ j(y, { type: be }),
 					onClick: e.moveToBottom,
 					disabled: !e.canMoveToBottom
 				}),
 				{ isSeparator: !0 },
 				r({
 					name: "Remove",
-					icon: /* @__PURE__ */ t(D, { type: F }),
+					icon: /* @__PURE__ */ j(y, { type: E }),
 					onClick: e.remove,
 					className: "eui-showFor--xs--flex"
 				}),
 				r({
 					name: "Remove to the top",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.removeToTop,
 					disabled: !e.canRemoveToTop
 				}),
 				r({
 					name: "Remove others",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.removeOthers,
 					disabled: !e.canRemoveOthers
 				})
 			]
 		}], [r, e])
 	});
-}), en = i(({ item: e }) => {
-	let [n, r] = d(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
-	return /* @__PURE__ */ t(k, {
-		button: /* @__PURE__ */ t(y, {
+}), Ft = t(({ item: e }) => {
+	let [t, r] = c(!1), i = n(() => r(!t), [t]), a = n(() => r(!1), []);
+	return /* @__PURE__ */ j(x, {
+		button: /* @__PURE__ */ j(f, {
 			title: "More options",
 			"aria-label": "More options",
-			iconType: I,
+			iconType: D,
 			size: "s",
 			color: "text",
 			onClick: i
 		}),
-		isOpen: n,
-		closePopover: o,
+		isOpen: t,
+		closePopover: a,
 		panelPaddingSize: "none",
 		anchorPosition: "leftCenter",
-		children: /* @__PURE__ */ t($t, {
+		children: /* @__PURE__ */ j(Pt, {
 			item: e,
-			closePopover: o
+			closePopover: a
 		})
 	});
-}), tn = N(({ item: e }) => {
-	let r = g();
-	return /* @__PURE__ */ n(j, {
+}), It = k(({ item: e }) => {
+	let t = N();
+	return /* @__PURE__ */ M(C, {
 		textOnly: !1,
 		hasActions: !0,
 		align: "right",
-		children: [/* @__PURE__ */ n(E, {
+		children: [/* @__PURE__ */ M(v, {
 			sizes: ["xs"],
-			children: [/* @__PURE__ */ t(_, {
-				iconType: L,
+			children: [/* @__PURE__ */ j(u, {
+				iconType: O,
 				size: "s",
 				onClick: async () => {
-					e.isCurrent ? await r.setCurrentTime(0) : await e.play();
+					e.isCurrent ? await t.setCurrentTime(0) : await e.play();
 				},
 				children: "Play"
-			}), /* @__PURE__ */ t(_, {
-				iconType: F,
+			}), /* @__PURE__ */ j(u, {
+				iconType: E,
 				size: "s",
 				onClick: e.remove,
 				children: "Remove"
 			})]
-		}), /* @__PURE__ */ t(en, { item: e })]
+		}), /* @__PURE__ */ j(Ft, { item: e })]
 	});
-}), nn = N(({ item: e }) => {
-	let r = u(null), { isCurrent: i } = e;
-	return s(() => {
-		i && r.current?.closest("tr")?.scrollIntoView({
+}), Lt = k(({ item: e }) => {
+	let t = s(null), { isCurrent: n } = e;
+	return i(() => {
+		n && t.current?.closest("tr")?.scrollIntoView({
 			behavior: "smooth",
 			block: "center"
 		});
-	}, [i]), /* @__PURE__ */ n(Te, {
+	}, [n]), /* @__PURE__ */ M(_e, {
 		isSelected: e.isCurrent,
 		hasSelection: !0,
 		hasActions: !0,
 		children: [
-			/* @__PURE__ */ t(Ee, { children: /* @__PURE__ */ t(b, {
+			/* @__PURE__ */ j(ve, { children: /* @__PURE__ */ j(p, {
 				id: e.id.toString(),
 				checked: e.isSelected,
 				onChange: e.toggleSelected
 			}) }),
-			/* @__PURE__ */ t(j, {
+			/* @__PURE__ */ j(C, {
 				textOnly: !1,
-				children: /* @__PURE__ */ t("img", {
-					ref: r,
-					src: z.get(e.type),
+				children: /* @__PURE__ */ j("img", {
+					ref: t,
+					src: at.get(e.type),
 					width: 16,
 					height: 16,
 					alt: e.type
 				})
 			}),
-			/* @__PURE__ */ t(j, {
+			/* @__PURE__ */ j(C, {
 				mobileOptions: {
 					header: !1,
 					enlarge: !0,
 					width: "100%"
 				},
-				children: /* @__PURE__ */ t(fe, {
+				children: /* @__PURE__ */ j(ie, {
 					href: e.url,
 					target: "_blank",
 					external: !0,
 					children: e.title
 				})
 			}),
-			/* @__PURE__ */ t(tn, { item: e })
+			/* @__PURE__ */ j(It, { item: e })
 		]
 	});
-}), rn = N(({ playQueue: e }) => /* @__PURE__ */ t(qe, {
+}), Rt = k(({ playQueue: e }) => /* @__PURE__ */ j(We, {
 	tag: "tbody",
 	list: e.items,
 	setList: (t) => e.setItems(t),
-	children: e.items.map((e) => /* @__PURE__ */ t(nn, { item: e }, e.id))
-})), an = N(({ playQueue: e }) => /* @__PURE__ */ n(xe, { children: [/* @__PURE__ */ t(Qt, { playQueue: e }), /* @__PURE__ */ t(rn, { playQueue: e })] })), on = N(({ playQueue: e }) => {
-	let { euiTheme: r } = M();
-	return /* @__PURE__ */ n(O.Section, { children: [
-		/* @__PURE__ */ t(Zt, { playQueue: e }),
-		/* @__PURE__ */ t(be, {
+	children: e.items.map((e) => /* @__PURE__ */ j(Lt, { item: e }, e.id))
+})), zt = k(({ playQueue: e }) => /* @__PURE__ */ M(pe, { children: [/* @__PURE__ */ j(Nt, { playQueue: e }), /* @__PURE__ */ j(Rt, { playQueue: e })] })), Bt = k(({ playQueue: e }) => {
+	let { euiTheme: t } = w();
+	return /* @__PURE__ */ M(b.Section, { children: [
+		/* @__PURE__ */ j(Mt, { playQueue: e }),
+		/* @__PURE__ */ j(fe, {
 			size: "l",
 			style: {
 				position: "sticky",
 				top: 88,
 				zIndex: 998,
-				background: r.colors.backgroundBasePlain
+				background: t.colors.backgroundBasePlain
 			}
 		}),
-		e.isEmpty ? /* @__PURE__ */ t(ue, {
-			title: /* @__PURE__ */ t("h2", { children: "We couldn't find any videos" }),
-			body: /* @__PURE__ */ t("p", { children: "Your video library doesn't contain any video content." }),
-			actions: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
-		}) : /* @__PURE__ */ t(an, { playQueue: e })
+		e.isEmpty ? /* @__PURE__ */ j(te, {
+			title: /* @__PURE__ */ j("h2", { children: "We couldn't find any videos" }),
+			body: /* @__PURE__ */ j("p", { children: "Your video library doesn't contain any video content." }),
+			actions: /* @__PURE__ */ j(Ot, { onFulfilled: e.addItemFromDto })
+		}) : /* @__PURE__ */ j(zt, { playQueue: e })
 	] });
-}), sn = ({ breadcrumbs: e, tabs: n, ...r }) => {
-	let i = Je();
-	return /* @__PURE__ */ t(O.Header, {
-		...r,
+}), Vt = e(void 0), Ht = () => r(Vt), Ut = ({ breadcrumbs: e, tabs: t, ...n }) => {
+	let r = Ge();
+	return /* @__PURE__ */ j(b.Header, {
+		...n,
 		breadcrumbs: e?.map(({ linkProps: e, ...t }) => ({
 			...t,
-			href: e === void 0 ? void 0 : i.buildLocation(e).href,
+			href: e === void 0 ? void 0 : r.buildLocation(e).href,
 			onClick: e === void 0 ? void 0 : async (t) => {
-				t.preventDefault(), await i.navigate(e);
+				t.preventDefault(), await r.navigate(e);
 			}
 		})),
-		tabs: n?.map(({ linkProps: e, ...t }) => ({
+		tabs: t?.map(({ linkProps: e, ...t }) => ({
 			...t,
-			href: e === void 0 ? void 0 : i.buildLocation(e).href,
+			href: e === void 0 ? void 0 : r.buildLocation(e).href,
 			onClick: e === void 0 ? void 0 : async (t) => {
-				t.preventDefault(), await i.navigate(e);
+				t.preventDefault(), await r.navigate(e);
 			}
 		}))
 	});
-}, cn = () => {
-	let r = G();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(sn, {
+}, Wt = () => {
+	let e = U();
+	return /* @__PURE__ */ M(A, { children: [/* @__PURE__ */ j(Ut, {
 		pageTitle: "Play queue",
 		rightSideItems: []
-	}), /* @__PURE__ */ t(on, { playQueue: r })] });
-}, ln = R.create(({ remove: e, resolve: r, playlistListItem: i }) => {
-	let [o, s] = d(!1);
-	return /* @__PURE__ */ t(le, {
+	}), /* @__PURE__ */ j(Bt, { playQueue: e })] });
+}, Gt = P.create(({ remove: e, resolve: t, playlistListItem: r }) => {
+	let [i, a] = c(!1);
+	return /* @__PURE__ */ j(ee, {
 		title: "Delete playlist permanently?",
 		onCancel: e,
-		onConfirm: a(async () => {
+		onConfirm: n(async () => {
 			try {
-				s(!0), r(), e();
+				a(!0), t(), e();
 			} finally {
-				s(!1);
+				a(!1);
 			}
-		}, [r, e]),
+		}, [t, e]),
 		cancelButtonText: "Cancel",
 		confirmButtonText: "Delete",
 		buttonColor: "danger",
-		isLoading: o,
-		children: /* @__PURE__ */ n("p", { children: [
+		isLoading: i,
+		children: /* @__PURE__ */ M("p", { children: [
 			"Are you sure you want to delete this playlist? If you delete '",
-			i.name,
+			r.name,
 			"', you won't be able to recover it."
 		] })
 	});
-}), un = N(({ playlist: e }) => /* @__PURE__ */ t(_, {
-	iconType: P,
+}), Kt = k(({ playlist: e }) => /* @__PURE__ */ j(u, {
+	iconType: T,
 	onClick: e.addSelectedItems,
 	disabled: !e.canAddSelectedItems,
 	children: "Add to play queue"
-})), dn = N(({ playlist: e, closePopover: n }) => {
-	let r = a(({ name: e, icon: t, disabled: r, onClick: i }) => ({
+})), qt = k(({ playlist: e, closePopover: t }) => {
+	let r = n(({ name: e, icon: n, disabled: r, onClick: i }) => ({
 		name: e,
-		icon: t,
+		icon: n,
 		disabled: r,
 		onClick: async (e) => {
-			n(), i(e);
+			t(), i(e);
 		}
-	}), [n]);
-	return /* @__PURE__ */ t(x, {
+	}), [t]);
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Play next",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					disabled: !e.canPlaySelectedItemsNext,
 					onClick: e.playSelectedItemsNext
 				}),
 				r({
 					name: "Add to play queue",
-					icon: /* @__PURE__ */ t(D, { type: P }),
+					icon: /* @__PURE__ */ j(y, { type: T }),
 					onClick: e.addSelectedItems,
 					disabled: !e.canAddSelectedItems
 				}),
 				r({
 					name: "Remove",
-					icon: /* @__PURE__ */ t(D, { type: F }),
+					icon: /* @__PURE__ */ j(y, { type: E }),
 					onClick: e.removeSelectedItems,
 					disabled: !e.canRemoveSelectedItems
 				})
 			]
 		}], [r, e])
 	});
-}), fn = i(({ playlist: e }) => {
-	let [n, r] = d(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
-	return /* @__PURE__ */ t(k, {
-		button: /* @__PURE__ */ t(y, {
+}), Jt = t(({ playlist: e }) => {
+	let [t, r] = c(!1), i = n(() => r(!t), [t]), a = n(() => r(!1), []);
+	return /* @__PURE__ */ j(x, {
+		button: /* @__PURE__ */ j(f, {
 			display: "base",
 			size: "m",
-			iconType: I,
+			iconType: D,
 			onClick: i
 		}),
-		isOpen: n,
-		closePopover: o,
+		isOpen: t,
+		closePopover: a,
 		panelPaddingSize: "none",
 		anchorPosition: "downLeft",
-		children: /* @__PURE__ */ t(dn, {
+		children: /* @__PURE__ */ j(qt, {
 			playlist: e,
-			closePopover: o
+			closePopover: a
 		})
 	});
-}), pn = N(({ playlist: e }) => {
-	let { euiTheme: r } = M();
-	return /* @__PURE__ */ n(C, {
+}), Yt = k(({ playlist: e }) => {
+	let { euiTheme: t } = w();
+	return /* @__PURE__ */ M(h, {
 		alignItems: "center",
 		gutterSize: "m",
 		responsive: !1,
@@ -1662,28 +998,28 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 			position: "sticky",
 			top: 48,
 			zIndex: 998,
-			background: r.colors.backgroundBasePlain
+			background: t.colors.backgroundBasePlain
 		},
 		children: [
-			/* @__PURE__ */ n(E, {
+			/* @__PURE__ */ M(v, {
 				sizes: ["xs"],
 				children: [
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(_, {
+						children: /* @__PURE__ */ j(u, {
 							disabled: !e.canPlaySelectedItemsNext,
 							onClick: e.playSelectedItemsNext,
 							children: "Play next"
 						})
 					}),
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(un, { playlist: e })
+						children: /* @__PURE__ */ j(Kt, { playlist: e })
 					}),
-					/* @__PURE__ */ t(w, {
+					/* @__PURE__ */ j(g, {
 						grow: !1,
-						children: /* @__PURE__ */ t(_, {
-							iconType: F,
+						children: /* @__PURE__ */ j(u, {
+							iconType: E,
 							onClick: e.removeSelectedItems,
 							disabled: !e.canRemoveSelectedItems,
 							children: "Remove"
@@ -1691,257 +1027,857 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 					})
 				]
 			}),
-			/* @__PURE__ */ t(ye, {
+			/* @__PURE__ */ j(de, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(fn, { playlist: e })
+				children: /* @__PURE__ */ j(Jt, { playlist: e })
 			}),
-			/* @__PURE__ */ t(w, { grow: !0 }),
-			/* @__PURE__ */ t(w, {
+			/* @__PURE__ */ j(g, { grow: !0 }),
+			/* @__PURE__ */ j(g, {
 				grow: !1,
-				children: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
+				children: /* @__PURE__ */ j(Ot, { onFulfilled: e.addItemFromDto })
 			})
 		]
 	});
-}), mn = N(({ playlist: r }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(we, { children: /* @__PURE__ */ t(C, {
+}), Xt = k(({ playlist: e }) => /* @__PURE__ */ M(A, { children: [/* @__PURE__ */ j(ge, { children: /* @__PURE__ */ j(h, {
 	responsive: !1,
 	justifyContent: "spaceBetween",
 	alignItems: "baseline",
-	children: /* @__PURE__ */ t(w, {
+	children: /* @__PURE__ */ j(g, {
 		grow: !1,
-		children: /* @__PURE__ */ t(b, {
+		children: /* @__PURE__ */ j(p, {
 			id: "",
-			checked: r.allItemsSelected,
-			onChange: (e) => {
-				e.target.checked ? r.selectAll() : r.unselectAll();
+			checked: e.allItemsSelected,
+			onChange: (t) => {
+				t.target.checked ? e.selectAll() : e.unselectAll();
 			}
 		})
 	})
-}) }), /* @__PURE__ */ n(Se, { children: [
-	/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(b, {
+}) }), /* @__PURE__ */ M(me, { children: [
+	/* @__PURE__ */ j(he, { children: /* @__PURE__ */ j(p, {
 		id: "",
-		checked: r.allItemsSelected,
-		onChange: (e) => {
-			e.target.checked ? r.selectAll() : r.unselectAll();
+		checked: e.allItemsSelected,
+		onChange: (t) => {
+			t.target.checked ? e.selectAll() : e.unselectAll();
 		}
 	}) }),
-	/* @__PURE__ */ t(A, { width: 24 }),
-	/* @__PURE__ */ t(A, { children: "Title" }),
-	/* @__PURE__ */ t(A, {})
-] })] })), hn = i(({ item: e, closePopover: n }) => {
-	let r = a(({ name: e, icon: t, disabled: r, onClick: i, className: a }) => ({
+	/* @__PURE__ */ j(S, { width: 24 }),
+	/* @__PURE__ */ j(S, { children: "Title" }),
+	/* @__PURE__ */ j(S, {})
+] })] })), Zt = t(({ item: e, closePopover: t }) => {
+	let r = n(({ name: e, icon: n, disabled: r, onClick: i, className: a }) => ({
 		name: e,
-		icon: t,
+		icon: n,
 		disabled: r,
 		onClick: async (e) => {
-			n(), i(e);
+			t(), i(e);
 		},
 		className: a
-	}), [n]);
-	return /* @__PURE__ */ t(x, {
+	}), [t]);
+	return /* @__PURE__ */ j(m, {
 		initialPanelId: 0,
-		panels: l(() => [{
+		panels: o(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Play",
-					icon: /* @__PURE__ */ t(D, { type: L }),
+					icon: /* @__PURE__ */ j(y, { type: O }),
 					onClick: e.play,
 					className: "eui-showFor--xs--flex"
 				}),
 				r({
 					name: "Play first",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.playFirst
 				}),
 				r({
 					name: "Play next",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.playNext
 				}),
 				r({
 					name: "Add to play queue",
-					icon: /* @__PURE__ */ t(D, { type: P }),
+					icon: /* @__PURE__ */ j(y, { type: T }),
 					onClick: e.addToPlayQueue
 				}),
 				{ isSeparator: !0 },
 				r({
 					name: "Move to the top",
-					icon: /* @__PURE__ */ t(D, { type: Pe }),
+					icon: /* @__PURE__ */ j(y, { type: Ee }),
 					onClick: e.moveToTop,
 					disabled: !e.canMoveToTop
 				}),
 				r({
 					name: "Move to the bottom",
-					icon: /* @__PURE__ */ t(D, { type: Oe }),
+					icon: /* @__PURE__ */ j(y, { type: be }),
 					onClick: e.moveToBottom,
 					disabled: !e.canMoveToBottom
 				}),
 				{ isSeparator: !0 },
 				r({
 					name: "Remove",
-					icon: /* @__PURE__ */ t(D, { type: F }),
+					icon: /* @__PURE__ */ j(y, { type: E }),
 					onClick: e.remove,
 					className: "eui-showFor--xs--flex"
 				}),
 				r({
 					name: "Remove to the top",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.removeToTop,
 					disabled: !e.canRemoveToTop
 				}),
 				r({
 					name: "Remove others",
-					icon: /* @__PURE__ */ t(D, { type: "" }),
+					icon: /* @__PURE__ */ j(y, { type: "" }),
 					onClick: e.removeOthers,
 					disabled: !e.canRemoveOthers
 				})
 			]
 		}], [r, e])
 	});
-}), gn = i(({ item: e }) => {
-	let [n, r] = d(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
-	return /* @__PURE__ */ t(k, {
-		button: /* @__PURE__ */ t(y, {
+}), Qt = t(({ item: e }) => {
+	let [t, r] = c(!1), i = n(() => r(!t), [t]), a = n(() => r(!1), []);
+	return /* @__PURE__ */ j(x, {
+		button: /* @__PURE__ */ j(f, {
 			title: "More options",
 			"aria-label": "More options",
-			iconType: I,
+			iconType: D,
 			size: "s",
 			color: "text",
 			onClick: i
 		}),
-		isOpen: n,
-		closePopover: o,
+		isOpen: t,
+		closePopover: a,
 		panelPaddingSize: "none",
 		anchorPosition: "leftCenter",
-		children: /* @__PURE__ */ t(hn, {
+		children: /* @__PURE__ */ j(Zt, {
 			item: e,
-			closePopover: o
+			closePopover: a
 		})
 	});
-}), _n = N(({ item: e }) => /* @__PURE__ */ n(j, {
+}), $t = k(({ item: e }) => /* @__PURE__ */ M(C, {
 	textOnly: !1,
 	hasActions: !0,
 	align: "right",
-	children: [/* @__PURE__ */ n(E, {
+	children: [/* @__PURE__ */ M(v, {
 		sizes: ["xs"],
-		children: [/* @__PURE__ */ t(_, {
-			iconType: L,
+		children: [/* @__PURE__ */ j(u, {
+			iconType: O,
 			size: "s",
 			onClick: e.play,
 			children: "Play"
-		}), /* @__PURE__ */ t(_, {
-			iconType: F,
+		}), /* @__PURE__ */ j(u, {
+			iconType: E,
 			size: "s",
 			onClick: e.remove,
 			children: "Remove"
 		})]
-	}), /* @__PURE__ */ t(gn, { item: e })]
-})), vn = N(({ item: e }) => /* @__PURE__ */ n(Te, {
+	}), /* @__PURE__ */ j(Qt, { item: e })]
+})), en = k(({ item: e }) => /* @__PURE__ */ M(_e, {
 	isSelected: e.isCurrent,
 	hasSelection: !0,
 	hasActions: !0,
 	children: [
-		/* @__PURE__ */ t(Ee, { children: /* @__PURE__ */ t(b, {
+		/* @__PURE__ */ j(ve, { children: /* @__PURE__ */ j(p, {
 			id: e.id.toString(),
 			checked: e.isSelected,
 			onChange: e.toggleSelected
 		}) }),
-		/* @__PURE__ */ t(j, {
+		/* @__PURE__ */ j(C, {
 			textOnly: !1,
-			children: /* @__PURE__ */ t("img", {
-				src: z.get(e.type),
+			children: /* @__PURE__ */ j("img", {
+				src: at.get(e.type),
 				width: 16,
 				height: 16,
 				alt: e.type
 			})
 		}),
-		/* @__PURE__ */ t(j, {
+		/* @__PURE__ */ j(C, {
 			mobileOptions: {
 				header: !1,
 				enlarge: !0,
 				width: "100%"
 			},
-			children: /* @__PURE__ */ t(fe, {
+			children: /* @__PURE__ */ j(ie, {
 				href: e.url,
 				target: "_blank",
 				external: !0,
 				children: e.title
 			})
 		}),
-		/* @__PURE__ */ t(_n, { item: e })
+		/* @__PURE__ */ j($t, { item: e })
 	]
-})), yn = N(({ playlist: e }) => /* @__PURE__ */ t(qe, {
+})), tn = k(({ playlist: e }) => /* @__PURE__ */ j(We, {
 	tag: "tbody",
 	list: e.items,
 	setList: (t) => e.setItems(t),
-	children: e.items.map((e) => /* @__PURE__ */ t(vn, { item: e }, e.id))
-})), bn = N(({ playlist: e }) => /* @__PURE__ */ n(xe, { children: [/* @__PURE__ */ t(mn, { playlist: e }), /* @__PURE__ */ t(yn, { playlist: e })] })), xn = N(({ playlist: r }) => {
-	let { euiTheme: i } = M();
-	return /* @__PURE__ */ n(O.Section, { children: [
-		/* @__PURE__ */ t(pn, { playlist: r }),
-		/* @__PURE__ */ t(be, {
+	children: e.items.map((e) => /* @__PURE__ */ j(en, { item: e }, e.id))
+})), nn = k(({ playlist: e }) => /* @__PURE__ */ M(pe, { children: [/* @__PURE__ */ j(Xt, { playlist: e }), /* @__PURE__ */ j(tn, { playlist: e })] })), rn = k(({ playlist: e }) => {
+	let { euiTheme: t } = w();
+	return /* @__PURE__ */ M(b.Section, { children: [
+		/* @__PURE__ */ j(Yt, { playlist: e }),
+		/* @__PURE__ */ j(fe, {
 			size: "l",
 			style: {
 				position: "sticky",
 				top: 88,
 				zIndex: 998,
-				background: i.colors.backgroundBasePlain
+				background: t.colors.backgroundBasePlain
 			}
 		}),
-		r.isEmpty ? /* @__PURE__ */ t(e, {}) : /* @__PURE__ */ t(bn, { playlist: r })
+		e.isEmpty ? /* @__PURE__ */ j(A, {}) : /* @__PURE__ */ j(nn, { playlist: e })
 	] });
-}), Sn = R.create(({ remove: e, resolve: r, playlistListItem: i }) => {
-	let a = De({ prefix: "modalForm" }), [o, s] = d(i.name), [c, l] = d(!1);
-	return /* @__PURE__ */ n(pe, {
+}), an = P.create(({ remove: e, resolve: t, playlistListItem: n }) => {
+	let r = ye({ prefix: "modalForm" }), [i, a] = c(n.name), [o, s] = c(!1);
+	return /* @__PURE__ */ M(ae, {
+		onClose: e,
+		initialFocus: "[name=name]",
+		children: [
+			/* @__PURE__ */ j(ce, { children: /* @__PURE__ */ j(le, { children: "Rename playlist" }) }),
+			/* @__PURE__ */ j(oe, { children: /* @__PURE__ */ j(re, {
+				id: r,
+				component: "form",
+				onSubmit: async (n) => {
+					n.preventDefault();
+					try {
+						s(!0), t(i), e();
+					} finally {
+						s(!1);
+					}
+				},
+				children: /* @__PURE__ */ j(_, {
+					label: "Name",
+					children: /* @__PURE__ */ j(ne, {
+						name: "name",
+						value: i,
+						onChange: (e) => a(e.target.value)
+					})
+				})
+			}) }),
+			/* @__PURE__ */ M(se, { children: [/* @__PURE__ */ j(d, {
+				onClick: e,
+				children: "Cancel"
+			}), /* @__PURE__ */ j(u, {
+				type: "submit",
+				form: r,
+				fill: !0,
+				disabled: i.trim().length === 0,
+				isLoading: o,
+				children: "Rename"
+			})] })
+		]
+	});
+}), on = {
+	type: "object",
+	properties: {
+		url: { type: "string" },
+		type: { type: "string" },
+		videoId: { type: "string" },
+		title: { type: "string" }
+	},
+	required: [
+		"url",
+		"type",
+		"videoId",
+		"title"
+	]
+};
+//#endregion
+//#region \0@oxc-project+runtime@0.130.0/helpers/decorate.js
+function W(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}
+//#endregion
+//#region src/features/media-player/stores/PlaylistItemStore.ts
+var G = class e {
+	playQueue;
+	playlist;
+	dto;
+	static nextId = 1;
+	id;
+	isSelected = !1;
+	constructor(t, n, r) {
+		this.playQueue = t, this.playlist = n, this.dto = r, L(this), this.id = e.nextId++;
+	}
+	static fromDto(t, n, r) {
+		return new e(t, n, r);
+	}
+	get url() {
+		return this.dto.url;
+	}
+	get type() {
+		return this.dto.type;
+	}
+	get videoId() {
+		return this.dto.videoId;
+	}
+	get title() {
+		return this.dto.title;
+	}
+	get isCurrent() {
+		return !1;
+	}
+	get index() {
+		return this.playlist.items.indexOf(this);
+	}
+	get isFirst() {
+		return this.index === 0;
+	}
+	get isLast() {
+		return this.index === this.playlist.items.length - 1;
+	}
+	get canMoveToTop() {
+		return !this.isFirst;
+	}
+	get canMoveToBottom() {
+		return !this.isLast;
+	}
+	get canRemoveToTop() {
+		return !this.isFirst;
+	}
+	get canRemoveOthers() {
+		return this.playlist.hasMultipleItems;
+	}
+	unselect() {
+		this.isSelected = !1;
+	}
+	select() {
+		this.isSelected = !0;
+	}
+	toggleSelected() {
+		this.isSelected = !this.isSelected;
+	}
+	play() {
+		return this.playQueue.clearAndSetItems([this.playQueue.createItemFromDto(this.dto)]), Promise.resolve();
+	}
+	remove() {
+		return this.playlist.removeItems([this]);
+	}
+	playFirst() {
+		return this.playQueue.playFirst([this.playQueue.createItemFromDto(this.dto)]);
+	}
+	playNext() {
+		return this.playQueue.playNext([this.playQueue.createItemFromDto(this.dto)]);
+	}
+	addToPlayQueue() {
+		return this.playQueue.addItems([this.playQueue.createItemFromDto(this.dto)]);
+	}
+	moveToTop() {
+		this.playlist.moveItem(this, 0);
+	}
+	moveToBottom() {
+		this.playlist.moveItem(this, this.playlist.items.length - 1);
+	}
+	removeToTop() {
+		return this.playlist.removeItemsAbove(this);
+	}
+	removeOthers() {
+		return this.playlist.removeOtherItems(this);
+	}
+};
+W([R], G.prototype, "isSelected", void 0), W([I], G.prototype, "isCurrent", null), W([I], G.prototype, "index", null), W([I], G.prototype, "isFirst", null), W([I], G.prototype, "isLast", null), W([I], G.prototype, "canMoveToTop", null), W([I], G.prototype, "canMoveToBottom", null), W([I], G.prototype, "canRemoveToTop", null), W([I], G.prototype, "canRemoveOthers", null), W([F.bound], G.prototype, "unselect", null), W([F.bound], G.prototype, "select", null), W([F.bound], G.prototype, "toggleSelected", null), W([F.bound], G.prototype, "play", null), W([F.bound], G.prototype, "remove", null), W([F.bound], G.prototype, "playFirst", null), W([F.bound], G.prototype, "playNext", null), W([F.bound], G.prototype, "addToPlayQueue", null), W([F.bound], G.prototype, "moveToTop", null), W([F.bound], G.prototype, "moveToBottom", null), W([F.bound], G.prototype, "removeToTop", null), W([F.bound], G.prototype, "removeOthers", null);
+//#endregion
+//#region src/shared/stores/getOrAddSchema.ts
+var sn = new qe({ coerceTypes: !0 });
+function cn(e, t) {
+	let n;
+	if (n = sn.getSchema(t), n === void 0 && (sn.addSchema(e, t), n = sn.getSchema(t)), n === void 0 || n.schema !== e) throw Error(`Invalid schema. Expected: '${JSON.stringify(e)}', but got '${JSON.stringify(n?.schema)}'.`);
+	return n;
+}
+//#endregion
+//#region src/features/media-player/stores/PlaylistStore.ts
+var ln = {
+	type: "object",
+	properties: {
+		version: {
+			type: "string",
+			nullable: !0
+		},
+		items: {
+			type: "array",
+			nullable: !0,
+			items: on
+		}
+	}
+}, un = class {
+	playlist;
+	constructor(e) {
+		this.playlist = e, L(this);
+	}
+	get state() {
+		return {
+			version: "1.0",
+			items: this.playlist.items.map((e) => e.dto)
+		};
+	}
+	set state(e) {
+		this.playlist.items = e.items?.map((e) => this.playlist.createItemFromDto(e)) ?? [];
+	}
+	validateState(e) {
+		return cn(ln, "PlaylistLocalStorageState")(e);
+	}
+};
+W([I.struct], un.prototype, "state", null);
+var K = class {
+	playQueue;
+	localStorageState;
+	items = [];
+	constructor(e) {
+		this.playQueue = e, L(this), this.localStorageState = new un(this);
+	}
+	createItemFromDto(e) {
+		return G.fromDto(this.playQueue, this, {
+			url: e.url,
+			type: e.type,
+			videoId: e.videoId,
+			title: e.title
+		});
+	}
+	get isEmpty() {
+		return this.items.length === 0;
+	}
+	get hasMultipleItems() {
+		return this.items.length > 1;
+	}
+	get selectedItems() {
+		return this.items.filter((e) => e.isSelected);
+	}
+	get allItemsSelected() {
+		return this.selectedItems.length === this.items.length;
+	}
+	get hasSelectedItems() {
+		return this.selectedItems.length > 0;
+	}
+	get selectedItemsOrAllItems() {
+		return this.hasSelectedItems ? this.selectedItems : this.items;
+	}
+	get canAddSelectedItems() {
+		return !this.isEmpty && this.hasSelectedItems;
+	}
+	get canPlaySelectedItemsNext() {
+		return !this.isEmpty && this.hasSelectedItems;
+	}
+	get canRemoveSelectedItems() {
+		return !this.isEmpty && this.hasSelectedItems;
+	}
+	setItems(e) {
+		this.items = e;
+	}
+	unselectAll() {
+		for (let e of this.items) e.unselect();
+	}
+	selectAll() {
+		for (let e of this.items) e.select();
+	}
+	async playSelectedItemsNext() {
+		await this.playQueue.playNext(this.selectedItemsOrAllItems.map((e) => this.playQueue.createItemFromDto(e.dto))), this.unselectAll();
+	}
+	async addSelectedItems() {
+		await this.playQueue.addItems(this.selectedItemsOrAllItems.map((e) => this.playQueue.createItemFromDto(e.dto))), this.unselectAll();
+	}
+	async addItems(e) {
+		this.items.push(...e);
+	}
+	moveItem(e, t) {
+		let n = this.items.splice(this.items.indexOf(e), 1)[0];
+		this.items.splice(t, 0, n);
+	}
+	async removeItems(e) {
+		z(this.items, ...e);
+	}
+	async removeSelectedItems() {
+		await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
+	}
+	async removeOtherItems(e) {
+		let t = e.id;
+		return this.removeItems(this.items.filter((e) => e.id !== t));
+	}
+	async removeItemsAbove(e) {
+		let t = this.items.indexOf(e);
+		return this.removeItems(this.items.filter((e, n) => n < t));
+	}
+	addItemFromDto(e) {
+		let t = this.createItemFromDto(e);
+		return this.addItems([t]);
+	}
+	playAll() {
+		return this.playQueue.clearAndSetItems(this.items.map((e) => this.playQueue.createItemFromDto(e.dto))), Promise.resolve();
+	}
+};
+W([R], K.prototype, "items", void 0), W([I], K.prototype, "isEmpty", null), W([I], K.prototype, "hasMultipleItems", null), W([I], K.prototype, "selectedItems", null), W([I], K.prototype, "allItemsSelected", null), W([I], K.prototype, "hasSelectedItems", null), W([I], K.prototype, "selectedItemsOrAllItems", null), W([I], K.prototype, "canAddSelectedItems", null), W([I], K.prototype, "canPlaySelectedItemsNext", null), W([I], K.prototype, "canRemoveSelectedItems", null), W([F.bound], K.prototype, "setItems", null), W([F.bound], K.prototype, "unselectAll", null), W([F.bound], K.prototype, "selectAll", null), W([F.bound], K.prototype, "playSelectedItemsNext", null), W([F.bound], K.prototype, "addSelectedItems", null), W([F.bound], K.prototype, "addItems", null), W([F.bound], K.prototype, "moveItem", null), W([F.bound], K.prototype, "removeItems", null), W([F.bound], K.prototype, "removeSelectedItems", null), W([F.bound], K.prototype, "removeOtherItems", null), W([F.bound], K.prototype, "removeItemsAbove", null), W([F.bound], K.prototype, "addItemFromDto", null), W([F.bound], K.prototype, "playAll", null);
+//#endregion
+//#region src/shared/stores/localStorageStateKeys.ts
+var dn = {
+	playQueue: "PlayQueueStore",
+	bottomBar: "BottomBarStore",
+	playlistList: "PlaylistListStore",
+	playlist: (e) => `PlaylistStore/${e}`
+}, fn = ({ onClick: e }) => /* @__PURE__ */ j(u, {
+	onClick: e,
+	iconType: O,
+	fill: !0,
+	children: "Play all"
+}), pn = ({ playlistListItem: e, onFulfilled: t }) => /* @__PURE__ */ j(u, {
+	onClick: () => P.show(an, { playlistListItem: e }).then(t),
+	iconType: Pe,
+	children: "Rename"
+}), mn = ({ playlistListItem: e, onFulfilled: t }) => /* @__PURE__ */ j(u, {
+	onClick: () => P.show(Gt, { playlistListItem: e }).then(t),
+	iconType: De,
+	children: "Delete"
+}), hn = k(({ playlistListItem: e }) => {
+	let t = dn.playlist(e.id), r = U(), [i] = c(() => new K(r));
+	B(t, i.localStorageState);
+	let a = Ge(), o = n(async (t) => {
+		await e.rename(t);
+	}, [e]), s = n(async () => {
+		await a.navigate({ to: "/playlists" }), window.localStorage.removeItem(t), await e.remove();
+	}, [
+		e,
+		a,
+		t
+	]);
+	return /* @__PURE__ */ M(A, { children: [/* @__PURE__ */ j(Ut, {
+		pageTitle: e.name,
+		breadcrumbs: [{
+			text: "Playlists",
+			linkProps: { to: "/playlists" }
+		}, { text: e.name }],
+		rightSideItems: [
+			/* @__PURE__ */ j(fn, { onClick: i.playAll }),
+			/* @__PURE__ */ j(pn, {
+				playlistListItem: e,
+				onFulfilled: o
+			}),
+			/* @__PURE__ */ j(mn, {
+				playlistListItem: e,
+				onFulfilled: s
+			})
+		]
+	}), /* @__PURE__ */ j(rn, { playlist: i })] });
+}), gn = P.create(({ remove: e, resolve: t }) => {
+	let n = ye({ prefix: "modalForm" }), [r, i] = c(""), [a, o] = c(!1);
+	return /* @__PURE__ */ M(ae, {
 		onClose: e,
 		initialFocus: "[name=name]",
 		children: [
-			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Rename playlist" }) }),
-			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ t(de, {
-				id: a,
+			/* @__PURE__ */ j(ce, { children: /* @__PURE__ */ j(le, { children: "Create playlist" }) }),
+			/* @__PURE__ */ j(oe, { children: /* @__PURE__ */ j(re, {
+				id: n,
 				component: "form",
-				onSubmit: async (t) => {
-					t.preventDefault();
+				onSubmit: async (n) => {
+					n.preventDefault();
 					try {
-						l(!0), r(o), e();
+						o(!0), t(r), e();
 					} finally {
-						l(!1);
+						o(!1);
 					}
 				},
-				children: /* @__PURE__ */ t(T, {
+				children: /* @__PURE__ */ j(_, {
 					label: "Name",
-					children: /* @__PURE__ */ t(S, {
+					children: /* @__PURE__ */ j(ne, {
 						name: "name",
-						value: o,
-						onChange: (e) => s(e.target.value)
+						value: r,
+						onChange: (e) => i(e.target.value)
 					})
 				})
 			}) }),
-			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
+			/* @__PURE__ */ M(se, { children: [/* @__PURE__ */ j(d, {
 				onClick: e,
 				children: "Cancel"
-			}), /* @__PURE__ */ t(_, {
+			}), /* @__PURE__ */ j(u, {
 				type: "submit",
-				form: a,
+				form: n,
 				fill: !0,
-				disabled: o.trim().length === 0,
-				isLoading: c,
-				children: "Rename"
+				disabled: r.trim().length === 0,
+				isLoading: a,
+				children: "Create playlist"
 			})] })
 		]
 	});
-}), Q = class e {
+}), _n = ({ children: e, onFulfilled: t }) => /* @__PURE__ */ j(u, {
+	onClick: () => P.show(gn).then(t),
+	iconType: T,
+	fill: !0,
+	children: e
+}), vn = ({ linkProps: e, ...t }) => {
+	let n = Ge(), r = async (t) => {
+		t.preventDefault(), await n.navigate(e);
+	};
+	return /* @__PURE__ */ j(ie, {
+		...t,
+		href: n.buildLocation(e).href,
+		onClick: r
+	});
+}, yn = k(() => /* @__PURE__ */ j(me, { children: /* @__PURE__ */ j(S, { children: "Name" }) })), bn = k(({ item: e }) => /* @__PURE__ */ j(_e, { children: /* @__PURE__ */ j(C, { children: /* @__PURE__ */ j(vn, {
+	linkProps: {
+		to: "/playlists/$playlistId",
+		params: { playlistId: e.id }
+	},
+	children: e.name
+}) }) }, e.id)), xn = k(({ playlistList: e }) => /* @__PURE__ */ j(We, {
+	tag: "tbody",
+	list: e.items,
+	setList: (t) => e.setItems(t),
+	children: e.items.map((e) => /* @__PURE__ */ j(bn, { item: e }, e.id))
+})), Sn = k(({ playlistList: e }) => /* @__PURE__ */ M(pe, { children: [/* @__PURE__ */ j(yn, {}), /* @__PURE__ */ j(xn, { playlistList: e })] })), Cn = () => /* @__PURE__ */ j(Ut, {
+	pageTitle: "Playlists",
+	breadcrumbs: [{ text: "Playlists" }]
+}), wn = k(({ playlistList: e }) => {
+	let t = n(async (t) => {
+		await e.addItem(e.createItem(t));
+	}, [e]);
+	return /* @__PURE__ */ M(b.Section, { children: [
+		/* @__PURE__ */ j(_n, {
+			onFulfilled: t,
+			children: "New playlist"
+		}),
+		/* @__PURE__ */ j(fe, { size: "l" }),
+		/* @__PURE__ */ j(Sn, { playlistList: e })
+	] });
+}), Tn = t(() => {
+	let e = Ht();
+	return /* @__PURE__ */ M(A, { children: [/* @__PURE__ */ j(Cn, {}), /* @__PURE__ */ j(wn, { playlistList: e })] });
+}), En = e(void 0), Dn = () => r(En), On = {
+	type: "object",
+	properties: {
+		repeat: {
+			type: "string",
+			enum: Object.values(H),
+			nullable: !0
+		},
+		shuffle: {
+			type: "boolean",
+			nullable: !0
+		}
+	}
+}, kn = class {
+	bottomBar;
+	constructor(e) {
+		this.bottomBar = e, L(this);
+	}
+	get state() {
+		return {
+			repeat: this.bottomBar.repeat,
+			shuffle: this.bottomBar.shuffle
+		};
+	}
+	set state(e) {
+		this.bottomBar.repeat = e.repeat ?? H.Off, this.bottomBar.shuffle = e.shuffle ?? !1;
+	}
+	validateState(e) {
+		return cn(On, "BottomBarLocalStorageState")(e);
+	}
+};
+W([I.struct], kn.prototype, "state", null);
+var q = class {
+	player;
+	playQueue;
+	localStorageState;
+	repeat = H.Off;
+	shuffle = !1;
+	constructor(e, t) {
+		this.player = e, this.playQueue = t, L(this), this.localStorageState = new kn(this);
+	}
+	get controller() {
+		return this.player.controller;
+	}
+	get playing() {
+		return this.player.playing;
+	}
+	get percent() {
+		return this.player.percent;
+	}
+	get canSeek() {
+		return !this.playQueue.isEmpty && this.controller.supports("setCurrentTime");
+	}
+	get currentItem() {
+		return this.playQueue.currentItem;
+	}
+	get canToggleRepeat() {
+		return !0;
+	}
+	get canToggleShuffle() {
+		return !1;
+	}
+	get canPlay() {
+		return this.playQueue.canPlay && this.controller.supports("play");
+	}
+	get canPause() {
+		return this.playQueue.canPause && this.controller.supports("pause");
+	}
+	get canPrevious() {
+		return !this.playQueue.isEmpty;
+	}
+	get canNext() {
+		return this.playQueue.hasNextItem;
+	}
+	get canSkipBack10() {
+		return this.canSeek;
+	}
+	get canSkipForward30() {
+		return this.canSeek;
+	}
+	get canRemoveFromPlayQueue() {
+		return !this.playQueue.isEmpty;
+	}
+	setPercent(e) {
+		this.player.setPercent(e);
+	}
+	setSeeking(e) {
+		this.player.setSeeking(e);
+	}
+	toggleRepeat() {
+		switch (this.repeat) {
+			case H.Off:
+				this.repeat = H.All;
+				break;
+			case H.All:
+				this.repeat = H.One;
+				break;
+			case H.One:
+				this.repeat = H.Off;
+				break;
+		}
+	}
+	toggleShuffle() {
+		this.shuffle = !this.shuffle;
+	}
+	play() {
+		return this.controller.play();
+	}
+	pause() {
+		return this.controller.pause();
+	}
+	async previous() {
+		if (this.playQueue.hasPreviousItem) {
+			let e = await this.controller.getCurrentTime();
+			e === void 0 || e < 5 ? await this.playQueue.previous() : await this.controller.setCurrentTime(0);
+		} else await this.controller.setCurrentTime(0);
+	}
+	next() {
+		return this.playQueue.next();
+	}
+	async skipBack10() {
+		let e = await this.controller.getCurrentTime();
+		e !== void 0 && await this.controller.setCurrentTime(e - 10);
+	}
+	async skipForward30() {
+		let e = await this.controller.getCurrentTime();
+		e !== void 0 && await this.controller.setCurrentTime(e + 30);
+	}
+	async removeFromPlayQueue() {
+		this.currentItem !== void 0 && await this.playQueue.removeItems([this.currentItem]);
+	}
+};
+W([R], q.prototype, "repeat", void 0), W([R], q.prototype, "shuffle", void 0), W([I], q.prototype, "controller", null), W([I], q.prototype, "playing", null), W([I], q.prototype, "percent", null), W([I], q.prototype, "canSeek", null), W([I], q.prototype, "currentItem", null), W([I], q.prototype, "canToggleRepeat", null), W([I], q.prototype, "canToggleShuffle", null), W([I], q.prototype, "canPlay", null), W([I], q.prototype, "canPause", null), W([I], q.prototype, "canPrevious", null), W([I], q.prototype, "canNext", null), W([I], q.prototype, "canSkipBack10", null), W([I], q.prototype, "canSkipForward30", null), W([I], q.prototype, "canRemoveFromPlayQueue", null), W([F.bound], q.prototype, "setPercent", null), W([F.bound], q.prototype, "setSeeking", null), W([F.bound], q.prototype, "toggleRepeat", null), W([F.bound], q.prototype, "toggleShuffle", null), W([F.bound], q.prototype, "play", null), W([F.bound], q.prototype, "pause", null), W([F.bound], q.prototype, "previous", null), W([F.bound], q.prototype, "next", null), W([F.bound], q.prototype, "skipBack10", null), W([F.bound], q.prototype, "skipForward30", null), W([F.bound], q.prototype, "removeFromPlayQueue", null);
+//#endregion
+//#region src/features/media-player/providers/BottomBarProvider.tsx
+var An = ({ children: e }) => {
+	let t = Dn(), n = U(), [r] = c(() => new q(t, n));
+	return B(dn.bottomBar, r.localStorageState), /* @__PURE__ */ j(Je.Provider, {
+		value: r,
+		children: e
+	});
+}, J = class {
+	player;
+	playQueue;
+	bottomBar;
+	constructor(e, t, n) {
+		this.player = e, this.playQueue = t, this.bottomBar = n, L(this);
+	}
+	get interacted() {
+		return this.playQueue.interacted;
+	}
+	get controller() {
+		return this.player.controller;
+	}
+	get currentItem() {
+		return this.playQueue.currentItem;
+	}
+	async onLoaded() {
+		this.interacted && await this.controller.play();
+	}
+	onPlay() {
+		this.player.onPlay();
+	}
+	onPause() {
+		this.player.onPause();
+	}
+	async onEnded() {
+		switch (this.bottomBar.repeat) {
+			case H.One:
+				await this.controller.setCurrentTime(0);
+				break;
+			case H.Off:
+			case H.All:
+				if (this.playQueue.isLastItem) switch (this.bottomBar.repeat) {
+					case H.Off:
+						this.player.onEnded();
+						break;
+					case H.All:
+						this.playQueue.hasMultipleItems ? await this.playQueue.goToFirst() : await this.controller.setCurrentTime(0);
+						break;
+				}
+				else await this.playQueue.next();
+				break;
+		}
+	}
+	onTimeUpdate(e) {
+		this.player.onTimeUpdate(e);
+	}
+	onControllerChange(e) {
+		this.player.onControllerChange(e);
+	}
+};
+W([I], J.prototype, "interacted", null), W([I], J.prototype, "controller", null), W([I], J.prototype, "currentItem", null), W([F.bound], J.prototype, "onLoaded", null), W([F.bound], J.prototype, "onPlay", null), W([F.bound], J.prototype, "onPause", null), W([F.bound], J.prototype, "onEnded", null), W([F.bound], J.prototype, "onTimeUpdate", null), W([F.bound], J.prototype, "onControllerChange", null);
+//#endregion
+//#region src/features/media-player/providers/MiniPlayerProvider.tsx
+var jn = ({ children: e }) => {
+	let t = Dn(), n = U(), r = V(), [i] = c(() => new J(t, n, r));
+	return /* @__PURE__ */ j(Ct.Provider, {
+		value: i,
+		children: e
+	});
+}, Mn = {
+	type: "object",
+	properties: {
+		version: {
+			type: "string",
+			nullable: !0
+		},
+		repeat: {
+			type: "string",
+			enum: Object.values(H),
+			nullable: !0
+		},
+		shuffle: {
+			type: "boolean",
+			nullable: !0
+		},
+		items: {
+			type: "array",
+			nullable: !0,
+			items: on
+		},
+		currentIndex: {
+			type: "integer",
+			nullable: !0
+		}
+	}
+}, Y = class e {
 	playQueue;
-	playlist;
 	dto;
 	static nextId = 1;
 	id;
 	isSelected = !1;
-	constructor(t, n, r) {
-		this.playQueue = t, this.playlist = n, this.dto = r, m(this), this.id = e.nextId++;
+	constructor(t, n) {
+		this.playQueue = t, this.dto = n, L(this), this.id = e.nextId++;
 	}
-	static fromDto(t, n, r) {
-		return new e(t, n, r);
+	static fromDto(t, n) {
+		return new e(t, n);
 	}
 	get url() {
 		return this.dto.url;
@@ -1956,16 +1892,16 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 		return this.dto.title;
 	}
 	get isCurrent() {
-		return !1;
+		return this.playQueue.currentItem === this;
 	}
 	get index() {
-		return this.playlist.items.indexOf(this);
+		return this.playQueue.items.indexOf(this);
 	}
 	get isFirst() {
 		return this.index === 0;
 	}
 	get isLast() {
-		return this.index === this.playlist.items.length - 1;
+		return this.index === this.playQueue.items.length - 1;
 	}
 	get canMoveToTop() {
 		return !this.isFirst;
@@ -1977,7 +1913,10 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 		return !this.isFirst;
 	}
 	get canRemoveOthers() {
-		return this.playlist.hasMultipleItems;
+		return this.playQueue.hasMultipleItems;
+	}
+	clone() {
+		return this.playQueue.createItemFromDto(this.dto);
 	}
 	unselect() {
 		this.isSelected = !1;
@@ -1989,77 +1928,66 @@ var Kt = R.create(({ remove: e, resolve: r }) => {
 		this.isSelected = !this.isSelected;
 	}
 	play() {
-		return this.playQueue.clearAndSetItems([this.playQueue.createItemFromDto(this.dto)]), Promise.resolve();
+		return this.playQueue.setCurrentItem(this), Promise.resolve();
 	}
 	remove() {
-		return this.playlist.removeItems([this]);
+		return this.playQueue.removeItems([this]);
 	}
 	playFirst() {
-		return this.playQueue.playFirst([this.playQueue.createItemFromDto(this.dto)]);
+		return this.playQueue.playFirst([this.clone()]);
 	}
 	playNext() {
-		return this.playQueue.playNext([this.playQueue.createItemFromDto(this.dto)]);
+		return this.playQueue.playNext([this.clone()]);
 	}
 	addToPlayQueue() {
-		return this.playQueue.addItems([this.playQueue.createItemFromDto(this.dto)]);
+		return this.playQueue.addItems([this.clone()]);
 	}
 	moveToTop() {
-		this.playlist.moveItem(this, 0);
+		this.playQueue.moveItem(this, 0);
 	}
 	moveToBottom() {
-		this.playlist.moveItem(this, this.playlist.items.length - 1);
+		this.playQueue.moveItem(this, this.playQueue.items.length - 1);
 	}
 	removeToTop() {
-		return this.playlist.removeItemsAbove(this);
+		return this.playQueue.removeItemsAbove(this);
 	}
 	removeOthers() {
-		return this.playlist.removeOtherItems(this);
+		return this.playQueue.removeOtherItems(this);
 	}
 };
-U([h], Q.prototype, "isSelected", void 0), U([p], Q.prototype, "isCurrent", null), U([p], Q.prototype, "index", null), U([p], Q.prototype, "isFirst", null), U([p], Q.prototype, "isLast", null), U([p], Q.prototype, "canMoveToTop", null), U([p], Q.prototype, "canMoveToBottom", null), U([p], Q.prototype, "canRemoveToTop", null), U([p], Q.prototype, "canRemoveOthers", null), U([f.bound], Q.prototype, "unselect", null), U([f.bound], Q.prototype, "select", null), U([f.bound], Q.prototype, "toggleSelected", null), U([f.bound], Q.prototype, "play", null), U([f.bound], Q.prototype, "remove", null), U([f.bound], Q.prototype, "playFirst", null), U([f.bound], Q.prototype, "playNext", null), U([f.bound], Q.prototype, "addToPlayQueue", null), U([f.bound], Q.prototype, "moveToTop", null), U([f.bound], Q.prototype, "moveToBottom", null), U([f.bound], Q.prototype, "removeToTop", null), U([f.bound], Q.prototype, "removeOthers", null);
+W([R], Y.prototype, "isSelected", void 0), W([I], Y.prototype, "isCurrent", null), W([I], Y.prototype, "index", null), W([I], Y.prototype, "isFirst", null), W([I], Y.prototype, "isLast", null), W([I], Y.prototype, "canMoveToTop", null), W([I], Y.prototype, "canMoveToBottom", null), W([I], Y.prototype, "canRemoveToTop", null), W([I], Y.prototype, "canRemoveOthers", null), W([F.bound], Y.prototype, "unselect", null), W([F.bound], Y.prototype, "select", null), W([F.bound], Y.prototype, "toggleSelected", null), W([F.bound], Y.prototype, "play", null), W([F.bound], Y.prototype, "remove", null), W([F.bound], Y.prototype, "playFirst", null), W([F.bound], Y.prototype, "playNext", null), W([F.bound], Y.prototype, "addToPlayQueue", null), W([F.bound], Y.prototype, "moveToTop", null), W([F.bound], Y.prototype, "moveToBottom", null), W([F.bound], Y.prototype, "removeToTop", null), W([F.bound], Y.prototype, "removeOthers", null);
 //#endregion
-//#region src/features/media-player.playlists/stores/PlaylistStore.ts
-var Cn = {
-	type: "object",
-	properties: {
-		version: {
-			type: "string",
-			nullable: !0
-		},
-		items: {
-			type: "array",
-			nullable: !0,
-			items: lt
-		}
-	}
-}, wn = class {
-	playlist;
+//#region src/features/media-player/stores/PlayQueueStore.ts
+var Nn = class {
+	playQueue;
 	constructor(e) {
-		this.playlist = e, m(this);
+		this.playQueue = e, L(this);
 	}
 	get state() {
 		return {
 			version: "1.0",
-			items: this.playlist.items.map((e) => e.dto)
+			items: this.playQueue.items.map((e) => e.dto),
+			currentIndex: this.playQueue.currentIndex
 		};
 	}
 	set state(e) {
-		this.playlist.items = e.items?.map((e) => this.playlist.createItemFromDto(e)) ?? [];
+		this.playQueue.items = e.items?.map((e) => this.playQueue.createItemFromDto(e)) ?? [], this.playQueue.currentIndex = e.currentIndex;
 	}
 	validateState(e) {
-		return $e(Cn, "PlaylistLocalStorageState")(e);
+		return cn(Mn, "PlayQueueDto")(e);
 	}
 };
-U([p.struct], wn.prototype, "state", null);
-var $ = class {
-	playQueue;
+W([I.struct], Nn.prototype, "state", null);
+var X = class {
+	interacted = !1;
 	localStorageState;
 	items = [];
-	constructor(e) {
-		this.playQueue = e, m(this), this.localStorageState = new wn(this);
+	currentId;
+	constructor() {
+		L(this), this.localStorageState = new Nn(this);
 	}
 	createItemFromDto(e) {
-		return Q.fromDto(this.playQueue, this, {
+		return Y.fromDto(this, {
 			url: e.url,
 			type: e.type,
 			videoId: e.videoId,
@@ -2069,9 +1997,36 @@ var $ = class {
 	get isEmpty() {
 		return this.items.length === 0;
 	}
+	get canClear() {
+		return !this.isEmpty;
+	}
+	get currentItem() {
+		return this.items.find((e) => e.id === this.currentId);
+	}
+	get canPlay() {
+		return this.currentItem !== void 0;
+	}
+	get canPause() {
+		return this.currentItem !== void 0;
+	}
 	get hasMultipleItems() {
 		return this.items.length > 1;
 	}
+	get currentIndex() {
+		return this.currentId === void 0 ? void 0 : this.items.findIndex((e) => e.id === this.currentId);
+	}
+	set currentIndex(e) {
+		this.currentId = e === void 0 ? void 0 : this.items.at(e)?.id;
+	}
+	get hasPreviousItem() {
+		return this.hasMultipleItems && this.currentIndex !== void 0 && this.currentIndex > 0;
+	}
+	get hasNextItem() {
+		return this.hasMultipleItems && this.currentIndex !== void 0 && this.currentIndex < this.items.length - 1;
+	}
+	get isLastItem() {
+		return this.currentIndex !== void 0 && this.currentIndex === this.items.length - 1;
+	}
 	get selectedItems() {
 		return this.items.filter((e) => e.isSelected);
 	}
@@ -2096,27 +2051,67 @@ var $ = class {
 	setItems(e) {
 		this.items = e;
 	}
+	interact() {
+		this.interacted = !0;
+	}
+	clear() {
+		this.interact(), this.currentIndex = void 0, this.items = [];
+	}
 	unselectAll() {
 		for (let e of this.items) e.unselect();
 	}
 	selectAll() {
 		for (let e of this.items) e.select();
 	}
-	async playSelectedItemsNext() {
-		await this.playQueue.playNext(this.selectedItemsOrAllItems.map((e) => this.playQueue.createItemFromDto(e.dto))), this.unselectAll();
+	setCurrentItem(e) {
+		this.interact(), this.currentId = e?.id;
 	}
-	async addSelectedItems() {
-		await this.playQueue.addItems(this.selectedItemsOrAllItems.map((e) => this.playQueue.createItemFromDto(e.dto))), this.unselectAll();
+	setNextItems(e) {
+		this.currentIndex !== void 0 && this.items.splice(this.currentIndex + 1, 0, ...e);
+	}
+	clearAndSetItems(e) {
+		this.clear(), this.setCurrentItem(e[0]), this.setNextItems(e);
+	}
+	async playNext(e) {
+		if (this.isEmpty) {
+			this.clearAndSetItems(e);
+			return;
+		}
+		this.setNextItems(e);
+	}
+	async playSelectedItemsNext() {
+		await this.playNext(this.selectedItemsOrAllItems.map((e) => e.clone())), this.unselectAll();
 	}
 	async addItems(e) {
+		if (this.isEmpty) {
+			this.clearAndSetItems(e);
+			return;
+		}
 		this.items.push(...e);
 	}
+	async addSelectedItems() {
+		await this.addItems(this.selectedItemsOrAllItems.map((e) => e.clone())), this.unselectAll();
+	}
+	async playFirst(e) {
+		if (this.isEmpty) {
+			this.clearAndSetItems(e);
+			return;
+		}
+		let { currentIndex: t } = this;
+		t !== void 0 && (this.interact(), this.items.splice(t, 0, ...e), this.currentIndex = t);
+	}
 	moveItem(e, t) {
 		let n = this.items.splice(this.items.indexOf(e), 1)[0];
 		this.items.splice(t, 0, n);
 	}
+	async goToFirst() {
+		this.currentIndex !== void 0 && (this.currentIndex = 0);
+	}
 	async removeItems(e) {
-		re(this.items, ...e);
+		let { currentItem: t } = this;
+		z(this.items, ...e.filter((e) => e !== t));
+		let { currentIndex: n, isLastItem: r } = this;
+		z(this.items, e.find((e) => e === t)), this.currentItem !== t && (this.interact(), r ? await this.goToFirst() : this.currentIndex = n);
 	}
 	async removeSelectedItems() {
 		await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
@@ -2129,145 +2124,150 @@ var $ = class {
 		let t = this.items.indexOf(e);
 		return this.removeItems(this.items.filter((e, n) => n < t));
 	}
+	async previous() {
+		this.currentIndex !== void 0 && this.hasPreviousItem && (this.interact(), this.currentIndex--);
+	}
+	async next() {
+		this.currentIndex !== void 0 && this.hasNextItem && (this.interact(), this.currentIndex++);
+	}
 	addItemFromDto(e) {
 		let t = this.createItemFromDto(e);
 		return this.addItems([t]);
 	}
-	playAll() {
-		return this.playQueue.clearAndSetItems(this.items.map((e) => this.playQueue.createItemFromDto(e.dto))), Promise.resolve();
+};
+W([R], X.prototype, "interacted", void 0), W([R], X.prototype, "items", void 0), W([R], X.prototype, "currentId", void 0), W([I], X.prototype, "isEmpty", null), W([I], X.prototype, "canClear", null), W([I], X.prototype, "currentItem", null), W([I], X.prototype, "canPlay", null), W([I], X.prototype, "canPause", null), W([I], X.prototype, "hasMultipleItems", null), W([I], X.prototype, "currentIndex", null), W([I], X.prototype, "hasPreviousItem", null), W([I], X.prototype, "hasNextItem", null), W([I], X.prototype, "isLastItem", null), W([I], X.prototype, "selectedItems", null), W([I], X.prototype, "allItemsSelected", null), W([I], X.prototype, "hasSelectedItems", null), W([I], X.prototype, "selectedItemsOrAllItems", null), W([I], X.prototype, "canAddSelectedItems", null), W([I], X.prototype, "canPlaySelectedItemsNext", null), W([I], X.prototype, "canRemoveSelectedItems", null), W([F.bound], X.prototype, "setItems", null), W([F.bound], X.prototype, "interact", null), W([F.bound], X.prototype, "clear", null), W([F.bound], X.prototype, "unselectAll", null), W([F.bound], X.prototype, "selectAll", null), W([F.bound], X.prototype, "setCurrentItem", null), W([F.bound], X.prototype, "setNextItems", null), W([F.bound], X.prototype, "clearAndSetItems", null), W([F.bound], X.prototype, "playNext", null), W([F.bound], X.prototype, "playSelectedItemsNext", null), W([F.bound], X.prototype, "addItems", null), W([F.bound], X.prototype, "addSelectedItems", null), W([F.bound], X.prototype, "playFirst", null), W([F.bound], X.prototype, "moveItem", null), W([F.bound], X.prototype, "goToFirst", null), W([F.bound], X.prototype, "removeItems", null), W([F.bound], X.prototype, "removeSelectedItems", null), W([F.bound], X.prototype, "removeOtherItems", null), W([F.bound], X.prototype, "removeItemsAbove", null), W([F.bound], X.prototype, "previous", null), W([F.bound], X.prototype, "next", null), W([F.bound], X.prototype, "addItemFromDto", null);
+//#endregion
+//#region src/features/media-player/providers/PlayQueueProvider.tsx
+var Pn = ({ children: e }) => {
+	let [t] = c(() => new X());
+	B(dn.playQueue, t.localStorageState);
+	let n = N();
+	return i(() => Ke(() => t.currentItem, async (e, t) => {
+		e === void 0 || t === void 0 || e.type === t.type && e.videoId === t.videoId && await n.setCurrentTime(0);
+	}), [t, n]), /* @__PURE__ */ j(yt.Provider, {
+		value: t,
+		children: e
+	});
+}, Z = class {
+	controller = Ue;
+	playing = !1;
+	percent = 0;
+	seeking = !1;
+	constructor() {
+		L(this);
+	}
+	setPlaying(e) {
+		this.playing = e;
+	}
+	setPercent(e) {
+		this.percent = e;
+	}
+	setSeeking(e) {
+		this.seeking = e;
+	}
+	onControllerChange(e) {
+		this.controller = e;
+	}
+	onPlay() {
+		this.playing = !0;
+	}
+	onPause() {
+		this.playing = !1;
+	}
+	onEnded() {
+		this.playing = !1;
+	}
+	onTimeUpdate({ percent: e }) {
+		e !== void 0 && (this.seeking || (this.percent = e));
 	}
 };
-U([h], $.prototype, "items", void 0), U([p], $.prototype, "isEmpty", null), U([p], $.prototype, "hasMultipleItems", null), U([p], $.prototype, "selectedItems", null), U([p], $.prototype, "allItemsSelected", null), U([p], $.prototype, "hasSelectedItems", null), U([p], $.prototype, "selectedItemsOrAllItems", null), U([p], $.prototype, "canAddSelectedItems", null), U([p], $.prototype, "canPlaySelectedItemsNext", null), U([p], $.prototype, "canRemoveSelectedItems", null), U([f.bound], $.prototype, "setItems", null), U([f.bound], $.prototype, "unselectAll", null), U([f.bound], $.prototype, "selectAll", null), U([f.bound], $.prototype, "playSelectedItemsNext", null), U([f.bound], $.prototype, "addSelectedItems", null), U([f.bound], $.prototype, "addItems", null), U([f.bound], $.prototype, "moveItem", null), U([f.bound], $.prototype, "removeItems", null), U([f.bound], $.prototype, "removeSelectedItems", null), U([f.bound], $.prototype, "removeOtherItems", null), U([f.bound], $.prototype, "removeItemsAbove", null), U([f.bound], $.prototype, "addItemFromDto", null), U([f.bound], $.prototype, "playAll", null);
+W([R], Z.prototype, "controller", void 0), W([R], Z.prototype, "playing", void 0), W([R], Z.prototype, "percent", void 0), W([R], Z.prototype, "seeking", void 0), W([F.bound], Z.prototype, "setPlaying", null), W([F.bound], Z.prototype, "setPercent", null), W([F.bound], Z.prototype, "setSeeking", null), W([F.bound], Z.prototype, "onControllerChange", null), W([F.bound], Z.prototype, "onPlay", null), W([F.bound], Z.prototype, "onPause", null), W([F.bound], Z.prototype, "onEnded", null), W([F.bound], Z.prototype, "onTimeUpdate", null);
 //#endregion
-//#region src/features/media-player.playlists/pages/PlaylistDetailsPage.tsx
-var Tn = ({ onClick: e }) => /* @__PURE__ */ t(_, {
-	onClick: e,
-	iconType: L,
-	fill: !0,
-	children: "Play all"
-}), En = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
-	onClick: () => R.show(Sn, { playlistListItem: e }).then(n),
-	iconType: He,
-	children: "Rename"
-}), Dn = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
-	onClick: () => R.show(ln, { playlistListItem: e }).then(n),
-	iconType: Fe,
-	children: "Delete"
-}), On = N(({ playlistListItem: r }) => {
-	let i = B.playlist(r.id), o = G(), [s] = d(() => new $(o));
-	ne(i, s.localStorageState);
-	let c = Je(), l = a(async (e) => {
-		await r.rename(e);
-	}, [r]), u = a(async () => {
-		await c.navigate({ to: "/playlists" }), window.localStorage.removeItem(i), await r.remove();
-	}, [
-		r,
-		c,
-		i
-	]);
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(sn, {
-		pageTitle: r.name,
-		breadcrumbs: [{
-			text: "Playlists",
-			linkProps: { to: "/playlists" }
-		}, { text: r.name }],
-		rightSideItems: [
-			/* @__PURE__ */ t(Tn, { onClick: s.playAll }),
-			/* @__PURE__ */ t(En, {
-				playlistListItem: r,
-				onFulfilled: l
-			}),
-			/* @__PURE__ */ t(Dn, {
-				playlistListItem: r,
-				onFulfilled: u
-			})
-		]
-	}), /* @__PURE__ */ t(xn, { playlist: s })] });
-}), kn = R.create(({ remove: e, resolve: r }) => {
-	let i = De({ prefix: "modalForm" }), [a, o] = d(""), [s, c] = d(!1);
-	return /* @__PURE__ */ n(pe, {
-		onClose: e,
-		initialFocus: "[name=name]",
-		children: [
-			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Create playlist" }) }),
-			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ t(de, {
-				id: i,
-				component: "form",
-				onSubmit: async (t) => {
-					t.preventDefault();
-					try {
-						c(!0), r(a), e();
-					} finally {
-						c(!1);
-					}
-				},
-				children: /* @__PURE__ */ t(T, {
-					label: "Name",
-					children: /* @__PURE__ */ t(S, {
-						name: "name",
-						value: a,
-						onChange: (e) => o(e.target.value)
-					})
-				})
-			}) }),
-			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
-				onClick: e,
-				children: "Cancel"
-			}), /* @__PURE__ */ t(_, {
-				type: "submit",
-				form: i,
-				fill: !0,
-				disabled: a.trim().length === 0,
-				isLoading: s,
-				children: "Create playlist"
-			})] })
-		]
+//#region src/features/media-player/providers/PlayerProvider.tsx
+var Fn = ({ children: e }) => {
+	let [t] = c(() => new Z());
+	return /* @__PURE__ */ j(En.Provider, {
+		value: t,
+		children: e
 	});
-}), An = ({ children: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
-	onClick: () => R.show(kn).then(n),
-	iconType: P,
-	fill: !0,
-	children: e
-}), jn = ({ linkProps: e, ...n }) => {
-	let r = Je(), i = async (t) => {
-		t.preventDefault(), await r.navigate(e);
-	};
-	return /* @__PURE__ */ t(fe, {
-		...n,
-		href: r.buildLocation(e).href,
-		onClick: i
+}, Q = class {
+	playlistList;
+	id;
+	name;
+	constructor(e, t, n) {
+		this.playlistList = e, L(this), this.id = t, this.name = n;
+	}
+	async rename(e) {
+		this.name = e;
+	}
+	remove() {
+		return this.playlistList.removeItem(this);
+	}
+};
+W([R], Q.prototype, "id", void 0), W([R], Q.prototype, "name", void 0), W([F.bound], Q.prototype, "rename", null), W([F.bound], Q.prototype, "remove", null);
+//#endregion
+//#region src/features/media-player/stores/PlaylistListStore.ts
+var In = class {
+	playlistList;
+	constructor(e) {
+		this.playlistList = e, L(this);
+	}
+	get state() {
+		return { items: this.playlistList.items.map((e) => ({
+			id: e.id,
+			name: e.name
+		})) };
+	}
+	set state(e) {
+		this.playlistList.items = e.items?.map((e) => new Q(this.playlistList, e.id, e.name)) ?? [];
+	}
+	validateState(e) {
+		return !0;
+	}
+};
+W([I.struct], In.prototype, "state", null);
+var $ = class {
+	localStorageState;
+	items = [];
+	constructor() {
+		L(this), this.localStorageState = new In(this);
+	}
+	createItem(e) {
+		return new Q(this, crypto.randomUUID(), e);
+	}
+	setItems(e) {
+		this.items = e;
+	}
+	async addItem(e) {
+		this.items.push(e);
+	}
+	async removeItem(e) {
+		z(this.items, e);
+	}
+};
+W([R], $.prototype, "items", void 0), W([F.bound], $.prototype, "setItems", null), W([F.bound], $.prototype, "addItem", null), W([F.bound], $.prototype, "removeItem", null);
+//#endregion
+//#region src/features/media-player/providers/PlaylistListProvider.tsx
+var Ln = ({ children: e }) => {
+	let [t] = c(() => new $());
+	return B(dn.playlistList, t.localStorageState), /* @__PURE__ */ j(Vt.Provider, {
+		value: t,
+		children: e
 	});
-}, Mn = N(({ playlistList: e }) => /* @__PURE__ */ t(Se, { children: /* @__PURE__ */ t(A, { children: "Name" }) })), Nn = N(({ item: e }) => /* @__PURE__ */ t(Te, { children: /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(jn, {
-	linkProps: {
-		to: "/playlists/$playlistId",
-		params: { playlistId: e.id }
-	},
-	children: e.name
-}) }) }, e.id)), Pn = N(({ playlistList: e }) => /* @__PURE__ */ t(qe, {
-	tag: "tbody",
-	list: e.items,
-	setList: (t) => e.setItems(t),
-	children: e.items.map((e) => /* @__PURE__ */ t(Nn, { item: e }, e.id))
-})), Fn = N(({ playlistList: e }) => /* @__PURE__ */ n(xe, { children: [/* @__PURE__ */ t(Mn, { playlistList: e }), /* @__PURE__ */ t(Pn, { playlistList: e })] })), In = () => /* @__PURE__ */ t(sn, {
-	pageTitle: "Playlists",
-	breadcrumbs: [{ text: "Playlists" }]
-}), Ln = N(({ playlistList: e }) => {
-	let r = a(async (t) => {
-		await e.addItem(e.createItem(t));
-	}, [e]);
-	return /* @__PURE__ */ n(O.Section, { children: [
-		/* @__PURE__ */ t(An, {
-			onFulfilled: r,
-			children: "New playlist"
-		}),
-		/* @__PURE__ */ t(be, { size: "l" }),
-		/* @__PURE__ */ t(Fn, { playlistList: e })
-	] });
-}), Rn = i(() => {
-	let r = ht();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(In, {}), /* @__PURE__ */ t(Ln, { playlistList: r })] });
+}, Rn = ({ components: e = [], children: t }) => /* @__PURE__ */ j(A, { children: e.reduceRight((e, t) => /* @__PURE__ */ j(t, { children: e }), t) }), zn = ({ children: e, nostalgicDivaProps: t }) => /* @__PURE__ */ j(Be, {
+	...t,
+	children: /* @__PURE__ */ j(Rn, {
+		components: [
+			Fn,
+			Pn,
+			An,
+			jn,
+			Ln
+		],
+		children: e
+	})
 });
 //#endregion
-export { Ut as BottomBar, vt as HydrangeanDivaProvider, bt as MediaPlayerLayout, Wt as MiniPlayer, nt as PlayQueueContext, cn as PlayQueuePage, on as PlayQueueSection, On as PlaylistDetailsPage, mt as PlaylistListContext, Rn as PlaylistListPage, H as RepeatMode, Ye as bottomBarHeight, G as usePlayQueue, ht as usePlaylistList, z as videoServiceIcons };
+export { vt as BottomBar, zn as HydrangeanDivaProvider, St as MediaPlayerLayout, Tt as MiniPlayer, yt as PlayQueueContext, Wt as PlayQueuePage, Bt as PlayQueueSection, hn as PlaylistDetailsPage, Vt as PlaylistListContext, Tn as PlaylistListPage, H as RepeatMode, bt as bottomBarHeight, Ve as findVideoService, U as usePlayQueue, Ht as usePlaylistList, at as videoServiceIcons };
 
 //# sourceMappingURL=index.es.js.map