videojs-vue 0.2.0 → 0.3.0

package/dist/audio/index.js

@@ -1,15 +1,10 @@
-import { useAudioPlayerActions, useAudioPlayerState } from "./composables.js";
+import { Audio } from "./Audio.js";
 import "../register/audio/player.js";
-import { n as AudioPlayerRoot, t as Audio } from "../Audio-D-RH-zmq.js";
-import { t as createAudioPlayer } from "../createAudioPlayer-BqZWB8il.js";
+import { AudioPlayerRoot } from "./AudioPlayerRoot.js";
 import "../register/audio/skin.js";
 import { DefaultAudioSkin } from "./skins/default.js";
 import "../register/audio/neutral-skin.js";
 import { NeutralAudioSkin } from "./skins/neutral.js";
-//#region src/audio/AudioPlayer.ts
-const AudioPlayer = /* @__PURE__ */ createAudioPlayer("AudioPlayer", {
-	default: DefaultAudioSkin,
-	neutral: NeutralAudioSkin
-}, "default");
-//#endregion
+import { AudioPlayer } from "./AudioPlayer.js";
+import { useAudioPlayerActions, useAudioPlayerState } from "./composables.js";
 export { Audio, AudioPlayer, AudioPlayerRoot, DefaultAudioSkin, NeutralAudioSkin, useAudioPlayerActions, useAudioPlayerState };

package/dist/audio/neutral.d.ts

@@ -1,7 +1,8 @@
-import { t as MediaTrack } from "../types-wAkjM01D.js";
-import { a as AudioPlayerStore, i as AudioPlayerState, n as AudioPlayerElement, o as AudioPlayerTarget, r as AudioPlayerHandle, t as AudioPlayerActions } from "../types-DR9kogyX.js";
-import { c as OnCleanup } from "../index-DhJ5A5TI.js";
-import { t as AudioMediaComponent } from "../createAudioPlayer-BhUZLd4H.js";
+import { OnCleanup } from "../node_modules/.pnpm/@vue_reactivity@3.5.43/node_modules/@vue/reactivity/dist/reactivity.js";
+import { MediaTrack } from "../media/types.js";
+import "../index.js";
+import { AudioPlayerActions, AudioPlayerElement, AudioPlayerHandle, AudioPlayerState, AudioPlayerStore, AudioPlayerTarget } from "./types.js";
+import { AudioMediaComponent } from "./createAudioPlayer.js";
 //#region src/audio/neutral.d.ts
 export declare const AudioPlayer: Omit<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   src: import("vue").PropType<string | undefined>;

package/dist/audio/neutral.js

@@ -1,4 +1,4 @@
-import { t as createAudioPlayer } from "../createAudioPlayer-BqZWB8il.js";
+import { createAudioPlayer } from "./createAudioPlayer.js";
 import { NeutralAudioSkin } from "./skins/neutral.js";
 //#region src/audio/neutral.ts
 const AudioPlayer = /* @__PURE__ */ createAudioPlayer("NeutralAudioPlayer", { neutral: NeutralAudioSkin }, "neutral");

package/dist/audio/skins/createAudioSkin.d.ts

@@ -0,0 +1,5 @@
+//#region src/audio/skins/createAudioSkin.d.ts
+export declare function createAudioSkin(name: string, tag: string): import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/audio/skins/createAudioSkin.js

@@ -0,0 +1,20 @@
+import { withSlot } from "../../skins/withSlot.js";
+import { defineComponent, h, mergeProps } from "vue";
+//#region src/audio/skins/createAudioSkin.ts
+function createAudioSkin(name, tag) {
+	return defineComponent({
+		name,
+		inheritAttrs: false,
+		setup(_props, { attrs, slots }) {
+			return () => {
+				var _slots$default, _slots$poster;
+				return h(tag, mergeProps({ style: {
+					display: "block",
+					width: "100%"
+				} }, attrs), [(_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), withSlot((_slots$poster = slots["poster"]) === null || _slots$poster === void 0 ? void 0 : _slots$poster.call(slots), "poster")]);
+			};
+		}
+	});
+}
+//#endregion
+export { createAudioSkin };

package/dist/audio/skins/default.d.ts

