@videojs/react 10.0.0-rc.1 → 10.0.0-rc.3

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

@@ -1,15 +1,15 @@
-import { MenuRadioItem, MenuRadioItemProps } from "./menu-radio-item.js";
-import { MenuCheckboxItem, MenuCheckboxItemProps } from "./menu-checkbox-item.js";
-import { MenuContent, MenuContentProps } from "./menu-content.js";
-import { MenuGroup, MenuGroupProps } from "./menu-group.js";
-import { MenuGroupLabel, MenuGroupLabelProps } from "./menu-group-label.js";
-import { MenuItem, MenuItemProps } from "./menu-item.js";
-import { MenuItemIndicator, MenuItemIndicatorProps } from "./menu-item-indicator.js";
-import { MenuPopup, MenuPopupProps } from "./menu-popup.js";
-import { MenuRadioGroup, MenuRadioGroupProps } from "./menu-radio-group.js";
-import { MenuRoot, MenuRootProps } from "./menu-root.js";
-import { MenuSeparator, MenuSeparatorProps } from "./menu-separator.js";
-import { MenuTrigger, MenuTriggerProps } from "./menu-trigger.js";
+import { MenuRadioItem, MenuRadioItemProps } from "./radio-item.js";
+import { MenuCheckboxItem, MenuCheckboxItemProps } from "./checkbox-item.js";
+import { MenuContent, MenuContentProps } from "./content.js";
+import { MenuGroup, MenuGroupProps } from "./group.js";
+import { MenuGroupLabel, MenuGroupLabelProps } from "./group-label.js";
+import { MenuItem, MenuItemProps } from "./item.js";
+import { MenuItemIndicator, MenuItemIndicatorProps } from "./item-indicator.js";
+import { MenuPopup, MenuPopupProps } from "./popup.js";
+import { MenuRadioGroup, MenuRadioGroupProps } from "./radio-group.js";
+import { MenuRoot, MenuRootProps } from "./root.js";
+import { MenuSeparator, MenuSeparatorProps } from "./separator.js";
+import { MenuTrigger, MenuTriggerProps } from "./trigger.js";
 declare namespace index_parts_d_exports {
   export { MenuCheckboxItem as CheckboxItem, MenuCheckboxItemProps as CheckboxItemProps, MenuContent as Content, MenuContentProps as ContentProps, MenuGroup as Group, MenuGroupLabel as GroupLabel, MenuGroupLabelProps as GroupLabelProps, MenuGroupProps as GroupProps, MenuItem as Item, MenuItemIndicator as ItemIndicator, MenuItemIndicatorProps as ItemIndicatorProps, MenuItemProps as ItemProps, MenuPopup as Popup, MenuPopupProps as PopupProps, 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 };
 }

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

@@ -1,16 +1,16 @@
 import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
