@videojs/react 10.0.0-beta.22 → 10.0.0-beta.24

package/dist/dev/ui/gesture/gesture.d.ts

@@ -0,0 +1,30 @@
+import { GestureActionName, GesturePointerType, GestureRegion } from "@videojs/core/dom";
+import { ReactNode } from "react";
+
+//#region src/ui/gesture/gesture.d.ts
+interface GestureProps {
+  type: 'tap' | 'doubletap' | (string & {});
+  action: GestureActionName | (string & {});
+  value?: number;
+  pointer?: GesturePointerType;
+  region?: GestureRegion;
+  disabled?: boolean;
+}
+declare function Gesture({
+  type,
+  action,
+  value,
+  pointer,
+  region,
+  disabled
+}: GestureProps): ReactNode;
+declare namespace Gesture {
+  type Props = GestureProps;
+}
+/** @deprecated Use `GestureProps` instead. */
+type MediaGestureProps = GestureProps;
+/** @deprecated Use `Gesture` instead. */
+declare const MediaGesture: typeof Gesture;
+//#endregion
+export { Gesture, GestureProps, MediaGesture, MediaGestureProps };
+//# sourceMappingURL=gesture.d.ts.map

package/dist/dev/ui/gesture/gesture.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gesture.d.ts","names":[],"sources":["../../../../src/ui/gesture/gesture.tsx"],"mappings":";;;;UAgBiB,YAAA;EACf,IAAA;EACA,MAAA,EAAQ,iBAAA;EACR,KAAA;EACA,OAAA,GAAU,kBAAA;EACV,MAAA,GAAS,aAAA;EACT,QAAA;AAAA;AAAA,iBAGc,OAAA,CAAA;EAAU,IAAA;EAAM,MAAA;EAAQ,KAAA;EAAO,OAAA;EAAS,MAAA;EAAQ;AAAA,GAAY,YAAA,GAAe,SAAA;AAAA,kBA0B1E,OAAA;EAAA,KACH,KAAA,GAAQ,YAAA;AAAA;;KAIV,iBAAA,GAAoB,YAAA;;cAGnB,YAAA,SAAY,OAAA"}

package/dist/dev/ui/gesture/{media-gesture.js → gesture.js}

@@ -2,8 +2,8 @@
 import { useContainer, usePlayer } from "../../player/context.js";
 import { createDoubleTapGesture, createTapGesture, resolveGestureAction } from "@videojs/core/dom";
 import { useEffect } from "react";