@@ -1,2 +1,6 @@
-import { t as DefaultAudioSkin } from "../../default-3MW_94HC.js";
-export { DefaultAudioSkin };
+import "../../register/audio/skin.js";
+//#region src/audio/skins/default.d.ts
+export declare const DefaultAudioSkin: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/audio/skins/default.js

@@ -1,5 +1,5 @@
 import "../../register/audio/skin.js";
-import { t as createAudioSkin } from "../../createAudioSkin-BNmtEp7u.js";
+import { createAudioSkin } from "./createAudioSkin.js";
 //#region src/audio/skins/default.ts
 const DefaultAudioSkin = /* @__PURE__ */ createAudioSkin("DefaultAudioSkin", "audio-skin");
 //#endregion

package/dist/audio/skins/neutral.d.ts

@@ -1,2 +1,6 @@
-import { t as NeutralAudioSkin } from "../../neutral-DWxkiOeo.js";
-export { NeutralAudioSkin };
+import "../../register/audio/neutral-skin.js";
+//#region src/audio/skins/neutral.d.ts
+export declare const NeutralAudioSkin: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/audio/skins/neutral.js

@@ -1,4 +1,4 @@
-import { t as createAudioSkin } from "../../createAudioSkin-BNmtEp7u.js";
+import { createAudioSkin } from "./createAudioSkin.js";
 import "../../register/audio/neutral-skin.js";
 //#region src/audio/skins/neutral.ts
 const NeutralAudioSkin = /* @__PURE__ */ createAudioSkin("NeutralAudioSkin", "audio-neutral-skin");

package/dist/audio/skins.d.ts

@@ -0,0 +1,3 @@
+import { DefaultAudioSkin } from "./skins/default.js";
+import { NeutralAudioSkin } from "./skins/neutral.js";
+export { DefaultAudioSkin, NeutralAudioSkin };

package/dist/audio/skins.js

@@ -0,0 +1,3 @@
+import { DefaultAudioSkin } from "./skins/default.js";
+import { NeutralAudioSkin } from "./skins/neutral.js";
+export { DefaultAudioSkin, NeutralAudioSkin };

package/dist/audio/types.d.ts

@@ -0,0 +1,22 @@
+import { PlayerMedia } from "../media/types.js";
+import { CommonPlayerActions } from "../player/actions.js";
+import { MaybeRefOrGetter } from "vue";
+import { AudioPlayerStore, AudioPlayerStore as AudioPlayerStore$1 } from "@videojs/html";
+import { AudioPlayerElement as AudioPlayerElement$1 } from "@videojs/html/audio";
+//#region src/audio/types.d.ts
+export type AudioPlayerState = AudioPlayerStore$1['state'];
+export type AudioPlayerActions = CommonPlayerActions;
+export type AudioPlayerElement = Omit<AudioPlayerElement$1, 'store'> & {
+  readonly store: AudioPlayerStore$1;
+};
+/**
+ * Live getters become null when the audio player is inactive or unmounted.
+ */
+export interface AudioPlayerHandle extends AudioPlayerActions {
+  readonly element: AudioPlayerElement | null;
+  readonly store: AudioPlayerStore$1 | null;
+  readonly media: PlayerMedia | null;
+}
+export type AudioPlayerTarget = MaybeRefOrGetter<AudioPlayerHandle | null | undefined>;
+//#endregion
+export type { AudioPlayerStore };

package/dist/composables/index.d.ts

@@ -1,3 +1,4 @@
-import { c as PlayerTarget, i as PlayerHandle, n as PlayerActions, o as PlayerState, s as PlayerStore } from "../types-wAkjM01D.js";
-import { n as usePlayerState, t as usePlayerActions } from "../usePlayerActions-McyRKswV.js";
+import { PlayerActions, PlayerHandle, PlayerState, PlayerStore, PlayerTarget } from "../player/types.js";
+import { usePlayerState } from "./usePlayerState.js";
+import { usePlayerActions } from "./usePlayerActions.js";
 export { type PlayerActions, type PlayerHandle, type PlayerState, type PlayerStore, type PlayerTarget, usePlayerActions, usePlayerState };

package/dist/composables/index.js