-import { MenuRadioGroup } from "./menu-radio-group.js";
-import { MenuCheckboxItem } from "./menu-checkbox-item.js";
-import { MenuContent } from "./menu-content.js";
-import { MenuGroup } from "./menu-group.js";
-import { MenuGroupLabel } from "./menu-group-label.js";
-import { MenuItem } from "./menu-item.js";
-import { MenuItemIndicator } from "./menu-item-indicator.js";
-import { MenuPopup } from "./menu-popup.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 { MenuRadioGroup } from "./radio-group.js";
+import { MenuCheckboxItem } from "./checkbox-item.js";
+import { MenuContent } from "./content.js";
+import { MenuGroup } from "./group.js";
+import { MenuGroupLabel } from "./group-label.js";
+import { MenuItem } from "./item.js";
+import { MenuItemIndicator } from "./item-indicator.js";
+import { MenuPopup } from "./popup.js";
+import { MenuRadioItem } from "./radio-item.js";
+import { MenuRoot } from "./root.js";
+import { MenuSeparator } from "./separator.js";
+import { MenuTrigger } from "./trigger.js";
 //#region src/ui/menu/index.parts.ts
 var index_parts_exports = /* @__PURE__ */ __exportAll({
 	CheckboxItem: () => MenuCheckboxItem,

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

@@ -1 +1 @@
-{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/menu/index.parts.ts"],"sourcesContent":["export {\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 { MenuGroupLabel as GroupLabel, type MenuGroupLabelProps as GroupLabelProps } from './menu-group-label';\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 { MenuPopup as Popup, type MenuPopupProps as PopupProps } from './menu-popup';\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';\n"],"mappings":""}
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/menu/index.parts.ts"],"sourcesContent":["export { MenuCheckboxItem as CheckboxItem, type MenuCheckboxItemProps as CheckboxItemProps } from './checkbox-item';\nexport { MenuContent as Content, type MenuContentProps as ContentProps } from './content';\nexport { MenuGroup as Group, type MenuGroupProps as GroupProps } from './group';\nexport { MenuGroupLabel as GroupLabel, type MenuGroupLabelProps as GroupLabelProps } from './group-label';\nexport { MenuItem as Item, type MenuItemProps as ItemProps } from './item';\nexport {\n  MenuItemIndicator as ItemIndicator,\n  type MenuItemIndicatorProps as ItemIndicatorProps,\n} from './item-indicator';\nexport { MenuPopup as Popup, type MenuPopupProps as PopupProps } from './popup';\nexport { MenuRadioGroup as RadioGroup, type MenuRadioGroupProps as RadioGroupProps } from './radio-group';\nexport { MenuRadioItem as RadioItem, type MenuRadioItemProps as RadioItemProps } from './radio-item';\nexport { MenuRoot as Root, type MenuRootProps as RootProps } from './root';\nexport { MenuSeparator as Separator, type MenuSeparatorProps as SeparatorProps } from './separator';\nexport { MenuTrigger as Trigger, type MenuTriggerProps as TriggerProps } from './trigger';\n"],"mappings":""}

package/dist/dev/ui/menu/item-indicator.d.ts

@@ -0,0 +1,18 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { MenuState } from "@videojs/core";
+//#region src/ui/menu/item-indicator.d.ts
+interface MenuItemIndicatorProps extends UIComponentProps<'span', MenuState> {
+  /** Whether the indicator is currently shown. Typically bound to the parent item's checked state. */
+  checked?: boolean;
+  /** When `true`, renders even when unchecked (useful for animating out). Defaults to `false`. */
+  forceMount?: boolean;
+}
+/** Visual indicator for a checked state. Only renders when `checked` is `true` (or `forceMount` is set). */
+declare const MenuItemIndicator: import("react").ForwardRefExoticComponent<Omit<MenuItemIndicatorProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+declare namespace MenuItemIndicator {
+  type Props = MenuItemIndicatorProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuItemIndicator, MenuItemIndicatorProps };
+//# sourceMappingURL=item-indicator.d.ts.map

package/dist/dev/ui/menu/item-indicator.js

@@ -0,0 +1,23 @@
+import { renderElement } from "../../utils/use-render.js";
+import { useMenuContext, useOptionalMenuRadioItemContext } from "./context.js";
+import { forwardRef } from "react";
+//#region src/ui/menu/item-indicator.tsx
+/** Visual indicator for a checked state. Only renders when `checked` is `true` (or `forceMount` is set). */
+const MenuItemIndicator = forwardRef(function MenuItemIndicator({ render, className, style, checked, forceMount = false, ...elementProps }, forwardedRef) {
+	const { state } = useMenuContext();
+	const itemChecked = useOptionalMenuRadioItemContext();
+	if (!(checked ?? itemChecked) && !forceMount) return null;
+	return renderElement("span", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		ref: [forwardedRef],
+		props: [{ "aria-hidden": true }, elementProps]
+	});
+});
+//#endregion
+export { MenuItemIndicator };
+
+//# sourceMappingURL=item-indicator.js.map

package/dist/dev/ui/menu/item-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-indicator.js","names":[],"sources":["../../../../src/ui/menu/item-indicator.tsx"],"sourcesContent":["import type { MenuState } from '@videojs/core';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useMenuContext, useOptionalMenuRadioItemContext } from './context';\n\nexport interface MenuItemIndicatorProps extends UIComponentProps<'span', MenuState> {\n  /** Whether the indicator is currently shown. Typically bound to the parent item's checked state. */\n  checked?: boolean;\n  /** When `true`, renders even when unchecked (useful for animating out). Defaults to `false`. */\n  forceMount?: boolean;\n}\n\n/** Visual indicator for a checked state. Only renders when `checked` is `true` (or `forceMount` is set). */\nexport const MenuItemIndicator = forwardRef<HTMLSpanElement, MenuItemIndicatorProps>(function MenuItemIndicator(\n  { render, className, style, checked, forceMount = false, ...elementProps },\n  forwardedRef\n) {\n  const { state } = useMenuContext();\n  const itemChecked = useOptionalMenuRadioItemContext();\n  const resolvedChecked = checked ?? itemChecked;\n  if (!resolvedChecked && !forceMount) return null;\n\n  return renderElement(\n    'span',\n    { render, className, style },\n    {\n      state,\n      ref: [forwardedRef],\n      props: [{ 'aria-hidden': true }, elementProps],\n    }\n  );\n});\n\nexport namespace MenuItemIndicator {\n  export type Props = MenuItemIndicatorProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;AAeA,MAAa,oBAAoB,WAAoD,SAAS,kBAC5F,EAAE,QAAQ,WAAW,OAAO,SAAS,aAAa,OAAO,GAAG,gBAC5D,cACA;CACA,MAAM,EAAE,UAAU,eAAe;CACjC,MAAM,cAAc,gCAAgC;CAEpD,IAAI,EADoB,WAAW,gBACX,CAAC,YAAY,OAAO;CAE5C,OAAO,cACL,QACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC,EAAE,eAAe,KAAK,GAAG,YAAY;CAC/C,CACF;AACF,CAAC"}

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

@@ -0,0 +1,18 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { MenuState } from "@videojs/core";
+//#region src/ui/menu/item.d.ts
+interface MenuItemProps extends UIComponentProps<'div', MenuState> {
+  /** Called when the item is selected. */
+  onSelect?: () => void;
+  /** Whether the item is disabled. */
+  disabled?: boolean;
+}
+/** A single action in the menu. Renders a `<div>` with `role="menuitem"`. */
+declare const MenuItem: import("react").ForwardRefExoticComponent<Omit<MenuItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace MenuItem {
+  type Props = MenuItemProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuItem, MenuItemProps };
+//# sourceMappingURL=item.d.ts.map

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

@@ -0,0 +1,133 @@
+import { renderElement } from "../../utils/use-render.js";
+import { useMenuContext } from "./context.js";
+import { completeMenuItemSelection } from "@videojs/core/dom";
+import { c } from "react-compiler-runtime";
+import { forwardRef, useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/menu/item.tsx
+/** A single action in the menu. Renders a `<div>` with `role="menuitem"`. */
+const MenuItem = forwardRef(function MenuItem(t0, forwardedRef) {
+	const $ = c(29);
+	let className;
+	let disabled;
+	let elementProps;
+	let onClick;
+	let onSelect;
+	let render;
+	let style;
+	if ($[0] !== t0) {
+		({render, className, style, onSelect, disabled, onClick, ...elementProps} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = disabled;
+		$[3] = elementProps;
+		$[4] = onClick;
+		$[5] = onSelect;
+		$[6] = render;
+		$[7] = style;
+	} else {
+		className = $[1];
+		disabled = $[2];
+		elementProps = $[3];
+		onClick = $[4];
+		onSelect = $[5];
+		render = $[6];
+		style = $[7];
+	}
+	const { menu, state } = useMenuContext();
+	const elementRef = useRef(null);
+	let t1;
+	let t2;
+	if ($[8] !== menu) {
+		t1 = () => {
+			const element = elementRef.current;
+			if (!element) return;
+			return menu.registerItem(element);
+		};
+		t2 = [menu];
+		$[8] = menu;
+		$[9] = t1;
+		$[10] = t2;
+	} else {
+		t1 = $[9];
+		t2 = $[10];
+	}
+	useEffect(t1, t2);
+	let t3;
+	if ($[11] !== disabled || $[12] !== menu || $[13] !== onClick || $[14] !== onSelect) {
+		t3 = (event) => {
+			if (disabled) return;
+			onClick?.(event);
+			if (event.defaultPrevented) return;
+			onSelect?.();
+			completeMenuItemSelection(menu);
+		};
+		$[11] = disabled;
+		$[12] = menu;
+		$[13] = onClick;
+		$[14] = onSelect;
+		$[15] = t3;
+	} else t3 = $[15];
+	const handleClick = t3;
+	let t4;
+	if ($[16] !== disabled || $[17] !== menu) {
+		t4 = () => {
+			const element_0 = elementRef.current;
+			if (!element_0 || disabled) return;
+			menu.highlight(element_0, {
+				focus: false,
+				pointer: true
+			});
+		};
+		$[16] = disabled;
+		$[17] = menu;
+		$[18] = t4;
+	} else t4 = $[18];
+	const handlePointerEnter = t4;
+	let t5;
+	if ($[19] !== className || $[20] !== disabled || $[21] !== elementProps || $[22] !== forwardedRef || $[23] !== handleClick || $[24] !== handlePointerEnter || $[25] !== render || $[26] !== state || $[27] !== style) {
+		t5 = /* @__PURE__ */ jsx(MenuItemContent, {
+			disabled,
+			elementProps,
+			onClick: handleClick,
+			onPointerEnter: handlePointerEnter,
+			render,
+			className,
+			style,
+			state,
+			forwardedRef,
+			elementRef
+		});
+		$[19] = className;
+		$[20] = disabled;
+		$[21] = elementProps;
+		$[22] = forwardedRef;
+		$[23] = handleClick;
+		$[24] = handlePointerEnter;
+		$[25] = render;
+		$[26] = state;
+		$[27] = style;
+		$[28] = t5;
+	} else t5 = $[28];
+	return t5;
+});
+function MenuItemContent({ disabled, elementProps, onClick, onPointerEnter, render, className, style, state, forwardedRef, elementRef }) {
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		ref: [forwardedRef, elementRef],
+		props: [{
+			role: "menuitem",
+			"aria-disabled": disabled ? true : void 0,
+			onClick,
+			onPointerEnter
+		}, elementProps]
+	});
+}
+//#endregion
+export { MenuItem };
+
+//# sourceMappingURL=item.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","names":["{ render, className, style, onSelect, disabled, onClick, ...elementProps }","() => {\n    const element = elementRef.current;\n    if (!element) return;\n\n    return menu.registerItem(element);\n  }","[menu]","(event: React.MouseEvent<HTMLDivElement>) => {\n      if (disabled) return;\n\n      onClick?.(event);\n\n      if (event.defaultPrevented) return;\n\n      onSelect?.();\n      completeMenuItemSelection(menu);\n    }","useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      if (disabled) return;\n\n      onClick?.(event);\n\n      if (event.defaultPrevented) return;\n\n      onSelect?.();\n      completeMenuItemSelection(menu);\n    },\n    [disabled, onClick, onSelect, menu]\n  )","() => {\n    const element = elementRef.current;\n    if (!element || disabled) return;\n\n    menu.highlight(element, { focus: false, pointer: true });\n  }","element","useCallback(() => {\n    const element = elementRef.current;\n    if (!element || disabled) return;\n\n    menu.highlight(element, { focus: false, pointer: true });\n  }, [menu, disabled])","<MenuItemContent\n      disabled={disabled}\n      elementProps={elementProps}\n      onClick={handleClick}\n      onPointerEnter={handlePointerEnter}\n      render={render}\n      className={className}\n      style={style}\n      state={state}\n      forwardedRef={forwardedRef}\n      elementRef={elementRef}\n    />"],"sources":["../../../../src/ui/menu/item.tsx"],"sourcesContent":["import type { MenuState } from '@videojs/core';\nimport { completeMenuItemSelection } from '@videojs/core/dom';\nimport { forwardRef, useCallback, useEffect, useRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useMenuContext } from './context';\n\nexport interface MenuItemProps extends UIComponentProps<'div', MenuState> {\n  /** Called when the item is selected. */\n  onSelect?: () => void;\n  /** Whether the item is disabled. */\n  disabled?: boolean;\n}\n\n/** A single action in the menu. Renders a `<div>` with `role=\"menuitem\"`. */\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(function MenuItem(\n  { render, className, style, onSelect, disabled, onClick, ...elementProps },\n  forwardedRef\n) {\n  const { menu, state } = useMenuContext();\n  const elementRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const element = elementRef.current;\n    if (!element) return;\n\n    return menu.registerItem(element);\n  }, [menu]);\n\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      if (disabled) return;\n\n      onClick?.(event);\n\n      if (event.defaultPrevented) return;\n\n      onSelect?.();\n      completeMenuItemSelection(menu);\n    },\n    [disabled, onClick, onSelect, menu]\n  );\n\n  const handlePointerEnter = useCallback(() => {\n    const element = elementRef.current;\n    if (!element || disabled) return;\n\n    menu.highlight(element, { focus: false, pointer: true });\n  }, [menu, disabled]);\n\n  return (\n    <MenuItemContent\n      disabled={disabled}\n      elementProps={elementProps}\n      onClick={handleClick}\n      onPointerEnter={handlePointerEnter}\n      render={render}\n      className={className}\n      style={style}\n      state={state}\n      forwardedRef={forwardedRef}\n      elementRef={elementRef}\n    />\n  );\n});\n\ninterface MenuItemContentProps {\n  disabled: boolean | undefined;\n  elementProps: Record<string, unknown>;\n  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;\n  onPointerEnter: () => void;\n  render: MenuItemProps['render'];\n  className: MenuItemProps['className'];\n  style: MenuItemProps['style'];\n  state: MenuState;\n  forwardedRef: React.ForwardedRef<HTMLDivElement>;\n  elementRef: React.RefObject<HTMLDivElement | null>;\n}\n\nfunction MenuItemContent({\n  disabled,\n  elementProps,\n  onClick,\n  onPointerEnter,\n  render,\n  className,\n  style,\n  state,\n  forwardedRef,\n  elementRef,\n}: MenuItemContentProps) {\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      ref: [forwardedRef, elementRef],\n      props: [\n        {\n          role: 'menuitem' as const,\n          'aria-disabled': disabled ? true : undefined,\n          onClick,\n          onPointerEnter,\n        },\n        elementProps,\n      ],\n    }\n  );\n}\n\nexport namespace MenuItem {\n  export type Props = MenuItemProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;;;AAgBA,MAAa,WAAW,WAA0C,SAAS,SAAA,IAEzE,cACA;;CAFU,IAAA;CAA4B,IAAA;CAAsB,IAAA;CAAZ,IAAA;CAApB,IAAA;CAA1B,IAAA;CAAmB,IAAA;CAArBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,QAAQ,WAAW,OAAO,UAAU,UAAU,YAAS,gBAAzDA;;;;;;;;;;;;;;;;;;CAGA,MAAM,EAAE,MAAM,UAAU,eAAe;CACvC,MAAM,aAAa,OAAuB,IAAI;CAEpCC,IAAAA;CAKPC,IAAAA;CADM,IAAA,EAAA,OAAA,MAAA;EAJC,WAAM;GACd,MAAM,UAAU,WAAW;GAC3B,IAAI,CAAC,SAAS;GAEd,OAAO,KAAK,aAAa,OAAO;EAClC;EAAG,KAAA,CAAC,IAAI;EADC,EAAA,KAAA;;;;;;;CAJT,UAAUD,IAKPC,EAAM;CAGPC,IAAAA;CACM,IAAA,EAAA,QAAA,YAAA,EAAA,QAOsB,QAAA,EAAA,QAL1B,WAAA,EAAA,QAIA,UAAA;EAPF,MAAC,UAA4C;GAC3C,IAAI,UAAU;GAEd,UAAU,KAAK;GAEf,IAAI,MAAM,kBAAkB;GAE5B,WAAW;GACX,0BAA0B,IAAI;EAChC;EARM,EAAA,MAAA;EAOsB,EAAA,MAAA;EAL1B,EAAA,MAAA;EAIA,EAAA,MAAA;;;CARJ,MAAM,cAAcC;CAcmBC,IAAAA;CAErB,IAAA,EAAA,QAAA,YAAA,EAAA,QAEhB,MAAA;EAJqC,WAAM;GAC3C,MAAMC,YAAU,WAAW;GAC3B,IAAI,CAACA,aAAW,UAAU;GAE1B,KAAK,UAAUA,WAAS;IAAE,OAAO;IAAO,SAAS;GAAK,CAAC;EACzD;EAHkB,EAAA,MAAA;EAEhB,EAAA,MAAA;;;CAJF,MAAM,qBAAqBC;CAQzBC,IAAAA;CAMa,IAAA,EAAA,QAAA,aAAA,EAAA,QALD,YAAA,EAAA,QACI,gBAAA,EAAA,QAOA,gBAAA,EAAA,QANL,eAAA,EAAA,QACO,sBAAA,EAAA,QACR,UAAA,EAAA,QAGD,SAAA,EAAA,QADA,OAAA;EAPT,KAAA,oBAAC,iBAAD;GACY;GACI;GACd,SAAS;GACT,gBAAgB;GACR;GACG;GACJ;GACA;GACO;GACF;EACb,CAAA;EALY,EAAA,MAAA;EALD,EAAA,MAAA;EACI,EAAA,MAAA;EAOA,EAAA,MAAA;EANL,EAAA,MAAA;EACO,EAAA,MAAA;EACR,EAAA,MAAA;EAGD,EAAA,MAAA;EADA,EAAA,MAAA;;;CARX,OACEA;AAaJ,CAAC;AAeD,SAAS,gBAAgB,EACvB,UACA,cACA,SACA,gBACA,QACA,WACA,OACA,OACA,cACA,cACuB;CACvB,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK,CAAC,cAAc,UAAU;EAC9B,OAAO,CACL;GACE,MAAM;GACN,iBAAiB,WAAW,OAAO,KAAA;GACnC;GACA;EACF,GACA,YACF;CACF,CACF;AACF"}

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

@@ -0,0 +1,31 @@
+import { isMenuNavigationKey } from "@videojs/core/dom";
+//#region src/ui/menu/keyboard.ts
+const preventedEvents = /* @__PURE__ */ new WeakSet();
+const canceledEvents = /* @__PURE__ */ new WeakSet();
+function preventMenuKeyDefault(event) {
+	if (event.key !== "Escape" && isMenuNavigationKey(event) && !event.defaultPrevented) {
+		event.preventDefault();
+		preventedEvents.add(event.nativeEvent);
+	}
+}
+function callKeyDownHandler(handler, event) {
+	const defaultPreventedBeforeHandler = event.defaultPrevented && (!preventedEvents.has(event.nativeEvent) || canceledEvents.has(event.nativeEvent));
+	if (!handler) return defaultPreventedBeforeHandler;
+	let defaultPreventedByHandler = false;
+	const preventDefault = event.preventDefault;
+	event.preventDefault = () => {
+		defaultPreventedByHandler = true;
+		preventDefault.call(event);
+	};
+	try {
+		handler(event);
+	} finally {
+		event.preventDefault = preventDefault;
+	}
+	if (defaultPreventedByHandler) canceledEvents.add(event.nativeEvent);
+	return defaultPreventedBeforeHandler || defaultPreventedByHandler;
+}
+//#endregion
+export { callKeyDownHandler, preventMenuKeyDefault };
+
+//# sourceMappingURL=keyboard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard.js","names":[],"sources":["../../../../src/ui/menu/keyboard.ts"],"sourcesContent":["import { isMenuNavigationKey } from '@videojs/core/dom';\n\nconst preventedEvents = new WeakSet<Event>();\nconst canceledEvents = new WeakSet<Event>();\n\n// Menu keys are prevented during capture before native player hotkeys run.\n// Track that internal prevention so bubble handlers can still honor a consumer\n// that calls preventDefault() to opt out of the built-in menu behavior.\nexport function preventMenuKeyDefault(event: React.KeyboardEvent<HTMLElement>): void {\n  if (event.key !== 'Escape' && isMenuNavigationKey(event) && !event.defaultPrevented) {\n    event.preventDefault();\n    preventedEvents.add(event.nativeEvent);\n  }\n}\n\nexport function callKeyDownHandler<T extends HTMLElement>(\n  handler: React.KeyboardEventHandler<T> | undefined,\n  event: React.KeyboardEvent<T>\n): boolean {\n  const defaultPreventedBeforeHandler =\n    event.defaultPrevented && (!preventedEvents.has(event.nativeEvent) || canceledEvents.has(event.nativeEvent));\n\n  if (!handler) return defaultPreventedBeforeHandler;\n\n  let defaultPreventedByHandler = false;\n  const preventDefault = event.preventDefault;\n\n  event.preventDefault = () => {\n    defaultPreventedByHandler = true;\n    preventDefault.call(event);\n  };\n\n  try {\n    handler(event);\n  } finally {\n    event.preventDefault = preventDefault;\n  }\n\n  if (defaultPreventedByHandler) canceledEvents.add(event.nativeEvent);\n\n  return defaultPreventedBeforeHandler || defaultPreventedByHandler;\n}\n"],"mappings":";;AAEA,MAAM,kCAAkB,IAAI,QAAe;AAC3C,MAAM,iCAAiB,IAAI,QAAe;AAK1C,SAAgB,sBAAsB,OAA+C;CACnF,IAAI,MAAM,QAAQ,YAAY,oBAAoB,KAAK,KAAK,CAAC,MAAM,kBAAkB;EACnF,MAAM,eAAe;EACrB,gBAAgB,IAAI,MAAM,WAAW;CACvC;AACF;AAEA,SAAgB,mBACd,SACA,OACS;CACT,MAAM,gCACJ,MAAM,qBAAqB,CAAC,gBAAgB,IAAI,MAAM,WAAW,KAAK,eAAe,IAAI,MAAM,WAAW;CAE5G,IAAI,CAAC,SAAS,OAAO;CAErB,IAAI,4BAA4B;CAChC,MAAM,iBAAiB,MAAM;CAE7B,MAAM,uBAAuB;EAC3B,4BAA4B;EAC5B,eAAe,KAAK,KAAK;CAC3B;CAEA,IAAI;EACF,QAAQ,KAAK;CACf,UAAU;EACR,MAAM,iBAAiB;CACzB;CAEA,IAAI,2BAA2B,eAAe,IAAI,MAAM,WAAW;CAEnE,OAAO,iCAAiC;AAC1C"}

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

@@ -0,0 +1,16 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { MenuState } from "@videojs/core";
+//#region src/ui/menu/popup.d.ts
+interface MenuPopupProps extends UIComponentProps<'div', MenuState> {
+  /** Keep the popup mounted, hidden, and inert while closed. */
+  keepMounted?: boolean;
+}
+/** Positioned menu surface that contains one or more sibling Content pages. */
+declare const MenuPopup: import("react").ForwardRefExoticComponent<Omit<MenuPopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace MenuPopup {
+  type Props = MenuPopupProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuPopup, MenuPopupProps };
+//# sourceMappingURL=popup.d.ts.map

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

@@ -0,0 +1,125 @@
+import { useComposedRefs } from "../../utils/use-composed-refs.js";
+import { useDestroy } from "../../utils/use-destroy.js";
+import { renderElement } from "../../utils/use-render.js";
+import { MenuPopupContextProvider, useMenuContext } from "./context.js";
+import { usePopupPosition } from "../popover/use-popup-position.js";
+import { MenuPopupDataAttrs } from "@videojs/core";
+import { MenuPositioningCSSVars, createMenuPopup, getRootPositionOptions } from "@videojs/core/dom";
+import { c } from "react-compiler-runtime";
+import { forwardRef, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/menu/popup.tsx
+/** Positioned menu surface that contains one or more sibling Content pages. */
+const MenuPopup = forwardRef(function MenuPopup(t0, forwardedRef) {
+	const $ = c(23);
+	const { render, className, style, onBlur, keepMounted: t1, ...elementProps } = t0;
+	const keepMounted = t1 === void 0 ? false : t1;
+	const { core, menu, parent, state, preferredSide, setPositionedSide, anchorName, boundary, container } = useMenuContext();
+	if (parent) throw new Error("Menu.Popup must be a direct child of a root Menu.Root");
+	const [popup] = useState(createMenuPopup);
+	const [popupElement, setPopupElement] = useState(null);
+	const internalRef = useRef(null);
+	let t2;
+	if ($[0] !== menu || $[1] !== popup) {
+		t2 = (element) => {
+			menu.setPopupElement(element);
+			popup.setElement(element);
+			setPopupElement(element);
+		};
+		$[0] = menu;
+		$[1] = popup;
+		$[2] = t2;
+	} else t2 = $[2];
+	const composedRef = useComposedRefs(forwardedRef, internalRef, t2);
+	let t3;
+	if ($[3] !== preferredSide || $[4] !== state.align) {
+		t3 = getRootPositionOptions(preferredSide, state.align);
+		$[3] = preferredSide;
+		$[4] = state.align;
+		$[5] = t3;
+	} else t3 = $[5];
+	const positionOptions = t3;
+	let t4;
+	if ($[6] !== anchorName || $[7] !== boundary || $[8] !== container || $[9] !== menu || $[10] !== positionOptions || $[11] !== setPositionedSide || $[12] !== state.open) {
+		t4 = {
+			open: state.open,
+			anchorName,
+			position: positionOptions,
+			triggerSource: menu,
+			popupRef: internalRef,
+			boundary,
+			container,
+			cssVars: MenuPositioningCSSVars,
+			trackResize: false,
+			onSideChange: setPositionedSide
+		};
+		$[6] = anchorName;
+		$[7] = boundary;
+		$[8] = container;
+		$[9] = menu;
+		$[10] = positionOptions;
+		$[11] = setPositionedSide;
+		$[12] = state.open;
+		$[13] = t4;
+	} else t4 = $[13];
+	const positioningStyle = usePopupPosition(t4);
+	useDestroy(popup);
+	const inactive = !state.open && state.status !== "ending";
+	if (inactive && !keepMounted) return null;
+	let t5;
+	if ($[14] !== menu.contentProps || $[15] !== onBlur) {
+		t5 = (event) => {
+			onBlur?.(event);
+			menu.contentProps.onFocusOut(event);
+		};
+		$[14] = menu.contentProps;
+		$[15] = onBlur;
+		$[16] = t5;
+	} else t5 = $[16];
+	const popupNode = renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: MenuPopupDataAttrs,
+		ref: composedRef,
+		props: [
+			{
+				style: positioningStyle,
+				...core.getPopupAttrs()
+			},
+			{ onBlur: t5 },
+			elementProps,
+			{
+				hidden: inactive,
+				inert: inactive || void 0
+			}
+		]
+	});
+	let t6;
+	if ($[17] !== popup || $[18] !== popupElement) {
+		t6 = {
+			popup,
+			element: popupElement
+		};
+		$[17] = popup;
+		$[18] = popupElement;
+		$[19] = t6;
+	} else t6 = $[19];
+	let t7;
+	if ($[20] !== popupNode || $[21] !== t6) {
+		t7 = /* @__PURE__ */ jsx(MenuPopupContextProvider, {
+			value: t6,
+			children: popupNode
+		});
+		$[20] = popupNode;
+		$[21] = t6;
+		$[22] = t7;
+	} else t7 = $[22];
+	return t7;
+});
+//#endregion
+export { MenuPopup };
+
+//# sourceMappingURL=popup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"popup.js","names":["{ render, className, style, onBlur, keepMounted = false, ...elementProps }","keepMounted = false","(element: HTMLDivElement | null) => {\n      menu.setPopupElement(element);\n      popup.setElement(element);\n      setPopupElement(element);\n    }","useCallback(\n    (element: HTMLDivElement | null) => {\n      menu.setPopupElement(element);\n      popup.setElement(element);\n      setPopupElement(element);\n    },\n    [menu, popup]\n  )","getRootPositionOptions(preferredSide, state.align)","align","useMemo(\n    () => getRootPositionOptions(preferredSide, state.align),\n    [preferredSide, state.align]\n  )","{\n    open: state.open,\n    anchorName,\n    position: positionOptions,\n    triggerSource: menu,\n    popupRef: internalRef,\n    boundary,\n    container,\n    cssVars: MenuPositioningCSSVars,\n    trackResize: false,\n    onSideChange: setPositionedSide,\n  }","open","(event: React.FocusEvent<HTMLDivElement>) => {\n            onBlur?.(event);\n            menu.contentProps.onFocusOut(event);\n          }","contentProps","{ popup, element: popupElement }","<MenuPopupContextProvider value={{ popup, element: popupElement }}>{popupNode}</MenuPopupContextProvider>"],"sources":["../../../../src/ui/menu/popup.tsx"],"sourcesContent":["import { MenuPopupDataAttrs, type MenuState } from '@videojs/core';\nimport { createMenuPopup, getRootPositionOptions, MenuPositioningCSSVars } from '@videojs/core/dom';\nimport { forwardRef, useCallback, useMemo, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { renderElement } from '../../utils/use-render';\nimport { usePopupPosition } from '../popover/use-popup-position';\nimport { MenuPopupContextProvider, useMenuContext } from './context';\n\nexport interface MenuPopupProps extends UIComponentProps<'div', MenuState> {\n  /** Keep the popup mounted, hidden, and inert while closed. */\n  keepMounted?: boolean;\n}\n\n/** Positioned menu surface that contains one or more sibling Content pages. */\nexport const MenuPopup = forwardRef<HTMLDivElement, MenuPopupProps>(function MenuPopup(\n  { render, className, style, onBlur, keepMounted = false, ...elementProps },\n  forwardedRef\n) {\n  const { core, menu, parent, state, preferredSide, setPositionedSide, anchorName, boundary, container } =\n    useMenuContext();\n  if (__DEV__ && parent) throw new Error('Menu.Popup must be a direct child of a root Menu.Root');\n\n  const [popup] = useState(createMenuPopup);\n  const [popupElement, setPopupElement] = useState<HTMLElement | null>(null);\n  const internalRef = useRef<HTMLDivElement>(null);\n  const setInternalElement = useCallback(\n    (element: HTMLDivElement | null) => {\n      menu.setPopupElement(element);\n      popup.setElement(element);\n      setPopupElement(element);\n    },\n    [menu, popup]\n  );\n  const composedRef = useComposedRefs(forwardedRef, internalRef, setInternalElement);\n  const positionOptions = useMemo(\n    () => getRootPositionOptions(preferredSide, state.align),\n    [preferredSide, state.align]\n  );\n  const positioningStyle = usePopupPosition({\n    open: state.open,\n    anchorName,\n    position: positionOptions,\n    triggerSource: menu,\n    popupRef: internalRef,\n    boundary,\n    container,\n    cssVars: MenuPositioningCSSVars,\n    trackResize: false,\n    onSideChange: setPositionedSide,\n  });\n\n  useDestroy(popup);\n\n  const inactive = !state.open && state.status !== 'ending';\n  if (inactive && !keepMounted) return null;\n\n  const popupNode = renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap: MenuPopupDataAttrs,\n      ref: composedRef,\n      props: [\n        { style: positioningStyle, ...core.getPopupAttrs() },\n        {\n          onBlur: (event: React.FocusEvent<HTMLDivElement>) => {\n            onBlur?.(event);\n            menu.contentProps.onFocusOut(event);\n          },\n        },\n        elementProps,\n        { hidden: inactive, inert: inactive || undefined },\n      ],\n    }\n  );\n\n  return <MenuPopupContextProvider value={{ popup, element: popupElement }}>{popupNode}</MenuPopupContextProvider>;\n});\n\nexport namespace MenuPopup {\n  export type Props = MenuPopupProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAa,YAAY,WAA2C,SAAS,UAAA,IAE3E,cACA;;CAFA,MAAA,EAAE,QAAQ,WAAW,OAAO,QAAQ,aAAA,IAAqB,GAAG,iBAA5DA;CAAoC,MAAA,cAAA,OAAA,KAAA,IAAc,QAAdC;CAGpC,MAAM,EAAE,MAAM,MAAM,QAAQ,OAAO,eAAe,mBAAmB,YAAY,UAAU,cACzF,eAAe;CACjB,IAAe,QAAQ,MAAM,IAAI,MAAM,uDAAuD;CAE9F,MAAM,CAAC,SAAS,SAAS,eAAe;CACxC,MAAM,CAAC,cAAc,mBAAmB,SAA6B,IAAI;CACzE,MAAM,cAAc,OAAuB,IAAI;CAE7CC,IAAAA;CACE,IAAA,EAAA,OAAA,QAAA,EAAA,OACA,OAAA;EAFF,MAAC,YAAmC;GAClC,KAAK,gBAAgB,OAAO;GAC5B,MAAM,WAAW,OAAO;GACxB,gBAAgB,OAAO;EACzB;EAHE,EAAA,KAAA;EACA,EAAA,KAAA;;;CAKJ,MAAM,cAAc,gBAAgB,cAAc,aAAa,EAAkB;CAEzEE,IAAAA;CAAuB,IAAA,EAAA,OAAA,iBAAA,EAAA,OAAqBC,MAAAA,OAAAA;EAA5C,KAAA,uBAAuB,eAAe,MAAM,KAAK;EAA1B,EAAA,KAAA;EAAqBA,EAAAA,KAAAA,MAAAA;;;CADpD,MAAM,kBAAkBC;CAIkBC,IAAAA;CAExC,IAAA,EAAA,OAAA,cAAA,EAAA,OAIA,YAAA,EAAA,OACA,aAAA,EAAA,OAHe,QAAA,EAAA,QADL,mBAAA,EAAA,QAOI,qBAAA,EAAA,QATFC,MAAAA,MAAAA;EAD4B,KAAA;GACxC,MAAM,MAAM;GACZ;GACA,UAAU;GACV,eAAe;GACf,UAAU;GACV;GACA;GACA,SAAS;GACT,aAAa;GACb,cAAc;EAChB;EATE,EAAA,KAAA;EAIA,EAAA,KAAA;EACA,EAAA,KAAA;EAHe,EAAA,KAAA;EADL,EAAA,MAAA;EAOI,EAAA,MAAA;EATFA,EAAAA,MAAAA,MAAAA;;;CADd,MAAM,mBAAmB,iBAAiBD,EAWzC;CAED,WAAW,KAAK;CAEhB,MAAM,WAAW,CAAC,MAAM,QAAQ,MAAM,WAAW;CACjD,IAAI,YAAY,CAAC,aAAa,OAAO;CAYrBE,IAAAA;CAEDC,IAAAA,EAAAA,QAAAA,KAAAA,gBAAAA,EAAAA,QADL,QAAA;EADM,MAAC,UAA4C;GACnD,SAAS,KAAK;GACd,KAAK,aAAa,WAAW,KAAK;EACpC;EADOA,EAAAA,MAAAA,KAAAA;EADL,EAAA,MAAA;;;CAXV,MAAM,YAAY,cAChB,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,cAAc;EACd,KAAK;EACL,OAAO;GACL;IAAE,OAAO;IAAkB,GAAG,KAAK,cAAc;GAAE;GACnD,EACE,QAAQD,GAIV;GACA;GACA;IAAE,QAAQ;IAAU,OAAO,YAAY,KAAA;GAAU;EACnD;CACF,CACF;CAEwCE,IAAAA;CAAE,IAAA,EAAA,QAAA,SAAA,EAAA,QAAgB,cAAA;EAAlB,KAAA;GAAE;GAAO,SAAS;EAAa;EAA7B,EAAA,MAAA;EAAgB,EAAA,MAAA;;;CAAnDC,IAAAA;CAAoE,IAAA,EAAA,QAAA,aAAA,EAAA,QAAnCD,IAAAA;EAAjC,KAAA,oBAAC,0BAAD;GAA0B,OAAOA;GAAmC,UAAA;EAAoC,CAAA;EAApC,EAAA,MAAA;EAAnCA,EAAAA,MAAAA;;;CAAxC,OAAOC;AACT,CAAC"}

package/dist/dev/ui/menu/radio-group.d.ts

@@ -0,0 +1,18 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { MenuState } from "@videojs/core";
+//#region src/ui/menu/radio-group.d.ts
+interface MenuRadioGroupProps extends UIComponentProps<'div', MenuState> {
+  /** The currently selected value. */
+  value: string;
+  /** Called when the user selects a radio item. */
+  onValueChange: (value: string) => void;
+}
+/** A group of mutually exclusive radio items. Renders a `<div>` with `role="group"`. */
+declare const MenuRadioGroup: import("react").ForwardRefExoticComponent<Omit<MenuRadioGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace MenuRadioGroup {
+  type Props = MenuRadioGroupProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuRadioGroup, MenuRadioGroupProps };
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/dev/ui/menu/radio-group.js

@@ -0,0 +1,67 @@
+import { renderElement } from "../../utils/use-render.js";
+import { MenuRadioGroupContextProvider, useMenuContext } from "./context.js";
+import { MenuGroupProvider, getMenuGroupProps } from "./use-menu-group.js";
+import { c } from "react-compiler-runtime";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/menu/radio-group.tsx
+/** A group of mutually exclusive radio items. Renders a `<div>` with `role="group"`. */
+const MenuRadioGroup = forwardRef(function MenuRadioGroup(t0, forwardedRef) {
+	const $ = c(16);
+	let className;
+	let elementProps;
+	let onValueChange;
+	let render;
+	let style;
+	let value;
+	if ($[0] !== t0) {
+		({render, className, style, value, onValueChange, ...elementProps} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = elementProps;
+		$[3] = onValueChange;
+		$[4] = render;
+		$[5] = style;
+		$[6] = value;
+	} else {
+		className = $[1];
+		elementProps = $[2];
+		onValueChange = $[3];
+		render = $[4];
+		style = $[5];
+		value = $[6];
+	}
+	const { state } = useMenuContext();
+	let t1;
+	if ($[7] !== className || $[8] !== elementProps || $[9] !== forwardedRef || $[10] !== onValueChange || $[11] !== render || $[12] !== state || $[13] !== style || $[14] !== value) {
+		t1 = /* @__PURE__ */ jsx(MenuGroupProvider, { children: (labelId) => /* @__PURE__ */ jsx(MenuRadioGroupContextProvider, {
+			value: {
+				value,
+				onValueChange
+			},
+			children: renderElement("div", {
+				render,
+				className,
+				style
+			}, {
+				state,
+				ref: [forwardedRef],
+				props: [getMenuGroupProps(labelId, elementProps), elementProps]
+			})
+		}) });
+		$[7] = className;
+		$[8] = elementProps;
+		$[9] = forwardedRef;
+		$[10] = onValueChange;
+		$[11] = render;
+		$[12] = state;
+		$[13] = style;
+		$[14] = value;
+		$[15] = t1;
+	} else t1 = $[15];
+	return t1;
+});
+//#endregion
+export { MenuRadioGroup };
+
+//# sourceMappingURL=radio-group.js.map

package/dist/dev/ui/menu/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","names":["{ render, className, style, value, onValueChange, ...elementProps }","<MenuGroupProvider>\n      {(labelId) => (\n        <MenuRadioGroupContextProvider value={{ value, onValueChange }}>\n          {renderElement(\n            'div',\n            { render, className, style },\n            {\n              state,\n              ref: [forwardedRef],\n              props: [getMenuGroupProps(labelId, elementProps), elementProps],\n            }\n          )}\n        </MenuRadioGroupContextProvider>\n      )}\n    </MenuGroupProvider>"],"sources":["../../../../src/ui/menu/radio-group.tsx"],"sourcesContent":["import type { MenuState } from '@videojs/core';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { MenuRadioGroupContextProvider, useMenuContext } from './context';\nimport { getMenuGroupProps, MenuGroupProvider } from './use-menu-group';\n\nexport interface MenuRadioGroupProps extends UIComponentProps<'div', MenuState> {\n  /** The currently selected value. */\n  value: string;\n  /** Called when the user selects a radio item. */\n  onValueChange: (value: string) => void;\n}\n\n/** A group of mutually exclusive radio items. Renders a `<div>` with `role=\"group\"`. */\nexport const MenuRadioGroup = forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioGroup(\n  { render, className, style, value, onValueChange, ...elementProps },\n  forwardedRef\n) {\n  const { state } = useMenuContext();\n\n  return (\n    <MenuGroupProvider>\n      {(labelId) => (\n        <MenuRadioGroupContextProvider value={{ value, onValueChange }}>\n          {renderElement(\n            'div',\n            { render, className, style },\n            {\n              state,\n              ref: [forwardedRef],\n              props: [getMenuGroupProps(labelId, elementProps), elementProps],\n            }\n          )}\n        </MenuRadioGroupContextProvider>\n      )}\n    </MenuGroupProvider>\n  );\n});\n\nexport namespace MenuRadioGroup {\n  export type Props = MenuRadioGroupProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;;;AAgBA,MAAa,iBAAiB,WAAgD,SAAS,eAAA,IAErF,cACA;;CAFU,IAAA;CAA2C,IAAA;CAAlB,IAAA;CAAjC,IAAA;CAAmB,IAAA;CAAO,IAAA;CAA5BA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,QAAQ,WAAW,OAAO,OAAO,kBAAe,gBAAlDA;;;;;;;;;;;;;;;;CAGA,MAAM,EAAE,UAAU,eAAe;CAG/BC,IAAAA;CAKkB,IAAA,EAAA,OAAA,aAAA,EAAA,OAI2B,gBAAA,EAAA,OAD7B,gBAAA,EAAA,QANmC,iBAAA,EAAA,QAGzC,UAAA,EAAA,QAEA,SAAA,EAAA,QAFmB,SAAA,EAAA,QAHe,OAAA;EAF5C,KAAA,oBAAC,mBAAD,EAAA,WACI,YACA,oBAAC,+BAAD;GAA+B,OAAO;IAAE;IAAO;GAAc;GAC1D,UAAA,cACC,OACA;IAAE;IAAQ;IAAW;GAAM,GAC3B;IACE;IACA,KAAK,CAAC,YAAY;IAClB,OAAO,CAAC,kBAAkB,SAAS,YAAY,GAAG,YAAY;GAChE,CACF;EAC6B,CAAA,EAEhB,CAAA;EATD,EAAA,KAAA;EAI2B,EAAA,KAAA;EAD7B,EAAA,KAAA;EANmC,EAAA,MAAA;EAGzC,EAAA,MAAA;EAEA,EAAA,MAAA;EAFmB,EAAA,MAAA;EAHe,EAAA,MAAA;;;CAH9C,OACEA;AAgBJ,CAAC"}

package/dist/dev/ui/menu/radio-item.d.ts

@@ -0,0 +1,18 @@
+import { UIComponentProps } from "../../utils/types.js";
+import { MenuState } from "@videojs/core";
+//#region src/ui/menu/radio-item.d.ts
+interface MenuRadioItemProps extends UIComponentProps<'div', MenuState> {
+  /** The value this item represents. */
+  value: string;
+  /** Whether the item is disabled. */
+  disabled?: boolean;
+}
+/** A radio-style menu item. Renders a `<div>` with `role="menuitemradio"`. */
+declare const MenuRadioItem: import("react").ForwardRefExoticComponent<Omit<MenuRadioItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare namespace MenuRadioItem {
+  type Props = MenuRadioItemProps;
+  type State = MenuState;
+}
+//#endregion
+export { MenuRadioItem, MenuRadioItemProps };
+//# sourceMappingURL=radio-item.d.ts.map