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

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

@@ -1,21 +1,51 @@
 import { renderElement } from "../../utils/use-render.js";
 import { 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/group.tsx
 /** Groups related menu items. Renders a `<div>` with `role="group"`. */
-const MenuGroup = forwardRef(function MenuGroup({ render, className, style, ...elementProps }, forwardedRef) {
+const MenuGroup = forwardRef(function MenuGroup(t0, forwardedRef) {
+	const $ = c(12);
+	let className;
+	let elementProps;
+	let render;
+	let style;
+	if ($[0] !== t0) {
+		({render, className, style, ...elementProps} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = elementProps;
+		$[3] = render;
+		$[4] = style;
+	} else {
+		className = $[1];
+		elementProps = $[2];
+		render = $[3];
+		style = $[4];
+	}
 	const { state } = useMenuContext();
-	return /* @__PURE__ */ jsx(MenuGroupProvider, { children: (labelId) => renderElement("div", {
-		render,
-		className,
-		style
-	}, {
-		state,
-		ref: [forwardedRef],
-		props: [getMenuGroupProps(labelId, elementProps), elementProps]
-	}) });
+	let t1;
+	if ($[5] !== className || $[6] !== elementProps || $[7] !== forwardedRef || $[8] !== render || $[9] !== state || $[10] !== style) {
+		t1 = /* @__PURE__ */ jsx(MenuGroupProvider, { children: (labelId) => renderElement("div", {
+			render,
+			className,
+			style
+		}, {
+			state,
+			ref: [forwardedRef],
+			props: [getMenuGroupProps(labelId, elementProps), elementProps]
+		}) });
+		$[5] = className;
+		$[6] = elementProps;
+		$[7] = forwardedRef;
+		$[8] = render;
+		$[9] = state;
+		$[10] = style;
+		$[11] = t1;
+	} else t1 = $[11];
+	return t1;
 });
 //#endregion
 export { MenuGroup };

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

@@ -1 +1 @@
-{"version":3,"file":"group.js","names":[],"sources":["../../../../src/ui/menu/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 { useMenuContext } from './context';\nimport { getMenuGroupProps, MenuGroupProvider } from './use-menu-group';\n\nexport interface MenuGroupProps extends UIComponentProps<'div', MenuState> {}\n\n/** Groups related menu items. Renders a `<div>` with `role=\"group\"`. */\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuGroupProps>(function MenuGroup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { state } = useMenuContext();\n\n  return (\n    <MenuGroupProvider>\n      {(labelId) =>\n        renderElement(\n          'div',\n          { render, className, style },\n          {\n            state,\n            ref: [forwardedRef],\n            props: [getMenuGroupProps(labelId, elementProps), elementProps],\n          }\n        )\n      }\n    </MenuGroupProvider>\n  );\n});\n\nexport namespace MenuGroup {\n  export type Props = MenuGroupProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;;AAWA,MAAa,YAAY,WAA2C,SAAS,UAC3E,EAAE,QAAQ,WAAW,OAAO,GAAG,gBAC/B,cACA;CACA,MAAM,EAAE,UAAU,eAAe;CAEjC,OACE,oBAAC,mBAAD,EAAA,WACI,YACA,cACE,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA,KAAK,CAAC,YAAY;EAClB,OAAO,CAAC,kBAAkB,SAAS,YAAY,GAAG,YAAY;CAChE,CACF,EAEe,CAAA;AAEvB,CAAC"}
+{"version":3,"file":"group.js","names":["{ render, className, style, ...elementProps }","<MenuGroupProvider>\n      {(labelId) =>\n        renderElement(\n          'div',\n          { render, className, style },\n          {\n            state,\n            ref: [forwardedRef],\n            props: [getMenuGroupProps(labelId, elementProps), elementProps],\n          }\n        )\n      }\n    </MenuGroupProvider>"],"sources":["../../../../src/ui/menu/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 { useMenuContext } from './context';\nimport { getMenuGroupProps, MenuGroupProvider } from './use-menu-group';\n\nexport interface MenuGroupProps extends UIComponentProps<'div', MenuState> {}\n\n/** Groups related menu items. Renders a `<div>` with `role=\"group\"`. */\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuGroupProps>(function MenuGroup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { state } = useMenuContext();\n\n  return (\n    <MenuGroupProvider>\n      {(labelId) =>\n        renderElement(\n          'div',\n          { render, className, style },\n          {\n            state,\n            ref: [forwardedRef],\n            props: [getMenuGroupProps(labelId, elementProps), elementProps],\n          }\n        )\n      }\n    </MenuGroupProvider>\n  );\n});\n\nexport namespace MenuGroup {\n  export type Props = MenuGroupProps;\n  export type State = MenuState;\n}\n"],"mappings":";;;;;;;;AAWA,MAAa,YAAY,WAA2C,SAAS,UAAA,IAE3E,cACA;;CAFU,IAAA;CAAqB,IAAA;CAA7B,IAAA;CAAmB,IAAA;CAArBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,QAAQ,WAAW,UAAO,gBAA5BA;;;;;;;;;;;;CAGA,MAAM,EAAE,UAAU,eAAe;CAG/BC,IAAAA;CAIgB,IAAA,EAAA,OAAA,aAAA,EAAA,OAI2B,gBAAA,EAAA,OAD7B,gBAAA,EAAA,OAHN,UAAA,EAAA,OAEA,SAAA,EAAA,QAFmB,OAAA;EAJ3B,KAAA,oBAAC,mBAAD,EAAA,WACI,YACA,cACE,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,KAAK,CAAC,YAAY;GAClB,OAAO,CAAC,kBAAkB,SAAS,YAAY,GAAG,YAAY;EAChE,CACF,EAEe,CAAA;EARH,EAAA,KAAA;EAI2B,EAAA,KAAA;EAD7B,EAAA,KAAA;EAHN,EAAA,KAAA;EAEA,EAAA,KAAA;EAFmB,EAAA,MAAA;;;CAL7B,OACEA;AAcJ,CAAC"}

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

@@ -1,50 +1,115 @@
 import { renderElement } from "../../utils/use-render.js";
 import { useMenuContext } from "./context.js";
 import { completeMenuItemSelection } from "@videojs/core/dom";
-import { forwardRef, useCallback, useEffect, useRef } from "react";
+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({ render, className, style, onSelect, disabled, onClick, ...elementProps }, forwardedRef) {
+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);
-	useEffect(() => {
-		const element = elementRef.current;
-		if (!element) return;
-		return menu.registerItem(element);
-	}, [menu]);
-	const handleClick = useCallback((event) => {
-		if (disabled) return;
-		onClick?.(event);
-		if (event.defaultPrevented) return;
-		onSelect?.();
-		completeMenuItemSelection(menu);
-	}, [
-		disabled,
-		onClick,
-		onSelect,
-		menu
-	]);
-	const handlePointerEnter = useCallback(() => {
-		const element = elementRef.current;
-		if (!element || disabled) return;
-		menu.highlight(element, {
-			focus: false,
-			pointer: true
+	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
 		});
-	}, [menu, disabled]);
-	return /* @__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", {

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

@@ -1 +1 @@
-{"version":3,"file":"item.js","names":[],"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,SACzE,EAAE,QAAQ,WAAW,OAAO,UAAU,UAAU,SAAS,GAAG,gBAC5D,cACA;CACA,MAAM,EAAE,MAAM,UAAU,eAAe;CACvC,MAAM,aAAa,OAAuB,IAAI;CAE9C,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,IAAI,CAAC,SAAS;EAEd,OAAO,KAAK,aAAa,OAAO;CAClC,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,cAAc,aACjB,UAA4C;EAC3C,IAAI,UAAU;EAEd,UAAU,KAAK;EAEf,IAAI,MAAM,kBAAkB;EAE5B,WAAW;EACX,0BAA0B,IAAI;CAChC,GACA;EAAC;EAAU;EAAS;EAAU;CAAI,CACpC;CAEA,MAAM,qBAAqB,kBAAkB;EAC3C,MAAM,UAAU,WAAW;EAC3B,IAAI,CAAC,WAAW,UAAU;EAE1B,KAAK,UAAU,SAAS;GAAE,OAAO;GAAO,SAAS;EAAK,CAAC;CACzD,GAAG,CAAC,MAAM,QAAQ,CAAC;CAEnB,OACE,oBAAC,iBAAD;EACY;EACI;EACd,SAAS;EACT,gBAAgB;EACR;EACG;EACJ;EACA;EACO;EACF;CACb,CAAA;AAEL,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"}
+{"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/popup.js

@@ -5,38 +5,77 @@ 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 { forwardRef, useCallback, useMemo, useRef, useState } from "react";
+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({ render, className, style, onBlur, keepMounted = false, ...elementProps }, forwardedRef) {
+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);
-	const setInternalElement = useCallback((element) => {
-		menu.setPopupElement(element);
-		popup.setElement(element);
-		setPopupElement(element);
-	}, [menu, popup]);
-	const composedRef = useComposedRefs(forwardedRef, internalRef, setInternalElement);
-	const positionOptions = useMemo(() => getRootPositionOptions(preferredSide, state.align), [preferredSide, state.align]);
-	const positioningStyle = usePopupPosition({
-		open: state.open,
-		anchorName,
-		position: positionOptions,
-		triggerSource: menu,
-		popupRef: internalRef,
-		boundary,
-		container,
-		cssVars: MenuPositioningCSSVars,
-		trackResize: false,
-		onSideChange: setPositionedSide
-	});
+	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,
@@ -50,10 +89,7 @@ const MenuPopup = forwardRef(function MenuPopup({ render, className, style, onBl
 				style: positioningStyle,
 				...core.getPopupAttrs()
 			},
-			{ onBlur: (event) => {
-				onBlur?.(event);
-				menu.contentProps.onFocusOut(event);
-			} },
+			{ onBlur: t5 },
 			elementProps,
 			{
 				hidden: inactive,
@@ -61,13 +97,27 @@ const MenuPopup = forwardRef(function MenuPopup({ render, className, style, onBl
 			}
 		]
 	});
-	return /* @__PURE__ */ jsx(MenuPopupContextProvider, {
-		value: {
+	let t6;
+	if ($[17] !== popup || $[18] !== popupElement) {
+		t6 = {
 			popup,
 			element: popupElement
-		},
-		children: popupNode
-	});
+		};
+		$[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 };

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

@@ -1 +1 @@
-{"version":3,"file":"popup.js","names":[],"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,UAC3E,EAAE,QAAQ,WAAW,OAAO,QAAQ,cAAc,OAAO,GAAG,gBAC5D,cACA;CACA,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;CAC/C,MAAM,qBAAqB,aACxB,YAAmC;EAClC,KAAK,gBAAgB,OAAO;EAC5B,MAAM,WAAW,OAAO;EACxB,gBAAgB,OAAO;CACzB,GACA,CAAC,MAAM,KAAK,CACd;CACA,MAAM,cAAc,gBAAgB,cAAc,aAAa,kBAAkB;CACjF,MAAM,kBAAkB,cAChB,uBAAuB,eAAe,MAAM,KAAK,GACvD,CAAC,eAAe,MAAM,KAAK,CAC7B;CACA,MAAM,mBAAmB,iBAAiB;EACxC,MAAM,MAAM;EACZ;EACA,UAAU;EACV,eAAe;EACf,UAAU;EACV;EACA;EACA,SAAS;EACT,aAAa;EACb,cAAc;CAChB,CAAC;CAED,WAAW,KAAK;CAEhB,MAAM,WAAW,CAAC,MAAM,QAAQ,MAAM,WAAW;CACjD,IAAI,YAAY,CAAC,aAAa,OAAO;CAErC,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,SAAS,UAA4C;IACnD,SAAS,KAAK;IACd,KAAK,aAAa,WAAW,KAAK;GACpC,EACF;GACA;GACA;IAAE,QAAQ;IAAU,OAAO,YAAY,KAAA;GAAU;EACnD;CACF,CACF;CAEA,OAAO,oBAAC,0BAAD;EAA0B,OAAO;GAAE;GAAO,SAAS;EAAa;EAAI,UAAA;CAAoC,CAAA;AACjH,CAAC"}
+{"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.js

@@ -1,27 +1,65 @@
 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({ render, className, style, value, onValueChange, ...elementProps }, forwardedRef) {
+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();
-	return /* @__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]
-		})
-	}) });
+	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 };

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

@@ -1 +1 @@
-{"version":3,"file":"radio-group.js","names":[],"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,eACrF,EAAE,QAAQ,WAAW,OAAO,OAAO,eAAe,GAAG,gBACrD,cACA;CACA,MAAM,EAAE,UAAU,eAAe;CAEjC,OACE,oBAAC,mBAAD,EAAA,WACI,YACA,oBAAC,+BAAD;EAA+B,OAAO;GAAE;GAAO;EAAc;EAC1D,UAAA,cACC,OACA;GAAE;GAAQ;GAAW;EAAM,GAC3B;GACE;GACA,KAAK,CAAC,YAAY;GAClB,OAAO,CAAC,kBAAkB,SAAS,YAAY,GAAG,YAAY;EAChE,CACF;CAC6B,CAAA,EAEhB,CAAA;AAEvB,CAAC"}
+{"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"}