@@ -1 +1,3 @@
-export { t as usePlayerActions, n as usePlayerState } from "../usePlayerActions-D3ILoEVZ.js";
+import { usePlayerState } from "./usePlayerState.js";
+import { usePlayerActions } from "./usePlayerActions.js";
+export { usePlayerActions, usePlayerState };

package/dist/composables/usePlayerActions.d.ts

@@ -0,0 +1,9 @@
+import { PlayerActions, PlayerTarget } from "../player/types.js";
+//#region src/composables/usePlayerActions.d.ts
+/**
+ * @param {PlayerTarget} target - Explicit player ref/getter, or injected context when omitted.
+ * @returns {PlayerActions} Actions that resolve their target on every call.
+ * Commands are never queued. Async failures retain the original rejection reason.
+ */
+export declare function usePlayerActions(target?: PlayerTarget): PlayerActions;
+//#endregion

package/dist/composables/usePlayerActions.js

@@ -0,0 +1,17 @@
+import { usePlayerTarget } from "../player/context.js";
+import { createPlayerActions } from "../player/actions.js";
+//#region src/composables/usePlayerActions.ts
+/**
+* @param {PlayerTarget} target - Explicit player ref/getter, or injected context when omitted.
+* @returns {PlayerActions} Actions that resolve their target on every call.
+* Commands are never queued. Async failures retain the original rejection reason.
+*/
+function usePlayerActions(target) {
+	const player = usePlayerTarget(target);
+	return createPlayerActions(() => {
+		var _player$value;
+		return ((_player$value = player.value) === null || _player$value === void 0 ? void 0 : _player$value.store) ?? null;
+	});
+}
+//#endregion
+export { usePlayerActions };

package/dist/composables/usePlayerState.d.ts

@@ -0,0 +1,12 @@
+import { PlayerState, PlayerTarget } from "../player/types.js";
+import { ComputedRef } from "vue";
+//#region src/composables/usePlayerState.d.ts
+/**
+ * @param {(state: PlayerState) => Selected} selector - Selects a value from the immutable upstream snapshot.
+ * @param {PlayerTarget} target - Explicit player ref/getter, or injected context when omitted.
+ * @returns {ComputedRef<Selected | undefined>} A readonly selection, undefined while unavailable.
+ * Subscribe to a selection of the upstream snapshot. Unready targets yield undefined.
+ * Object selections should preserve identity when their selected fields are unchanged.
+ */
+export declare function usePlayerState<Selected>(selector: (state: PlayerState) => Selected, target?: PlayerTarget): ComputedRef<Selected | undefined>;
+//#endregion

package/dist/composables/usePlayerState.js

@@ -0,0 +1,19 @@
+import { usePlayerTarget } from "../player/context.js";
+import { useStoreSelection } from "./useStoreSelection.js";
+//#region src/composables/usePlayerState.ts
+/**
+* @param {(state: PlayerState) => Selected} selector - Selects a value from the immutable upstream snapshot.
+* @param {PlayerTarget} target - Explicit player ref/getter, or injected context when omitted.
+* @returns {ComputedRef<Selected | undefined>} A readonly selection, undefined while unavailable.
+* Subscribe to a selection of the upstream snapshot. Unready targets yield undefined.
+* Object selections should preserve identity when their selected fields are unchanged.
+*/
+function usePlayerState(selector, target) {
+	const player = usePlayerTarget(target);
+	return useStoreSelection(() => {
+		var _player$value;
+		return (_player$value = player.value) === null || _player$value === void 0 ? void 0 : _player$value.store;
+	}, selector);
+}
+//#endregion
+export { usePlayerState };

package/dist/composables/useStoreSelection.d.ts

@@ -0,0 +1,9 @@
+import { ComputedRef } from "vue";
+//#region src/composables/useStoreSelection.d.ts
+interface SnapshotStore<State> {
+  readonly state: State;
+  subscribe: (listener: () => void) => () => void;
+}
+export declare function useStoreSelection<State, Selected>(getStore: () => SnapshotStore<State> | null | undefined, selector: (state: State) => Selected): ComputedRef<Selected | undefined>;
+//#endregion
+export {};

package/dist/{useStoreSelection-BFUpSMPo.js → composables/useStoreSelection.js}

