@videojs/react 10.0.0-beta.25 → 10.0.0-beta.26

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

@@ -1 +1 @@
-{"version":3,"file":"use-menu-group.js","names":[],"sources":["../../../../src/ui/menu/use-menu-group.tsx"],"sourcesContent":["'use client';\n\nimport { type ReactElement, useCallback, useMemo, useState } from 'react';\n\nimport { MenuGroupContextProvider } from './context';\n\ninterface MenuGroupProviderProps {\n  children: (labelId: string | undefined) => ReactElement | null;\n}\n\ninterface MenuGroupElementProps {\n  'aria-label'?: unknown;\n  'aria-labelledby'?: unknown;\n}\n\nfunction hasExplicitLabel(elementProps: MenuGroupElementProps): boolean {\n  return elementProps['aria-label'] !== undefined || elementProps['aria-labelledby'] !== undefined;\n}\n\nexport function getMenuGroupProps(\n  labelId: string | undefined,\n  elementProps: MenuGroupElementProps\n): { role: 'group'; 'aria-labelledby'?: string | undefined } {\n  return {\n    role: 'group',\n    'aria-labelledby': hasExplicitLabel(elementProps) ? undefined : labelId,\n  };\n}\n\nexport function MenuGroupProvider({ children }: MenuGroupProviderProps): ReactElement | null {\n  const [labelId, setLabelId] = useState<string>();\n\n  const registerLabel = useCallback((id: string) => {\n    setLabelId(id);\n\n    return () => {\n      setLabelId((current) => (current === id ? undefined : current));\n    };\n  }, []);\n\n  const value = useMemo(() => ({ registerLabel }), [registerLabel]);\n\n  return <MenuGroupContextProvider value={value}>{children(labelId)}</MenuGroupContextProvider>;\n}\n"],"mappings":";;;;;AAeA,SAAS,iBAAiB,cAA8C;AACtE,QAAO,aAAa,kBAAkB,KAAA,KAAa,aAAa,uBAAuB,KAAA;;AAGzF,SAAgB,kBACd,SACA,cAC2D;AAC3D,QAAO;EACL,MAAM;EACN,mBAAmB,iBAAiB,aAAa,GAAG,KAAA,IAAY;EACjE;;AAGH,SAAgB,kBAAkB,EAAE,YAAyD;CAC3F,MAAM,CAAC,SAAS,cAAc,UAAkB;CAEhD,MAAM,gBAAgB,aAAa,OAAe;AAChD,aAAW,GAAG;AAEd,eAAa;AACX,eAAY,YAAa,YAAY,KAAK,KAAA,IAAY,QAAS;;IAEhE,EAAE,CAAC;AAIN,QAAO,oBAAC,0BAAD;EAA0B,OAFnB,eAAe,EAAE,eAAe,GAAG,CAAC,cAAc,CAAC;YAEjB,SAAS,QAAQ;EAA4B,CAAA"}
+{"version":3,"file":"use-menu-group.js","names":[],"sources":["../../../../src/ui/menu/use-menu-group.tsx"],"sourcesContent":["'use client';\n\nimport { type ReactElement, useCallback, useMemo, useState } from 'react';\n\nimport { MenuGroupContextProvider } from './context';\n\ninterface MenuGroupProviderProps {\n  children: (labelId: string | undefined) => ReactElement | null;\n}\n\ninterface MenuGroupElementProps {\n  'aria-label'?: unknown;\n  'aria-labelledby'?: unknown;\n}\n\nfunction hasExplicitLabel(elementProps: MenuGroupElementProps): boolean {\n  return elementProps['aria-label'] !== undefined || elementProps['aria-labelledby'] !== undefined;\n}\n\nexport function getMenuGroupProps(\n  labelId: string | undefined,\n  elementProps: MenuGroupElementProps\n): { role: 'group'; 'aria-labelledby'?: string | undefined } {\n  return {\n    role: 'group',\n    'aria-labelledby': hasExplicitLabel(elementProps) ? undefined : labelId,\n  };\n}\n\nexport function MenuGroupProvider({ children }: MenuGroupProviderProps): ReactElement | null {\n  const [labelId, setLabelId] = useState<string>();\n\n  const registerLabel = useCallback((id: string) => {\n    setLabelId(id);\n\n    return () => {\n      setLabelId((current) => (current === id ? undefined : current));\n    };\n  }, []);\n\n  const value = useMemo(() => ({ registerLabel }), [registerLabel]);\n\n  return <MenuGroupContextProvider value={value}>{children(labelId)}</MenuGroupContextProvider>;\n}\n"],"mappings":";;;;;AAeA,SAAS,iBAAiB,cAA8C;CACtE,OAAO,aAAa,kBAAkB,KAAA,KAAa,aAAa,uBAAuB,KAAA;AACzF;AAEA,SAAgB,kBACd,SACA,cAC2D;CAC3D,OAAO;EACL,MAAM;EACN,mBAAmB,iBAAiB,YAAY,IAAI,KAAA,IAAY;CAClE;AACF;AAEA,SAAgB,kBAAkB,EAAE,YAAyD;CAC3F,MAAM,CAAC,SAAS,cAAc,SAAiB;CAE/C,MAAM,gBAAgB,aAAa,OAAe;EAChD,WAAW,EAAE;EAEb,aAAa;GACX,YAAY,YAAa,YAAY,KAAK,KAAA,IAAY,OAAQ;EAChE;CACF,GAAG,CAAC,CAAC;CAIL,OAAO,oBAAC,0BAAD;EAA0B,OAFnB,eAAe,EAAE,cAAc,IAAI,CAAC,aAAa,CAEnB;EAAI,UAAA,SAAS,OAAO;CAA4B,CAAA;AAC9F"}

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

@@ -1,11 +1,9 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { MuteButtonCore } from "@videojs/core";
-
 //#region src/ui/mute-button/mute-button.d.ts
 interface MuteButtonProps extends UIComponentProps<'button', MuteButtonCore.State>, MuteButtonCore.Props {}
 /** A button that toggles mute state. */
-declare const MuteButton: _$react.ForwardRefExoticComponent<MuteButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
+declare const MuteButton: import("react").ForwardRefExoticComponent<MuteButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 declare namespace MuteButton {
   type Props = MuteButtonProps;
   type State = MuteButtonCore.State;

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

@@ -1 +1 @@
-{"version":3,"file":"mute-button.d.ts","names":[],"sources":["../../../../src/ui/mute-button/mute-button.tsx"],"mappings":";;;;;UAQiB,eAAA,SAAwB,gBAAA,WAA2B,cAAA,CAAe,KAAA,GAAQ,cAAA,CAAe,KAAA;;cAG7F,UAAA,EAAU,OAAA,CAAA,yBAAA,CAAA,eAAA,GAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBASN,UAAA;EAAA,KACH,KAAA,GAAQ,eAAA;EAAA,KACR,KAAA,GAAQ,cAAA,CAAe,KAAA;AAAA"}
+{"version":3,"file":"mute-button.d.ts","names":[],"sources":["../../../../src/ui/mute-button/mute-button.tsx"],"mappings":";;;UAQiB,wBAAwB,2BAA2B,eAAe,QAAQ,eAAe;;cAG7F,4BAAU,0BAAA,kCAAA,cAAA;kBASN;OACH,QAAQ;OACR,QAAQ,eAAe"}

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

@@ -1 +1 @@
-{"version":3,"file":"mute-button.js","names":[],"sources":["../../../../src/ui/mute-button/mute-button.tsx"],"sourcesContent":["'use client';\n\nimport { MuteButtonCore, MuteButtonDataAttrs } from '@videojs/core';\nimport { selectVolume } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface MuteButtonProps extends UIComponentProps<'button', MuteButtonCore.State>, MuteButtonCore.Props {}\n\n/** A button that toggles mute state. */\nexport const MuteButton = createMediaButton<MuteButtonCore, MuteButtonProps>({\n  displayName: 'MuteButton',\n  core: MuteButtonCore,\n  stateAttrMap: MuteButtonDataAttrs,\n  selector: selectVolume,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'toggleMuted',\n});\n\nexport namespace MuteButton {\n  export type Props = MuteButtonProps;\n  export type State = MuteButtonCore.State;\n}\n"],"mappings":";;;;;;AAWA,MAAa,aAAa,kBAAmD;CAC3E,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,MAAM;CAC3C,cAAc;CACf,CAAC"}
+{"version":3,"file":"mute-button.js","names":[],"sources":["../../../../src/ui/mute-button/mute-button.tsx"],"sourcesContent":["'use client';\n\nimport { MuteButtonCore, MuteButtonDataAttrs } from '@videojs/core';\nimport { selectVolume } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface MuteButtonProps extends UIComponentProps<'button', MuteButtonCore.State>, MuteButtonCore.Props {}\n\n/** A button that toggles mute state. */\nexport const MuteButton = createMediaButton<MuteButtonCore, MuteButtonProps>({\n  displayName: 'MuteButton',\n  core: MuteButtonCore,\n  stateAttrMap: MuteButtonDataAttrs,\n  selector: selectVolume,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'toggleMuted',\n});\n\nexport namespace MuteButton {\n  export type Props = MuteButtonProps;\n  export type State = MuteButtonCore.State;\n}\n"],"mappings":";;;;;;AAWA,MAAa,aAAa,kBAAmD;CAC3E,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,KAAK;CAC1C,cAAc;AAChB,CAAC"}

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

@@ -1,11 +1,9 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PiPButtonCore } from "@videojs/core";
-
 //#region src/ui/pip-button/pip-button.d.ts
 interface PiPButtonProps extends UIComponentProps<'button', PiPButtonCore.State>, PiPButtonCore.Props {}
 /** A button that toggles picture-in-picture. */