-//#region src/ui/gesture/media-gesture.tsx
-function MediaGesture({ type, action, value, pointer, region, disabled }) {
+//#region src/ui/gesture/gesture.tsx
+function Gesture({ type, action, value, pointer, region, disabled }) {
 	const store = usePlayer();
 	const container = useContainer();
 	useEffect(() => {
@@ -20,7 +20,8 @@ function MediaGesture({ type, action, value, pointer, region, disabled }) {
 		const options = {
 			pointer,
 			region,
-			action
+			action,
+			value
 		};
 		if (type === "doubletap") return createDoubleTapGesture(container, onActivate, options);
 		return createTapGesture(container, onActivate, options);
@@ -36,7 +37,9 @@ function MediaGesture({ type, action, value, pointer, region, disabled }) {
 	]);
 	return null;
 }
+/** @deprecated Use `Gesture` instead. */
+const MediaGesture = Gesture;
 //#endregion
-export { MediaGesture };
+export { Gesture, MediaGesture };
 
-//# sourceMappingURL=media-gesture.js.map
+//# sourceMappingURL=gesture.js.map

package/dist/dev/ui/gesture/gesture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gesture.js","names":[],"sources":["../../../../src/ui/gesture/gesture.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type AnyPlayerStore,\n  createDoubleTapGesture,\n  createTapGesture,\n  type GestureActionName,\n  type GesturePointerType,\n  type GestureRegion,\n  resolveGestureAction,\n} from '@videojs/core/dom';\nimport type { ReactNode } from 'react';\nimport { useEffect } from 'react';\n\nimport { useContainer, usePlayer } from '../../player/context';\n\nexport interface GestureProps {\n  type: 'tap' | 'doubletap' | (string & {});\n  action: GestureActionName | (string & {});\n  value?: number;\n  pointer?: GesturePointerType;\n  region?: GestureRegion;\n  disabled?: boolean;\n}\n\nexport function Gesture({ type, action, value, pointer, region, disabled }: GestureProps): ReactNode {\n  const store = usePlayer() as AnyPlayerStore;\n  const container = useContainer();\n\n  useEffect(() => {\n    if (!container || !type || !action || disabled) return;\n\n    const resolver = resolveGestureAction(action);\n    if (!resolver) return;\n\n    const onActivate = (event: PointerEvent) => {\n      resolver({ store, value, event });\n    };\n\n    const options = { pointer, region, action, value };\n\n    if (type === 'doubletap') {\n      return createDoubleTapGesture(container, onActivate, options);\n    }\n\n    return createTapGesture(container, onActivate, options);\n  }, [container, store, type, action, value, pointer, region, disabled]);\n\n  return null;\n}\n\nexport namespace Gesture {\n  export type Props = GestureProps;\n}\n\n/** @deprecated Use `GestureProps` instead. */\nexport type MediaGestureProps = GestureProps;\n\n/** @deprecated Use `Gesture` instead. */\nexport const MediaGesture = Gesture;\n"],"mappings":";;;;;AAyBA,SAAgB,QAAQ,EAAE,MAAM,QAAQ,OAAO,SAAS,QAAQ,YAAqC;CACnG,MAAM,QAAQ,WAAW;CACzB,MAAM,YAAY,cAAc;AAEhC,iBAAgB;AACd,MAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,UAAU,SAAU;EAEhD,MAAM,WAAW,qBAAqB,OAAO;AAC7C,MAAI,CAAC,SAAU;EAEf,MAAM,cAAc,UAAwB;AAC1C,YAAS;IAAE;IAAO;IAAO;IAAO,CAAC;;EAGnC,MAAM,UAAU;GAAE;GAAS;GAAQ;GAAQ;GAAO;AAElD,MAAI,SAAS,YACX,QAAO,uBAAuB,WAAW,YAAY,QAAQ;AAG/D,SAAO,iBAAiB,WAAW,YAAY,QAAQ;IACtD;EAAC;EAAW;EAAO;EAAM;EAAQ;EAAO;EAAS;EAAQ;EAAS,CAAC;AAEtE,QAAO;;;AAWT,MAAa,eAAe"}

package/dist/dev/ui/gesture/index.d.ts

@@ -0,0 +1,2 @@
+import { Gesture, GestureProps, MediaGesture, MediaGestureProps } from "./gesture.js";
+export { Gesture, GestureProps, MediaGesture, MediaGestureProps };

package/dist/dev/ui/gesture/index.js

@@ -0,0 +1,2 @@
+import { Gesture, MediaGesture } from "./gesture.js";
+export { Gesture, MediaGesture };

package/dist/dev/ui/hotkey/hotkey.d.ts

@@ -0,0 +1,28 @@
+import { HotkeyActionName } from "@videojs/core/dom";
+import { ReactNode } from "react";
+
+//#region src/ui/hotkey/hotkey.d.ts
+interface HotkeyProps {
+  keys: string;
+  action: HotkeyActionName | (string & {});
+  value?: number;
+  disabled?: boolean;
+  target?: 'player' | 'document';
+}
+declare function Hotkey({
+  keys,
+  action,
+  value,
+  disabled,
+  target
+}: HotkeyProps): ReactNode;
+declare namespace Hotkey {
+  type Props = HotkeyProps;
+}
+/** @deprecated Use `HotkeyProps` instead. */
+type MediaHotkeyProps = HotkeyProps;
+/** @deprecated Use `Hotkey` instead. */
+declare const MediaHotkey: typeof Hotkey;
+//#endregion
+export { Hotkey, HotkeyProps, MediaHotkey, MediaHotkeyProps };
+//# sourceMappingURL=hotkey.d.ts.map

package/dist/dev/ui/hotkey/hotkey.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hotkey.d.ts","names":[],"sources":["../../../../src/ui/hotkey/hotkey.tsx"],"mappings":";;;;UAciB,WAAA;EACf,IAAA;EACA,MAAA,EAAQ,gBAAA;EACR,KAAA;EACA,QAAA;EACA,MAAA;AAAA;AAAA,iBAGc,MAAA,CAAA;EAAS,IAAA;EAAM,MAAA;EAAQ,KAAA;EAAO,QAAA;EAAU;AAAA,GAAU,WAAA,GAAc,SAAA;AAAA,kBA0B/D,MAAA;EAAA,KACH,KAAA,GAAQ,WAAA;AAAA;;KAIV,gBAAA,GAAmB,WAAA;;cAGlB,WAAA,SAAW,MAAA"}

package/dist/dev/ui/hotkey/{media-hotkey.js → hotkey.js}

@@ -2,8 +2,8 @@
 import { useContainer, usePlayer } from "../../player/context.js";
 import { createHotkey, isHotkeyToggleAction, resolveHotkeyAction } from "@videojs/core/dom";
 import { useEffect } from "react";
-//#region src/ui/hotkey/media-hotkey.tsx
-function MediaHotkey({ keys, action, value, disabled, target }) {
+//#region src/ui/hotkey/hotkey.tsx
+function Hotkey({ keys, action, value, disabled, target }) {
 	const store = usePlayer();
 	const container = useContainer();
 	useEffect(() => {
@@ -13,6 +13,7 @@ function MediaHotkey({ keys, action, value, disabled, target }) {
 		return createHotkey(container, {
 			keys,
 			action,
+			value,
 			target,
 			disabled,
 			repeatable: !isHotkeyToggleAction(action),
@@ -35,7 +36,9 @@ function MediaHotkey({ keys, action, value, disabled, target }) {
 	]);
 	return null;
 }
+/** @deprecated Use `Hotkey` instead. */
+const MediaHotkey = Hotkey;
 //#endregion
-export { MediaHotkey };
+export { Hotkey, MediaHotkey };
 
-//# sourceMappingURL=media-hotkey.js.map
+//# sourceMappingURL=hotkey.js.map

package/dist/dev/ui/hotkey/hotkey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hotkey.js","names":[],"sources":["../../../../src/ui/hotkey/hotkey.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type AnyPlayerStore,\n  createHotkey,\n  type HotkeyActionName,\n  isHotkeyToggleAction,\n  resolveHotkeyAction,\n} from '@videojs/core/dom';\nimport type { ReactNode } from 'react';\nimport { useEffect } from 'react';\n\nimport { useContainer, usePlayer } from '../../player/context';\n\nexport interface HotkeyProps {\n  keys: string;\n  action: HotkeyActionName | (string & {});\n  value?: number;\n  disabled?: boolean;\n  target?: 'player' | 'document';\n}\n\nexport function Hotkey({ keys, action, value, disabled, target }: HotkeyProps): ReactNode {\n  const store = usePlayer() as AnyPlayerStore;\n  const container = useContainer();\n\n  useEffect(() => {\n    if (!container || !keys || !action || disabled) return;\n\n    const resolver = resolveHotkeyAction(action);\n    if (!resolver) return;\n\n    return createHotkey(container, {\n      keys,\n      action,\n      value,\n      target,\n      disabled,\n      repeatable: !isHotkeyToggleAction(action),\n      onActivate: (_event, key) => {\n        resolver({ store, key, value });\n      },\n    });\n  }, [container, store, keys, action, value, disabled, target]);\n\n  return null;\n}\n\nexport namespace Hotkey {\n  export type Props = HotkeyProps;\n}\n\n/** @deprecated Use `HotkeyProps` instead. */\nexport type MediaHotkeyProps = HotkeyProps;\n\n/** @deprecated Use `Hotkey` instead. */\nexport const MediaHotkey = Hotkey;\n"],"mappings":";;;;;AAsBA,SAAgB,OAAO,EAAE,MAAM,QAAQ,OAAO,UAAU,UAAkC;CACxF,MAAM,QAAQ,WAAW;CACzB,MAAM,YAAY,cAAc;AAEhC,iBAAgB;AACd,MAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,UAAU,SAAU;EAEhD,MAAM,WAAW,oBAAoB,OAAO;AAC5C,MAAI,CAAC,SAAU;AAEf,SAAO,aAAa,WAAW;GAC7B;GACA;GACA;GACA;GACA;GACA,YAAY,CAAC,qBAAqB,OAAO;GACzC,aAAa,QAAQ,QAAQ;AAC3B,aAAS;KAAE;KAAO;KAAK;KAAO,CAAC;;GAElC,CAAC;IACD;EAAC;EAAW;EAAO;EAAM;EAAQ;EAAO;EAAU;EAAO,CAAC;AAE7D,QAAO;;;AAWT,MAAa,cAAc"}

package/dist/dev/ui/hotkey/index.d.ts

@@ -0,0 +1,2 @@
+import { Hotkey, HotkeyProps, MediaHotkey, MediaHotkeyProps } from "./hotkey.js";
+export { Hotkey, HotkeyProps, MediaHotkey, MediaHotkeyProps };

package/dist/dev/ui/hotkey/index.js

@@ -0,0 +1,2 @@
+import { Hotkey, MediaHotkey } from "./hotkey.js";
+export { Hotkey, MediaHotkey };

package/dist/dev/ui/input-indicators/use-indicator-visibility.js

@@ -0,0 +1,25 @@
+"use client";
+import { useContainer } from "../../player/context.js";
+import { useLatestRef } from "../../utils/use-latest-ref.js";
+import { getIndicatorVisibilityCoordinator } from "@videojs/core/dom";
+import { useCallback, useEffect, useRef, useState } from "react";
+//#region src/ui/input-indicators/use-indicator-visibility.ts
+function useIndicatorVisibility(close) {
+	const container = useContainer();
+	const closeRef = useLatestRef(close);
+	const coordinatorRef = useRef(null);
+	const [handle] = useState(() => ({ close: () => closeRef.current() }));
+	useEffect(() => {
+		if (!container) return;
+		const coordinator = getIndicatorVisibilityCoordinator(container);
+		coordinatorRef.current = coordinator;
+		return coordinator.register(handle);
+	}, [container, handle]);
+	return useCallback(() => {
+		coordinatorRef.current?.show(handle);
+	}, [handle]);
+}
+//#endregion
+export { useIndicatorVisibility };
+
+//# sourceMappingURL=use-indicator-visibility.js.map

package/dist/dev/ui/input-indicators/use-indicator-visibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-indicator-visibility.js","names":[],"sources":["../../../../src/ui/input-indicators/use-indicator-visibility.ts"],"sourcesContent":["'use client';\n\nimport type { IndicatorVisibilityHandle } from '@videojs/core';\nimport { getIndicatorVisibilityCoordinator } from '@videojs/core/dom';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useContainer } from '../../player/context';\nimport { useLatestRef } from '../../utils/use-latest-ref';\n\nexport function useIndicatorVisibility(close: () => void): () => void {\n  const container = useContainer();\n  const closeRef = useLatestRef(close);\n  const coordinatorRef = useRef<ReturnType<typeof getIndicatorVisibilityCoordinator> | null>(null);\n  const [handle] = useState<IndicatorVisibilityHandle>(() => ({\n    close: () => closeRef.current(),\n  }));\n\n  useEffect(() => {\n    if (!container) return;\n\n    const coordinator = getIndicatorVisibilityCoordinator(container);\n    coordinatorRef.current = coordinator;\n\n    return coordinator.register(handle);\n  }, [container, handle]);\n\n  return useCallback(() => {\n    coordinatorRef.current?.show(handle);\n  }, [handle]);\n}\n"],"mappings":";;;;;;AASA,SAAgB,uBAAuB,OAA+B;CACpE,MAAM,YAAY,cAAc;CAChC,MAAM,WAAW,aAAa,MAAM;CACpC,MAAM,iBAAiB,OAAoE,KAAK;CAChG,MAAM,CAAC,UAAU,gBAA2C,EAC1D,aAAa,SAAS,SAAS,EAChC,EAAE;AAEH,iBAAgB;AACd,MAAI,CAAC,UAAW;EAEhB,MAAM,cAAc,kCAAkC,UAAU;AAChE,iBAAe,UAAU;AAEzB,SAAO,YAAY,SAAS,OAAO;IAClC,CAAC,WAAW,OAAO,CAAC;AAEvB,QAAO,kBAAkB;AACvB,iBAAe,SAAS,KAAK,OAAO;IACnC,CAAC,OAAO,CAAC"}

package/dist/dev/ui/input-indicators/use-input-action-subscription.js

@@ -0,0 +1,22 @@
+"use client";
+import { useContainer, usePlayer } from "../../player/context.js";
+import { useLatestRef } from "../../utils/use-latest-ref.js";
+import { getMediaSnapshot, subscribeToInputActions } from "@videojs/core/dom";
+import { useEffect } from "react";
+//#region src/ui/input-indicators/use-input-action-subscription.ts
+function useInputActionSubscription(callback) {
+	const container = useContainer();
+	const store = usePlayer();
+	const callbackRef = useLatestRef(callback);
+	const storeRef = useLatestRef(store);
+	useEffect(() => {
+		if (!container) return;
+		return subscribeToInputActions(container, (event) => {
+			callbackRef.current(event, getMediaSnapshot(storeRef.current));
+		});
+	}, [container]);
+}
+//#endregion
+export { useInputActionSubscription };
+
+//# sourceMappingURL=use-input-action-subscription.js.map

package/dist/dev/ui/input-indicators/use-input-action-subscription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-input-action-subscription.js","names":[],"sources":["../../../../src/ui/input-indicators/use-input-action-subscription.ts"],"sourcesContent":["'use client';\n\nimport type { InputActionEvent, MediaSnapshot } from '@videojs/core';\nimport { getMediaSnapshot, subscribeToInputActions } from '@videojs/core/dom';\nimport { useEffect } from 'react';\n\nimport { useContainer, usePlayer } from '../../player/context';\nimport { useLatestRef } from '../../utils/use-latest-ref';\n\nexport function useInputActionSubscription(callback: (event: InputActionEvent, snapshot: MediaSnapshot) => void): void {\n  const container = useContainer();\n  const store = usePlayer();\n  const callbackRef = useLatestRef(callback);\n  const storeRef = useLatestRef(store);\n\n  useEffect(() => {\n    if (!container) return;\n\n    return subscribeToInputActions(container, (event) => {\n      callbackRef.current(event, getMediaSnapshot(storeRef.current));\n    });\n  }, [container]);\n}\n"],"mappings":";;;;;;AASA,SAAgB,2BAA2B,UAA4E;CACrH,MAAM,YAAY,cAAc;CAChC,MAAM,QAAQ,WAAW;CACzB,MAAM,cAAc,aAAa,SAAS;CAC1C,MAAM,WAAW,aAAa,MAAM;AAEpC,iBAAgB;AACd,MAAI,CAAC,UAAW;AAEhB,SAAO,wBAAwB,YAAY,UAAU;AACnD,eAAY,QAAQ,OAAO,iBAAiB,SAAS,QAAQ,CAAC;IAC9D;IACD,CAAC,UAAU,CAAC"}

package/dist/dev/ui/input-indicators/use-input-indicator-root.js

@@ -0,0 +1,21 @@
+"use client";
+import { useDestroy } from "../../utils/use-destroy.js";
+import { useIndicatorVisibility } from "./use-indicator-visibility.js";
+import { useInputActionSubscription } from "./use-input-action-subscription.js";
+import { useRenderedIndicatorState } from "./use-rendered-indicator-state.js";
+import { useState, useSyncExternalStore } from "react";
+//#region src/ui/input-indicators/use-input-indicator-root.ts
+function useInputIndicatorRoot(createCore, props) {
+	const [core] = useState(createCore);
+	useDestroy(core);
+	core.setProps(props);
+	const showIndicator = useIndicatorVisibility(() => core.close());
+	useInputActionSubscription((event, snapshot) => {
+		if (core.processEvent(event, snapshot)) showIndicator();
+	});
+	return useRenderedIndicatorState(useSyncExternalStore((callback) => core.state.subscribe(callback), () => core.state.current, () => core.state.current));
+}
+//#endregion
+export { useInputIndicatorRoot };
+
+//# sourceMappingURL=use-input-indicator-root.js.map

package/dist/dev/ui/input-indicators/use-input-indicator-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-input-indicator-root.js","names":[],"sources":["../../../../src/ui/input-indicators/use-input-indicator-root.ts"],"sourcesContent":["'use client';\n\nimport type { IndicatorLifecycleState, InputActionEvent, MediaSnapshot } from '@videojs/core';\nimport type { State as StoreState } from '@videojs/store';\nimport { useState, useSyncExternalStore } from 'react';\n\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useIndicatorVisibility } from './use-indicator-visibility';\nimport { useInputActionSubscription } from './use-input-action-subscription';\nimport { useRenderedIndicatorState } from './use-rendered-indicator-state';\n\ninterface InputIndicatorRootCore<IndicatorState extends IndicatorLifecycleState, Props> {\n  readonly state: StoreState<IndicatorState>;\n  setProps(props: Props): void;\n  destroy(): void;\n  close(): void;\n  processEvent(event: InputActionEvent, snapshot: MediaSnapshot): boolean;\n}\n\nexport function useInputIndicatorRoot<IndicatorState extends IndicatorLifecycleState, Props>(\n  createCore: () => InputIndicatorRootCore<IndicatorState, Props>,\n  props: Props\n) {\n  const [core] = useState(createCore);\n  useDestroy(core);\n  core.setProps(props);\n  const showIndicator = useIndicatorVisibility(() => core.close());\n\n  useInputActionSubscription((event, snapshot) => {\n    if (core.processEvent(event, snapshot)) showIndicator();\n  });\n\n  const currentState = useSyncExternalStore(\n    (callback) => core.state.subscribe(callback),\n    () => core.state.current,\n    () => core.state.current\n  );\n\n  return useRenderedIndicatorState(currentState);\n}\n"],"mappings":";;;;;;;AAmBA,SAAgB,sBACd,YACA,OACA;CACA,MAAM,CAAC,QAAQ,SAAS,WAAW;AACnC,YAAW,KAAK;AAChB,MAAK,SAAS,MAAM;CACpB,MAAM,gBAAgB,6BAA6B,KAAK,OAAO,CAAC;AAEhE,6BAA4B,OAAO,aAAa;AAC9C,MAAI,KAAK,aAAa,OAAO,SAAS,CAAE,gBAAe;GACvD;AAQF,QAAO,0BANc,sBAClB,aAAa,KAAK,MAAM,UAAU,SAAS,QACtC,KAAK,MAAM,eACX,KAAK,MAAM,QAClB,CAE6C"}

package/dist/dev/ui/input-indicators/use-rendered-indicator-state.js

@@ -0,0 +1,40 @@
+"use client";
+import { useDestroy } from "../../utils/use-destroy.js";
+import { createTransition } from "@videojs/core/dom";
+import { useEffect, useRef, useState, useSyncExternalStore } from "react";
+import { getRenderedIndicatorState, isIndicatorPresent } from "@videojs/core";
+//#region src/ui/input-indicators/use-rendered-indicator-state.ts
+function useRenderedIndicatorState(currentState) {
+	const elementRef = useRef(null);
+	const currentStateRef = useRef(currentState);
+	const snapshotRef = useRef(currentState);
+	const [transition] = useState(() => createTransition());
+	useDestroy(transition);
+	currentStateRef.current = currentState;
+	const transitionState = useSyncExternalStore((callback) => transition.state.subscribe(callback), () => transition.state.current, () => transition.state.current);
+	const { generation, open } = currentState;
+	useEffect(() => {
+		if (open) {
+			const nextState = currentStateRef.current;
+			if (nextState.generation !== generation) return;
+			snapshotRef.current = nextState;
+			transition.open();
+			return;
+		}
+		const { active, status } = transition.state.current;
+		if (active && status !== "ending") transition.close(elementRef.current);
+	}, [
+		generation,
+		open,
+		transition
+	]);
+	return {
+		elementRef,
+		present: isIndicatorPresent(currentState, transitionState),
+		state: getRenderedIndicatorState(currentState, snapshotRef.current, transitionState)
+	};
+}
+//#endregion
+export { useRenderedIndicatorState };
+
+//# sourceMappingURL=use-rendered-indicator-state.js.map

package/dist/dev/ui/input-indicators/use-rendered-indicator-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-rendered-indicator-state.js","names":[],"sources":["../../../../src/ui/input-indicators/use-rendered-indicator-state.ts"],"sourcesContent":["'use client';\n\nimport { getRenderedIndicatorState, type IndicatorLifecycleState, isIndicatorPresent } from '@videojs/core';\nimport { createTransition } from '@videojs/core/dom';\nimport { useEffect, useRef, useState, useSyncExternalStore } from 'react';\n\nimport { useDestroy } from '../../utils/use-destroy';\n\nexport function useRenderedIndicatorState<State extends IndicatorLifecycleState>(currentState: State) {\n  const elementRef = useRef<HTMLElement>(null);\n  const currentStateRef = useRef(currentState);\n  const snapshotRef = useRef(currentState);\n  const [transition] = useState(() => createTransition());\n  useDestroy(transition);\n  currentStateRef.current = currentState;\n\n  const transitionState = useSyncExternalStore(\n    (callback) => transition.state.subscribe(callback),\n    () => transition.state.current,\n    () => transition.state.current\n  );\n\n  const { generation, open } = currentState;\n\n  useEffect(() => {\n    if (open) {\n      const nextState = currentStateRef.current;\n      if (nextState.generation !== generation) return;\n\n      snapshotRef.current = nextState;\n      void transition.open();\n      return;\n    }\n\n    const { active, status } = transition.state.current;\n    if (active && status !== 'ending') {\n      void transition.close(elementRef.current);\n    }\n  }, [generation, open, transition]);\n\n  return {\n    elementRef,\n    present: isIndicatorPresent(currentState, transitionState),\n    state: getRenderedIndicatorState(currentState, snapshotRef.current, transitionState),\n  };\n}\n"],"mappings":";;;;;;AAQA,SAAgB,0BAAiE,cAAqB;CACpG,MAAM,aAAa,OAAoB,KAAK;CAC5C,MAAM,kBAAkB,OAAO,aAAa;CAC5C,MAAM,cAAc,OAAO,aAAa;CACxC,MAAM,CAAC,cAAc,eAAe,kBAAkB,CAAC;AACvD,YAAW,WAAW;AACtB,iBAAgB,UAAU;CAE1B,MAAM,kBAAkB,sBACrB,aAAa,WAAW,MAAM,UAAU,SAAS,QAC5C,WAAW,MAAM,eACjB,WAAW,MAAM,QACxB;CAED,MAAM,EAAE,YAAY,SAAS;AAE7B,iBAAgB;AACd,MAAI,MAAM;GACR,MAAM,YAAY,gBAAgB;AAClC,OAAI,UAAU,eAAe,WAAY;AAEzC,eAAY,UAAU;AACjB,cAAW,MAAM;AACtB;;EAGF,MAAM,EAAE,QAAQ,WAAW,WAAW,MAAM;AAC5C,MAAI,UAAU,WAAW,SAClB,YAAW,MAAM,WAAW,QAAQ;IAE1C;EAAC;EAAY;EAAM;EAAW,CAAC;AAElC,QAAO;EACL;EACA,SAAS,mBAAmB,cAAc,gBAAgB;EAC1D,OAAO,0BAA0B,cAAc,YAAY,SAAS,gBAAgB;EACrF"}

package/dist/dev/ui/live-button/index.d.ts

@@ -0,0 +1,2 @@
+import { LiveButton, LiveButtonProps } from "./live-button.js";
+export { LiveButton, type LiveButtonProps };

package/dist/dev/ui/live-button/index.js

@@ -0,0 +1,2 @@
+import { LiveButton } from "./live-button.js";
+export { LiveButton };

package/dist/dev/ui/live-button/live-button.d.ts

@@ -0,0 +1,34 @@
+import { UIComponentProps } from "../../utils/types.js";
+import * as _$react from "react";
+import { LiveButtonCore } from "@videojs/core";
+
+//#region src/ui/live-button/live-button.d.ts
+interface LiveButtonProps extends UIComponentProps<'button', LiveButtonCore.State>, LiveButtonCore.Props {}
+/**
+ * A button that indicates live status and seeks to the live edge when
+ * pressed. Exposes `data-live` while the stream is live (or DVR) and
+ * `data-live-edge` while playing at the live edge so skins can style a
+ * red-dot ↔ grey-dot treatment.
+ *
+ * Selects from `live`, `time`, and `buffer` features and composes them
+ * itself rather than going through `createMediaButton`, since the LiveButton
+ * needs three feature slices to detect the live edge and seek.
+ *
+ * Falls back to `LiveButtonCore.defaultText` (`'Live'` by default) when no
+ * children are provided. Override the static field globally for i18n.
+ *
+ * @example
+ * ```tsx
+ * <LiveButton />
+ * ```
+ *
+ * @see https://github.com/video-dev/media-ui-extensions/blob/main/proposals/0007-live-edge.md
+ */
+declare const LiveButton: _$react.ForwardRefExoticComponent<Omit<LiveButtonProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
+declare namespace LiveButton {
+  type Props = LiveButtonProps;
+  type State = LiveButtonCore.State;
+}
+//#endregion
+export { LiveButton, LiveButtonProps };
+//# sourceMappingURL=live-button.d.ts.map

package/dist/dev/ui/live-button/live-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-button.d.ts","names":[],"sources":["../../../../src/ui/live-button/live-button.tsx"],"mappings":";;;;;UAciB,eAAA,SAAwB,gBAAA,WAA2B,cAAA,CAAe,KAAA,GAAQ,cAAA,CAAe,KAAA;;AAA1G;;;;;;;;;;;;;;;AAsBA;;;;cAAa,UAAA,EAAU,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,eAAA,WAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAgEN,UAAA;EAAA,KACH,KAAA,GAAQ,eAAA;EAAA,KACR,KAAA,GAAQ,cAAA,CAAe,KAAA;AAAA"}

package/dist/dev/ui/live-button/live-button.js

@@ -0,0 +1,92 @@
+"use client";
+import { usePlayer } from "../../player/context.js";
+import { renderElement } from "../../utils/use-render.js";
+import { useButton } from "../hooks/use-button.js";
+import { useOptionalTooltipContext } from "../tooltip/context.js";
+import { logMissingFeature, selectBuffer, selectLive, selectTime } from "@videojs/core/dom";
+import { forwardRef, useLayoutEffect, useState } from "react";
+import { LiveButtonCore, LiveButtonDataAttrs } from "@videojs/core";
+//#region src/ui/live-button/live-button.tsx
+const DISPLAY_NAME = "LiveButton";
+/**
+* A button that indicates live status and seeks to the live edge when
+* pressed. Exposes `data-live` while the stream is live (or DVR) and
+* `data-live-edge` while playing at the live edge so skins can style a
+* red-dot ↔ grey-dot treatment.
+*
+* Selects from `live`, `time`, and `buffer` features and composes them
+* itself rather than going through `createMediaButton`, since the LiveButton
+* needs three feature slices to detect the live edge and seek.
+*
+* Falls back to `LiveButtonCore.defaultText` (`'Live'` by default) when no
+* children are provided. Override the static field globally for i18n.
+*
+* @example
+* ```tsx
+* <LiveButton />
+* ```
+*
+* @see https://github.com/video-dev/media-ui-extensions/blob/main/proposals/0007-live-edge.md
+*/
+const LiveButton = forwardRef(function LiveButton(componentProps, forwardedRef) {
+	const { children, render, className, style, label, disabled, ...elementProps } = componentProps;
+	const live = usePlayer(selectLive);
+	const time = usePlayer(selectTime);
+	const buffer = usePlayer(selectBuffer);
+	const media = live && time && buffer ? {
+		currentTime: time.currentTime,
+		seek: time.seek,
+		seekable: buffer.seekable,
+		liveEdgeStart: live.liveEdgeStart,
+		targetLiveWindow: live.targetLiveWindow
+	} : null;
+	const tooltipCtx = useOptionalTooltipContext();
+	const [core] = useState(() => new LiveButtonCore());
+	core.setProps({
+		label,
+		disabled
+	});
+	const { getButtonProps, buttonRef } = useButton({
+		displayName: DISPLAY_NAME,
+		onActivate: () => {
+			if (media) core.seekToLive(media);
+		},
+		isDisabled: () => !!disabled || !media
+	});
+	if (media) core.setMedia(media);
+	const state = media ? core.getState() : null;
+	const labelText = state ? core.getLabel(state) : void 0;
+	useLayoutEffect(() => {
+		if (!tooltipCtx) return;
+		tooltipCtx.setContent(labelText);
+		return () => tooltipCtx.setContent(void 0);
+	}, [tooltipCtx, labelText]);
+	if (!media || !state) {
+		logMissingFeature(DISPLAY_NAME, selectLive.displayName ?? "live");
+		return null;
+	}
+	const attrs = core.getAttrs(state);
+	const content = children ?? LiveButtonCore.defaultText;
+	return renderElement("button", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: LiveButtonDataAttrs,
+		ref: [forwardedRef, buttonRef],
+		props: [
+			attrs,
+			{
+				children: content,
+				...elementProps
+			},
+			getButtonProps()
+		]
+	});
+});
+LiveButton.displayName = DISPLAY_NAME;
+//#endregion
+export { LiveButton };
+
+//# sourceMappingURL=live-button.js.map

package/dist/dev/ui/live-button/live-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-button.js","names":[],"sources":["../../../../src/ui/live-button/live-button.tsx"],"sourcesContent":["'use client';\n\nimport { LiveButtonCore, LiveButtonDataAttrs, type LiveButtonMediaState } from '@videojs/core';\nimport { logMissingFeature, selectBuffer, selectLive, selectTime } from '@videojs/core/dom';\nimport { forwardRef, type ReactNode, useLayoutEffect, useState } from 'react';\n\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useButton } from '../hooks/use-button';\nimport { useOptionalTooltipContext } from '../tooltip/context';\n\nconst DISPLAY_NAME = 'LiveButton';\n\nexport interface LiveButtonProps extends UIComponentProps<'button', LiveButtonCore.State>, LiveButtonCore.Props {}\n\n/**\n * A button that indicates live status and seeks to the live edge when\n * pressed. Exposes `data-live` while the stream is live (or DVR) and\n * `data-live-edge` while playing at the live edge so skins can style a\n * red-dot ↔ grey-dot treatment.\n *\n * Selects from `live`, `time`, and `buffer` features and composes them\n * itself rather than going through `createMediaButton`, since the LiveButton\n * needs three feature slices to detect the live edge and seek.\n *\n * Falls back to `LiveButtonCore.defaultText` (`'Live'` by default) when no\n * children are provided. Override the static field globally for i18n.\n *\n * @example\n * ```tsx\n * <LiveButton />\n * ```\n *\n * @see https://github.com/video-dev/media-ui-extensions/blob/main/proposals/0007-live-edge.md\n */\nexport const LiveButton = forwardRef<HTMLButtonElement, LiveButtonProps>(\n  function LiveButton(componentProps, forwardedRef): ReactNode {\n    const { children, render, className, style, label, disabled, ...elementProps } = componentProps;\n\n    const live = usePlayer(selectLive);\n    const time = usePlayer(selectTime);\n    const buffer = usePlayer(selectBuffer);\n\n    const media: LiveButtonMediaState | null =\n      live && time && buffer\n        ? {\n            currentTime: time.currentTime,\n            seek: time.seek,\n            seekable: buffer.seekable,\n            liveEdgeStart: live.liveEdgeStart,\n            targetLiveWindow: live.targetLiveWindow,\n          }\n        : null;\n\n    const tooltipCtx = useOptionalTooltipContext();\n    const [core] = useState(() => new LiveButtonCore());\n    core.setProps({ label, disabled });\n\n    const { getButtonProps, buttonRef } = useButton({\n      displayName: DISPLAY_NAME,\n      onActivate: () => {\n        if (media) core.seekToLive(media);\n      },\n      isDisabled: () => !!disabled || !media,\n    });\n\n    if (media) core.setMedia(media);\n    const state = media ? core.getState() : null;\n    const labelText = state ? core.getLabel(state) : undefined;\n\n    useLayoutEffect(() => {\n      if (!tooltipCtx) return;\n      tooltipCtx.setContent(labelText);\n      return () => tooltipCtx.setContent(undefined);\n    }, [tooltipCtx, labelText]);\n\n    if (!media || !state) {\n      if (__DEV__) logMissingFeature(DISPLAY_NAME, selectLive.displayName ?? 'live');\n      return null;\n    }\n\n    const attrs = core.getAttrs(state);\n    const content = children ?? LiveButtonCore.defaultText;\n\n    return renderElement(\n      'button',\n      { render, className, style },\n      {\n        state,\n        stateAttrMap: LiveButtonDataAttrs,\n        ref: [forwardedRef, buttonRef],\n        props: [attrs, { children: content, ...elementProps }, getButtonProps()],\n      }\n    );\n  }\n);\n\nLiveButton.displayName = DISPLAY_NAME;\n\nexport namespace LiveButton {\n  export type Props = LiveButtonProps;\n  export type State = LiveButtonCore.State;\n}\n"],"mappings":";;;;;;;;;AAYA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;AAwBrB,MAAa,aAAa,WACxB,SAAS,WAAW,gBAAgB,cAAyB;CAC3D,MAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,OAAO,UAAU,GAAG,iBAAiB;CAEjF,MAAM,OAAO,UAAU,WAAW;CAClC,MAAM,OAAO,UAAU,WAAW;CAClC,MAAM,SAAS,UAAU,aAAa;CAEtC,MAAM,QACJ,QAAQ,QAAQ,SACZ;EACE,aAAa,KAAK;EAClB,MAAM,KAAK;EACX,UAAU,OAAO;EACjB,eAAe,KAAK;EACpB,kBAAkB,KAAK;EACxB,GACD;CAEN,MAAM,aAAa,2BAA2B;CAC9C,MAAM,CAAC,QAAQ,eAAe,IAAI,gBAAgB,CAAC;AACnD,MAAK,SAAS;EAAE;EAAO;EAAU,CAAC;CAElC,MAAM,EAAE,gBAAgB,cAAc,UAAU;EAC9C,aAAa;EACb,kBAAkB;AAChB,OAAI,MAAO,MAAK,WAAW,MAAM;;EAEnC,kBAAkB,CAAC,CAAC,YAAY,CAAC;EAClC,CAAC;AAEF,KAAI,MAAO,MAAK,SAAS,MAAM;CAC/B,MAAM,QAAQ,QAAQ,KAAK,UAAU,GAAG;CACxC,MAAM,YAAY,QAAQ,KAAK,SAAS,MAAM,GAAG,KAAA;AAEjD,uBAAsB;AACpB,MAAI,CAAC,WAAY;AACjB,aAAW,WAAW,UAAU;AAChC,eAAa,WAAW,WAAW,KAAA,EAAU;IAC5C,CAAC,YAAY,UAAU,CAAC;AAE3B,KAAI,CAAC,SAAS,CAAC,OAAO;AACP,oBAAkB,cAAc,WAAW,eAAe,OAAO;AAC9E,SAAO;;CAGT,MAAM,QAAQ,KAAK,SAAS,MAAM;CAClC,MAAM,UAAU,YAAY,eAAe;AAE3C,QAAO,cACL,UACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA,cAAc;EACd,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO;GAAC;GAAO;IAAE,UAAU;IAAS,GAAG;IAAc;GAAE,gBAAgB;GAAC;EACzE,CACF;EAEJ;AAED,WAAW,cAAc"}

package/dist/dev/ui/menu/context.d.ts

@@ -0,0 +1,29 @@
+import { MediaContainer, MenuApi, PositioningBoundary } from "@videojs/core/dom";
+import { MenuCore, MenuState, StateAttrMap as StateAttrMap$1 } from "@videojs/core";
+
+//#region src/ui/menu/context.d.ts
+interface MenuContextValue {
+  core: MenuCore;
+  menu: MenuApi;
+  state: MenuState;
+  stateAttrMap: StateAttrMap$1<MenuState>;
+  contentId: string;
+  anchorName: string;
+  boundary: PositioningBoundary;
+  container: MediaContainer | null;
+  /** ID of the currently visible submenu, or null when at root view. */
+  activeSubMenuId: string | null;
+  /** Triggerer ID of the active submenu entry (for focus restoration on pop). */
+  activeSubMenuTriggerId: string | null;
+  /** Direction of the most recent navigation. */
+  navigationDirection: 'forward' | 'back';
+  /** Push a submenu onto the navigation stack. */
+  push: (menuId: string, triggerId: string) => void;
+  /** Pop the current submenu from the navigation stack. */
+  pop: () => void;
+}
+declare function useMenuContext(): MenuContextValue;
+declare function useOptionalMenuContext(): MenuContextValue | null;
+//#endregion
+export { MenuContextValue, useMenuContext, useOptionalMenuContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/dev/ui/menu/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/menu/context.tsx"],"mappings":";;;;UAMiB,gBAAA;EACf,IAAA,EAAM,QAAA;EACN,IAAA,EAAM,OAAA;EACN,KAAA,EAAO,SAAA;EACP,YAAA,EAAc,cAAA,CAAa,SAAA;EAC3B,SAAA;EACA,UAAA;EACA,QAAA,EAAU,mBAAA;EACV,SAAA,EAAW,cAAA;EAJgB;EAM3B,eAAA;EAHU;EAKV,sBAAA;EAJyB;EAMzB,mBAAA;EAbA;EAeA,IAAA,GAAO,MAAA,UAAgB,SAAA;EAdvB;EAgBA,GAAA;AAAA;AAAA,iBAOc,cAAA,CAAA,GAAkB,gBAAA;AAAA,iBAMlB,sBAAA,CAAA,GAA0B,gBAAA"}

package/dist/dev/ui/menu/context.js

@@ -0,0 +1,29 @@
+"use client";
+import { createContext, useContext } from "react";
+//#region src/ui/menu/context.tsx
+const MenuContext = createContext(null);
+const MenuContextProvider = MenuContext.Provider;
+function useMenuContext() {
+	const ctx = useContext(MenuContext);
+	if (!ctx) throw new Error("Menu compound components must be used within a Menu.Root");
+	return ctx;
+}
+function useOptionalMenuContext() {
+	return useContext(MenuContext);
+}
+const SubMenuContext = createContext(null);
+const SubMenuContextProvider = SubMenuContext.Provider;
+function useSubMenuContext() {
+	return useContext(SubMenuContext);
+}
+const MenuRadioGroupContext = createContext(null);
+const MenuRadioGroupContextProvider = MenuRadioGroupContext.Provider;
+function useMenuRadioGroupContext() {
+	const ctx = useContext(MenuRadioGroupContext);
+	if (!ctx) throw new Error("Menu.RadioItem must be used within a Menu.RadioGroup");
+	return ctx;
+}
+//#endregion
+export { MenuContextProvider, MenuRadioGroupContextProvider, SubMenuContextProvider, useMenuContext, useMenuRadioGroupContext, useOptionalMenuContext, useSubMenuContext };
+
+//# sourceMappingURL=context.js.map

package/dist/dev/ui/menu/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/menu/context.tsx"],"sourcesContent":["'use client';\n\nimport type { MenuCore, MenuState, StateAttrMap } from '@videojs/core';\nimport type { MediaContainer, MenuApi, PositioningBoundary } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface MenuContextValue {\n  core: MenuCore;\n  menu: MenuApi;\n  state: MenuState;\n  stateAttrMap: StateAttrMap<MenuState>;\n  contentId: string;\n  anchorName: string;\n  boundary: PositioningBoundary;\n  container: MediaContainer | null;\n  /** ID of the currently visible submenu, or null when at root view. */\n  activeSubMenuId: string | null;\n  /** Triggerer ID of the active submenu entry (for focus restoration on pop). */\n  activeSubMenuTriggerId: string | null;\n  /** Direction of the most recent navigation. */\n  navigationDirection: 'forward' | 'back';\n  /** Push a submenu onto the navigation stack. */\n  push: (menuId: string, triggerId: string) => void;\n  /** Pop the current submenu from the navigation stack. */\n  pop: () => void;\n}\n\nconst MenuContext = createContext<MenuContextValue | null>(null);\n\nexport const MenuContextProvider = MenuContext.Provider;\n\nexport function useMenuContext(): MenuContextValue {\n  const ctx = useContext(MenuContext);\n  if (!ctx) throw new Error('Menu compound components must be used within a Menu.Root');\n  return ctx;\n}\n\nexport function useOptionalMenuContext(): MenuContextValue | null {\n  return useContext(MenuContext);\n}\n\n// ---------------------------------------------------------------------------\n// Sub-menu identity context — provided by a nested Menu.Root so child parts\n// (Trigger, Content) can read the submenu ID and access the parent menu for\n// push/pop and item registration.\n// ---------------------------------------------------------------------------\n\nexport interface SubMenuContextValue {\n  /** Stable ID for this submenu (matches the contentId of the nested Root). */\n  subMenuId: string;\n  /** The parent menu's context — used by Trigger to register and push. */\n  parentMenu: MenuContextValue;\n}\n\nconst SubMenuContext = createContext<SubMenuContextValue | null>(null);\n\nexport const SubMenuContextProvider = SubMenuContext.Provider;\n\nexport function useSubMenuContext(): SubMenuContextValue | null {\n  return useContext(SubMenuContext);\n}\n\n// ---------------------------------------------------------------------------\n// Radio group context — shared between MenuRadioGroup and MenuRadioItem\n// ---------------------------------------------------------------------------\n\nexport interface MenuRadioGroupContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n}\n\nconst MenuRadioGroupContext = createContext<MenuRadioGroupContextValue | null>(null);\n\nexport const MenuRadioGroupContextProvider = MenuRadioGroupContext.Provider;\n\nexport function useMenuRadioGroupContext(): MenuRadioGroupContextValue {\n  const ctx = useContext(MenuRadioGroupContext);\n  if (!ctx) throw new Error('Menu.RadioItem must be used within a Menu.RadioGroup');\n  return ctx;\n}\n"],"mappings":";;;AA2BA,MAAM,cAAc,cAAuC,KAAK;AAEhE,MAAa,sBAAsB,YAAY;AAE/C,SAAgB,iBAAmC;CACjD,MAAM,MAAM,WAAW,YAAY;AACnC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,2DAA2D;AACrF,QAAO;;AAGT,SAAgB,yBAAkD;AAChE,QAAO,WAAW,YAAY;;AAgBhC,MAAM,iBAAiB,cAA0C,KAAK;AAEtE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAgD;AAC9D,QAAO,WAAW,eAAe;;AAYnC,MAAM,wBAAwB,cAAiD,KAAK;AAEpF,MAAa,gCAAgC,sBAAsB;AAEnE,SAAgB,2BAAuD;CACrE,MAAM,MAAM,WAAW,sBAAsB;AAC7C,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,uDAAuD;AACjF,QAAO"}

package/dist/dev/ui/menu/index.d.ts

@@ -0,0 +1,3 @@
+import { MenuContextValue, useMenuContext, useOptionalMenuContext } from "./context.js";
+import { index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as Menu, type MenuContextValue, useMenuContext, useOptionalMenuContext };

package/dist/dev/ui/menu/index.js

@@ -0,0 +1,3 @@
+import { useMenuContext, useOptionalMenuContext } from "./context.js";
+import { index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as Menu, useMenuContext, useOptionalMenuContext };

package/dist/dev/ui/menu/index.parts.d.ts

@@ -0,0 +1,21 @@
+import { MenuBack, MenuBackProps } from "./menu-back.js";
+import { MenuCheckboxItem, MenuCheckboxItemProps } from "./menu-checkbox-item.js";
+import { MenuContent, MenuContentProps } from "./menu-content.js";
+import { MenuGroup, MenuGroupProps } from "./menu-group.js";
+import { MenuItem, MenuItemProps } from "./menu-item.js";
+import { MenuItemIndicator, MenuItemIndicatorProps } from "./menu-item-indicator.js";
+import { MenuLabel, MenuLabelProps } from "./menu-label.js";
+import { MenuRadioGroup, MenuRadioGroupProps } from "./menu-radio-group.js";
+import { MenuRadioItem, MenuRadioItemProps } from "./menu-radio-item.js";
+import { MenuRoot, MenuRootProps } from "./menu-root.js";
+import { MenuSeparator, MenuSeparatorProps } from "./menu-separator.js";
+import { MenuTrigger, MenuTriggerProps } from "./menu-trigger.js";
+import { MenuView, MenuViewProps } from "./menu-view.js";
+
+//#region src/ui/menu/index.parts.d.ts
+declare namespace index_parts_d_exports {
+  export { MenuBack as Back, MenuBackProps as BackProps, MenuCheckboxItem as CheckboxItem, MenuCheckboxItemProps as CheckboxItemProps, MenuContent as Content, MenuContentProps as ContentProps, MenuGroup as Group, MenuGroupProps as GroupProps, MenuItem as Item, MenuItemIndicator as ItemIndicator, MenuItemIndicatorProps as ItemIndicatorProps, MenuItemProps as ItemProps, MenuLabel as Label, MenuLabelProps as LabelProps, MenuRadioGroup as RadioGroup, MenuRadioGroupProps as RadioGroupProps, MenuRadioItem as RadioItem, MenuRadioItemProps as RadioItemProps, MenuRoot as Root, MenuRootProps as RootProps, MenuSeparator as Separator, MenuSeparatorProps as SeparatorProps, MenuTrigger as Trigger, MenuTriggerProps as TriggerProps, MenuView as View, MenuViewProps as ViewProps };
+}
+//#endregion
+export { index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/dev/ui/menu/index.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../../src/ui/menu/index.parts.ts"],"mappings":""}

package/dist/dev/ui/menu/index.parts.js

@@ -0,0 +1,34 @@
+import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
+import { MenuBack } from "./menu-back.js";
+import { MenuCheckboxItem } from "./menu-checkbox-item.js";
+import { MenuContent } from "./menu-content.js";
+import { MenuGroup } from "./menu-group.js";
+import { MenuItem } from "./menu-item.js";
+import { MenuItemIndicator } from "./menu-item-indicator.js";
+import { MenuLabel } from "./menu-label.js";
+import { MenuRadioGroup } from "./menu-radio-group.js";
+import { MenuRadioItem } from "./menu-radio-item.js";
+import { MenuRoot } from "./menu-root.js";
+import { MenuSeparator } from "./menu-separator.js";
+import { MenuTrigger } from "./menu-trigger.js";
+import { MenuView } from "./menu-view.js";
+//#region src/ui/menu/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Back: () => MenuBack,
+	CheckboxItem: () => MenuCheckboxItem,
+	Content: () => MenuContent,
+	Group: () => MenuGroup,
+	Item: () => MenuItem,
+	ItemIndicator: () => MenuItemIndicator,
+	Label: () => MenuLabel,
+	RadioGroup: () => MenuRadioGroup,
+	RadioItem: () => MenuRadioItem,
+	Root: () => MenuRoot,
+	Separator: () => MenuSeparator,
+	Trigger: () => MenuTrigger,
+	View: () => MenuView
+});
+//#endregion
+export { index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/dev/ui/menu/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/menu/index.parts.ts"],"sourcesContent":["export { MenuBack as Back, type MenuBackProps as BackProps } from './menu-back';\nexport {\n  MenuCheckboxItem as CheckboxItem,\n  type MenuCheckboxItemProps as CheckboxItemProps,\n} from './menu-checkbox-item';\nexport { MenuContent as Content, type MenuContentProps as ContentProps } from './menu-content';\nexport { MenuGroup as Group, type MenuGroupProps as GroupProps } from './menu-group';\nexport { MenuItem as Item, type MenuItemProps as ItemProps } from './menu-item';\nexport {\n  MenuItemIndicator as ItemIndicator,\n  type MenuItemIndicatorProps as ItemIndicatorProps,\n} from './menu-item-indicator';\nexport { MenuLabel as Label, type MenuLabelProps as LabelProps } from './menu-label';\nexport { MenuRadioGroup as RadioGroup, type MenuRadioGroupProps as RadioGroupProps } from './menu-radio-group';\nexport { MenuRadioItem as RadioItem, type MenuRadioItemProps as RadioItemProps } from './menu-radio-item';\nexport { MenuRoot as Root, type MenuRootProps as RootProps } from './menu-root';\nexport { MenuSeparator as Separator, type MenuSeparatorProps as SeparatorProps } from './menu-separator';\nexport { MenuTrigger as Trigger, type MenuTriggerProps as TriggerProps } from './menu-trigger';\nexport { MenuView as View, type MenuViewProps as ViewProps } from './menu-view';\n"],"mappings":""}

package/dist/dev/ui/menu/menu-back.d.ts

@@ -0,0 +1,18 @@
+import { UIComponentProps } from "../../utils/types.js";
+import * as _$react from "react";
+import { MenuState } from "@videojs/core";
+
+//#region src/ui/menu/menu-back.d.ts
+interface MenuBackProps extends UIComponentProps<'button', MenuState> {
+  /** Accessible label for the back button. */
+  label?: string;
+}
+/** Button that navigates back to the parent menu view. Place at the top of a submenu Content. */
+declare const MenuBack: _$react.ForwardRefExoticComponent<Omit<MenuBackProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
+declare namespace MenuBack {
+  type Props = MenuBackProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuBack, MenuBackProps };
+//# sourceMappingURL=menu-back.d.ts.map