@@ -16,4 +16,4 @@ function useStoreSelection(getStore, selector) {
 	return computed(() => selection.value);
 }
 //#endregion
-export { useStoreSelection as t };
+export { useStoreSelection };

package/dist/core/index.d.ts

@@ -1,3 +1,7 @@
-import { a as PlayerMedia, c as PlayerTarget, i as PlayerHandle, n as PlayerActions, o as PlayerState, r as PlayerElement, s as PlayerStore, t as MediaTrack } from "../types-wAkjM01D.js";
-import { i as PlayerRoot, n as MediaProps, r as MediaEventName, s as Video } from "../index-DhJ5A5TI.js";
+import { MediaTrack, PlayerMedia } from "../media/types.js";
+import { Video } from "../media/Video.js";
+import { PlayerActions, PlayerElement, PlayerHandle, PlayerState, PlayerStore, PlayerTarget } from "../player/types.js";
+import { PlayerRoot } from "../player/PlayerRoot.js";
+import { MediaEventName } from "../media/events.js";
+import { MediaProps } from "../media/props.js";
 export { type MediaEventName, type MediaProps, type MediaTrack, type PlayerActions, type PlayerElement, type PlayerHandle, type PlayerMedia, PlayerRoot, type PlayerState, type PlayerStore, type PlayerTarget, Video };

package/dist/core/index.js

@@ -1 +1,3 @@
-export { n as PlayerRoot, t as Video } from "../Video-fUL_ClzK.js";
+import { Video } from "../media/Video.js";
+import { PlayerRoot } from "../player/PlayerRoot.js";
+export { PlayerRoot, Video };

package/dist/i18n/MediaI18n.d.ts

@@ -0,0 +1,16 @@
+import "../register/i18n.js";
+import { PropType } from "vue";
+//#region src/i18n/MediaI18n.d.ts
+/**
+ * Shares the upstream locale with all descendant players and controls.
+ */
+export declare const MediaI18n: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  lang: PropType<string | undefined>;
+  dir: PropType<'ltr' | 'rtl' | 'auto' | undefined>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  lang: PropType<string | undefined>;
+  dir: PropType<'ltr' | 'rtl' | 'auto' | undefined>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/i18n/MediaI18n.js

@@ -0,0 +1,26 @@
+import "../register/i18n.js";
+import { defineComponent, h } from "vue";
+//#region src/i18n/MediaI18n.ts
+/**
+* Shares the upstream locale with all descendant players and controls.
+*/
+const MediaI18n = defineComponent({
+	name: "MediaI18n",
+	inheritAttrs: false,
+	props: {
+		lang: String,
+		dir: String
+	},
+	setup(props, { attrs, slots }) {
+		return () => {
+			var _slots$default;
+			return h("media-i18n", {
+				...attrs,
+				lang: props.lang ?? "",
+				dir: props.dir ?? ""
+			}, (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots));
+		};
+	}
+});
+//#endregion
+export { MediaI18n };

package/dist/i18n/MediaText.d.ts

@@ -0,0 +1,14 @@
+import "../register/i18n.js";
+import { PropType } from "vue";
+//#region src/i18n/MediaText.d.ts
+/**
+ * Translates a token using plain text from the default slot as its fallback.
+ */
+export declare const MediaText: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  token: PropType<string | undefined>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  token: PropType<string | undefined>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/i18n/MediaText.js

@@ -0,0 +1,37 @@
+import "../register/i18n.js";
+import { Comment, defineComponent, h, isVNode, onMounted, shallowRef } from "vue";
+//#region src/i18n/MediaText.ts
+function getSlotText(value) {
+	if (typeof value === "string" || typeof value === "number") return String(value);
+	if (Array.isArray(value)) return value.map((child) => getSlotText(child)).join("");
+	if (isVNode(value) && value.type !== Comment) return getSlotText(value.children);
+	return "";
+}
+/**
+* Translates a token using plain text from the default slot as its fallback.
+*/
+const MediaText = defineComponent({
+	name: "MediaText",
+	inheritAttrs: false,
+	props: { token: String },
+	setup(props, { attrs, slots }) {
+		const element = shallowRef(null);
+		onMounted(() => {
+			var _element$value;
+			return (_element$value = element.value) === null || _element$value === void 0 ? void 0 : _element$value.requestUpdate();
+		});
+		return () => {
+			var _slots$default;
+			const fallback = getSlotText((_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)).trim();
+			return h("media-text", {
+				"data-allow-mismatch": "text",
+				...attrs,
+				ref: element,
+				key: fallback,
+				token: props.token ?? ""
+			}, fallback);
+		};
+	}
+});
+//#endregion
+export { MediaText };