-declare const PiPButton: _$react.ForwardRefExoticComponent<PiPButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
+declare const PiPButton: import("react").ForwardRefExoticComponent<PiPButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 declare namespace PiPButton {
   type Props = PiPButtonProps;
   type State = PiPButtonCore.State;

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

@@ -1 +1 @@
-{"version":3,"file":"pip-button.d.ts","names":[],"sources":["../../../../src/ui/pip-button/pip-button.tsx"],"mappings":";;;;;UAQiB,cAAA,SAAuB,gBAAA,WAA2B,aAAA,CAAc,KAAA,GAAQ,aAAA,CAAc,KAAA;;cAG1F,SAAA,EAAS,OAAA,CAAA,yBAAA,CAAA,cAAA,GAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBASL,SAAA;EAAA,KACH,KAAA,GAAQ,cAAA;EAAA,KACR,KAAA,GAAQ,aAAA,CAAc,KAAA;AAAA"}
+{"version":3,"file":"pip-button.d.ts","names":[],"sources":["../../../../src/ui/pip-button/pip-button.tsx"],"mappings":";;;UAQiB,uBAAuB,2BAA2B,cAAc,QAAQ,cAAc;;cAG1F,2BAAS,0BAAA,iCAAA,cAAA;kBAUL;OACH,QAAQ;OACR,QAAQ,cAAc"}

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

@@ -10,7 +10,8 @@ const PiPButton = createMediaButton({
 	stateAttrMap: PiPButtonDataAttrs,
 	selector: selectPiP,
 	action: (core, state) => core.toggle(state),
-	hotkeyAction: "togglePictureInPicture"
+	hotkeyAction: "togglePictureInPicture",
+	isSupported: (state) => !state.hidden
 });
 //#endregion
 export { PiPButton };

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

@@ -1 +1 @@
-{"version":3,"file":"pip-button.js","names":[],"sources":["../../../../src/ui/pip-button/pip-button.tsx"],"sourcesContent":["'use client';\n\nimport { PiPButtonCore, PiPButtonDataAttrs } from '@videojs/core';\nimport { selectPiP } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PiPButtonProps extends UIComponentProps<'button', PiPButtonCore.State>, PiPButtonCore.Props {}\n\n/** A button that toggles picture-in-picture. */\nexport const PiPButton = createMediaButton<PiPButtonCore, PiPButtonProps>({\n  displayName: 'PiPButton',\n  core: PiPButtonCore,\n  stateAttrMap: PiPButtonDataAttrs,\n  selector: selectPiP,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'togglePictureInPicture',\n});\n\nexport namespace PiPButton {\n  export type Props = PiPButtonProps;\n  export type State = PiPButtonCore.State;\n}\n"],"mappings":";;;;;;AAWA,MAAa,YAAY,kBAAiD;CACxE,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,MAAM;CAC3C,cAAc;CACf,CAAC"}
+{"version":3,"file":"pip-button.js","names":[],"sources":["../../../../src/ui/pip-button/pip-button.tsx"],"sourcesContent":["'use client';\n\nimport { PiPButtonCore, PiPButtonDataAttrs } from '@videojs/core';\nimport { selectPiP } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PiPButtonProps extends UIComponentProps<'button', PiPButtonCore.State>, PiPButtonCore.Props {}\n\n/** A button that toggles picture-in-picture. */\nexport const PiPButton = createMediaButton<PiPButtonCore, PiPButtonProps>({\n  displayName: 'PiPButton',\n  core: PiPButtonCore,\n  stateAttrMap: PiPButtonDataAttrs,\n  selector: selectPiP,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'togglePictureInPicture',\n  isSupported: (state) => !state.hidden,\n});\n\nexport namespace PiPButton {\n  export type Props = PiPButtonProps;\n  export type State = PiPButtonCore.State;\n}\n"],"mappings":";;;;;;AAWA,MAAa,YAAY,kBAAiD;CACxE,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,KAAK;CAC1C,cAAc;CACd,cAAc,UAAU,CAAC,MAAM;AACjC,CAAC"}

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

@@ -1,7 +1,5 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PlayButtonCore } from "@videojs/core";
-
 //#region src/ui/play-button/play-button.d.ts
 interface PlayButtonProps extends UIComponentProps<'button', PlayButtonCore.State>, PlayButtonCore.Props {}
 /**
@@ -20,7 +18,7 @@ interface PlayButtonProps extends UIComponentProps<'button', PlayButtonCore.Stat
  * />
  * ```
  */
