@aigamo/hydrangean-diva 0.0.1-alpha.68 → 0.0.1-alpha.69

package/dist/index.es.js

@@ -1,18 +1,18 @@
 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, useState as u } from "react";
-import d from "ajv";
-import { action as f, computed as p, makeObservable as m, observable as h, reaction as ee } from "mobx";
-import { useLocalStorageState as g } from "@aigamo/route-sphere";
-import { pull as te } from "lodash-es";
-import { NostalgicDiva as ne, NostalgicDivaProvider as re, findVideoService as ie, nullPlayerController as ae, useNostalgicDiva as _ } from "@aigamo/nostalgic-diva";
-import { EuiBottomBar as oe, EuiButton as v, EuiButtonEmpty as y, EuiButtonIcon as b, EuiCheckbox as x, EuiConfirmModal as se, EuiContextMenu as S, EuiEmptyPrompt as ce, EuiFieldText as le, EuiFlexGroup as C, EuiFlexItem as w, EuiForm as ue, EuiFormRow as T, EuiHideFor as E, EuiIcon as D, EuiLink as de, EuiModal as fe, EuiModalBody as pe, EuiModalFooter as me, EuiModalHeader as he, EuiModalHeaderTitle as ge, EuiPageTemplate as O, EuiPopover as k, EuiRange as _e, EuiShowFor as ve, EuiSpacer as ye, EuiTable as be, EuiTableHeader as xe, EuiTableHeaderCell as A, EuiTableHeaderCellCheckbox as Se, EuiTableHeaderMobile as Ce, EuiTableRow as we, EuiTableRowCell as j, EuiTableRowCellCheckbox as Te, useEuiTheme as M, useGeneratedHtmlId as Ee } from "@elastic/eui";
+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 De, ArrowRepeat1Filled as Oe, ArrowRepeatAllFilled as ke, ArrowRepeatAllOffFilled as Ae, ArrowShuffleFilled as je, ArrowShuffleOffFilled as Me, ArrowUploadRegular as Ne, DeleteRegular as Pe, DismissRegular as F, MoreHorizontalFilled as I, NavigationPlayRegular as Fe, NextFilled as Ie, OpenRegular as Le, PauseFilled as Re, PlayFilled as ze, PlayRegular as L, PreviousFilled as Be, RenameRegular as Ve, SkipBack10Regular as He, SkipForward30Regular as Ue, Speaker2Regular as We, TopSpeedRegular as Ge } from "@fluentui/react-icons";
+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 Ke } from "react-sortablejs";
-import { useRouter as qe } from "@tanstack/react-router";
+import { ReactSortable as qe } from "react-sortablejs";
+import { useRouter as Je } from "@tanstack/react-router";
 //#region src/features/common/helpers/bottomBarHeight.ts