package/dist/i18n/index.d.ts

@@ -1,30 +1,4 @@
-import "../i18n-C4MwExsj.js";
-import { PropType } from "vue";
+import { MediaI18n } from "./MediaI18n.js";
+import { MediaText } from "./MediaText.js";
 import { FlatTranslations, Locale, Translations, getI18nTranslations, hasRegisteredLocale, onI18nRegistryChange, registerI18n } from "@videojs/html/i18n";
-//#region src/i18n/MediaI18n.d.ts
-/**
- * Shares the upstream locale with all descendant players and controls.
- */
-export declare const MediaI18n: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-  lang: PropType<string | undefined>;
-  dir: PropType<'ltr' | 'rtl' | 'auto' | undefined>;
-}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-  [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-  lang: PropType<string | undefined>;
-  dir: PropType<'ltr' | 'rtl' | 'auto' | undefined>;
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-//#endregion
-//#region src/i18n/MediaText.d.ts
-/**
- * Translates a token using plain text from the default slot as its fallback.
- */
-export declare const MediaText: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-  token: PropType<string | undefined>;
-}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-  [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-  token: PropType<string | undefined>;
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { type FlatTranslations, type Locale, type Translations, getI18nTranslations, hasRegisteredLocale, onI18nRegistryChange, registerI18n };
+export { type FlatTranslations, type Locale, MediaI18n, MediaText, type Translations, getI18nTranslations, hasRegisteredLocale, onI18nRegistryChange, registerI18n };

package/dist/i18n/index.js

@@ -1,54 +1,4 @@
-import "../register/i18n.js";
-import { Comment, defineComponent, h, isVNode, onMounted, shallowRef } from "vue";
+import { MediaI18n } from "./MediaI18n.js";
+import { MediaText } from "./MediaText.js";
 import { getI18nTranslations, hasRegisteredLocale, onI18nRegistryChange, registerI18n } from "@videojs/html/i18n";
-//#region src/i18n/MediaI18n.ts
-/**
-* Shares the upstream locale with all descendant players and controls.
-*/
-const MediaI18n = defineComponent({
-	name: "MediaI18n",
-	inheritAttrs: false,
-	props: {
-		lang: String,
-		dir: String
-	},
-	setup(props, { attrs, slots }) {
-		return () => h("media-i18n", {
-			...attrs,
-			lang: props.lang ?? "",
-			dir: props.dir ?? ""
-		}, slots["default"]?.());
-	}
-});
-//#endregion
-//#region src/i18n/MediaText.ts
-function getSlotText(value) {
-	if (typeof value === "string" || typeof value === "number") return String(value);
-	if (Array.isArray(value)) return value.map((child) => getSlotText(child)).join("");
-	if (isVNode(value) && value.type !== Comment) return getSlotText(value.children);
-	return "";
-}
-/**
-* Translates a token using plain text from the default slot as its fallback.
-*/
-const MediaText = defineComponent({
-	name: "MediaText",
-	inheritAttrs: false,
-	props: { token: String },
-	setup(props, { attrs, slots }) {
-		const element = shallowRef(null);
-		onMounted(() => element.value?.requestUpdate());
-		return () => {
-			const fallback = getSlotText(slots["default"]?.()).trim();
-			return h("media-text", {
-				"data-allow-mismatch": "text",
-				...attrs,
-				ref: element,
-				key: fallback,
-				token: props.token ?? ""
-			}, fallback);
-		};
-	}
-});
-//#endregion
 export { MediaI18n, MediaText, getI18nTranslations, hasRegisteredLocale, onI18nRegistryChange, registerI18n };

package/dist/index.d.ts

@@ -1,6 +1,17 @@
-import { a as PlayerMedia, c as PlayerTarget, i as PlayerHandle, n as PlayerActions, o as PlayerState, r as PlayerElement, s as PlayerStore, t as MediaTrack } from "./types-wAkjM01D.js";
-import { a as VideoPlayer, i as PlayerRoot, n as MediaProps, o as VideoMediaComponent, r as MediaEventName, s as Video } from "./index-DhJ5A5TI.js";
-import { t as DefaultVideoSkin } from "./default-C4INOLJr.js";
-import { t as NeutralVideoSkin } from "./neutral-x5edtrGj.js";
-import { n as usePlayerState, t as usePlayerActions } from "./usePlayerActions-McyRKswV.js";
+import "./register/video/player.js";
+import "./register/video/skin.js";
+import "./register/video/neutral-skin.js";
+import { MediaTrack, PlayerMedia } from "./media/types.js";
+import { Video } from "./media/Video.js";
+import { PlayerActions, PlayerElement, PlayerHandle, PlayerState, PlayerStore, PlayerTarget } from "./player/types.js";
+import { VideoMediaComponent } from "./video/createVideoPlayer.js";
+import { VideoPlayer } from "./video/VideoPlayer.js";
+import { PlayerRoot } from "./player/PlayerRoot.js";
+import { DefaultVideoSkin } from "./skins/default.js";
+import { NeutralVideoSkin } from "./skins/neutral.js";
+import "./skins/index.js";
+import { usePlayerState } from "./composables/usePlayerState.js";
+import { usePlayerActions } from "./composables/usePlayerActions.js";
+import { MediaEventName } from "./media/events.js";
+import { MediaProps } from "./media/props.js";
 export { DefaultVideoSkin, type MediaEventName, type MediaProps, type MediaTrack, NeutralVideoSkin, type PlayerActions, type PlayerElement, type PlayerHandle, type PlayerMedia, PlayerRoot, type PlayerState, type PlayerStore, type PlayerTarget, Video, type VideoMediaComponent, VideoPlayer, usePlayerActions, usePlayerState };

package/dist/index.js

@@ -1,15 +1,11 @@
-import { n as usePlayerState, t as usePlayerActions } from "./usePlayerActions-D3ILoEVZ.js";
 import "./register/video/player.js";
-import { n as PlayerRoot, t as Video } from "./Video-fUL_ClzK.js";
 import "./register/video/skin.js";
 import "./register/video/neutral-skin.js";
-import { t as createVideoPlayer } from "./createVideoPlayer-CU9HWSAy.js";
 import { DefaultVideoSkin } from "./skins/default.js";
 import { NeutralVideoSkin } from "./skins/neutral.js";
-//#region src/VideoPlayer.ts
-const VideoPlayer = /* @__PURE__ */ createVideoPlayer("VideoPlayer", {
-	default: DefaultVideoSkin,
-	neutral: NeutralVideoSkin
-}, "default");
-//#endregion
+import { Video } from "./media/Video.js";
+import { PlayerRoot } from "./player/PlayerRoot.js";
+import { VideoPlayer } from "./video/VideoPlayer.js";
+import { usePlayerState } from "./composables/usePlayerState.js";
+import { usePlayerActions } from "./composables/usePlayerActions.js";
 export { DefaultVideoSkin, NeutralVideoSkin, PlayerRoot, Video, VideoPlayer, usePlayerActions, usePlayerState };

package/dist/media/Video.d.ts

@@ -0,0 +1,79 @@
+import { MediaTrack } from "./types.js";
+//#region src/media/Video.d.ts
+export declare const Video: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+  readonly src: import("vue").PropType<string | undefined>;
+  readonly autoplay: BooleanConstructor;
+  readonly loop: BooleanConstructor;
+  readonly preload: {
+    readonly type: import("vue").PropType<'none' | 'metadata' | 'auto'>;
+    readonly default: 'metadata';
+  };
+  readonly crossorigin: import("vue").PropType<'' | 'anonymous' | 'use-credentials' | undefined>;
+  readonly tracks: import("vue").PropType<readonly MediaTrack[] | undefined>;
+  readonly volume: import("vue").PropType<number | undefined>;
+  readonly muted: {
+    readonly type: import("vue").PropType<boolean | undefined>;
+    readonly default: undefined;
+  };
+  readonly playbackRate: import("vue").PropType<number | undefined>;
+  readonly poster: import("vue").PropType<string | undefined>;
+  readonly playsinline: {
+    readonly type: BooleanConstructor;
+    readonly default: true;
+  };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<"abort" | "canplay" | "canplaythrough" | "durationchange" | "emptied" | "ended" | "enterpictureinpicture" | "error" | "leavepictureinpicture" | "loadeddata" | "loadedmetadata" | "loadstart" | "pause" | "play" | "playing" | "progress" | "ratechange" | "seeked" | "seeking" | "stalled" | "suspend" | "timeupdate" | "volumechange" | "waiting", (event: Event) => boolean>, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+  readonly src: import("vue").PropType<string | undefined>;
+  readonly autoplay: BooleanConstructor;
+  readonly loop: BooleanConstructor;
+  readonly preload: {
+    readonly type: import("vue").PropType<'none' | 'metadata' | 'auto'>;
+    readonly default: 'metadata';
+  };
+  readonly crossorigin: import("vue").PropType<'' | 'anonymous' | 'use-credentials' | undefined>;
+  readonly tracks: import("vue").PropType<readonly MediaTrack[] | undefined>;
+  readonly volume: import("vue").PropType<number | undefined>;
+  readonly muted: {
+    readonly type: import("vue").PropType<boolean | undefined>;
+    readonly default: undefined;
+  };
+  readonly playbackRate: import("vue").PropType<number | undefined>;
+  readonly poster: import("vue").PropType<string | undefined>;
+  readonly playsinline: {
+    readonly type: BooleanConstructor;
+    readonly default: true;
+  };
+}>> & Readonly<{
+  onAbort?: (event: Event) => any;
+  onCanplay?: (event: Event) => any;
+  onCanplaythrough?: (event: Event) => any;
+  onDurationchange?: (event: Event) => any;
+  onEmptied?: (event: Event) => any;
+  onEnded?: (event: Event) => any;
+  onEnterpictureinpicture?: (event: Event) => any;
+  onError?: (event: Event) => any;
+  onLeavepictureinpicture?: (event: Event) => any;
+  onLoadeddata?: (event: Event) => any;
+  onLoadedmetadata?: (event: Event) => any;
+  onLoadstart?: (event: Event) => any;
+  onPause?: (event: Event) => any;
+  onPlay?: (event: Event) => any;
+  onPlaying?: (event: Event) => any;
+  onProgress?: (event: Event) => any;
+  onRatechange?: (event: Event) => any;
+  onSeeked?: (event: Event) => any;
+  onSeeking?: (event: Event) => any;
+  onStalled?: (event: Event) => any;
+  onSuspend?: (event: Event) => any;
+  onTimeupdate?: (event: Event) => any;
+  onVolumechange?: (event: Event) => any;
+  onWaiting?: (event: Event) => any;
+}>, {
+  readonly autoplay: boolean;
+  readonly loop: boolean;
+  readonly preload: "auto" | "metadata" | "none";
+  readonly muted: boolean | undefined;
+  readonly playsinline: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+//#endregion

package/dist/media/Video.js

@@ -0,0 +1,21 @@
+import { mediaEmits } from "./events.js";
+import { mediaProps } from "./props.js";
+import { useMediaElement } from "./useMediaElement.js";
+import { defineComponent } from "vue";
+//#region src/media/Video.ts
+const Video = defineComponent({
+	name: "Video",
+	inheritAttrs: false,
+	props: mediaProps,
+	emits: mediaEmits,
+	setup(props, context) {
+		return useMediaElement({
+			tag: "video",
+			props,
+			context,
+			emit: context.emit
+		});
+	}
+});
+//#endregion
+export { Video };

package/dist/media/events.d.ts

@@ -0,0 +1,5 @@
+//#region src/media/events.d.ts
+export declare const MEDIA_EVENTS: readonly ['abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting', 'enterpictureinpicture', 'leavepictureinpicture'];
+export type MediaEventName = (typeof MEDIA_EVENTS)[number];
+export declare const mediaEmits: Record<MediaEventName, (event: Event) => boolean>;
+//#endregion