-declare const PlayButton: _$react.ForwardRefExoticComponent<PlayButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
+declare const PlayButton: import("react").ForwardRefExoticComponent<PlayButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 declare namespace PlayButton {
   type Props = PlayButtonProps;
   type State = PlayButtonCore.State;

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

@@ -1 +1 @@
-{"version":3,"file":"play-button.d.ts","names":[],"sources":["../../../../src/ui/play-button/play-button.tsx"],"mappings":";;;;;UAQiB,eAAA,SAAwB,gBAAA,WAA2B,cAAA,CAAe,KAAA,GAAQ,cAAA,CAAe,KAAA;;AAA1G;;;;;;;;;;;;;;;cAkBa,UAAA,EAAU,OAAA,CAAA,yBAAA,CAAA,eAAA,GAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBASN,UAAA;EAAA,KACH,KAAA,GAAQ,eAAA;EAAA,KACR,KAAA,GAAQ,cAAA,CAAe,KAAA;AAAA"}
+{"version":3,"file":"play-button.d.ts","names":[],"sources":["../../../../src/ui/play-button/play-button.tsx"],"mappings":";;;UAQiB,wBAAwB,2BAA2B,eAAe,QAAQ,eAAe;;;;;;;;;;;;;;;;;cAkB7F,4BAAU,0BAAA,kCAAA,cAAA;kBASN;OACH,QAAQ;OACR,QAAQ,eAAe"}

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

@@ -1 +1 @@
-{"version":3,"file":"play-button.js","names":[],"sources":["../../../../src/ui/play-button/play-button.tsx"],"sourcesContent":["'use client';\n\nimport { PlayButtonCore, PlayButtonDataAttrs } from '@videojs/core';\nimport { selectPlayback } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PlayButtonProps extends UIComponentProps<'button', PlayButtonCore.State>, PlayButtonCore.Props {}\n\n/**\n * A button that toggles playback.\n *\n * @example\n * ```tsx\n * <PlayButton />\n *\n * <PlayButton\n *   render={(props, state) => (\n *     <button {...props}>\n *       {state.paused ? <PlayIcon /> : <PauseIcon />}\n *     </button>\n *   )}\n * />\n * ```\n */\nexport const PlayButton = createMediaButton<PlayButtonCore, PlayButtonProps>({\n  displayName: 'PlayButton',\n  core: PlayButtonCore,\n  stateAttrMap: PlayButtonDataAttrs,\n  selector: selectPlayback,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'togglePaused',\n});\n\nexport namespace PlayButton {\n  export type Props = PlayButtonProps;\n  export type State = PlayButtonCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA0BA,MAAa,aAAa,kBAAmD;CAC3E,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,MAAM;CAC3C,cAAc;CACf,CAAC"}
+{"version":3,"file":"play-button.js","names":[],"sources":["../../../../src/ui/play-button/play-button.tsx"],"sourcesContent":["'use client';\n\nimport { PlayButtonCore, PlayButtonDataAttrs } from '@videojs/core';\nimport { selectPlayback } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PlayButtonProps extends UIComponentProps<'button', PlayButtonCore.State>, PlayButtonCore.Props {}\n\n/**\n * A button that toggles playback.\n *\n * @example\n * ```tsx\n * <PlayButton />\n *\n * <PlayButton\n *   render={(props, state) => (\n *     <button {...props}>\n *       {state.paused ? <PlayIcon /> : <PauseIcon />}\n *     </button>\n *   )}\n * />\n * ```\n */\nexport const PlayButton = createMediaButton<PlayButtonCore, PlayButtonProps>({\n  displayName: 'PlayButton',\n  core: PlayButtonCore,\n  stateAttrMap: PlayButtonDataAttrs,\n  selector: selectPlayback,\n  action: (core, state) => core.toggle(state),\n  hotkeyAction: 'togglePaused',\n});\n\nexport namespace PlayButton {\n  export type Props = PlayButtonProps;\n  export type State = PlayButtonCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA0BA,MAAa,aAAa,kBAAmD;CAC3E,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,KAAK;CAC1C,cAAc;AAChB,CAAC"}

package/dist/dev/ui/playback-rate/use-playback-rate-options.d.ts

@@ -1,5 +1,4 @@
 import { PlaybackRateRadioGroupCore } from "@videojs/core";
-
 //#region src/ui/playback-rate/use-playback-rate-options.d.ts
 interface PlaybackRateOptionsProps extends PlaybackRateRadioGroupCore.Props {}
 interface PlaybackRateOption {
@@ -17,6 +16,12 @@ interface PlaybackRateOptionsResult {
   setRate: (rate: number) => void;
   setValue: (value: string) => void;
 }
+/**
+ * Create playback rate menu options from the player playback rate state.
+ * Returns `null` when the playback rate feature is not configured.
+ *
+ * @param props - Optional `label`, `formatRate`, and `disabled` overrides.
+ */
 declare function usePlaybackRateOptions(props?: PlaybackRateOptionsProps): PlaybackRateOptionsResult | null;
 declare namespace usePlaybackRateOptions {
   type Props = PlaybackRateOptionsProps;

package/dist/dev/ui/playback-rate/use-playback-rate-options.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-playback-rate-options.d.ts","names":[],"sources":["../../../../src/ui/playback-rate/use-playback-rate-options.ts"],"mappings":";;;UAWiB,wBAAA,SAAiC,0BAAA,CAA2B,KAAA;AAAA,UAE5D,kBAAA;EACf,IAAA;EACA,KAAA;EACA,KAAA;EACA,QAAA;AAAA;AAAA,UAGe,yBAAA;EACf,KAAA,EAAO,0BAAA,CAA2B,KAAA;EAClC,IAAA;EACA,KAAA;EACA,OAAA,EAAS,kBAAA;EACT,QAAA;EACA,OAAA,GAAU,IAAA;EACV,QAAA,GAAW,KAAA;AAAA;AAAA,iBAGG,sBAAA,CAAuB,KAAA,GAAQ,wBAAA,GAA2B,yBAAA;AAAA,kBAiCzD,sBAAA;EAAA,KACH,KAAA,GAAQ,wBAAA;EAAA,KACR,MAAA,GAAS,yBAAA;EAAA,KACT,MAAA,GAAS,kBAAA;AAAA"}
+{"version":3,"file":"use-playback-rate-options.d.ts","names":[],"sources":["../../../../src/ui/playback-rate/use-playback-rate-options.ts"],"mappings":";;UAWiB,iCAAiC,2BAA2B;UAE5D;EACf;EACA;EACA;EACA;;UAGe;EACf,OAAO,2BAA2B;EAClC;EACA;EACA,SAAS;EACT;EACA,UAAU;EACV,WAAW;;;;;;;;iBASG,uBAAuB,QAAQ,2BAA2B;kBAiCzD;OACH,QAAQ;OACR,SAAS;OACT,SAAS"}

package/dist/dev/ui/playback-rate/use-playback-rate-options.js

@@ -4,6 +4,12 @@ import { logMissingFeature, selectPlaybackRate } from "@videojs/core/dom";
 import { useCallback, useState } from "react";
 import { PlaybackRateRadioGroupCore } from "@videojs/core";
 //#region src/ui/playback-rate/use-playback-rate-options.ts
+/**
+* Create playback rate menu options from the player playback rate state.
+* Returns `null` when the playback rate feature is not configured.
+*
+* @param props - Optional `label`, `formatRate`, and `disabled` overrides.
+*/
 function usePlaybackRateOptions(props) {
 	const media = usePlayer(selectPlaybackRate);
 	const [core] = useState(() => new PlaybackRateRadioGroupCore());

package/dist/dev/ui/playback-rate/use-playback-rate-options.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-playback-rate-options.js","names":["PlaybackRateRadioGroupCoreClass"],"sources":["../../../../src/ui/playback-rate/use-playback-rate-options.ts"],"sourcesContent":["'use client';\n\nimport {\n  type PlaybackRateRadioGroupCore,\n  PlaybackRateRadioGroupCore as PlaybackRateRadioGroupCoreClass,\n} from '@videojs/core';\nimport { logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport { useCallback, useState } from 'react';\n\nimport { usePlayer } from '../../player/context';\n\nexport interface PlaybackRateOptionsProps extends PlaybackRateRadioGroupCore.Props {}\n\nexport interface PlaybackRateOption {\n  rate: number;\n  value: string;\n  label: string;\n  disabled: boolean;\n}\n\nexport interface PlaybackRateOptionsResult {\n  state: PlaybackRateRadioGroupCore.State;\n  rate: number;\n  value: string;\n  options: PlaybackRateOption[];\n  disabled: boolean;\n  setRate: (rate: number) => void;\n  setValue: (value: string) => void;\n}\n\nexport function usePlaybackRateOptions(props?: PlaybackRateOptionsProps): PlaybackRateOptionsResult | null {\n  const media = usePlayer(selectPlaybackRate);\n  const [core] = useState(() => new PlaybackRateRadioGroupCoreClass());\n\n  core.setProps(props ?? {});\n\n  const setRate = useCallback((rate: number) => core.select(media!, rate), [core, media]);\n  const setValue = useCallback((value: string) => core.selectValue(media!, value), [core, media]);\n\n  if (!media) {\n    if (__DEV__) logMissingFeature('usePlaybackRateOptions', selectPlaybackRate.displayName ?? 'playbackRate');\n    return null;\n  }\n\n  core.setMedia(media);\n  const state = core.getState();\n\n  return {\n    state,\n    rate: state.rate,\n    value: core.getRateValue(state.rate),\n    options: state.rates.map((rate) => ({\n      rate,\n      value: core.getRateValue(rate),\n      label: core.getRateLabel(rate),\n      disabled: state.disabled,\n    })),\n    disabled: state.disabled,\n    setRate,\n    setValue,\n  };\n}\n\nexport namespace usePlaybackRateOptions {\n  export type Props = PlaybackRateOptionsProps;\n  export type Result = PlaybackRateOptionsResult;\n  export type Option = PlaybackRateOption;\n}\n"],"mappings":";;;;;;AA8BA,SAAgB,uBAAuB,OAAoE;CACzG,MAAM,QAAQ,UAAU,mBAAmB;CAC3C,MAAM,CAAC,QAAQ,eAAe,IAAIA,4BAAiC,CAAC;AAEpE,MAAK,SAAS,SAAS,EAAE,CAAC;CAE1B,MAAM,UAAU,aAAa,SAAiB,KAAK,OAAO,OAAQ,KAAK,EAAE,CAAC,MAAM,MAAM,CAAC;CACvF,MAAM,WAAW,aAAa,UAAkB,KAAK,YAAY,OAAQ,MAAM,EAAE,CAAC,MAAM,MAAM,CAAC;AAE/F,KAAI,CAAC,OAAO;AACG,oBAAkB,0BAA0B,mBAAmB,eAAe,eAAe;AAC1G,SAAO;;AAGT,MAAK,SAAS,MAAM;CACpB,MAAM,QAAQ,KAAK,UAAU;AAE7B,QAAO;EACL;EACA,MAAM,MAAM;EACZ,OAAO,KAAK,aAAa,MAAM,KAAK;EACpC,SAAS,MAAM,MAAM,KAAK,UAAU;GAClC;GACA,OAAO,KAAK,aAAa,KAAK;GAC9B,OAAO,KAAK,aAAa,KAAK;GAC9B,UAAU,MAAM;GACjB,EAAE;EACH,UAAU,MAAM;EAChB;EACA;EACD"}
+{"version":3,"file":"use-playback-rate-options.js","names":["PlaybackRateRadioGroupCoreClass"],"sources":["../../../../src/ui/playback-rate/use-playback-rate-options.ts"],"sourcesContent":["'use client';\n\nimport {\n  type PlaybackRateRadioGroupCore,\n  PlaybackRateRadioGroupCore as PlaybackRateRadioGroupCoreClass,\n} from '@videojs/core';\nimport { logMissingFeature, selectPlaybackRate } from '@videojs/core/dom';\nimport { useCallback, useState } from 'react';\n\nimport { usePlayer } from '../../player/context';\n\nexport interface PlaybackRateOptionsProps extends PlaybackRateRadioGroupCore.Props {}\n\nexport interface PlaybackRateOption {\n  rate: number;\n  value: string;\n  label: string;\n  disabled: boolean;\n}\n\nexport interface PlaybackRateOptionsResult {\n  state: PlaybackRateRadioGroupCore.State;\n  rate: number;\n  value: string;\n  options: PlaybackRateOption[];\n  disabled: boolean;\n  setRate: (rate: number) => void;\n  setValue: (value: string) => void;\n}\n\n/**\n * Create playback rate menu options from the player playback rate state.\n * Returns `null` when the playback rate feature is not configured.\n *\n * @param props - Optional `label`, `formatRate`, and `disabled` overrides.\n */\nexport function usePlaybackRateOptions(props?: PlaybackRateOptionsProps): PlaybackRateOptionsResult | null {\n  const media = usePlayer(selectPlaybackRate);\n  const [core] = useState(() => new PlaybackRateRadioGroupCoreClass());\n\n  core.setProps(props ?? {});\n\n  const setRate = useCallback((rate: number) => core.select(media!, rate), [core, media]);\n  const setValue = useCallback((value: string) => core.selectValue(media!, value), [core, media]);\n\n  if (!media) {\n    if (__DEV__) logMissingFeature('usePlaybackRateOptions', selectPlaybackRate.displayName ?? 'playbackRate');\n    return null;\n  }\n\n  core.setMedia(media);\n  const state = core.getState();\n\n  return {\n    state,\n    rate: state.rate,\n    value: core.getRateValue(state.rate),\n    options: state.rates.map((rate) => ({\n      rate,\n      value: core.getRateValue(rate),\n      label: core.getRateLabel(rate),\n      disabled: state.disabled,\n    })),\n    disabled: state.disabled,\n    setRate,\n    setValue,\n  };\n}\n\nexport namespace usePlaybackRateOptions {\n  export type Props = PlaybackRateOptionsProps;\n  export type Result = PlaybackRateOptionsResult;\n  export type Option = PlaybackRateOption;\n}\n"],"mappings":";;;;;;;;;;;;AAoCA,SAAgB,uBAAuB,OAAoE;CACzG,MAAM,QAAQ,UAAU,kBAAkB;CAC1C,MAAM,CAAC,QAAQ,eAAe,IAAIA,2BAAgC,CAAC;CAEnE,KAAK,SAAS,SAAS,CAAC,CAAC;CAEzB,MAAM,UAAU,aAAa,SAAiB,KAAK,OAAO,OAAQ,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC;CACtF,MAAM,WAAW,aAAa,UAAkB,KAAK,YAAY,OAAQ,KAAK,GAAG,CAAC,MAAM,KAAK,CAAC;CAE9F,IAAI,CAAC,OAAO;EACG,kBAAkB,0BAA0B,mBAAmB,eAAe,cAAc;EACzG,OAAO;CACT;CAEA,KAAK,SAAS,KAAK;CACnB,MAAM,QAAQ,KAAK,SAAS;CAE5B,OAAO;EACL;EACA,MAAM,MAAM;EACZ,OAAO,KAAK,aAAa,MAAM,IAAI;EACnC,SAAS,MAAM,MAAM,KAAK,UAAU;GAClC;GACA,OAAO,KAAK,aAAa,IAAI;GAC7B,OAAO,KAAK,aAAa,IAAI;GAC7B,UAAU,MAAM;EAClB,EAAE;EACF,UAAU,MAAM;EAChB;EACA;CACF;AACF"}

package/dist/dev/ui/playback-rate-button/playback-rate-button.d.ts

@@ -1,7 +1,5 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PlaybackRateButtonCore } from "@videojs/core";
-
 //#region src/ui/playback-rate-button/playback-rate-button.d.ts
 interface PlaybackRateButtonProps extends UIComponentProps<'button', PlaybackRateButtonCore.State>, PlaybackRateButtonCore.Props {}
 /**
@@ -20,7 +18,7 @@ interface PlaybackRateButtonProps extends UIComponentProps<'button', PlaybackRat
  * />
  * ```
  */
-declare const PlaybackRateButton: _$react.ForwardRefExoticComponent<PlaybackRateButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
+declare const PlaybackRateButton: import("react").ForwardRefExoticComponent<PlaybackRateButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
 declare namespace PlaybackRateButton {
   type Props = PlaybackRateButtonProps;
   type State = PlaybackRateButtonCore.State;

package/dist/dev/ui/playback-rate-button/playback-rate-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"playback-rate-button.d.ts","names":[],"sources":["../../../../src/ui/playback-rate-button/playback-rate-button.tsx"],"mappings":";;;;;UAQiB,uBAAA,SACP,gBAAA,WAA2B,sBAAA,CAAuB,KAAA,GACxD,sBAAA,CAAuB,KAAA;;AAF3B;;;;;;;;;;;;;;;cAoBa,kBAAA,EAAkB,OAAA,CAAA,yBAAA,CAAA,uBAAA,GAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBASd,kBAAA;EAAA,KACH,KAAA,GAAQ,uBAAA;EAAA,KACR,KAAA,GAAQ,sBAAA,CAAuB,KAAA;AAAA"}
+{"version":3,"file":"playback-rate-button.d.ts","names":[],"sources":["../../../../src/ui/playback-rate-button/playback-rate-button.tsx"],"mappings":";;;UAQiB,gCACP,2BAA2B,uBAAuB,QACxD,uBAAuB;;;;;;;;;;;;;;;;;cAkBd,oCAAkB,0BAAA,0CAAA,cAAA;kBASd;OACH,QAAQ;OACR,QAAQ,uBAAuB"}

package/dist/dev/ui/playback-rate-button/playback-rate-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"playback-rate-button.js","names":[],"sources":["../../../../src/ui/playback-rate-button/playback-rate-button.tsx"],"sourcesContent":["'use client';\n\nimport { PlaybackRateButtonCore, PlaybackRateButtonDataAttrs } from '@videojs/core';\nimport { selectPlaybackRate } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PlaybackRateButtonProps\n  extends UIComponentProps<'button', PlaybackRateButtonCore.State>,\n    PlaybackRateButtonCore.Props {}\n\n/**\n * A button that cycles through playback rates.\n *\n * @example\n * ```tsx\n * <PlaybackRateButton />\n *\n * <PlaybackRateButton\n *   render={(props, state) => (\n *     <button {...props}>\n *       {state.rate}&times;\n *     </button>\n *   )}\n * />\n * ```\n */\nexport const PlaybackRateButton = createMediaButton<PlaybackRateButtonCore, PlaybackRateButtonProps>({\n  displayName: 'PlaybackRateButton',\n  core: PlaybackRateButtonCore,\n  stateAttrMap: PlaybackRateButtonDataAttrs,\n  selector: selectPlaybackRate,\n  action: (core, state) => core.cycle(state),\n  hotkeyAction: 'speedUp',\n});\n\nexport namespace PlaybackRateButton {\n  export type Props = PlaybackRateButtonProps;\n  export type State = PlaybackRateButtonCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4BA,MAAa,qBAAqB,kBAAmE;CACnG,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,MAAM,MAAM;CAC1C,cAAc;CACf,CAAC"}
+{"version":3,"file":"playback-rate-button.js","names":[],"sources":["../../../../src/ui/playback-rate-button/playback-rate-button.tsx"],"sourcesContent":["'use client';\n\nimport { PlaybackRateButtonCore, PlaybackRateButtonDataAttrs } from '@videojs/core';\nimport { selectPlaybackRate } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface PlaybackRateButtonProps\n  extends UIComponentProps<'button', PlaybackRateButtonCore.State>,\n    PlaybackRateButtonCore.Props {}\n\n/**\n * A button that cycles through playback rates.\n *\n * @example\n * ```tsx\n * <PlaybackRateButton />\n *\n * <PlaybackRateButton\n *   render={(props, state) => (\n *     <button {...props}>\n *       {state.rate}&times;\n *     </button>\n *   )}\n * />\n * ```\n */\nexport const PlaybackRateButton = createMediaButton<PlaybackRateButtonCore, PlaybackRateButtonProps>({\n  displayName: 'PlaybackRateButton',\n  core: PlaybackRateButtonCore,\n  stateAttrMap: PlaybackRateButtonDataAttrs,\n  selector: selectPlaybackRate,\n  action: (core, state) => core.cycle(state),\n  hotkeyAction: 'speedUp',\n});\n\nexport namespace PlaybackRateButton {\n  export type Props = PlaybackRateButtonProps;\n  export type State = PlaybackRateButtonCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4BA,MAAa,qBAAqB,kBAAmE;CACnG,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,MAAM,KAAK;CACzC,cAAc;AAChB,CAAC"}

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

@@ -1,11 +1,12 @@
 import { MediaContainer, PopoverApi, PositioningBoundary } from "@videojs/core/dom";
 import { PopoverCore, StateAttrMap as StateAttrMap$1 } from "@videojs/core";
-
 //#region src/ui/popover/context.d.ts
 interface PopoverContextValue {
   core: PopoverCore;
   popover: PopoverApi;
   state: PopoverCore.State;
+  preferredSide: PopoverCore.State['side'];
+  setPositionedSide: (side: PopoverCore.State['side']) => void;
   stateAttrMap: StateAttrMap$1<PopoverCore.State>;
   anchorName: string;
   popupId: string;

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

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"mappings":";;;;UAMiB,mBAAA;EACf,IAAA,EAAM,WAAA;EACN,OAAA,EAAS,UAAA;EACT,KAAA,EAAO,WAAA,CAAY,KAAA;EACnB,YAAA,EAAc,cAAA,CAAa,WAAA,CAAY,KAAA;EACvC,UAAA;EACA,OAAA;EACA,QAAA,EAAU,mBAAA;EACV,SAAA,EAAW,cAAA;AAAA;AAAA,iBAOG,iBAAA,CAAA,GAAqB,mBAAA"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"mappings":";;;UAMiB;EACf,MAAM;EACN,SAAS;EACT,OAAO,YAAY;EACnB,eAAe,YAAY;EAC3B,oBAAoB,MAAM,YAAY;EACtC,cAAc,eAAa,YAAY;EACvC;EACA;EACA,UAAU;EACV,WAAW;;iBAOG,qBAAqB"}

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

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverCore, StateAttrMap } from '@videojs/core';\nimport type { MediaContainer, PopoverApi, PositioningBoundary } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface PopoverContextValue {\n  core: PopoverCore;\n  popover: PopoverApi;\n  state: PopoverCore.State;\n  stateAttrMap: StateAttrMap<PopoverCore.State>;\n  anchorName: string;\n  popupId: string;\n  boundary: PositioningBoundary;\n  container: MediaContainer | null;\n}\n\nconst PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport const PopoverContextProvider = PopoverContext.Provider;\n\nexport function usePopoverContext(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) throw new Error('Popover compound components must be used within a Popover.Root');\n  return ctx;\n}\n"],"mappings":";;;AAiBA,MAAM,iBAAiB,cAA0C,KAAK;AAEtE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,eAAe;AACtC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iEAAiE;AAC3F,QAAO"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverCore, StateAttrMap } from '@videojs/core';\nimport type { MediaContainer, PopoverApi, PositioningBoundary } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface PopoverContextValue {\n  core: PopoverCore;\n  popover: PopoverApi;\n  state: PopoverCore.State;\n  preferredSide: PopoverCore.State['side'];\n  setPositionedSide: (side: PopoverCore.State['side']) => void;\n  stateAttrMap: StateAttrMap<PopoverCore.State>;\n  anchorName: string;\n  popupId: string;\n  boundary: PositioningBoundary;\n  container: MediaContainer | null;\n}\n\nconst PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport const PopoverContextProvider = PopoverContext.Provider;\n\nexport function usePopoverContext(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) throw new Error('Popover compound components must be used within a Popover.Root');\n  return ctx;\n}\n"],"mappings":";;;AAmBA,MAAM,iBAAiB,cAA0C,IAAI;AAErE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,cAAc;CACrC,IAAI,CAAC,KAAK,MAAM,IAAI,MAAM,gEAAgE;CAC1F,OAAO;AACT"}

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

@@ -2,11 +2,9 @@ import { PopoverArrow, PopoverArrowProps } from "./popover-arrow.js";
 import { PopoverPopup, PopoverPopupProps } from "./popover-popup.js";
 import { PopoverRoot, PopoverRootProps } from "./popover-root.js";
 import { PopoverTrigger, PopoverTriggerProps } from "./popover-trigger.js";
-
-//#region src/ui/popover/index.parts.d.ts
 declare namespace index_parts_d_exports {
   export { PopoverArrow as Arrow, PopoverArrowProps as ArrowProps, PopoverPopup as Popup, PopoverPopupProps as PopupProps, PopoverRoot as Root, PopoverRootProps as RootProps, PopoverTrigger as Trigger, PopoverTriggerProps as TriggerProps };
 }
 //#endregion
-export { index_parts_d_exports };
+export { PopoverArrow as Arrow, type PopoverArrowProps as ArrowProps, PopoverPopup as Popup, type PopoverPopupProps as PopupProps, PopoverRoot as Root, type PopoverRootProps as RootProps, PopoverTrigger as Trigger, type PopoverTriggerProps as TriggerProps, index_parts_d_exports };
 //# sourceMappingURL=index.parts.d.ts.map

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

@@ -11,6 +11,6 @@ var index_parts_exports = /* @__PURE__ */ __exportAll({
 	Trigger: () => PopoverTrigger
 });
 //#endregion
-export { index_parts_exports };
+export { PopoverArrow as Arrow, PopoverPopup as Popup, PopoverRoot as Root, PopoverTrigger as Trigger, index_parts_exports };
 
 //# sourceMappingURL=index.parts.js.map

package/dist/dev/ui/popover/popover-arrow.d.ts

@@ -1,11 +1,9 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
-
 //#region src/ui/popover/popover-arrow.d.ts
 interface PopoverArrowProps extends UIComponentProps<'div', PopoverState> {}
 /** Decorative arrow pointing from the popup toward the trigger. Hidden from assistive technology. */
-declare const PopoverArrow: _$react.ForwardRefExoticComponent<PopoverArrowProps>;
+declare const PopoverArrow: import("react").ForwardRefExoticComponent<PopoverArrowProps>;
 declare namespace PopoverArrow {
   type Props = PopoverArrowProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-arrow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-arrow.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"mappings":";;;;;UAQiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAGtD,YAAA,EAAY,OAAA,CAAA,yBAAA,CAAA,iBAAA;AAAA,kBAOR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-arrow.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"mappings":";;;UAQiB,0BAA0B,wBAAwB;;cAGtD,8BAAY,0BAAA;kBAOR;OACH,QAAQ;OACR,QAAQ"}

package/dist/dev/ui/popover/popover-arrow.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-arrow.js","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverArrowProps extends UIComponentProps<'div', PopoverState> {}\n\n/** Decorative arrow pointing from the popup toward the trigger. Hidden from assistive technology. */\nexport const PopoverArrow = createContextPart<PopoverArrowProps, PopoverState>({\n  displayName: 'PopoverArrow',\n  tag: 'div',\n  useContext: usePopoverContext,\n  staticProps: { 'aria-hidden': 'true' as const },\n});\n\nexport namespace PopoverArrow {\n  export type Props = PopoverArrowProps;\n  export type State = PopoverState;\n}\n"],"mappings":";;;;;AAWA,MAAa,eAAe,kBAAmD;CAC7E,aAAa;CACb,KAAK;CACL,YAAY;CACZ,aAAa,EAAE,eAAe,QAAiB;CAChD,CAAC"}
+{"version":3,"file":"popover-arrow.js","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverArrowProps extends UIComponentProps<'div', PopoverState> {}\n\n/** Decorative arrow pointing from the popup toward the trigger. Hidden from assistive technology. */\nexport const PopoverArrow = createContextPart<PopoverArrowProps, PopoverState>({\n  displayName: 'PopoverArrow',\n  tag: 'div',\n  useContext: usePopoverContext,\n  staticProps: { 'aria-hidden': 'true' as const },\n});\n\nexport namespace PopoverArrow {\n  export type Props = PopoverArrowProps;\n  export type State = PopoverState;\n}\n"],"mappings":";;;;;AAWA,MAAa,eAAe,kBAAmD;CAC7E,aAAa;CACb,KAAK;CACL,YAAY;CACZ,aAAa,EAAE,eAAe,OAAgB;AAChD,CAAC"}

package/dist/dev/ui/popover/popover-popup.d.ts

@@ -1,11 +1,9 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
-
 //#region src/ui/popover/popover-popup.d.ts
 interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}
 /** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */
-declare const PopoverPopup: _$react.ForwardRefExoticComponent<Omit<PopoverPopupProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+declare const PopoverPopup: import("react").ForwardRefExoticComponent<Omit<PopoverPopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 declare namespace PopoverPopup {
   type Props = PopoverPopupProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-popup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-popup.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"mappings":";;;;;UAoBiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAKtD,YAAA,EAAY,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,iBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAqJR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-popup.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"mappings":";;;UAqBiB,0BAA0B,wBAAwB;;cAKtD,8BAAY,0BAAA,KAAA,4CAAA,cAAA;kBAiKR;OACH,QAAQ;OACR,QAAQ"}

package/dist/dev/ui/popover/popover-popup.js

@@ -2,7 +2,7 @@
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
 import { renderElement } from "../../utils/use-render.js";
 import { usePopoverContext } from "./context.js";
-import { getAnchorPositionStyle, getPopupPositionRect, getPositioningBoundaryRect, isEventWithinElement, resolveOffsets, resolvePositioningBoundary } from "@videojs/core/dom";
+import { getAnchorPositionStyle, getPopupPositionRect, getPositionedSide, getPositioningBoundaryRect, isEventWithinElement, resolveOffsets, resolvePositioningBoundary } from "@videojs/core/dom";
 import { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { supportsAnchorPositioning } from "@videojs/utils/dom";
 //#region src/ui/popover/popover-popup.tsx
@@ -13,25 +13,25 @@ const POPOVER_RESET = {
 };
 /** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */
 const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style, ...elementProps }, forwardedRef) {
-	const { core, popover, state, stateAttrMap, anchorName, popupId, boundary, container } = usePopoverContext();
+	const { core, popover, state, preferredSide, setPositionedSide, stateAttrMap, anchorName, popupId, boundary, container } = usePopoverContext();
 	const internalRef = useRef(null);
 	const composedRef = useComposedRefs(forwardedRef, useCallback((el) => {
 		popover.setPopupElement(el);
 		if (el && supportsAnchorPositioning()) el.style.setProperty("position-anchor", `--${anchorName}`);
 	}, [popover, anchorName]), internalRef);
 	const posOpts = useMemo(() => ({
-		side: state.side,
+		side: preferredSide,
 		align: state.align
-	}), [state.side, state.align]);
+	}), [preferredSide, state.align]);
 	const anchorStyle = useMemo(() => {
 		if (!supportsAnchorPositioning()) return null;
 		const { positionAnchor: _, ...rest } = getAnchorPositionStyle(anchorName, posOpts);
 		return rest;
 	}, [anchorName, posOpts]);