-var Je = 81, z = new Map(Object.entries({
+var Ye = 81, z = new Map(Object.entries({
 	Audio: "",
 	Dailymotion: "https://www.dailymotion.com/favicon.ico",
 	Niconico: "https://www.nicovideo.jp/favicon.ico",
@@ -20,15 +20,15 @@ var Je = 81, z = new Map(Object.entries({
 	Twitch: "https://www.twitch.tv/favicon.ico",
 	Vimeo: "https://vimeo.com/favicon.ico",
 	YouTube: "https://www.youtube.com/favicon.ico"
-})), Ye = ({ components: n = [], children: r }) => /* @__PURE__ */ t(e, { children: n.reduceRight((e, n) => /* @__PURE__ */ t(n, { children: e }), r) }), B = {
+})), 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}`
-}, Xe = r(void 0), V = () => o(Xe), Ze = new d({ coerceTypes: !0 });
-function Qe(e, t) {
+}, Ze = r(void 0), V = () => o(Ze), Qe = new ee({ coerceTypes: !0 });
+function $e(e, t) {
 	let n;
-	if (n = Ze.getSchema(t), n === void 0 && (Ze.addSchema(e, t), n = Ze.getSchema(t)), n === void 0 || n.schema !== e) throw Error(`Invalid schema. Expected: '${JSON.stringify(e)}', but got '${JSON.stringify(n?.schema)}'.`);
+	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
@@ -46,7 +46,7 @@ function U(e, t, n, r) {
 }
 //#endregion
 //#region src/features/media-player.bottom-bar/stores/BottomBarStore.ts
-var $e = {
+var et = {
 	type: "object",
 	properties: {
 		repeat: {
@@ -59,7 +59,7 @@ var $e = {
 			nullable: !0
 		}
 	}
-}, et = class {
+}, tt = class {
 	bottomBar;
 	constructor(e) {
 		this.bottomBar = e, m(this);
@@ -74,10 +74,10 @@ var $e = {
 		this.bottomBar.repeat = e.repeat ?? H.Off, this.bottomBar.shuffle = e.shuffle ?? !1;
 	}
 	validateState(e) {
-		return Qe($e, "BottomBarLocalStorageState")(e);
+		return $e(et, "BottomBarLocalStorageState")(e);
 	}
 };
-U([p.struct], et.prototype, "state", null);
+U([p.struct], tt.prototype, "state", null);
 var W = class {
 	player;
 	playQueue;
@@ -85,7 +85,7 @@ var W = class {
 	repeat = H.Off;
 	shuffle = !1;
 	constructor(e, t) {
-		this.player = e, this.playQueue = t, m(this), this.localStorageState = new et(this);
+		this.player = e, this.playQueue = t, m(this), this.localStorageState = new tt(this);
 	}
 	get controller() {
 		return this.player.controller;
@@ -181,13 +181,13 @@ var W = class {
 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 tt = r(void 0), G = () => o(tt), nt = r(void 0), rt = () => o(nt), it = ({ children: e }) => {
-	let n = rt(), r = G(), [i] = u(() => new W(n, r));
-	return g(B.bottomBar, i.localStorageState), /* @__PURE__ */ t(Xe.Provider, {
+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
 	});
-}, at = r(void 0), ot = () => o(at), K = class {
+}, ot = r(void 0), st = () => o(ot), K = class {
 	player;
 	playQueue;
 	bottomBar;
@@ -241,13 +241,13 @@ var tt = r(void 0), G = () => o(tt), nt = r(void 0), rt = () => o(nt), it = ({ c
 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 st = ({ children: e }) => {
-	let n = rt(), r = G(), i = V(), [a] = u(() => new K(n, r, i));
-	return /* @__PURE__ */ t(at.Provider, {
+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
 	});
-}, ct = {
+}, lt = {
 	type: "object",
 	properties: {
 		url: { type: "string" },
@@ -261,7 +261,7 @@ var st = ({ children: e }) => {
 		"videoId",
 		"title"
 	]
-}, lt = {
+}, ut = {
 	type: "object",
 	properties: {
 		version: {
@@ -280,7 +280,7 @@ var st = ({ children: e }) => {
 		items: {
 			type: "array",
 			nullable: !0,
-			items: ct
+			items: lt
 		},
 		currentIndex: {
 			type: "integer",
@@ -378,7 +378,7 @@ var st = ({ children: e }) => {
 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 ut = class {
+var dt = class {
 	playQueue;
 	constructor(e) {
 		this.playQueue = e, m(this);
@@ -394,17 +394,17 @@ var ut = class {
 		this.playQueue.items = e.items?.map((e) => this.playQueue.createItemFromDto(e)) ?? [], this.playQueue.currentIndex = e.currentIndex;
 	}
 	validateState(e) {
-		return Qe(lt, "PlayQueueDto")(e);
+		return $e(ut, "PlayQueueDto")(e);
 	}
 };
-U([p.struct], ut.prototype, "state", null);
+U([p.struct], dt.prototype, "state", null);
 var J = class {
 	interacted = !1;
 	localStorageState;
 	items = [];
 	currentId;
 	constructor() {
-		m(this), this.localStorageState = new ut(this);
+		m(this), this.localStorageState = new dt(this);
 	}
 	createItemFromDto(e) {
 		return q.fromDto(this, {
@@ -529,9 +529,9 @@ var J = class {
 	}
 	async removeItems(e) {
 		let { currentItem: t } = this;
-		te(this.items, ...e.filter((e) => e !== t));
+		re(this.items, ...e.filter((e) => e !== t));
 		let { currentIndex: n, isLastItem: r } = this;
-		te(this.items, e.find((e) => e === t)), this.currentItem !== t && (this.interact(), r ? await this.goToFirst() : this.currentIndex = n);
+		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();
@@ -558,18 +558,18 @@ var J = class {
 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 dt = ({ children: e }) => {
-	let [n] = u(() => new J());
-	g(B.playQueue, n.localStorageState);
-	let r = _();
-	return s(() => ee(() => n.currentItem, async (e, t) => {
+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(tt.Provider, {
+	}), [n, r]), /* @__PURE__ */ t(nt.Provider, {
 		value: n,
 		children: e
 	});
 }, Y = class {
-	controller = ae;
+	controller = se;
 	playing = !1;
 	percent = 0;
 	seeking = !1;
@@ -604,13 +604,13 @@ var dt = ({ children: 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 ft = ({ children: e }) => {
-	let [n] = u(() => new Y());
-	return /* @__PURE__ */ t(nt.Provider, {
+var pt = ({ children: e }) => {
+	let [n] = d(() => new Y());
+	return /* @__PURE__ */ t(rt.Provider, {
 		value: n,
 		children: e
 	});
-}, pt = r(void 0), mt = () => o(pt), X = class {
+}, mt = r(void 0), ht = () => o(mt), X = class {
 	playlistList;
 	id;
 	name;
@@ -627,7 +627,7 @@ var ft = ({ children: e }) => {
 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 ht = class {
+var gt = class {
 	playlistList;
 	constructor(e) {
 		this.playlistList = e, m(this);
@@ -645,12 +645,12 @@ var ht = class {
 		return !0;
 	}
 };
-U([p.struct], ht.prototype, "state", null);
+U([p.struct], gt.prototype, "state", null);
 var Z = class {
 	localStorageState;
 	items = [];
 	constructor() {
-		m(this), this.localStorageState = new ht(this);
+		m(this), this.localStorageState = new gt(this);
 	}
 	createItem(e) {
 		return new X(this, crypto.randomUUID(), e);
@@ -662,130 +662,130 @@ var Z = class {
 		this.items.push(e);
 	}
 	async removeItem(e) {
-		te(this.items, 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 gt = ({ children: e }) => {
-	let [n] = u(() => new Z());
-	return g(B.playlistList, n.localStorageState), /* @__PURE__ */ t(pt.Provider, {
+var _t = ({ children: e }) => {
+	let [n] = d(() => new Z());
+	return ne(B.playlistList, n.localStorageState), /* @__PURE__ */ t(mt.Provider, {
 		value: n,
 		children: e
 	});
-}, _t = ({ children: e, nostalgicDivaProps: n }) => /* @__PURE__ */ t(re, {
+}, vt = ({ children: e, nostalgicDivaProps: n }) => /* @__PURE__ */ t(ae, {
 	...n,
-	children: /* @__PURE__ */ t(Ye, {
+	children: /* @__PURE__ */ t(Xe, {
 		components: [
+			pt,
 			ft,
-			dt,
-			it,
-			st,
-			gt
+			at,
+			ct,
+			_t
 		],
 		children: e
 	})
-}), vt = {
+}), yt = {
 	width: 400,
 	height: 225
-}, yt = N(({ children: e }) => /* @__PURE__ */ n(O, {
+}, bt = N(({ children: e }) => /* @__PURE__ */ n(O, {
 	panelled: !0,
 	style: { minBlockSize: "max(460px, 100vh - 81px)" },
-	children: [e, !G().isEmpty && /* @__PURE__ */ t(ye, { style: { blockSize: vt.height } })]
-})), bt = N(() => {
+	children: [e, !G().isEmpty && /* @__PURE__ */ t(be, { style: { blockSize: yt.height } })]
+})), xt = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
 		"aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
-		iconType: e.shuffle ? je : Me,
+		iconType: e.shuffle ? Me : Ne,
 		size: "s",
 		iconSize: "l",
 		onClick: e.toggleShuffle,
 		disabled: !e.canToggleShuffle
 	});
-}), xt = N(() => {
+}), St = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Previous",
 		"aria-label": "Previous",
-		iconType: Be,
+		iconType: Ve,
 		size: "s",
 		iconSize: "l",
 		onClick: e.previous,
 		disabled: !e.canPrevious
 	});
-}), St = N(() => {
+}), Ct = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Skip back 10 seconds",
 		"aria-label": "Skip back 10 seconds",
-		iconType: He,
+		iconType: Ue,
 		size: "s",
 		iconSize: "l",
 		onClick: e.skipBack10,
 		disabled: !e.canSkipBack10
 	});
-}), Ct = N(() => {
+}), wt = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Pause",
 		"aria-label": "Pause",
-		iconType: Re,
+		iconType: ze,
 		size: "s",
 		iconSize: "l",
 		onClick: e.pause,
 		disabled: !e.canPause
 	});
-}), wt = N(() => {
+}), Tt = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Play",
 		"aria-label": "Play",
-		iconType: ze,
+		iconType: Be,
 		size: "s",
 		iconSize: "l",
 		onClick: e.play,
 		disabled: !e.canPlay
 	});
-}), Tt = N(() => {
+}), Et = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Skip forward 30 seconds",
 		"aria-label": "Skip forward 30 seconds",
-		iconType: Ue,
+		iconType: We,
 		size: "s",
 		iconSize: "l",
 		onClick: e.skipForward30,
 		disabled: !e.canSkipForward30
 	});
-}), Et = N(() => {
+}), Dt = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		title: "Next",
 		"aria-label": "Next",
-		iconType: Ie,
+		iconType: Le,
 		size: "s",
 		iconSize: "l",
 		onClick: e.next,
 		disabled: !e.canNext
 	});
-}), Dt = {
-	[H.Off]: Ae,
-	[H.All]: ke,
-	[H.One]: Oe
-}, Ot = N(() => {
+}), Ot = {
+	[H.Off]: je,
+	[H.All]: Ae,
+	[H.One]: ke
+}, kt = N(() => {
 	let e = V();
-	return /* @__PURE__ */ t(b, {
+	return /* @__PURE__ */ t(y, {
 		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: Dt[e.repeat],
+		iconType: Ot[e.repeat],
 		size: "s",
 		iconSize: "l",
 		onClick: e.toggleRepeat,
 		disabled: !e.canToggleRepeat
 	});
-}), kt = N(() => {
+}), At = N(() => {
 	let e = V();
 	return /* @__PURE__ */ n(C, {
 		responsive: !1,
@@ -795,26 +795,26 @@ var gt = ({ children: e }) => {
 		children: [
 			/* @__PURE__ */ t(E, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(bt, {})
+				children: /* @__PURE__ */ t(xt, {})
 			}),
-			/* @__PURE__ */ t(xt, {}),
+			/* @__PURE__ */ t(St, {}),
 			/* @__PURE__ */ t(E, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(St, {})
+				children: /* @__PURE__ */ t(Ct, {})
 			}),
-			e.playing ? /* @__PURE__ */ t(Ct, {}) : /* @__PURE__ */ t(wt, {}),
+			e.playing ? /* @__PURE__ */ t(wt, {}) : /* @__PURE__ */ t(Tt, {}),
 			/* @__PURE__ */ t(E, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Tt, {})
+				children: /* @__PURE__ */ t(Et, {})
 			}),
-			/* @__PURE__ */ t(Et, {}),
+			/* @__PURE__ */ t(Dt, {}),
 			/* @__PURE__ */ t(E, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Ot, {})
+				children: /* @__PURE__ */ t(kt, {})
 			})
 		]
 	});
-}), At = i(({ item: e, closePopover: n }) => {
+}), jt = i(({ item: e, closePopover: n }) => {
 	let r = a(({ name: e, icon: t, onClick: r }) => ({
 		name: e,
 		icon: t,
@@ -822,14 +822,14 @@ var gt = ({ children: e }) => {
 			n(), r(e);
 		}
 	}), [n]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
 			items: [
 				r({
 					name: "Open in new tab",
-					icon: /* @__PURE__ */ t(D, { type: Le }),
+					icon: /* @__PURE__ */ t(D, { type: Re }),
 					onClick: async () => {
 						window.open(e.dto.url, "_blank");
 					}
@@ -851,10 +851,10 @@ var gt = ({ children: e }) => {
 			]
 		}], [r, e])
 	});
-}), jt = i(({ item: e }) => {
-	let [n, r] = u(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
+}), 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(y, {
+		button: /* @__PURE__ */ t(v, {
 			iconType: z.get(e.type),
 			size: "s",
 			onClick: i,
@@ -864,37 +864,37 @@ var gt = ({ children: e }) => {
 		closePopover: o,
 		panelPaddingSize: "none",
 		anchorPosition: "upLeft",
-		children: /* @__PURE__ */ t(At, {
+		children: /* @__PURE__ */ t(jt, {
 			item: e,
 			closePopover: o
 		})
 	});
-}), Mt = N(() => {
+}), Nt = N(() => {
 	let e = V();
 	return /* @__PURE__ */ t(C, {
 		responsive: !1,
 		gutterSize: "s",
 		justifyContent: "flexStart",
 		alignItems: "center",
-		children: e.currentItem && /* @__PURE__ */ t(jt, { item: e.currentItem })
+		children: e.currentItem && /* @__PURE__ */ t(Mt, { item: e.currentItem })
 	});
-}), Nt = N(() => /* @__PURE__ */ t(b, {
+}), Pt = N(() => /* @__PURE__ */ t(y, {
 	title: "Mute",
 	"aria-label": "Mute",
-	iconType: We,
+	iconType: Ge,
 	size: "s",
 	iconSize: "l",
 	disabled: !V().controller.supports("setMuted")
-})), Pt = N(({ button: e, isOpen: r, closePopover: i }) => {
-	let o = V(), [s, l] = u("0"), d = _();
+})), Ft = N(({ button: e, isOpen: r, closePopover: i }) => {
+	let o = V(), [s, l] = d("0"), u = g();
 	c(() => {
-		r && d.getVolume().then((e) => {
+		r && u.getVolume().then((e) => {
 			e !== void 0 && l(Math.floor(e * 100).toString());
 		});
-	}, [r, d]);
-	let f = a(async (e) => {
-		l(e.currentTarget.value), await d.setVolume(Number(e.currentTarget.value) / 100);
-	}, [d]);
+	}, [r, u]);
+	let ee = a(async (e) => {
+		l(e.currentTarget.value), await u.setVolume(Number(e.currentTarget.value) / 100);
+	}, [u]);
 	return /* @__PURE__ */ t(k, {
 		button: e,
 		isOpen: r,
@@ -905,24 +905,24 @@ var gt = ({ children: e }) => {
 			gutterSize: "s",
 			justifyContent: "center",
 			alignItems: "center",
-			children: [/* @__PURE__ */ t(Nt, {}), /* @__PURE__ */ t(_e, {
+			children: [/* @__PURE__ */ t(Pt, {}), /* @__PURE__ */ t(ve, {
 				min: 0,
 				max: 100,
 				step: 1,
 				value: s,
-				onChange: f,
+				onChange: ee,
 				css: { blockSize: 32 },
 				disabled: !o.controller.supports("setVolume")
 			})]
 		}) })
 	});
-}), Ft = N(() => {
-	let e = V(), [n, r] = u(!1);
-	return /* @__PURE__ */ t(Pt, {
-		button: /* @__PURE__ */ t(b, {
+}), It = N(() => {
+	let e = V(), [n, r] = d(!1);
+	return /* @__PURE__ */ t(Ft, {
+		button: /* @__PURE__ */ t(y, {
 			title: "Volume",
 			"aria-label": "Volume",
-			iconType: We,
+			iconType: Ge,
 			size: "s",
 			iconSize: "l",
 			onClick: () => r(!n),
@@ -931,15 +931,15 @@ var gt = ({ children: e }) => {
 		isOpen: n,
 		closePopover: () => r(!1)
 	});
-}), It = ({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(b, {
+}), Lt = ({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(y, {
 	title: "Play queue",
 	"aria-label": "Play queue",
-	iconType: Fe,
+	iconType: Ie,
 	size: "s",
 	iconSize: "l",
 	onClick: e
-}), Lt = N(({ closePopover: e }) => {
-	let n = V(), r = _(), [i, o] = u(), s = a(async () => {
+}), 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 }) => ({
 		name: t,
@@ -950,40 +950,40 @@ var gt = ({ children: e }) => {
 		disabled: i,
 		className: a
 	}), [e]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
 			items: [
 				{
 					name: "Speed",
-					icon: /* @__PURE__ */ t(D, { type: Ge }),
+					icon: /* @__PURE__ */ t(D, { type: Ke }),
 					panel: 1,
 					onClick: s,
 					disabled: !n.controller.supports("getPlaybackRate")
 				},
 				c({
 					name: "Skip back 10 seconds",
-					icon: /* @__PURE__ */ t(D, { type: He }),
+					icon: /* @__PURE__ */ t(D, { type: Ue }),
 					onClick: n.skipBack10,
 					disabled: !n.canSkipBack10
 				}),
 				c({
 					name: "Skip forward 30 seconds",
-					icon: /* @__PURE__ */ t(D, { type: Ue }),
+					icon: /* @__PURE__ */ t(D, { type: We }),
 					onClick: n.skipForward30,
 					disabled: !n.canSkipForward30
 				}),
 				c({
 					name: `Shuffle: ${n.shuffle ? "On" : "Off"}`,
-					icon: /* @__PURE__ */ t(D, { type: n.shuffle ? je : Me }),
+					icon: /* @__PURE__ */ t(D, { type: n.shuffle ? Me : Ne }),
 					onClick: n.toggleShuffle,
 					disabled: !n.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: Dt[n.repeat] }),
+					icon: /* @__PURE__ */ t(D, { type: Ot[n.repeat] }),
 					onClick: n.toggleRepeat,
 					disabled: !n.canToggleRepeat,
 					className: "eui-showFor--xs--flex"
@@ -1022,17 +1022,17 @@ var gt = ({ children: e }) => {
 			i
 		])
 	});
-}), Rt = i(({ button: e, isOpen: n, closePopover: r }) => /* @__PURE__ */ t(k, {
+}), zt = i(({ button: e, isOpen: n, closePopover: r }) => /* @__PURE__ */ t(k, {
 	button: e,
 	isOpen: n,
 	closePopover: r,
 	panelPaddingSize: "none",
 	anchorPosition: "upRight",
-	children: /* @__PURE__ */ t(Lt, { closePopover: r })
-})), zt = i(() => {
-	let [e, n] = u(!1);
-	return /* @__PURE__ */ t(Rt, {
-		button: /* @__PURE__ */ t(b, {
+	children: /* @__PURE__ */ t(Rt, { closePopover: r })
+})), Bt = i(() => {
+	let [e, n] = d(!1);
+	return /* @__PURE__ */ t(zt, {
+		button: /* @__PURE__ */ t(y, {
 			title: "More options",
 			"aria-label": "More options",
 			iconType: I,
@@ -1043,18 +1043,18 @@ var gt = ({ children: e }) => {
 		isOpen: e,
 		closePopover: () => n(!1)
 	});
-}), Bt = i(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ n(C, {
+}), Vt = i(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ n(C, {
 	responsive: !1,
 	gutterSize: "s",
 	justifyContent: "flexEnd",
 	alignItems: "center",
 	children: [
-		/* @__PURE__ */ t(Ft, {}),
-		e && /* @__PURE__ */ t(It, { onClickPlayQueueButton: e }),
-		/* @__PURE__ */ t(zt, {})
+		/* @__PURE__ */ t(It, {}),
+		e && /* @__PURE__ */ t(Lt, { onClickPlayQueueButton: e }),
+		/* @__PURE__ */ t(Bt, {})
 	]
-})), Vt = N(() => {
-	let e = V(), n = _(), r = a((t) => {
+})), Ht = N(() => {
+	let e = V(), n = g(), r = a((t) => {
 		let n = Number(t.currentTarget.value) / 100;
 		e.setPercent(n);
 	}, [e]), i = a((t) => {
@@ -1067,7 +1067,7 @@ var gt = ({ children: e }) => {
 			i !== void 0 && await n.setCurrentTime(i * r);
 		}
 	}, [e, n]);
-	return /* @__PURE__ */ t(_e, {
+	return /* @__PURE__ */ t(ve, {
 		min: 0,
 		max: 100,
 		step: 1e-7,
@@ -1080,31 +1080,31 @@ var gt = ({ children: e }) => {
 		css: { blockSize: 32 },
 		disabled: !e.canSeek
 	});
-}), Ht = N(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(oe, {
+}), Ut = N(({ onClickPlayQueueButton: e }) => /* @__PURE__ */ t(ce, {
 	paddingSize: "s",
 	children: /* @__PURE__ */ n(C, {
 		direction: "column",
 		gutterSize: "none",
-		children: [/* @__PURE__ */ t(w, { children: /* @__PURE__ */ t(Vt, {}) }), /* @__PURE__ */ t(w, { children: /* @__PURE__ */ n(C, {
+		children: [/* @__PURE__ */ t(w, { children: /* @__PURE__ */ t(Ht, {}) }), /* @__PURE__ */ t(w, { children: /* @__PURE__ */ n(C, {
 			responsive: !1,
 			children: [
 				/* @__PURE__ */ t(w, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(Mt, {})
+					children: /* @__PURE__ */ t(Nt, {})
 				}),
 				/* @__PURE__ */ t(w, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(kt, {})
+					children: /* @__PURE__ */ t(At, {})
 				}),
 				/* @__PURE__ */ t(w, {
 					css: { width: "calc(100% / 3)" },
-					children: /* @__PURE__ */ t(Bt, { onClickPlayQueueButton: e })
+					children: /* @__PURE__ */ t(Vt, { onClickPlayQueueButton: e })
 				})
 			]
 		}) })]
 	})
-})), Ut = N(() => {
-	let e = ot(), n = l(() => ({
+})), Wt = N(() => {
+	let e = st(), n = l(() => ({
 		onLoaded: e.onLoaded,
 		onPlay: e.onPlay,
 		onPause: e.onPause,
@@ -1116,8 +1116,8 @@ var gt = ({ children: e }) => {
 			position: "fixed",
 			right: 0,
 			bottom: 81,
-			width: vt.width,
-			height: vt.height,
+			width: yt.width,
+			height: yt.height,
 			zIndex: 998,
 			backgroundColor: "rgb(39, 39, 39)",
 			display: "flex",
@@ -1128,7 +1128,7 @@ var gt = ({ children: e }) => {
 				flexGrow: 1,
 				backgroundColor: "black"
 			},
-			children: e.currentItem && /* @__PURE__ */ t(ne, {
+			children: e.currentItem && /* @__PURE__ */ t(ie, {
 				src: e.currentItem.url,
 				options: n,
 				onControllerChange: e.onControllerChange
@@ -1138,26 +1138,26 @@ var gt = ({ children: e }) => {
 });
 //#endregion
 //#region src/features/media-player.play-queue/helpers/isNoembedResult.ts
-function Wt(e) {
+function Gt(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 Gt = R.create(({ remove: e, resolve: r }) => {
-	let i = Ee({ prefix: "modalForm" }), [a, o] = u(""), [s, c] = u(""), [l, d] = u(!1);
-	return /* @__PURE__ */ n(fe, {
+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, {
 		onClose: e,
 		initialFocus: "[name=url]",
 		children: [
-			/* @__PURE__ */ t(he, { children: /* @__PURE__ */ t(ge, { children: "Add video" }) }),
-			/* @__PURE__ */ t(pe, { children: /* @__PURE__ */ n(ue, {
+			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Add video" }) }),
+			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ n(de, {
 				id: i,
 				component: "form",
 				onSubmit: async (t) => {
 					t.preventDefault();
 					try {
-						d(!0);
-						let t = ie(a);
+						u(!0);
+						let t = oe(a);
 						if (t === void 0) return;
 						let n = t.extractVideoId(a);
 						if (n === void 0) return;
@@ -1166,32 +1166,32 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 							url: a,
 							type: t.type,
 							videoId: n,
-							title: s || (Wt(i) ? i.title : n)
+							title: s || (Gt(i) ? i.title : n)
 						}), e();
 					} finally {
-						d(!1);
+						u(!1);
 					}
 				},
 				children: [/* @__PURE__ */ t(T, {
 					label: "URL",
-					children: /* @__PURE__ */ t(le, {
+					children: /* @__PURE__ */ t(S, {
 						name: "url",
 						value: a,
 						onChange: (e) => o(e.target.value)
 					})
 				}), /* @__PURE__ */ t(T, {
 					label: "Title",
-					children: /* @__PURE__ */ t(le, {
+					children: /* @__PURE__ */ t(S, {
 						name: "title",
 						value: s,
 						onChange: (e) => c(e.target.value)
 					})
 				})]
 			}) }),
-			/* @__PURE__ */ n(me, { children: [/* @__PURE__ */ t(y, {
+			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
 				onClick: e,
 				children: "Cancel"
-			}), /* @__PURE__ */ t(v, {
+			}), /* @__PURE__ */ t(_, {
 				type: "submit",
 				form: i,
 				fill: !0,
@@ -1201,17 +1201,17 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			})] })
 		]
 	});
-}), Kt = i(({ onFulfilled: e }) => /* @__PURE__ */ t(v, {
-	onClick: () => R.show(Gt).then(e),
+}), qt = i(({ onFulfilled: e }) => /* @__PURE__ */ t(_, {
+	onClick: () => R.show(Kt).then(e),
 	iconType: P,
 	color: "primary",
 	children: "Add video"
-})), qt = N(({ playQueue: e }) => /* @__PURE__ */ t(v, {
+})), Jt = N(({ playQueue: e }) => /* @__PURE__ */ t(_, {
 	iconType: P,
 	onClick: e.addSelectedItems,
 	disabled: !e.canAddSelectedItems,
 	children: "Add to play queue"
-})), Jt = N(({ playQueue: e, closePopover: n }) => {
+})), Yt = N(({ playQueue: e, closePopover: n }) => {
 	let r = a(({ name: e, icon: t, disabled: r, onClick: i }) => ({
 		name: e,
 		icon: t,
@@ -1220,7 +1220,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			n(), i(e);
 		}
 	}), [n]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
@@ -1245,17 +1245,17 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				}),
 				r({
 					name: "Clear",
-					icon: /* @__PURE__ */ t(D, { type: Pe }),
+					icon: /* @__PURE__ */ t(D, { type: Fe }),
 					onClick: e.clear,
 					disabled: !e.canClear
 				})
 			]
 		}], [r, e])
 	});
-}), Yt = i(({ playQueue: e }) => {
-	let [n, r] = u(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
+}), 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(b, {
+		button: /* @__PURE__ */ t(y, {
 			display: "base",
 			size: "m",
 			iconType: I,
@@ -1265,12 +1265,12 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		closePopover: o,
 		panelPaddingSize: "none",
 		anchorPosition: "downLeft",
-		children: /* @__PURE__ */ t(Jt, {
+		children: /* @__PURE__ */ t(Yt, {
 			playQueue: e,
 			closePopover: o
 		})
 	});
-}), Xt = N(({ playQueue: e }) => {
+}), Zt = N(({ playQueue: e }) => {
 	let { euiTheme: r } = M();
 	return /* @__PURE__ */ n(C, {
 		alignItems: "center",
@@ -1288,7 +1288,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				children: [
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(v, {
+						children: /* @__PURE__ */ t(_, {
 							disabled: !e.canPlaySelectedItemsNext,
 							onClick: e.playSelectedItemsNext,
 							children: "Play next"
@@ -1296,11 +1296,11 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 					}),
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(qt, { playQueue: e })
+						children: /* @__PURE__ */ t(Jt, { playQueue: e })
 					}),
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(v, {
+						children: /* @__PURE__ */ t(_, {
 							iconType: F,
 							onClick: e.removeSelectedItems,
 							disabled: !e.canRemoveSelectedItems,
@@ -1309,8 +1309,8 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 					}),
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(v, {
-							iconType: Pe,
+						children: /* @__PURE__ */ t(_, {
+							iconType: Fe,
 							onClick: e.clear,
 							disabled: !e.canClear,
 							children: "Clear"
@@ -1318,26 +1318,26 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 					})
 				]
 			}),
-			/* @__PURE__ */ t(ve, {
+			/* @__PURE__ */ t(ye, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(Yt, { playQueue: e })
+				children: /* @__PURE__ */ t(Xt, { playQueue: e })
 			}),
 			/* @__PURE__ */ t(w, { grow: !0 }),
 			/* @__PURE__ */ t(w, {
 				grow: !1,
-				children: /* @__PURE__ */ t(Kt, { onFulfilled: e.addItemFromDto })
+				children: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
 			})
 		]
 	});
-}), Zt = N(({ playQueue: r }) => {
+}), Qt = N(({ playQueue: r }) => {
 	let { euiTheme: i } = M();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(C, {
+	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(we, { children: /* @__PURE__ */ t(C, {
 		responsive: !1,
 		justifyContent: "spaceBetween",
 		alignItems: "baseline",
 		children: /* @__PURE__ */ t(w, {
 			grow: !1,
-			children: /* @__PURE__ */ t(x, {
+			children: /* @__PURE__ */ t(b, {
 				id: "",
 				checked: r.allItemsSelected,
 				onChange: (e) => {
@@ -1345,7 +1345,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				}
 			})
 		})
-	}) }), /* @__PURE__ */ n(xe, {
+	}) }), /* @__PURE__ */ n(Se, {
 		style: {
 			position: "sticky",
 			top: 112,
@@ -1353,7 +1353,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			background: i.colors.backgroundBasePlain
 		},
 		children: [
-			/* @__PURE__ */ t(Se, { children: /* @__PURE__ */ t(x, {
+			/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(b, {
 				id: "",
 				checked: r.allItemsSelected,
 				onChange: (e) => {
@@ -1365,7 +1365,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			/* @__PURE__ */ t(A, {})
 		]
 	})] });
-}), Qt = N(({ item: e, closePopover: n }) => {
+}), $t = N(({ item: e, closePopover: n }) => {
 	let r = a(({ name: e, icon: t, disabled: r, onClick: i, className: a }) => ({
 		name: e,
 		icon: t,
@@ -1375,7 +1375,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		},
 		className: a
 	}), [n]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
@@ -1404,13 +1404,13 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				{ isSeparator: !0 },
 				r({
 					name: "Move to the top",
-					icon: /* @__PURE__ */ t(D, { type: Ne }),
+					icon: /* @__PURE__ */ t(D, { type: Pe }),
 					onClick: e.moveToTop,
 					disabled: !e.canMoveToTop
 				}),
 				r({
 					name: "Move to the bottom",
-					icon: /* @__PURE__ */ t(D, { type: De }),
+					icon: /* @__PURE__ */ t(D, { type: Oe }),
 					onClick: e.moveToBottom,
 					disabled: !e.canMoveToBottom
 				}),
@@ -1436,10 +1436,10 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			]
 		}], [r, e])
 	});
-}), $t = i(({ item: e }) => {
-	let [n, r] = u(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
+}), 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(b, {
+		button: /* @__PURE__ */ t(y, {
 			title: "More options",
 			"aria-label": "More options",
 			iconType: I,
@@ -1451,78 +1451,87 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		closePopover: o,
 		panelPaddingSize: "none",
 		anchorPosition: "leftCenter",
-		children: /* @__PURE__ */ t(Qt, {
+		children: /* @__PURE__ */ t($t, {
 			item: e,
 			closePopover: o
 		})
 	});
-}), en = N(({ item: e }) => {
-	let r = _();
+}), tn = N(({ item: e }) => {
+	let r = g();
 	return /* @__PURE__ */ n(j, {
 		textOnly: !1,
 		hasActions: !0,
 		align: "right",
 		children: [/* @__PURE__ */ n(E, {
 			sizes: ["xs"],
-			children: [/* @__PURE__ */ t(v, {
+			children: [/* @__PURE__ */ t(_, {
 				iconType: L,
 				size: "s",
 				onClick: async () => {
 					e.isCurrent ? await r.setCurrentTime(0) : await e.play();
 				},
 				children: "Play"
-			}), /* @__PURE__ */ t(v, {
+			}), /* @__PURE__ */ t(_, {
 				iconType: F,
 				size: "s",
 				onClick: e.remove,
 				children: "Remove"
 			})]
-		}), /* @__PURE__ */ t($t, { item: e })]
+		}), /* @__PURE__ */ t(en, { item: e })]
 	});
-}), tn = N(({ item: e }) => /* @__PURE__ */ n(we, {
-	isSelected: e.isCurrent,
-	hasSelection: !0,
-	hasActions: !0,
-	children: [
-		/* @__PURE__ */ t(Te, { children: /* @__PURE__ */ t(x, {
-			id: e.id.toString(),
-			checked: e.isSelected,
-			onChange: e.toggleSelected
-		}) }),
-		/* @__PURE__ */ t(j, {
-			textOnly: !1,
-			children: /* @__PURE__ */ t("img", {
-				src: z.get(e.type),
-				width: 16,
-				height: 16,
-				alt: e.type
-			})
-		}),
-		/* @__PURE__ */ t(j, {
-			mobileOptions: {
-				header: !1,
-				enlarge: !0,
-				width: "100%"
-			},
-			children: /* @__PURE__ */ t(de, {
-				href: e.url,
-				target: "_blank",
-				external: !0,
-				children: e.title
-			})
-		}),
-		/* @__PURE__ */ t(en, { item: e })
-	]
-})), nn = N(({ playQueue: e }) => /* @__PURE__ */ t(Ke, {
+}), nn = N(({ item: e }) => {
+	let r = u(null), { isCurrent: i } = e;
+	return s(() => {
+		i && r.current?.closest("tr")?.scrollIntoView({
+			behavior: "smooth",
+			block: "center"
+		});
+	}, [i]), /* @__PURE__ */ n(Te, {
+		isSelected: e.isCurrent,
+		hasSelection: !0,
+		hasActions: !0,
+		children: [
+			/* @__PURE__ */ t(Ee, { children: /* @__PURE__ */ t(b, {
+				id: e.id.toString(),
+				checked: e.isSelected,
+				onChange: e.toggleSelected
+			}) }),
+			/* @__PURE__ */ t(j, {
+				textOnly: !1,
+				children: /* @__PURE__ */ t("img", {
+					ref: r,
+					src: z.get(e.type),
+					width: 16,
+					height: 16,
+					alt: e.type
+				})
+			}),
+			/* @__PURE__ */ t(j, {
+				mobileOptions: {
+					header: !1,
+					enlarge: !0,
+					width: "100%"
+				},
+				children: /* @__PURE__ */ t(fe, {
+					href: e.url,
+					target: "_blank",
+					external: !0,
+					children: e.title
+				})
+			}),
+			/* @__PURE__ */ t(tn, { item: e })
+		]
+	});
+}), rn = N(({ playQueue: e }) => /* @__PURE__ */ t(qe, {
 	tag: "tbody",
 	list: e.items,
 	setList: (t) => e.setItems(t),
-	children: e.items.map((e) => /* @__PURE__ */ t(tn, { item: e }, e.id))
-})), rn = N(({ playQueue: e }) => /* @__PURE__ */ n(be, { children: [/* @__PURE__ */ t(Zt, { playQueue: e }), /* @__PURE__ */ t(nn, { playQueue: e })] })), an = N(({ playQueue: e }) => {
+	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(Xt, { playQueue: e }),
-		/* @__PURE__ */ t(ye, {
+		/* @__PURE__ */ t(Zt, { playQueue: e }),
+		/* @__PURE__ */ t(be, {
 			size: "l",
 			style: {
 				position: "sticky",
@@ -1531,14 +1540,14 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				background: r.colors.backgroundBasePlain
 			}
 		}),
-		e.isEmpty ? /* @__PURE__ */ t(ce, {
+		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(Kt, { onFulfilled: e.addItemFromDto })
-		}) : /* @__PURE__ */ t(rn, { playQueue: e })
+			actions: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
+		}) : /* @__PURE__ */ t(an, { playQueue: e })
 	] });
-}), on = ({ breadcrumbs: e, tabs: n, ...r }) => {
-	let i = qe();
+}), sn = ({ breadcrumbs: e, tabs: n, ...r }) => {
+	let i = Je();
 	return /* @__PURE__ */ t(O.Header, {
 		...r,
 		breadcrumbs: e?.map(({ linkProps: e, ...t }) => ({
@@ -1556,15 +1565,15 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			}
 		}))
 	});
-}, sn = () => {
+}, cn = () => {
 	let r = G();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(on, {
+	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(sn, {
 		pageTitle: "Play queue",
 		rightSideItems: []
-	}), /* @__PURE__ */ t(an, { playQueue: r })] });
-}, cn = R.create(({ remove: e, resolve: r, playlistListItem: i }) => {
-	let [o, s] = u(!1);
-	return /* @__PURE__ */ t(se, {
+	}), /* @__PURE__ */ t(on, { playQueue: r })] });
+}, ln = R.create(({ remove: e, resolve: r, playlistListItem: i }) => {
+	let [o, s] = d(!1);
+	return /* @__PURE__ */ t(le, {
 		title: "Delete playlist permanently?",
 		onCancel: e,
 		onConfirm: a(async () => {
@@ -1584,12 +1593,12 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			"', you won't be able to recover it."
 		] })
 	});
-}), ln = N(({ playlist: e }) => /* @__PURE__ */ t(v, {
+}), un = N(({ playlist: e }) => /* @__PURE__ */ t(_, {
 	iconType: P,
 	onClick: e.addSelectedItems,
 	disabled: !e.canAddSelectedItems,
 	children: "Add to play queue"
-})), un = N(({ playlist: e, closePopover: n }) => {
+})), dn = N(({ playlist: e, closePopover: n }) => {
 	let r = a(({ name: e, icon: t, disabled: r, onClick: i }) => ({
 		name: e,
 		icon: t,
@@ -1598,7 +1607,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			n(), i(e);
 		}
 	}), [n]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
@@ -1624,10 +1633,10 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			]
 		}], [r, e])
 	});
-}), dn = i(({ playlist: e }) => {
-	let [n, r] = u(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
+}), 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(b, {
+		button: /* @__PURE__ */ t(y, {
 			display: "base",
 			size: "m",
 			iconType: I,
@@ -1637,12 +1646,12 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		closePopover: o,
 		panelPaddingSize: "none",
 		anchorPosition: "downLeft",
-		children: /* @__PURE__ */ t(un, {
+		children: /* @__PURE__ */ t(dn, {
 			playlist: e,
 			closePopover: o
 		})
 	});
-}), fn = N(({ playlist: e }) => {
+}), pn = N(({ playlist: e }) => {
 	let { euiTheme: r } = M();
 	return /* @__PURE__ */ n(C, {
 		alignItems: "center",
@@ -1660,7 +1669,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				children: [
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(v, {
+						children: /* @__PURE__ */ t(_, {
 							disabled: !e.canPlaySelectedItemsNext,
 							onClick: e.playSelectedItemsNext,
 							children: "Play next"
@@ -1668,11 +1677,11 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 					}),
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(ln, { playlist: e })
+						children: /* @__PURE__ */ t(un, { playlist: e })
 					}),
 					/* @__PURE__ */ t(w, {
 						grow: !1,
-						children: /* @__PURE__ */ t(v, {
+						children: /* @__PURE__ */ t(_, {
 							iconType: F,
 							onClick: e.removeSelectedItems,
 							disabled: !e.canRemoveSelectedItems,
@@ -1681,24 +1690,24 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 					})
 				]
 			}),
-			/* @__PURE__ */ t(ve, {
+			/* @__PURE__ */ t(ye, {
 				sizes: ["xs"],
-				children: /* @__PURE__ */ t(dn, { playlist: e })
+				children: /* @__PURE__ */ t(fn, { playlist: e })
 			}),
 			/* @__PURE__ */ t(w, { grow: !0 }),
 			/* @__PURE__ */ t(w, {
 				grow: !1,
-				children: /* @__PURE__ */ t(Kt, { onFulfilled: e.addItemFromDto })
+				children: /* @__PURE__ */ t(qt, { onFulfilled: e.addItemFromDto })
 			})
 		]
 	});
-}), pn = N(({ playlist: r }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(C, {
+}), mn = N(({ playlist: r }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(we, { children: /* @__PURE__ */ t(C, {
 	responsive: !1,
 	justifyContent: "spaceBetween",
 	alignItems: "baseline",
 	children: /* @__PURE__ */ t(w, {
 		grow: !1,
-		children: /* @__PURE__ */ t(x, {
+		children: /* @__PURE__ */ t(b, {
 			id: "",
 			checked: r.allItemsSelected,
 			onChange: (e) => {
@@ -1706,8 +1715,8 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			}
 		})
 	})
-}) }), /* @__PURE__ */ n(xe, { children: [
-	/* @__PURE__ */ t(Se, { children: /* @__PURE__ */ t(x, {
+}) }), /* @__PURE__ */ n(Se, { children: [
+	/* @__PURE__ */ t(Ce, { children: /* @__PURE__ */ t(b, {
 		id: "",
 		checked: r.allItemsSelected,
 		onChange: (e) => {
@@ -1717,7 +1726,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 	/* @__PURE__ */ t(A, { width: 24 }),
 	/* @__PURE__ */ t(A, { children: "Title" }),
 	/* @__PURE__ */ t(A, {})
-] })] })), mn = i(({ item: e, closePopover: n }) => {
+] })] })), hn = i(({ item: e, closePopover: n }) => {
 	let r = a(({ name: e, icon: t, disabled: r, onClick: i, className: a }) => ({
 		name: e,
 		icon: t,
@@ -1727,7 +1736,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		},
 		className: a
 	}), [n]);
-	return /* @__PURE__ */ t(S, {
+	return /* @__PURE__ */ t(x, {
 		initialPanelId: 0,
 		panels: l(() => [{
 			id: 0,
@@ -1756,13 +1765,13 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				{ isSeparator: !0 },
 				r({
 					name: "Move to the top",
-					icon: /* @__PURE__ */ t(D, { type: Ne }),
+					icon: /* @__PURE__ */ t(D, { type: Pe }),
 					onClick: e.moveToTop,
 					disabled: !e.canMoveToTop
 				}),
 				r({
 					name: "Move to the bottom",
-					icon: /* @__PURE__ */ t(D, { type: De }),
+					icon: /* @__PURE__ */ t(D, { type: Oe }),
 					onClick: e.moveToBottom,
 					disabled: !e.canMoveToBottom
 				}),
@@ -1788,10 +1797,10 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 			]
 		}], [r, e])
 	});
-}), hn = i(({ item: e }) => {
-	let [n, r] = u(!1), i = a(() => r(!n), [n]), o = a(() => r(!1), []);
+}), 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(b, {
+		button: /* @__PURE__ */ t(y, {
 			title: "More options",
 			"aria-label": "More options",
 			iconType: I,
@@ -1803,35 +1812,35 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 		closePopover: o,
 		panelPaddingSize: "none",
 		anchorPosition: "leftCenter",
-		children: /* @__PURE__ */ t(mn, {
+		children: /* @__PURE__ */ t(hn, {
 			item: e,
 			closePopover: o
 		})
 	});
-}), gn = N(({ item: e }) => /* @__PURE__ */ n(j, {
+}), _n = N(({ item: e }) => /* @__PURE__ */ n(j, {
 	textOnly: !1,
 	hasActions: !0,
 	align: "right",
 	children: [/* @__PURE__ */ n(E, {
 		sizes: ["xs"],
-		children: [/* @__PURE__ */ t(v, {
+		children: [/* @__PURE__ */ t(_, {
 			iconType: L,
 			size: "s",
 			onClick: e.play,
 			children: "Play"
-		}), /* @__PURE__ */ t(v, {
+		}), /* @__PURE__ */ t(_, {
 			iconType: F,
 			size: "s",
 			onClick: e.remove,
 			children: "Remove"
 		})]
-	}), /* @__PURE__ */ t(hn, { item: e })]
-})), _n = N(({ item: e }) => /* @__PURE__ */ n(we, {
+	}), /* @__PURE__ */ t(gn, { item: e })]
+})), vn = N(({ item: e }) => /* @__PURE__ */ n(Te, {
 	isSelected: e.isCurrent,
 	hasSelection: !0,
 	hasActions: !0,
 	children: [
-		/* @__PURE__ */ t(Te, { children: /* @__PURE__ */ t(x, {
+		/* @__PURE__ */ t(Ee, { children: /* @__PURE__ */ t(b, {
 			id: e.id.toString(),
 			checked: e.isSelected,
 			onChange: e.toggleSelected
@@ -1851,25 +1860,25 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				enlarge: !0,
 				width: "100%"
 			},
-			children: /* @__PURE__ */ t(de, {
+			children: /* @__PURE__ */ t(fe, {
 				href: e.url,
 				target: "_blank",
 				external: !0,
 				children: e.title
 			})
 		}),
-		/* @__PURE__ */ t(gn, { item: e })
+		/* @__PURE__ */ t(_n, { item: e })
 	]
-})), vn = N(({ playlist: e }) => /* @__PURE__ */ t(Ke, {
+})), yn = N(({ playlist: e }) => /* @__PURE__ */ t(qe, {
 	tag: "tbody",
 	list: e.items,
 	setList: (t) => e.setItems(t),
-	children: e.items.map((e) => /* @__PURE__ */ t(_n, { item: e }, e.id))
-})), yn = N(({ playlist: e }) => /* @__PURE__ */ n(be, { children: [/* @__PURE__ */ t(pn, { playlist: e }), /* @__PURE__ */ t(vn, { playlist: e })] })), bn = N(({ playlist: r }) => {
+	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(fn, { playlist: r }),
-		/* @__PURE__ */ t(ye, {
+		/* @__PURE__ */ t(pn, { playlist: r }),
+		/* @__PURE__ */ t(be, {
 			size: "l",
 			style: {
 				position: "sticky",
@@ -1878,16 +1887,16 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				background: i.colors.backgroundBasePlain
 			}
 		}),
-		r.isEmpty ? /* @__PURE__ */ t(e, {}) : /* @__PURE__ */ t(yn, { playlist: r })
+		r.isEmpty ? /* @__PURE__ */ t(e, {}) : /* @__PURE__ */ t(bn, { playlist: r })
 	] });
-}), xn = R.create(({ remove: e, resolve: r, playlistListItem: i }) => {
-	let a = Ee({ prefix: "modalForm" }), [o, s] = u(i.name), [c, l] = u(!1);
-	return /* @__PURE__ */ n(fe, {
+}), 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, {
 		onClose: e,
 		initialFocus: "[name=name]",
 		children: [
-			/* @__PURE__ */ t(he, { children: /* @__PURE__ */ t(ge, { children: "Rename playlist" }) }),
-			/* @__PURE__ */ t(pe, { children: /* @__PURE__ */ t(ue, {
+			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Rename playlist" }) }),
+			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ t(de, {
 				id: a,
 				component: "form",
 				onSubmit: async (t) => {
@@ -1900,17 +1909,17 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 				},
 				children: /* @__PURE__ */ t(T, {
 					label: "Name",
-					children: /* @__PURE__ */ t(le, {
+					children: /* @__PURE__ */ t(S, {
 						name: "name",
 						value: o,
 						onChange: (e) => s(e.target.value)
 					})
 				})
 			}) }),
-			/* @__PURE__ */ n(me, { children: [/* @__PURE__ */ t(y, {
+			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
 				onClick: e,
 				children: "Cancel"
-			}), /* @__PURE__ */ t(v, {
+			}), /* @__PURE__ */ t(_, {
 				type: "submit",
 				form: a,
 				fill: !0,
@@ -2009,7 +2018,7 @@ var Gt = R.create(({ remove: e, resolve: r }) => {
 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.playlists/stores/PlaylistStore.ts
-var Sn = {
+var Cn = {
 	type: "object",
 	properties: {
 		version: {
@@ -2019,10 +2028,10 @@ var Sn = {
 		items: {
 			type: "array",
 			nullable: !0,
-			items: ct
+			items: lt
 		}
 	}
-}, Cn = class {
+}, wn = class {
 	playlist;
 	constructor(e) {
 		this.playlist = e, m(this);
@@ -2037,16 +2046,16 @@ var Sn = {
 		this.playlist.items = e.items?.map((e) => this.playlist.createItemFromDto(e)) ?? [];
 	}
 	validateState(e) {
-		return Qe(Sn, "PlaylistLocalStorageState")(e);
+		return $e(Cn, "PlaylistLocalStorageState")(e);
 	}
 };
-U([p.struct], Cn.prototype, "state", null);
+U([p.struct], wn.prototype, "state", null);
 var $ = class {
 	playQueue;
 	localStorageState;
 	items = [];
 	constructor(e) {
-		this.playQueue = e, m(this), this.localStorageState = new Cn(this);
+		this.playQueue = e, m(this), this.localStorageState = new wn(this);
 	}
 	createItemFromDto(e) {
 		return Q.fromDto(this.playQueue, this, {
@@ -2106,7 +2115,7 @@ var $ = class {
 		this.items.splice(t, 0, n);
 	}
 	async removeItems(e) {
-		te(this.items, ...e);
+		re(this.items, ...e);
 	}
 	async removeSelectedItems() {
 		await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
@@ -2130,57 +2139,57 @@ var $ = class {
 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);
 //#endregion
 //#region src/features/media-player.playlists/pages/PlaylistDetailsPage.tsx
-var wn = ({ onClick: e }) => /* @__PURE__ */ t(v, {
+var Tn = ({ onClick: e }) => /* @__PURE__ */ t(_, {
 	onClick: e,
 	iconType: L,
 	fill: !0,
 	children: "Play all"
-}), Tn = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(v, {
-	onClick: () => R.show(xn, { playlistListItem: e }).then(n),
-	iconType: Ve,
+}), En = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
+	onClick: () => R.show(Sn, { playlistListItem: e }).then(n),
+	iconType: He,
 	children: "Rename"
-}), En = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(v, {
-	onClick: () => R.show(cn, { playlistListItem: e }).then(n),
-	iconType: Pe,
+}), Dn = ({ playlistListItem: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
+	onClick: () => R.show(ln, { playlistListItem: e }).then(n),
+	iconType: Fe,
 	children: "Delete"
-}), Dn = N(({ playlistListItem: r }) => {
-	let i = B.playlist(r.id), o = G(), [s] = u(() => new $(o));
-	g(i, s.localStorageState);
-	let c = qe(), l = a(async (e) => {
+}), 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]), d = a(async () => {
+	}, [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(on, {
+	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(sn, {
 		pageTitle: r.name,
 		breadcrumbs: [{
 			text: "Playlists",
 			linkProps: { to: "/playlists" }
 		}, { text: r.name }],
 		rightSideItems: [
-			/* @__PURE__ */ t(wn, { onClick: s.playAll }),
-			/* @__PURE__ */ t(Tn, {
+			/* @__PURE__ */ t(Tn, { onClick: s.playAll }),
+			/* @__PURE__ */ t(En, {
 				playlistListItem: r,
 				onFulfilled: l
 			}),
-			/* @__PURE__ */ t(En, {
+			/* @__PURE__ */ t(Dn, {
 				playlistListItem: r,
-				onFulfilled: d
+				onFulfilled: u
 			})
 		]
-	}), /* @__PURE__ */ t(bn, { playlist: s })] });
-}), On = R.create(({ remove: e, resolve: r }) => {
-	let i = Ee({ prefix: "modalForm" }), [a, o] = u(""), [s, c] = u(!1);
-	return /* @__PURE__ */ n(fe, {
+	}), /* @__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(he, { children: /* @__PURE__ */ t(ge, { children: "Create playlist" }) }),
-			/* @__PURE__ */ t(pe, { children: /* @__PURE__ */ t(ue, {
+			/* @__PURE__ */ t(ge, { children: /* @__PURE__ */ t(_e, { children: "Create playlist" }) }),
+			/* @__PURE__ */ t(me, { children: /* @__PURE__ */ t(de, {
 				id: i,
 				component: "form",
 				onSubmit: async (t) => {
@@ -2193,17 +2202,17 @@ var wn = ({ onClick: e }) => /* @__PURE__ */ t(v, {
 				},
 				children: /* @__PURE__ */ t(T, {
 					label: "Name",
-					children: /* @__PURE__ */ t(le, {
+					children: /* @__PURE__ */ t(S, {
 						name: "name",
 						value: a,
 						onChange: (e) => o(e.target.value)
 					})
 				})
 			}) }),
-			/* @__PURE__ */ n(me, { children: [/* @__PURE__ */ t(y, {
+			/* @__PURE__ */ n(he, { children: [/* @__PURE__ */ t(v, {
 				onClick: e,
 				children: "Cancel"
-			}), /* @__PURE__ */ t(v, {
+			}), /* @__PURE__ */ t(_, {
 				type: "submit",
 				form: i,
 				fill: !0,
@@ -2213,51 +2222,51 @@ var wn = ({ onClick: e }) => /* @__PURE__ */ t(v, {
 			})] })
 		]
 	});
-}), kn = ({ children: e, onFulfilled: n }) => /* @__PURE__ */ t(v, {
-	onClick: () => R.show(On).then(n),
+}), An = ({ children: e, onFulfilled: n }) => /* @__PURE__ */ t(_, {
+	onClick: () => R.show(kn).then(n),
 	iconType: P,
 	fill: !0,
 	children: e
-}), An = ({ linkProps: e, ...n }) => {
-	let r = qe(), i = async (t) => {
+}), jn = ({ linkProps: e, ...n }) => {
+	let r = Je(), i = async (t) => {
 		t.preventDefault(), await r.navigate(e);
 	};
-	return /* @__PURE__ */ t(de, {
+	return /* @__PURE__ */ t(fe, {
 		...n,
 		href: r.buildLocation(e).href,
 		onClick: i
 	});
-}, jn = N(({ playlistList: e }) => /* @__PURE__ */ t(xe, { children: /* @__PURE__ */ t(A, { children: "Name" }) })), Mn = N(({ item: e }) => /* @__PURE__ */ t(we, { children: /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(An, {
+}, 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)), Nn = N(({ playlistList: e }) => /* @__PURE__ */ t(Ke, {
+}) }) }, 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(Mn, { item: e }, e.id))
-})), Pn = N(({ playlistList: e }) => /* @__PURE__ */ n(be, { children: [/* @__PURE__ */ t(jn, { playlistList: e }), /* @__PURE__ */ t(Nn, { playlistList: e })] })), Fn = () => /* @__PURE__ */ t(on, {
+	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" }]
-}), In = N(({ playlistList: e }) => {
+}), Ln = N(({ playlistList: e }) => {
 	let r = a(async (t) => {
 		await e.addItem(e.createItem(t));
 	}, [e]);
 	return /* @__PURE__ */ n(O.Section, { children: [
-		/* @__PURE__ */ t(kn, {
+		/* @__PURE__ */ t(An, {
 			onFulfilled: r,
 			children: "New playlist"
 		}),
-		/* @__PURE__ */ t(ye, { size: "l" }),
-		/* @__PURE__ */ t(Pn, { playlistList: e })
+		/* @__PURE__ */ t(be, { size: "l" }),
+		/* @__PURE__ */ t(Fn, { playlistList: e })
 	] });
-}), Ln = i(() => {
-	let r = mt();
-	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(Fn, {}), /* @__PURE__ */ t(In, { playlistList: r })] });
+}), Rn = i(() => {
+	let r = ht();
+	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(In, {}), /* @__PURE__ */ t(Ln, { playlistList: r })] });
 });
 //#endregion
-export { Ht as BottomBar, _t as HydrangeanDivaProvider, yt as MediaPlayerLayout, Ut as MiniPlayer, tt as PlayQueueContext, sn as PlayQueuePage, an as PlayQueueSection, Dn as PlaylistDetailsPage, pt as PlaylistListContext, Ln as PlaylistListPage, H as RepeatMode, Je as bottomBarHeight, G as usePlayQueue, mt as usePlaylistList, z as videoServiceIcons };
+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 };
 
 //# sourceMappingURL=index.es.js.map