-	const [manualStyle, setManualStyle] = useState(null);
+	const [position, setPosition] = useState(null);
 	useLayoutEffect(() => {
 		if (!state.open) {
-			setManualStyle(null);
+			setPosition(null);
 			return;
 		}
 		function measure() {
@@ -39,12 +39,21 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 			const popupEl = internalRef.current;
 			if (!triggerEl || !popupEl) return;
 			const triggerRect = triggerEl.getBoundingClientRect();
+			const root = popupEl.getRootNode();
 			const boundaryElement = resolvePositioningBoundary(boundary, {
 				container,
-				root: popupEl.getRootNode()
+				root
 			});
-			const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(anchorName, posOpts, triggerRect, supportsAnchorPositioning() ? void 0 : getPopupPositionRect(popupEl), getPositioningBoundaryRect(boundaryElement), resolveOffsets(popupEl));
-			setManualStyle(nextStyle);
+			const popupRect = getPopupPositionRect(popupEl, posOpts.side);
+			const boundaryRect = getPositioningBoundaryRect(boundaryElement);
+			const offsets = resolveOffsets(popupEl);
+			const side = getPositionedSide(triggerRect, popupRect, boundaryRect, posOpts, offsets);
+			const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(anchorName, {
+				...posOpts,
+				side
+			}, triggerRect, supportsAnchorPositioning() ? void 0 : popupRect, boundaryRect, offsets);
+			setPosition(nextStyle);
+			setPositionedSide(side);
 		}
 		measure();
 		const triggerEl = popover.triggerElement;
@@ -83,9 +92,10 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 		posOpts,
 		popover,
 		boundary,
-		container
+		container,
+		setPositionedSide
 	]);
-	const positioningStyle = manualStyle ?? anchorStyle ?? POPOVER_RESET;
+	const positioningStyle = position ?? anchorStyle ?? POPOVER_RESET;
 	if (!state.open) return null;
 	const { onFocusOut, ...restPopupProps } = popover.popupProps;
 	return renderElement("div", {

package/dist/dev/ui/popover/popover-popup.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-popup.js","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\nimport {\n  getAnchorPositionStyle,\n  getPopupPositionRect,\n  getPositioningBoundaryRect,\n  isEventWithinElement,\n  resolveOffsets,\n  resolvePositioningBoundary,\n} from '@videojs/core/dom';\nimport { supportsAnchorPositioning } from '@videojs/utils/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { renderElement } from '../../utils/use-render';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}\n\nconst POPOVER_RESET: CSSProperties = { position: 'fixed', inset: 'auto', margin: 0 };\n\n/** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { core, popover, state, stateAttrMap, anchorName, popupId, boundary, container } = usePopoverContext();\n  const internalRef = useRef<HTMLDivElement>(null);\n\n  const popupRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      popover.setPopupElement(el);\n      if (el && supportsAnchorPositioning()) {\n        el.style.setProperty('position-anchor', `--${anchorName}`);\n      }\n    },\n    [popover, anchorName]\n  );\n\n  const composedRef = useComposedRefs(forwardedRef, popupRef, internalRef);\n\n  // --- Positioning ---\n\n  const posOpts = useMemo(() => ({ side: state.side, align: state.align }), [state.side, state.align]);\n\n  // CSS Anchor Positioning — computed from state, no measurement needed.\n  // `position-anchor` is set imperatively in the ref callback above\n  // because React's style prop silently drops unrecognised CSS properties.\n  const anchorStyle = useMemo(() => {\n    if (!supportsAnchorPositioning()) return null;\n    const { positionAnchor: _, ...rest } = getAnchorPositionStyle(anchorName, posOpts);\n    return rest as CSSProperties;\n  }, [anchorName, posOpts]);\n\n  // Manual fallback — measure rects after layout, before paint.\n  const [manualStyle, setManualStyle] = useState<CSSProperties | null>(null);\n\n  useLayoutEffect(() => {\n    if (!state.open) {\n      setManualStyle(null);\n      return;\n    }\n\n    function measure(): void {\n      const triggerEl = popover.triggerElement;\n      const popupEl = internalRef.current;\n      if (!triggerEl || !popupEl) return;\n\n      const triggerRect = triggerEl.getBoundingClientRect();\n      const root = popupEl.getRootNode() as Document | ShadowRoot;\n      const boundaryElement = resolvePositioningBoundary(boundary, { container, root });\n      const popupRect = supportsAnchorPositioning() ? undefined : getPopupPositionRect(popupEl);\n      const boundaryRect = getPositioningBoundaryRect(boundaryElement);\n      const offsets = resolveOffsets(popupEl);\n\n      const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(\n        anchorName,\n        posOpts,\n        triggerRect,\n        popupRect,\n        boundaryRect,\n        offsets\n      );\n\n      setManualStyle(nextStyle as CSSProperties);\n    }\n\n    measure();\n    const triggerEl = popover.triggerElement;\n    const popupEl = internalRef.current;\n    const boundaryElement = popupEl\n      ? resolvePositioningBoundary(boundary, {\n          container,\n          root: popupEl.getRootNode() as Document | ShadowRoot,\n        })\n      : null;\n\n    let rafId = 0;\n    function reposition(event?: Event): void {\n      if (event && isEventWithinElement(event, internalRef.current)) return;\n\n      cancelAnimationFrame(rafId);\n      rafId = requestAnimationFrame(measure);\n    }\n\n    // Re-measure after the popover has entered the top layer and whenever\n    // its own size or the trigger size changes.\n    reposition();\n\n    const resizeObserver =\n      typeof ResizeObserver === 'function'\n        ? new ResizeObserver(() => {\n            reposition();\n          })\n        : null;\n\n    if (triggerEl && resizeObserver) {\n      resizeObserver.observe(triggerEl);\n    }\n\n    if (popupEl && resizeObserver) {\n      resizeObserver.observe(popupEl);\n    }\n    if (boundaryElement && resizeObserver) {\n      resizeObserver.observe(boundaryElement);\n    }\n\n    window.addEventListener('scroll', reposition, { capture: true, passive: true });\n    window.addEventListener('resize', reposition);\n\n    return () => {\n      cancelAnimationFrame(rafId);\n      resizeObserver?.disconnect();\n      window.removeEventListener('scroll', reposition, true);\n      window.removeEventListener('resize', reposition);\n    };\n  }, [state.open, anchorName, posOpts, popover, boundary, container]);\n\n  // Anchor path uses computed styles; manual path uses measured styles;\n  // fallback resets UA [popover] defaults until positioning is computed.\n  const positioningStyle = manualStyle ?? anchorStyle ?? POPOVER_RESET;\n\n  // --- Visibility ---\n\n  if (!state.open) {\n    return null;\n  }\n\n  // Remap DOM focus events to React synthetic event names.\n  const { onFocusOut, ...restPopupProps } = popover.popupProps;\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap,\n      ref: composedRef,\n      props: [\n        {\n          id: popupId,\n          style: positioningStyle,\n          ...core.getPopupAttrs(state),\n        },\n        { ...restPopupProps, onBlur: onFocusOut },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace PopoverPopup {\n  export type Props = PopoverPopupProps;\n  export type State = PopoverState;\n}\n"],"mappings":"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"}
+{"version":3,"file":"popover-popup.js","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\nimport {\n  getAnchorPositionStyle,\n  getPopupPositionRect,\n  getPositionedSide,\n  getPositioningBoundaryRect,\n  isEventWithinElement,\n  resolveOffsets,\n  resolvePositioningBoundary,\n} from '@videojs/core/dom';\nimport { supportsAnchorPositioning } from '@videojs/utils/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { renderElement } from '../../utils/use-render';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}\n\nconst POPOVER_RESET: CSSProperties = { position: 'fixed', inset: 'auto', margin: 0 };\n\n/** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const {\n    core,\n    popover,\n    state,\n    preferredSide,\n    setPositionedSide,\n    stateAttrMap,\n    anchorName,\n    popupId,\n    boundary,\n    container,\n  } = usePopoverContext();\n  const internalRef = useRef<HTMLDivElement>(null);\n\n  const popupRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      popover.setPopupElement(el);\n      if (el && supportsAnchorPositioning()) {\n        el.style.setProperty('position-anchor', `--${anchorName}`);\n      }\n    },\n    [popover, anchorName]\n  );\n\n  const composedRef = useComposedRefs(forwardedRef, popupRef, internalRef);\n\n  // --- Positioning ---\n\n  const posOpts = useMemo(() => ({ side: preferredSide, align: state.align }), [preferredSide, state.align]);\n\n  // CSS Anchor Positioning — computed from state, no measurement needed.\n  // `position-anchor` is set imperatively in the ref callback above\n  // because React's style prop silently drops unrecognised CSS properties.\n  const anchorStyle = useMemo(() => {\n    if (!supportsAnchorPositioning()) return null;\n    const { positionAnchor: _, ...rest } = getAnchorPositionStyle(anchorName, posOpts);\n    return rest as CSSProperties;\n  }, [anchorName, posOpts]);\n\n  // Measure rects after layout, before paint.\n  const [position, setPosition] = useState<CSSProperties | null>(null);\n\n  useLayoutEffect(() => {\n    if (!state.open) {\n      setPosition(null);\n      return;\n    }\n\n    function measure(): void {\n      const triggerEl = popover.triggerElement;\n      const popupEl = internalRef.current;\n      if (!triggerEl || !popupEl) return;\n\n      const triggerRect = triggerEl.getBoundingClientRect();\n      const root = popupEl.getRootNode() as Document | ShadowRoot;\n      const boundaryElement = resolvePositioningBoundary(boundary, { container, root });\n      const popupRect = getPopupPositionRect(popupEl, posOpts.side);\n      const boundaryRect = getPositioningBoundaryRect(boundaryElement);\n      const offsets = resolveOffsets(popupEl);\n      const side = getPositionedSide(triggerRect, popupRect, boundaryRect, posOpts, offsets);\n\n      const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(\n        anchorName,\n        { ...posOpts, side },\n        triggerRect,\n        supportsAnchorPositioning() ? undefined : popupRect,\n        boundaryRect,\n        offsets\n      );\n\n      setPosition(nextStyle as CSSProperties);\n      setPositionedSide(side);\n    }\n\n    measure();\n    const triggerEl = popover.triggerElement;\n    const popupEl = internalRef.current;\n    const boundaryElement = popupEl\n      ? resolvePositioningBoundary(boundary, {\n          container,\n          root: popupEl.getRootNode() as Document | ShadowRoot,\n        })\n      : null;\n\n    let rafId = 0;\n    function reposition(event?: Event): void {\n      if (event && isEventWithinElement(event, internalRef.current)) return;\n\n      cancelAnimationFrame(rafId);\n      rafId = requestAnimationFrame(measure);\n    }\n\n    // Re-measure after the popover has entered the top layer and whenever\n    // its own size or the trigger size changes.\n    reposition();\n\n    const resizeObserver =\n      typeof ResizeObserver === 'function'\n        ? new ResizeObserver(() => {\n            reposition();\n          })\n        : null;\n\n    if (triggerEl && resizeObserver) {\n      resizeObserver.observe(triggerEl);\n    }\n\n    if (popupEl && resizeObserver) {\n      resizeObserver.observe(popupEl);\n    }\n    if (boundaryElement && resizeObserver) {\n      resizeObserver.observe(boundaryElement);\n    }\n\n    window.addEventListener('scroll', reposition, { capture: true, passive: true });\n    window.addEventListener('resize', reposition);\n\n    return () => {\n      cancelAnimationFrame(rafId);\n      resizeObserver?.disconnect();\n      window.removeEventListener('scroll', reposition, true);\n      window.removeEventListener('resize', reposition);\n    };\n  }, [state.open, anchorName, posOpts, popover, boundary, container, setPositionedSide]);\n\n  // Use measured styles once available; reset UA [popover] defaults until then.\n  const positioningStyle = position ?? anchorStyle ?? POPOVER_RESET;\n\n  // --- Visibility ---\n\n  if (!state.open) {\n    return null;\n  }\n\n  // Remap DOM focus events to React synthetic event names.\n  const { onFocusOut, ...restPopupProps } = popover.popupProps;\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap,\n      ref: composedRef,\n      props: [\n        {\n          id: popupId,\n          style: positioningStyle,\n          ...core.getPopupAttrs(state),\n        },\n        { ...restPopupProps, onBlur: onFocusOut },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace PopoverPopup {\n  export type Props = PopoverPopupProps;\n  export type State = PopoverState;\n}\n"],"mappings":";;;;;;;;AAuBA,MAAM,gBAA+B;CAAE,UAAU;CAAS,OAAO;CAAQ,QAAQ;AAAE;;AAGnF,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,QAAQ,WAAW,OAAO,GAAG,gBAC/B,cACA;CACA,MAAM,EACJ,MACA,SACA,OACA,eACA,mBACA,cACA,YACA,SACA,UACA,cACE,kBAAkB;CACtB,MAAM,cAAc,OAAuB,IAAI;CAY/C,MAAM,cAAc,gBAAgB,cAVnB,aACd,OAA8B;EAC7B,QAAQ,gBAAgB,EAAE;EAC1B,IAAI,MAAM,0BAA0B,GAClC,GAAG,MAAM,YAAY,mBAAmB,KAAK,YAAY;CAE7D,GACA,CAAC,SAAS,UAAU,CAGmC,GAAG,WAAW;CAIvE,MAAM,UAAU,eAAe;EAAE,MAAM;EAAe,OAAO,MAAM;CAAM,IAAI,CAAC,eAAe,MAAM,KAAK,CAAC;CAKzG,MAAM,cAAc,cAAc;EAChC,IAAI,CAAC,0BAA0B,GAAG,OAAO;EACzC,MAAM,EAAE,gBAAgB,GAAG,GAAG,SAAS,uBAAuB,YAAY,OAAO;EACjF,OAAO;CACT,GAAG,CAAC,YAAY,OAAO,CAAC;CAGxB,MAAM,CAAC,UAAU,eAAe,SAA+B,IAAI;CAEnE,sBAAsB;EACpB,IAAI,CAAC,MAAM,MAAM;GACf,YAAY,IAAI;GAChB;EACF;EAEA,SAAS,UAAgB;GACvB,MAAM,YAAY,QAAQ;GAC1B,MAAM,UAAU,YAAY;GAC5B,IAAI,CAAC,aAAa,CAAC,SAAS;GAE5B,MAAM,cAAc,UAAU,sBAAsB;GACpD,MAAM,OAAO,QAAQ,YAAY;GACjC,MAAM,kBAAkB,2BAA2B,UAAU;IAAE;IAAW;GAAK,CAAC;GAChF,MAAM,YAAY,qBAAqB,SAAS,QAAQ,IAAI;GAC5D,MAAM,eAAe,2BAA2B,eAAe;GAC/D,MAAM,UAAU,eAAe,OAAO;GACtC,MAAM,OAAO,kBAAkB,aAAa,WAAW,cAAc,SAAS,OAAO;GAErF,MAAM,EAAE,gBAAgB,GAAG,GAAG,cAAc,uBAC1C,YACA;IAAE,GAAG;IAAS;GAAK,GACnB,aACA,0BAA0B,IAAI,KAAA,IAAY,WAC1C,cACA,OACF;GAEA,YAAY,SAA0B;GACtC,kBAAkB,IAAI;EACxB;EAEA,QAAQ;EACR,MAAM,YAAY,QAAQ;EAC1B,MAAM,UAAU,YAAY;EAC5B,MAAM,kBAAkB,UACpB,2BAA2B,UAAU;GACnC;GACA,MAAM,QAAQ,YAAY;EAC5B,CAAC,IACD;EAEJ,IAAI,QAAQ;EACZ,SAAS,WAAW,OAAqB;GACvC,IAAI,SAAS,qBAAqB,OAAO,YAAY,OAAO,GAAG;GAE/D,qBAAqB,KAAK;GAC1B,QAAQ,sBAAsB,OAAO;EACvC;EAIA,WAAW;EAEX,MAAM,iBACJ,OAAO,mBAAmB,aACtB,IAAI,qBAAqB;GACvB,WAAW;EACb,CAAC,IACD;EAEN,IAAI,aAAa,gBACf,eAAe,QAAQ,SAAS;EAGlC,IAAI,WAAW,gBACb,eAAe,QAAQ,OAAO;EAEhC,IAAI,mBAAmB,gBACrB,eAAe,QAAQ,eAAe;EAGxC,OAAO,iBAAiB,UAAU,YAAY;GAAE,SAAS;GAAM,SAAS;EAAK,CAAC;EAC9E,OAAO,iBAAiB,UAAU,UAAU;EAE5C,aAAa;GACX,qBAAqB,KAAK;GAC1B,gBAAgB,WAAW;GAC3B,OAAO,oBAAoB,UAAU,YAAY,IAAI;GACrD,OAAO,oBAAoB,UAAU,UAAU;EACjD;CACF,GAAG;EAAC,MAAM;EAAM;EAAY;EAAS;EAAS;EAAU;EAAW;CAAiB,CAAC;CAGrF,MAAM,mBAAmB,YAAY,eAAe;CAIpD,IAAI,CAAC,MAAM,MACT,OAAO;CAIT,MAAM,EAAE,YAAY,GAAG,mBAAmB,QAAQ;CAElD,OAAO,cACL,OACA;EAAE;EAAQ;EAAW;CAAM,GAC3B;EACE;EACA;EACA,KAAK;EACL,OAAO;GACL;IACE,IAAI;IACJ,OAAO;IACP,GAAG,KAAK,cAAc,KAAK;GAC7B;GACA;IAAE,GAAG;IAAgB,QAAQ;GAAW;GACxC;EACF;CACF,CACF;AACF,CAAC"}

package/dist/dev/ui/popover/popover-root.d.ts

@@ -1,7 +1,6 @@
 import { PopoverChangeDetails, PositioningBoundary } from "@videojs/core/dom";
 import { ReactNode } from "react";
 import { PopoverProps } from "@videojs/core";
-
 //#region src/ui/popover/popover-root.d.ts
 interface PopoverRootProps extends PopoverProps {
   /** Boundary used to constrain the popup size. */
@@ -12,18 +11,7 @@ interface PopoverRootProps extends PopoverProps {
   onOpenChangeComplete?: (open: boolean) => void;
   children?: ReactNode;
 }
-declare function PopoverRoot({
-  open: controlledOpen,
-  defaultOpen,
-  onOpenChange: onOpenChangeProp,
-  onOpenChangeComplete: onOpenChangeCompleteProp,
-  openOnHover,
-  delay,
-  closeDelay,
-  boundary,
-  children,
-  ...coreProps
-}: PopoverRootProps): ReactNode;
+declare function PopoverRoot({ open: controlledOpen, defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, openOnHover, delay, closeDelay, boundary, children, ...coreProps }: PopoverRootProps): ReactNode;
 declare namespace PopoverRoot {
   type Props = PopoverRootProps;
 }

package/dist/dev/ui/popover/popover-root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-root.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"mappings":";;;;;UAoBiB,gBAAA,SAAyB,YAAA;;EAExC,QAAA,GAAW,mBAAA;EAFqB;EAIhC,YAAA,IAAgB,IAAA,WAAe,OAAA,EAAS,oBAAA;EAF7B;EAIX,oBAAA,IAAwB,IAAA;EACxB,QAAA,GAAW,SAAA;AAAA;AAAA,iBAGG,WAAA,CAAA;EACd,IAAA,EAAM,cAAA;EACN,WAAA;EACA,YAAA,EAAc,gBAAA;EACd,oBAAA,EAAsB,wBAAA;EACtB,WAAA;EACA,KAAA;EACA,UAAA;EACA,QAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,gBAAA,GAAmB,SAAA;AAAA,kBAoFL,WAAA;EAAA,KACH,KAAA,GAAQ,gBAAA;AAAA"}
+{"version":3,"file":"popover-root.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"mappings":";;;;UAqBiB,yBAAyB;;EAExC,WAAW;;EAEX,gBAAgB,eAAe,SAAS;;EAExC,wBAAwB;EACxB,WAAW;;iBAGG,cACd,MAAM,gBACN,aACA,cAAc,kBACd,sBAAsB,0BACtB,aACA,OACA,YACA,UACA,aACG,aACF,mBAAmB;kBA+FL;OACH,QAAQ"}

package/dist/dev/ui/popover/popover-root.js

@@ -4,12 +4,13 @@ import { useLatestRef } from "../../utils/use-latest-ref.js";
 import { useDestroy } from "../../utils/use-destroy.js";
 import { useSafeId } from "../../utils/use-safe-id.js";
 import { useOptionalControlsContext } from "../controls/context.js";
+import { usePositionedState } from "../hooks/use-positioned-state.js";
 import { PopoverContextProvider } from "./context.js";
 import { createPopover, createTransition } from "@videojs/core/dom";
 import { useSnapshot } from "@videojs/store/react";
 import { useEffect, useState } from "react";
-import { isUndefined } from "@videojs/utils/predicate";
 import { jsx } from "react/jsx-runtime";
+import { isUndefined } from "@videojs/utils/predicate";
 import { PopoverCore, PopoverDataAttrs } from "@videojs/core";
 //#region src/ui/popover/popover-root.tsx
 function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, openOnHover = PopoverCore.defaultProps.openOnHover, delay = PopoverCore.defaultProps.delay, closeDelay = PopoverCore.defaultProps.closeDelay, boundary = "container", children, ...coreProps }) {
@@ -63,11 +64,14 @@ function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultPr
 	useDestroy(popover);
 	const input = useSnapshot(popover.input);
 	core.setInput(input);
+	const { state, preferredSide, setPositionedSide } = usePositionedState(core.getState());
 	return /* @__PURE__ */ jsx(PopoverContextProvider, {
 		value: {
 			core,
 			popover,
-			state: core.getState(),
+			state,
+			preferredSide,
+			setPositionedSide,
 			stateAttrMap: PopoverDataAttrs,
 			anchorName,
 			popupId,

package/dist/dev/ui/popover/popover-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-root.js","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"sourcesContent":["'use client';\n\nimport { type PopoverProps as CorePopoverProps, PopoverCore, PopoverDataAttrs } from '@videojs/core';\nimport {\n  createPopover,\n  createTransition,\n  type PopoverChangeDetails,\n  type PositioningBoundary,\n} from '@videojs/core/dom';\nimport { useSnapshot } from '@videojs/store/react';\nimport { isUndefined } from '@videojs/utils/predicate';\nimport type { ReactNode } from 'react';\nimport { useEffect, useState } from 'react';\nimport { useOptionalContainer, useOptionalPopupGroup } from '../../player/context';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { useSafeId } from '../../utils/use-safe-id';\nimport { useOptionalControlsContext } from '../controls/context';\nimport { PopoverContextProvider } from './context';\n\nexport interface PopoverRootProps extends CorePopoverProps {\n  /** Boundary used to constrain the popup size. */\n  boundary?: PositioningBoundary;\n  /** Called when the popover open state changes (fires immediately, before animations). */\n  onOpenChange?: (open: boolean, details: PopoverChangeDetails) => void;\n  /** Called after open/close animations complete. */\n  onOpenChangeComplete?: (open: boolean) => void;\n  children?: ReactNode;\n}\n\nexport function PopoverRoot({\n  open: controlledOpen,\n  defaultOpen = PopoverCore.defaultProps.defaultOpen,\n  onOpenChange: onOpenChangeProp,\n  onOpenChangeComplete: onOpenChangeCompleteProp,\n  openOnHover = PopoverCore.defaultProps.openOnHover,\n  delay = PopoverCore.defaultProps.delay,\n  closeDelay = PopoverCore.defaultProps.closeDelay,\n  boundary = 'container',\n  children,\n  ...coreProps\n}: PopoverRootProps): ReactNode {\n  const container = useOptionalContainer();\n  const popupGroup = useOptionalPopupGroup();\n  const controls = useOptionalControlsContext();\n  const [core] = useState(() => new PopoverCore(coreProps));\n  core.setProps(coreProps);\n\n  const isControlled = !isUndefined(controlledOpen);\n\n  // Keep refs that always point to the latest values so the\n  // createPopover closure never reads stale props.\n  const onOpenChangeRef = useLatestRef(onOpenChangeProp);\n  const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);\n  const closeOnEscapeRef = useLatestRef(coreProps.closeOnEscape);\n  const closeOnOutsideClickRef = useLatestRef(coreProps.closeOnOutsideClick);\n  const openOnHoverRef = useLatestRef(openOnHover);\n  const delayRef = useLatestRef(delay);\n  const closeDelayRef = useLatestRef(closeDelay);\n  const popupGroupRef = useLatestRef(popupGroup);\n\n  const [popover] = useState(() => {\n    const instance = createPopover({\n      transition: createTransition(),\n      onOpenChange: (nextOpen: boolean, details: PopoverChangeDetails) => {\n        onOpenChangeRef.current?.(nextOpen, details);\n      },\n      onOpenChangeComplete: (nextOpen: boolean) => {\n        onOpenChangeCompleteRef.current?.(nextOpen);\n      },\n      closeOnEscape: () => closeOnEscapeRef.current ?? PopoverCore.defaultProps.closeOnEscape,\n      closeOnOutsideClick: () => closeOnOutsideClickRef.current ?? PopoverCore.defaultProps.closeOnOutsideClick,\n      openOnHover: () => openOnHoverRef.current,\n      delay: () => delayRef.current,\n      closeDelay: () => closeDelayRef.current,\n      group: () => popupGroupRef.current,\n    });\n\n    // Apply defaultOpen on creation (uncontrolled only)\n    if (!isControlled && defaultOpen) {\n      instance.open('click');\n    }\n\n    return instance;\n  });\n\n  const anchorName = useSafeId();\n  const popupId = useSafeId('popup');\n\n  // Sync controlled open prop -> internal input state.\n  useEffect(() => {\n    if (isUndefined(controlledOpen)) return;\n\n    const { active: inputOpen } = popover.input.current;\n    if (controlledOpen === inputOpen) return;\n\n    if (controlledOpen) {\n      popover.open('click');\n    } else {\n      popover.close('click');\n    }\n  }, [controlledOpen, popover]);\n\n  useEffect(() => {\n    if (isUndefined(controls?.state.visible)) return;\n    if (controls.state.visible) return;\n\n    popover.close('imperative-action');\n  }, [controls?.state.visible, popover]);\n\n  useDestroy(popover);\n\n  const input = useSnapshot(popover.input);\n  core.setInput(input);\n  const state = core.getState();\n\n  return (\n    <PopoverContextProvider\n      value={{ core, popover, state, stateAttrMap: PopoverDataAttrs, anchorName, popupId, boundary, container }}\n    >\n      {children}\n    </PopoverContextProvider>\n  );\n}\n\nexport namespace PopoverRoot {\n  export type Props = PopoverRootProps;\n}\n"],"mappings":";;;;;;;;;;;;;;AA8BA,SAAgB,YAAY,EAC1B,MAAM,gBACN,cAAc,YAAY,aAAa,aACvC,cAAc,kBACd,sBAAsB,0BACtB,cAAc,YAAY,aAAa,aACvC,QAAQ,YAAY,aAAa,OACjC,aAAa,YAAY,aAAa,YACtC,WAAW,aACX,UACA,GAAG,aAC2B;CAC9B,MAAM,YAAY,sBAAsB;CACxC,MAAM,aAAa,uBAAuB;CAC1C,MAAM,WAAW,4BAA4B;CAC7C,MAAM,CAAC,QAAQ,eAAe,IAAI,YAAY,UAAU,CAAC;AACzD,MAAK,SAAS,UAAU;CAExB,MAAM,eAAe,CAAC,YAAY,eAAe;CAIjD,MAAM,kBAAkB,aAAa,iBAAiB;CACtD,MAAM,0BAA0B,aAAa,yBAAyB;CACtE,MAAM,mBAAmB,aAAa,UAAU,cAAc;CAC9D,MAAM,yBAAyB,aAAa,UAAU,oBAAoB;CAC1E,MAAM,iBAAiB,aAAa,YAAY;CAChD,MAAM,WAAW,aAAa,MAAM;CACpC,MAAM,gBAAgB,aAAa,WAAW;CAC9C,MAAM,gBAAgB,aAAa,WAAW;CAE9C,MAAM,CAAC,WAAW,eAAe;EAC/B,MAAM,WAAW,cAAc;GAC7B,YAAY,kBAAkB;GAC9B,eAAe,UAAmB,YAAkC;AAClE,oBAAgB,UAAU,UAAU,QAAQ;;GAE9C,uBAAuB,aAAsB;AAC3C,4BAAwB,UAAU,SAAS;;GAE7C,qBAAqB,iBAAiB,WAAW,YAAY,aAAa;GAC1E,2BAA2B,uBAAuB,WAAW,YAAY,aAAa;GACtF,mBAAmB,eAAe;GAClC,aAAa,SAAS;GACtB,kBAAkB,cAAc;GAChC,aAAa,cAAc;GAC5B,CAAC;AAGF,MAAI,CAAC,gBAAgB,YACnB,UAAS,KAAK,QAAQ;AAGxB,SAAO;GACP;CAEF,MAAM,aAAa,WAAW;CAC9B,MAAM,UAAU,UAAU,QAAQ;AAGlC,iBAAgB;AACd,MAAI,YAAY,eAAe,CAAE;EAEjC,MAAM,EAAE,QAAQ,cAAc,QAAQ,MAAM;AAC5C,MAAI,mBAAmB,UAAW;AAElC,MAAI,eACF,SAAQ,KAAK,QAAQ;MAErB,SAAQ,MAAM,QAAQ;IAEvB,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,iBAAgB;AACd,MAAI,YAAY,UAAU,MAAM,QAAQ,CAAE;AAC1C,MAAI,SAAS,MAAM,QAAS;AAE5B,UAAQ,MAAM,oBAAoB;IACjC,CAAC,UAAU,MAAM,SAAS,QAAQ,CAAC;AAEtC,YAAW,QAAQ;CAEnB,MAAM,QAAQ,YAAY,QAAQ,MAAM;AACxC,MAAK,SAAS,MAAM;AAGpB,QACE,oBAAC,wBAAD;EACE,OAAO;GAAE;GAAM;GAAS,OAJd,KAAK,UAAU;GAIM,cAAc;GAAkB;GAAY;GAAS;GAAU;GAAW;EAExG;EACsB,CAAA"}
+{"version":3,"file":"popover-root.js","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"sourcesContent":["'use client';\n\nimport { type PopoverProps as CorePopoverProps, PopoverCore, PopoverDataAttrs } from '@videojs/core';\nimport {\n  createPopover,\n  createTransition,\n  type PopoverChangeDetails,\n  type PositioningBoundary,\n} from '@videojs/core/dom';\nimport { useSnapshot } from '@videojs/store/react';\nimport { isUndefined } from '@videojs/utils/predicate';\nimport type { ReactNode } from 'react';\nimport { useEffect, useState } from 'react';\nimport { useOptionalContainer, useOptionalPopupGroup } from '../../player/context';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { useSafeId } from '../../utils/use-safe-id';\nimport { useOptionalControlsContext } from '../controls/context';\nimport { usePositionedState } from '../hooks/use-positioned-state';\nimport { PopoverContextProvider } from './context';\n\nexport interface PopoverRootProps extends CorePopoverProps {\n  /** Boundary used to constrain the popup size. */\n  boundary?: PositioningBoundary;\n  /** Called when the popover open state changes (fires immediately, before animations). */\n  onOpenChange?: (open: boolean, details: PopoverChangeDetails) => void;\n  /** Called after open/close animations complete. */\n  onOpenChangeComplete?: (open: boolean) => void;\n  children?: ReactNode;\n}\n\nexport function PopoverRoot({\n  open: controlledOpen,\n  defaultOpen = PopoverCore.defaultProps.defaultOpen,\n  onOpenChange: onOpenChangeProp,\n  onOpenChangeComplete: onOpenChangeCompleteProp,\n  openOnHover = PopoverCore.defaultProps.openOnHover,\n  delay = PopoverCore.defaultProps.delay,\n  closeDelay = PopoverCore.defaultProps.closeDelay,\n  boundary = 'container',\n  children,\n  ...coreProps\n}: PopoverRootProps): ReactNode {\n  const container = useOptionalContainer();\n  const popupGroup = useOptionalPopupGroup();\n  const controls = useOptionalControlsContext();\n  const [core] = useState(() => new PopoverCore(coreProps));\n  core.setProps(coreProps);\n\n  const isControlled = !isUndefined(controlledOpen);\n\n  // Keep refs that always point to the latest values so the\n  // createPopover closure never reads stale props.\n  const onOpenChangeRef = useLatestRef(onOpenChangeProp);\n  const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);\n  const closeOnEscapeRef = useLatestRef(coreProps.closeOnEscape);\n  const closeOnOutsideClickRef = useLatestRef(coreProps.closeOnOutsideClick);\n  const openOnHoverRef = useLatestRef(openOnHover);\n  const delayRef = useLatestRef(delay);\n  const closeDelayRef = useLatestRef(closeDelay);\n  const popupGroupRef = useLatestRef(popupGroup);\n\n  const [popover] = useState(() => {\n    const instance = createPopover({\n      transition: createTransition(),\n      onOpenChange: (nextOpen: boolean, details: PopoverChangeDetails) => {\n        onOpenChangeRef.current?.(nextOpen, details);\n      },\n      onOpenChangeComplete: (nextOpen: boolean) => {\n        onOpenChangeCompleteRef.current?.(nextOpen);\n      },\n      closeOnEscape: () => closeOnEscapeRef.current ?? PopoverCore.defaultProps.closeOnEscape,\n      closeOnOutsideClick: () => closeOnOutsideClickRef.current ?? PopoverCore.defaultProps.closeOnOutsideClick,\n      openOnHover: () => openOnHoverRef.current,\n      delay: () => delayRef.current,\n      closeDelay: () => closeDelayRef.current,\n      group: () => popupGroupRef.current,\n    });\n\n    // Apply defaultOpen on creation (uncontrolled only)\n    if (!isControlled && defaultOpen) {\n      instance.open('click');\n    }\n\n    return instance;\n  });\n\n  const anchorName = useSafeId();\n  const popupId = useSafeId('popup');\n\n  // Sync controlled open prop -> internal input state.\n  useEffect(() => {\n    if (isUndefined(controlledOpen)) return;\n\n    const { active: inputOpen } = popover.input.current;\n    if (controlledOpen === inputOpen) return;\n\n    if (controlledOpen) {\n      popover.open('click');\n    } else {\n      popover.close('click');\n    }\n  }, [controlledOpen, popover]);\n\n  useEffect(() => {\n    if (isUndefined(controls?.state.visible)) return;\n    if (controls.state.visible) return;\n\n    popover.close('imperative-action');\n  }, [controls?.state.visible, popover]);\n\n  useDestroy(popover);\n\n  const input = useSnapshot(popover.input);\n  core.setInput(input);\n  const { state, preferredSide, setPositionedSide } = usePositionedState(core.getState());\n\n  return (\n    <PopoverContextProvider\n      value={{\n        core,\n        popover,\n        state,\n        preferredSide,\n        setPositionedSide,\n        stateAttrMap: PopoverDataAttrs,\n        anchorName,\n        popupId,\n        boundary,\n        container,\n      }}\n    >\n      {children}\n    </PopoverContextProvider>\n  );\n}\n\nexport namespace PopoverRoot {\n  export type Props = PopoverRootProps;\n}\n"],"mappings":";;;;;;;;;;;;;;;AA+BA,SAAgB,YAAY,EAC1B,MAAM,gBACN,cAAc,YAAY,aAAa,aACvC,cAAc,kBACd,sBAAsB,0BACtB,cAAc,YAAY,aAAa,aACvC,QAAQ,YAAY,aAAa,OACjC,aAAa,YAAY,aAAa,YACtC,WAAW,aACX,UACA,GAAG,aAC2B;CAC9B,MAAM,YAAY,qBAAqB;CACvC,MAAM,aAAa,sBAAsB;CACzC,MAAM,WAAW,2BAA2B;CAC5C,MAAM,CAAC,QAAQ,eAAe,IAAI,YAAY,SAAS,CAAC;CACxD,KAAK,SAAS,SAAS;CAEvB,MAAM,eAAe,CAAC,YAAY,cAAc;CAIhD,MAAM,kBAAkB,aAAa,gBAAgB;CACrD,MAAM,0BAA0B,aAAa,wBAAwB;CACrE,MAAM,mBAAmB,aAAa,UAAU,aAAa;CAC7D,MAAM,yBAAyB,aAAa,UAAU,mBAAmB;CACzE,MAAM,iBAAiB,aAAa,WAAW;CAC/C,MAAM,WAAW,aAAa,KAAK;CACnC,MAAM,gBAAgB,aAAa,UAAU;CAC7C,MAAM,gBAAgB,aAAa,UAAU;CAE7C,MAAM,CAAC,WAAW,eAAe;EAC/B,MAAM,WAAW,cAAc;GAC7B,YAAY,iBAAiB;GAC7B,eAAe,UAAmB,YAAkC;IAClE,gBAAgB,UAAU,UAAU,OAAO;GAC7C;GACA,uBAAuB,aAAsB;IAC3C,wBAAwB,UAAU,QAAQ;GAC5C;GACA,qBAAqB,iBAAiB,WAAW,YAAY,aAAa;GAC1E,2BAA2B,uBAAuB,WAAW,YAAY,aAAa;GACtF,mBAAmB,eAAe;GAClC,aAAa,SAAS;GACtB,kBAAkB,cAAc;GAChC,aAAa,cAAc;EAC7B,CAAC;EAGD,IAAI,CAAC,gBAAgB,aACnB,SAAS,KAAK,OAAO;EAGvB,OAAO;CACT,CAAC;CAED,MAAM,aAAa,UAAU;CAC7B,MAAM,UAAU,UAAU,OAAO;CAGjC,gBAAgB;EACd,IAAI,YAAY,cAAc,GAAG;EAEjC,MAAM,EAAE,QAAQ,cAAc,QAAQ,MAAM;EAC5C,IAAI,mBAAmB,WAAW;EAElC,IAAI,gBACF,QAAQ,KAAK,OAAO;OAEpB,QAAQ,MAAM,OAAO;CAEzB,GAAG,CAAC,gBAAgB,OAAO,CAAC;CAE5B,gBAAgB;EACd,IAAI,YAAY,UAAU,MAAM,OAAO,GAAG;EAC1C,IAAI,SAAS,MAAM,SAAS;EAE5B,QAAQ,MAAM,mBAAmB;CACnC,GAAG,CAAC,UAAU,MAAM,SAAS,OAAO,CAAC;CAErC,WAAW,OAAO;CAElB,MAAM,QAAQ,YAAY,QAAQ,KAAK;CACvC,KAAK,SAAS,KAAK;CACnB,MAAM,EAAE,OAAO,eAAe,sBAAsB,mBAAmB,KAAK,SAAS,CAAC;CAEtF,OACE,oBAAC,wBAAD;EACE,OAAO;GACL;GACA;GACA;GACA;GACA;GACA,cAAc;GACd;GACA;GACA;GACA;EACF;EAEC;CACqB,CAAA;AAE5B"}

package/dist/dev/ui/popover/popover-trigger.d.ts

@@ -1,11 +1,9 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
-
 //#region src/ui/popover/popover-trigger.d.ts
 interface PopoverTriggerProps extends UIComponentProps<'button', PopoverState> {}
 /** Button that toggles the popover visibility. Renders a `<button>` element. */
-declare const PopoverTrigger: _$react.ForwardRefExoticComponent<Omit<PopoverTriggerProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
+declare const PopoverTrigger: import("react").ForwardRefExoticComponent<Omit<PopoverTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 declare namespace PopoverTrigger {
   type Props = PopoverTriggerProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-trigger.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-trigger.tsx"],"mappings":";;;;;UAUiB,mBAAA,SAA4B,gBAAA,WAA2B,YAAA;;cAG3D,cAAA,EAAc,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,mBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAwCV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-trigger.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-trigger.tsx"],"mappings":";;;UAUiB,4BAA4B,2BAA2B;;cAG3D,gCAAc,0BAAA,KAAA,8CAAA,cAAA;kBAwCV;OACH,QAAQ;OACR,QAAQ"}