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

package/dist/dev/internal/skins/minimal-video/skins/shared/video/display/status-indicators.js

@@ -0,0 +1,80 @@
+import { StatusAnnouncer } from "../../../../../shared/components/behaviors/status-announcer.js";
+import { SeekIndicator } from "../../../../components/display/seek-indicator.js";
+import { PlaybackStatusIndicator, StatusIndicator } from "../../../../components/display/status-indicator.js";
+import { VolumeIndicator } from "../../../../components/display/volume-indicator.js";
+import { c } from "react-compiler-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@videojs/utils/style";
+//#region src/internal/skins/minimal-video/skins/shared/video/display/status-indicators.tsx
+/** @jsxImportSource react */
+function VideoStatusIndicators(t0) {
+	const $ = c(15);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	let className;
+	let props;
+	if ($[2] !== t1) {
+		({className, ...props} = t1);
+		$[2] = t1;
+		$[3] = className;
+		$[4] = props;
+	} else {
+		className = $[3];
+		props = $[4];
+	}
+	let t2;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(StatusAnnouncer, {});
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== className) {
+		t3 = cn("video-status-indicators", className);
+		$[6] = className;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	let t5;
+	let t6;
+	let t7;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(VolumeIndicator, {});
+		t5 = /* @__PURE__ */ jsx(StatusIndicator, {});
+		t6 = /* @__PURE__ */ jsx(SeekIndicator, {});
+		t7 = /* @__PURE__ */ jsx(PlaybackStatusIndicator, {});
+		$[8] = t4;
+		$[9] = t5;
+		$[10] = t6;
+		$[11] = t7;
+	} else {
+		t4 = $[8];
+		t5 = $[9];
+		t6 = $[10];
+		t7 = $[11];
+	}
+	let t8;
+	if ($[12] !== props || $[13] !== t3) {
+		t8 = /* @__PURE__ */ jsxs(Fragment, { children: [t2, /* @__PURE__ */ jsxs("div", {
+			className: t3,
+			...props,
+			children: [
+				t4,
+				t5,
+				t6,
+				t7
+			]
+		})] });
+		$[12] = props;
+		$[13] = t3;
+		$[14] = t8;
+	} else t8 = $[14];
+	return t8;
+}
+//#endregion
+export { VideoStatusIndicators };
+
+//# sourceMappingURL=status-indicators.js.map

package/dist/dev/internal/skins/minimal-video/skins/shared/video/display/status-indicators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-indicators.js","names":["{ className, ...props }: VideoStatusIndicatorsProps = {}","<StatusAnnouncer />","cn('video-status-indicators', className)","<VolumeIndicator />","<StatusIndicator />","<SeekIndicator />","<PlaybackStatusIndicator />","<>\n      <StatusAnnouncer />\n      <div className={cn('video-status-indicators', className)} {...props}>\n        <VolumeIndicator />\n        <StatusIndicator />\n        <SeekIndicator />\n        <PlaybackStatusIndicator />\n      </div>\n    </>"],"sources":["../../../../../../../../../src/internal/skins/minimal-video/skins/shared/video/display/status-indicators.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport type { ComponentProps } from 'react';\n\nimport { StatusAnnouncer } from '../../../../../shared/components/behaviors/status-announcer';\nimport { SeekIndicator } from '../../../../components/display/seek-indicator';\nimport { PlaybackStatusIndicator, StatusIndicator } from '../../../../components/display/status-indicator';\nimport { VolumeIndicator } from '../../../../components/display/volume-indicator';\n\nexport type VideoStatusIndicatorsProps = Omit<ComponentProps<'div'>, 'children'>;\n\nexport function VideoStatusIndicators({ className, ...props }: VideoStatusIndicatorsProps = {}) {\n  return (\n    <>\n      <StatusAnnouncer />\n      <div className={cn('video-status-indicators', className)} {...props}>\n        <VolumeIndicator />\n        <StatusIndicator />\n        <SeekIndicator />\n        <PlaybackStatusIndicator />\n      </div>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;AAYA,SAAgB,sBAAA,IAAgF;;CAA1DA,IAAAA;;EAAsD,KAAA,OAAA,KAAA,IAAA,CAAC,IAAvDA;;;;CAAE,IAAA;CAAc,IAAA;CAAhBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,cAAW,SAAbA;;;;;;;;CAGhCC,IAAAA;;EAAC,KAAA,oBAAA,iBAAD,CAAkB,CAAA;;;CACFC,IAAAA;CAA8B,IAAA,EAAA,OAAA,WAAA;EAA9B,KAAA,GAAG,2BAA2B,SAAS;EAAT,EAAA,KAAA;;;CAC5CC,IAAAA;CACAC,IAAAA;CACAC,IAAAA;CACAC,IAAAA;;EAHA,KAAA,oBAAC,iBAAD,CAAkB,CAAA;EAClB,KAAA,oBAAC,iBAAD,CAAkB,CAAA;EAClB,KAAA,oBAAC,eAAD,CAAgB,CAAA;EAChB,KAAA,oBAAC,yBAAD,CAA0B,CAAA;;;;;;;;;;;CAN9BC,IAAAA;CAEgE,IAAA,EAAA,QAAA,SAAA,EAAA,QAA9CL,IAAAA;EAFlB,KAAA,qBAAA,UAAA,EAAA,UAAA,CACED,IACA,qBAAC,OAAD;GAAK,WAAWC;GAA0C,GAAI;GAA9D,UAAA;IACEC;IACAC;IACAC;IACAC;GACG;EACL,CAAA,CAAA,EAAA,CAAA;EAN8D,EAAA,MAAA;EAA9CJ,EAAAA,MAAAA;;;CAHpB,OACEK;AAUJ"}

package/dist/dev/internal/skins/minimal-video/skins/shared/video/menus/settings-menu.js

@@ -0,0 +1,56 @@
+import { AudioTrackMenu } from "../../../../components/menus/audio-track-menu.js";
+import { CaptionsSubmenu } from "../../../../components/menus/captions-submenu.js";
+import { PlaybackRateSubmenu } from "../../../../components/menus/playback-rate-submenu.js";
+import { QualityMenu } from "../../../../components/menus/quality-menu.js";
+import { SettingsMenu } from "../../../../components/menus/settings-menu.js";
+import { c } from "react-compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/internal/skins/minimal-video/skins/shared/video/menus/settings-menu.tsx
+function VideoSettingsMenu(t0) {
+	const $ = c(8);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	const props = t1;
+	let t2;
+	let t3;
+	let t4;
+	let t5;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(QualityMenu, {});
+		t3 = /* @__PURE__ */ jsx(AudioTrackMenu, {});
+		t4 = /* @__PURE__ */ jsx(PlaybackRateSubmenu, {});
+		t5 = /* @__PURE__ */ jsx(CaptionsSubmenu, {});
+		$[2] = t2;
+		$[3] = t3;
+		$[4] = t4;
+		$[5] = t5;
+	} else {
+		t2 = $[2];
+		t3 = $[3];
+		t4 = $[4];
+		t5 = $[5];
+	}
+	let t6;
+	if ($[6] !== props) {
+		t6 = /* @__PURE__ */ jsxs(SettingsMenu, {
+			...props,
+			children: [
+				t2,
+				t3,
+				t4,
+				t5
+			]
+		});
+		$[6] = props;
+		$[7] = t6;
+	} else t6 = $[7];
+	return t6;
+}
+//#endregion
+export { VideoSettingsMenu };
+
+//# sourceMappingURL=settings-menu.js.map

package/dist/dev/internal/skins/minimal-video/skins/shared/video/menus/settings-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-menu.js","names":["props: VideoSettingsMenuProps = {}","<QualityMenu />","<AudioTrackMenu />","<PlaybackRateSubmenu />","<CaptionsSubmenu />","<SettingsMenu {...props}>\n      <QualityMenu />\n      <AudioTrackMenu />\n      <PlaybackRateSubmenu />\n      <CaptionsSubmenu />\n    </SettingsMenu>"],"sources":["../../../../../../../../../src/internal/skins/minimal-video/skins/shared/video/menus/settings-menu.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport type { ComponentProps } from 'react';\n\nimport { AudioTrackMenu } from '../../../../components/menus/audio-track-menu';\nimport { CaptionsSubmenu } from '../../../../components/menus/captions-submenu';\nimport { PlaybackRateSubmenu } from '../../../../components/menus/playback-rate-submenu';\nimport { QualityMenu } from '../../../../components/menus/quality-menu';\nimport { SettingsMenu } from '../../../../components/menus/settings-menu';\n\nexport type VideoSettingsMenuProps = Omit<NonNullable<ComponentProps<typeof SettingsMenu>>, 'children'>;\n\nexport function VideoSettingsMenu(props: VideoSettingsMenuProps = {}) {\n  return (\n    <SettingsMenu {...props}>\n      <QualityMenu />\n      <AudioTrackMenu />\n      <PlaybackRateSubmenu />\n      <CaptionsSubmenu />\n    </SettingsMenu>\n  );\n}\n"],"mappings":";;;;;;;;AAYA,SAAgB,kBAAA,IAAsD;;CAApCA,IAAAA;;EAAgC,KAAA,OAAA,KAAA,IAAA,CAAC,IAAjCA;;;;;CAG5BC,IAAAA;CACAC,IAAAA;CACAC,IAAAA;CACAC,IAAAA;;EAHA,KAAA,oBAAC,aAAD,CAAc,CAAA;EACd,KAAA,oBAAC,gBAAD,CAAiB,CAAA;EACjB,KAAA,oBAAC,qBAAD,CAAsB,CAAA;EACtB,KAAA,oBAAC,iBAAD,CAAkB,CAAA;;;;;;;;;;;CAJpBC,IAAAA;CAAkB,IAAA,EAAA,OAAA,OAAA;EAAlB,KAAA,qBAAC,cAAD;GAAc,GAAI;GAAlB,UAAA;IACEJ;IACAC;IACAC;IACAC;GACY;;EALI,EAAA,KAAA;;;CADpB,OACEC;AAOJ"}

package/dist/dev/internal/skins/shared/components/behaviors/status-announcer.js

@@ -0,0 +1,47 @@
+import { StatusAnnouncer as StatusAnnouncer$1 } from "../../../../../ui/status-announcer/component.js";
+import { c } from "react-compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+import { cn, resolveClassName } from "@videojs/utils/style";
+//#region src/internal/skins/shared/components/behaviors/status-announcer.tsx
+/** @jsxImportSource react */
+function StatusAnnouncer(t0) {
+	const $ = c(10);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	let className;
+	let props;
+	if ($[2] !== t1) {
+		({className, ...props} = t1);
+		$[2] = t1;
+		$[3] = className;
+		$[4] = props;
+	} else {
+		className = $[3];
+		props = $[4];
+	}
+	let t2;
+	if ($[5] !== className) {
+		t2 = (state) => cn("media-status-announcer", resolveClassName(className, state));
+		$[5] = className;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] !== props || $[8] !== t2) {
+		t3 = /* @__PURE__ */ jsx(StatusAnnouncer$1, {
+			className: t2,
+			...props
+		});
+		$[7] = props;
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
+}
+//#endregion
+export { StatusAnnouncer };
+
+//# sourceMappingURL=status-announcer.js.map

package/dist/dev/internal/skins/shared/components/behaviors/status-announcer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-announcer.js","names":["{ className, ...props }: StatusAnnouncerProps = {}","(state) => cn('media-status-announcer', resolveClassName(className, state))","<StatusAnnouncerPrimitive\n      className={(state) => cn('media-status-announcer', resolveClassName(className, state))}\n      {...props}\n    />"],"sources":["../../../../../../../src/internal/skins/shared/components/behaviors/status-announcer.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport { resolveClassName } from '@videojs/utils/style';\n\nimport { StatusAnnouncer as StatusAnnouncerPrimitive } from '../../../../skin-primitives';\n\nexport type StatusAnnouncerProps = Omit<StatusAnnouncerPrimitive.Props, 'children'>;\n\nexport function StatusAnnouncer({ className, ...props }: StatusAnnouncerProps = {}) {\n  return (\n    <StatusAnnouncerPrimitive\n      className={(state) => cn('media-status-announcer', resolveClassName(className, state))}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;AASA,SAAgB,gBAAA,IAAoE;;CAApDA,IAAAA;;EAAgD,KAAA,OAAA,KAAA,IAAA,CAAC,IAAjDA;;;;CAAE,IAAA;CAAc,IAAA;CAAhBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,cAAW,SAAbA;;;;;;;;CAGfC,IAAAA;CAAyD,IAAA,EAAA,OAAA,WAAA;EAAzD,MAAC,UAAU,GAAG,0BAA0B,iBAAiB,WAAW,KAAK,CAAC;EAAjB,EAAA,KAAA;;;CADtEC,IAAAA;CAEM,IAAA,EAAA,OAAA,SAAA,EAAA,OADOD,IAAAA;EADb,KAAA,oBAAC,mBAAD;GACE,WAAWA;GACX,GAAI;EACL,CAAA;EADK,EAAA,KAAA;EADOA,EAAAA,KAAAA;;;CAFf,OACEC;AAKJ"}

package/dist/dev/internal/skins/shared/components/buttons/button-tooltip.js

@@ -3,18 +3,72 @@ import { TooltipShortcut } from "../../../../../ui/tooltip/shortcut.js";
 import { TooltipPopup } from "../../../../../ui/tooltip/popup.js";
 import { TooltipRoot } from "../../../../../ui/tooltip/root.js";
 import { TooltipTrigger } from "../../../../../ui/tooltip/trigger.js";
+import { c } from "react-compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "@videojs/utils/style";
 //#region src/internal/skins/shared/components/buttons/button-tooltip.tsx
 /** @jsxImportSource react */
-function ButtonTooltip({ children, label, ...props }) {
-	return /* @__PURE__ */ jsxs(TooltipRoot, {
-		...props,
-		children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: children }), /* @__PURE__ */ jsxs(TooltipPopup, {
-			className: cn("media-popup", "media-popup-safe-area", "media-popup-transition", "media-popup-surface", "media-tooltip"),
-			children: [label ?? /* @__PURE__ */ jsx(TooltipLabel, {}), !label && /* @__PURE__ */ jsx(TooltipShortcut, { className: "media-tooltip-shortcut" })]
-		})]
-	});
+function ButtonTooltip(t0) {
+	const $ = c(18);
+	let children;
+	let label;
+	let props;
+	if ($[0] !== t0) {
+		({children, label, ...props} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = label;
+		$[3] = props;
+	} else {
+		children = $[1];
+		label = $[2];
+		props = $[3];
+	}
+	let t1;
+	if ($[4] !== children) {
+		t1 = /* @__PURE__ */ jsx(TooltipTrigger, { render: children });
+		$[4] = children;
+		$[5] = t1;
+	} else t1 = $[5];
+	let t2;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = cn("media-popup", "media-popup-safe-area", "media-popup-transition", "media-popup-surface", "media-tooltip");
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] !== label) {
+		t3 = label ?? /* @__PURE__ */ jsx(TooltipLabel, {});
+		$[7] = label;
+		$[8] = t3;
+	} else t3 = $[8];
+	let t4;
+	if ($[9] !== label) {
+		t4 = !label && /* @__PURE__ */ jsx(TooltipShortcut, { className: "media-tooltip-shortcut" });
+		$[9] = label;
+		$[10] = t4;
+	} else t4 = $[10];
+	let t5;
+	if ($[11] !== t3 || $[12] !== t4) {
+		t5 = /* @__PURE__ */ jsxs(TooltipPopup, {
+			className: t2,
+			children: [t3, t4]
+		});
+		$[11] = t3;
+		$[12] = t4;
+		$[13] = t5;
+	} else t5 = $[13];
+	let t6;
+	if ($[14] !== props || $[15] !== t1 || $[16] !== t5) {
+		t6 = /* @__PURE__ */ jsxs(TooltipRoot, {
+			...props,
+			children: [t1, t5]
+		});
+		$[14] = props;
+		$[15] = t1;
+		$[16] = t5;
+		$[17] = t6;
+	} else t6 = $[17];
+	return t6;
 }
 //#endregion
 export { ButtonTooltip };

package/dist/dev/internal/skins/shared/components/buttons/button-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-tooltip.js","names":["Tooltip.Root","Tooltip.Trigger","Tooltip.Popup","Tooltip.Label","Tooltip.Shortcut"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/button-tooltip.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { Tooltip } from '../../../../skin-primitives';\n\nexport interface ButtonTooltipProps extends Omit<Tooltip.RootProps, 'children'> {\n  children: ReactElement;\n  label?: ReactNode;\n}\n\nexport function ButtonTooltip({ children, label, ...props }: ButtonTooltipProps) {\n  return (\n    <Tooltip.Root {...props}>\n      <Tooltip.Trigger render={children} />\n      <Tooltip.Popup\n        className={cn(\n          'media-popup',\n          'media-popup-safe-area',\n          'media-popup-transition',\n          'media-popup-surface',\n          'media-tooltip'\n        )}\n      >\n        {label ?? <Tooltip.Label />}\n        {!label && <Tooltip.Shortcut className={'media-tooltip-shortcut'} />}\n      </Tooltip.Popup>\n    </Tooltip.Root>\n  );\n}\n"],"mappings":";;;;;;;;;AAYA,SAAgB,cAAc,EAAE,UAAU,OAAO,GAAG,SAA6B;CAC/E,OACE,qBAACA,aAAD;EAAc,GAAI;EAAlB,UAAA,CACE,oBAACC,gBAAD,EAAiB,QAAQ,SAAW,CAAA,GACpC,qBAACC,cAAD;GACE,WAAW,GACT,eACA,yBACA,0BACA,uBACA,eACF;GAPF,UAAA,CASG,SAAS,oBAACC,cAAD,CAAgB,CAAA,GACzB,CAAC,SAAS,oBAACC,iBAAD,EAAkB,WAAW,yBAA2B,CAAA,CACtD;EACH,CAAA,CAAA;;AAElB"}
+{"version":3,"file":"button-tooltip.js","names":["{ children, label, ...props }: ButtonTooltipProps","<Tooltip.Trigger render={children} />","Tooltip.Trigger","cn(\n          'media-popup',\n          'media-popup-safe-area',\n          'media-popup-transition',\n          'media-popup-surface',\n          'media-tooltip'\n        )","label ?? <Tooltip.Label />","Tooltip.Label","!label && <Tooltip.Shortcut className={'media-tooltip-shortcut'} />","Tooltip.Shortcut","<Tooltip.Popup\n        className={cn(\n          'media-popup',\n          'media-popup-safe-area',\n          'media-popup-transition',\n          'media-popup-surface',\n          'media-tooltip'\n        )}\n      >\n        {label ?? <Tooltip.Label />}\n        {!label && <Tooltip.Shortcut className={'media-tooltip-shortcut'} />}\n      </Tooltip.Popup>","Tooltip.Popup","<Tooltip.Root {...props}>\n      <Tooltip.Trigger render={children} />\n      <Tooltip.Popup\n        className={cn(\n          'media-popup',\n          'media-popup-safe-area',\n          'media-popup-transition',\n          'media-popup-surface',\n          'media-tooltip'\n        )}\n      >\n        {label ?? <Tooltip.Label />}\n        {!label && <Tooltip.Shortcut className={'media-tooltip-shortcut'} />}\n      </Tooltip.Popup>\n    </Tooltip.Root>","Tooltip.Root"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/button-tooltip.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { Tooltip } from '../../../../skin-primitives';\n\nexport interface ButtonTooltipProps extends Omit<Tooltip.RootProps, 'children'> {\n  children: ReactElement;\n  label?: ReactNode;\n}\n\nexport function ButtonTooltip({ children, label, ...props }: ButtonTooltipProps) {\n  return (\n    <Tooltip.Root {...props}>\n      <Tooltip.Trigger render={children} />\n      <Tooltip.Popup\n        className={cn(\n          'media-popup',\n          'media-popup-safe-area',\n          'media-popup-transition',\n          'media-popup-surface',\n          'media-tooltip'\n        )}\n      >\n        {label ?? <Tooltip.Label />}\n        {!label && <Tooltip.Shortcut className={'media-tooltip-shortcut'} />}\n      </Tooltip.Popup>\n    </Tooltip.Root>\n  );\n}\n"],"mappings":";;;;;;;;;;AAYA,SAAgB,cAAA,IAAiE;;CAAjD,IAAA;CAAU,IAAA;CAAU,IAAA;CAAtBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,UAAU,UAAO,SAAnBA;;;;;;;;;;CAGxBC,IAAAA;CAAyB,IAAA,EAAA,OAAA,UAAA;EAAzB,KAAA,oBAACC,gBAAD,EAAiB,QAAQ,SAAW,CAAA;EAAX,EAAA,KAAA;;;CAEZC,IAAAA;;EACT,KAAA,GAAA,eACA,yBACA,0BACA,uBACA,eACF;;;CAECC,IAAAA;;EAAS,KAAA,SAAA,oBAACC,cAAD,CAAgB,CAAA;EAAzB,EAAA,KAAA;;;CACAC,IAAAA;CAAC,IAAA,EAAA,OAAA,OAAA;EAAD,KAAA,CAAC,SAAS,oBAACC,iBAAD,EAAkB,WAAW,yBAA2B,CAAA;EAAjE,EAAA,KAAA;;;CAVJC,IAAAA;CASGJ,IAAAA,EAAAA,QAAAA,MAAAA,EAAAA,QACAE,IAAAA;EAVH,KAAA,qBAACG,cAAD;GACE,WAAWN;GADb,UAAA,CASGC,IACAE,EACY;;EAFZF,EAAAA,MAAAA;EACAE,EAAAA,MAAAA;;;CAZLI,IAAAA;CAAkB,IAAA,EAAA,QAAA,SAAA,EAAA,QAChBT,MAAAA,EAAAA,QACAO,IAAAA;EAFF,KAAA,qBAACG,aAAD;GAAc,GAAI;GAAlB,UAAA,CACEV,IACAO,EAYY;;EAdI,EAAA,MAAA;EAChBP,EAAAA,MAAAA;EACAO,EAAAA,MAAAA;;;CAHJ,OACEE;AAgBJ"}

package/dist/dev/internal/skins/shared/components/buttons/button.js

@@ -1,11 +1,37 @@
+import { c } from "react-compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { cn } from "@videojs/utils/style";
 //#region src/internal/skins/shared/components/buttons/button.tsx
-function Button({ className, ...props }) {
-	return /* @__PURE__ */ jsx("button", {
-		className: cn("media-button", className),
-		...props
-	});
+function Button(t0) {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = cn("media-button", className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx("button", {
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
 }
 //#endregion
 export { Button };

package/dist/dev/internal/skins/shared/components/buttons/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/button.tsx"],"sourcesContent":["import { cn } from '@videojs/utils/style';\nimport type { ComponentProps } from 'react';\n\n/** Shared button carrying the base interactive styles used by media controls. */\nexport type ButtonProps = ComponentProps<'button'>;\n\nexport function Button({ className, ...props }: ButtonProps) {\n  return <button className={cn('media-button', className)} {...props} />;\n}\n"],"mappings":";;;AAMA,SAAgB,OAAO,EAAE,WAAW,GAAG,SAAsB;CAC3D,OAAO,oBAAC,UAAD;EAAQ,WAAW,GAAG,gBAAgB,SAAS;EAAG,GAAI;CAAQ,CAAA;AACvE"}
+{"version":3,"file":"button.js","names":["{ className, ...props }: ButtonProps","cn('media-button', className)","<button className={cn('media-button', className)} {...props} />"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/button.tsx"],"sourcesContent":["import { cn } from '@videojs/utils/style';\nimport type { ComponentProps } from 'react';\n\n/** Shared button carrying the base interactive styles used by media controls. */\nexport type ButtonProps = ComponentProps<'button'>;\n\nexport function Button({ className, ...props }: ButtonProps) {\n  return <button className={cn('media-button', className)} {...props} />;\n}\n"],"mappings":";;;;AAMA,SAAgB,OAAA,IAA6C;;CAApC,IAAA;CAAc,IAAA;CAAhBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,cAAW,SAAbA;;;;;;;;CACKC,IAAAA;CAAmB,IAAA,EAAA,OAAA,WAAA;EAAnB,KAAA,GAAG,gBAAgB,SAAS;EAAT,EAAA,KAAA;;;CAAtCC,IAAAA;CAAsD,IAAA,EAAA,OAAA,SAAA,EAAA,OAAnCD,IAAAA;EAAnB,KAAA,oBAAC,UAAD;GAAQ,WAAWA;GAA+B,GAAI;EAAQ,CAAA;EAAR,EAAA,KAAA;EAAnCA,EAAAA,KAAAA;;;CAA1B,OAAOC;AACT"}

package/dist/dev/internal/skins/shared/components/buttons/live-button.js

@@ -1,15 +1,52 @@
 import { LiveButton as LiveButton$1 } from "../../../../../ui/live-button/component.js";
 import { Button } from "./button.js";
+import { c } from "react-compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { cn, resolveClassName } from "@videojs/utils/style";
 //#region src/internal/skins/shared/components/buttons/live-button.tsx
 /** @jsxImportSource react */
-function LiveButton({ className, ...props } = {}) {
-	return /* @__PURE__ */ jsx(LiveButton$1, {
-		render: /* @__PURE__ */ jsx(Button, {}),
-		className: (state) => cn("media-live-button", resolveClassName(className, state)),
-		...props
-	});
+function LiveButton(t0) {
+	const $ = c(11);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	let className;
+	let props;
+	if ($[2] !== t1) {
+		({className, ...props} = t1);
+		$[2] = t1;
+		$[3] = className;
+		$[4] = props;
+	} else {
+		className = $[3];
+		props = $[4];
+	}
+	let t2;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Button, {});
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== className) {
+		t3 = (state) => cn("media-live-button", resolveClassName(className, state));
+		$[6] = className;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== props || $[9] !== t3) {
+		t4 = /* @__PURE__ */ jsx(LiveButton$1, {
+			render: t2,
+			className: t3,
+			...props
+		});
+		$[8] = props;
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	return t4;
 }
 //#endregion
 export { LiveButton };

package/dist/dev/internal/skins/shared/components/buttons/live-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"live-button.js","names":["LiveButtonPrimitive"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/live-button.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn, resolveClassName } from '@videojs/utils/style';\n\nimport { LiveButton as LiveButtonPrimitive } from '../../../../skin-primitives';\nimport { Button } from './button';\n\nexport type LiveButtonProps = Omit<LiveButtonPrimitive.Props, 'children'>;\n\nexport function LiveButton({ className, ...props }: LiveButtonProps = {}) {\n  return (\n    <LiveButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-live-button', resolveClassName(className, state))}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;AASA,SAAgB,WAAW,EAAE,WAAW,GAAG,UAA2B,CAAC,GAAG;CACxE,OACE,oBAACA,cAAD;EACE,QAAQ,oBAAC,QAAD,CAAS,CAAA;EACjB,YAAY,UAAU,GAAG,qBAAqB,iBAAiB,WAAW,KAAK,CAAC;EAChF,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"live-button.js","names":["{ className, ...props }: LiveButtonProps = {}","<Button />","(state) => cn('media-live-button', resolveClassName(className, state))","<LiveButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-live-button', resolveClassName(className, state))}\n      {...props}\n    />"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/live-button.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport { resolveClassName } from '@videojs/utils/style';\n\nimport { LiveButton as LiveButtonPrimitive } from '../../../../skin-primitives';\nimport { Button } from './button';\n\nexport type LiveButtonProps = Omit<LiveButtonPrimitive.Props, 'children'>;\n\nexport function LiveButton({ className, ...props }: LiveButtonProps = {}) {\n  return (\n    <LiveButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-live-button', resolveClassName(className, state))}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAUA,SAAgB,WAAA,IAA0D;;CAA/CA,IAAAA;;EAA2C,KAAA,OAAA,KAAA,IAAA,CAAC,IAA5CA;;;;CAAE,IAAA;CAAc,IAAA;CAAhBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,cAAW,SAAbA;;;;;;;;CAGbC,IAAAA;;EAAC,KAAA,oBAAA,QAAD,CAAS,CAAA;;;CACNC,IAAAA;CAAoD,IAAA,EAAA,OAAA,WAAA;EAApD,MAAC,UAAU,GAAG,qBAAqB,iBAAiB,WAAW,KAAK,CAAC;EAAjB,EAAA,KAAA;;;CAFjEC,IAAAA;CAGM,IAAA,EAAA,OAAA,SAAA,EAAA,OADOD,IAAAA;EAFb,KAAA,oBAAC,cAAD;GACE,QAAQD;GACR,WAAWC;GACX,GAAI;EACL,CAAA;EADK,EAAA,KAAA;EADOA,EAAAA,KAAAA;;;CAHf,OACEC;AAMJ"}

package/dist/dev/internal/skins/shared/components/buttons/playback-rate-button.js

@@ -1,15 +1,52 @@
 import { PlaybackRateButton as PlaybackRateButton$1 } from "../../../../../ui/playback-rate-button/component.js";
 import { Button } from "./button.js";
+import { c } from "react-compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { cn, resolveClassName } from "@videojs/utils/style";
 //#region src/internal/skins/shared/components/buttons/playback-rate-button.tsx
 /** @jsxImportSource react */
-function PlaybackRateButton({ className, ...props } = {}) {
-	return /* @__PURE__ */ jsx(PlaybackRateButton$1, {
-		render: /* @__PURE__ */ jsx(Button, {}),
-		className: (state) => cn("media-playback-rate-button", resolveClassName(className, state)),
-		...props
-	});
+function PlaybackRateButton(t0) {
+	const $ = c(11);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	let className;
+	let props;
+	if ($[2] !== t1) {
+		({className, ...props} = t1);
+		$[2] = t1;
+		$[3] = className;
+		$[4] = props;
+	} else {
+		className = $[3];
+		props = $[4];
+	}
+	let t2;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Button, {});
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== className) {
+		t3 = (state) => cn("media-playback-rate-button", resolveClassName(className, state));
+		$[6] = className;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== props || $[9] !== t3) {
+		t4 = /* @__PURE__ */ jsx(PlaybackRateButton$1, {
+			render: t2,
+			className: t3,
+			...props
+		});
+		$[8] = props;
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	return t4;
 }
 //#endregion
 export { PlaybackRateButton };

package/dist/dev/internal/skins/shared/components/buttons/playback-rate-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"playback-rate-button.js","names":["PlaybackRateButtonPrimitive"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/playback-rate-button.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn, resolveClassName } from '@videojs/utils/style';\n\nimport { PlaybackRateButton as PlaybackRateButtonPrimitive } from '../../../../skin-primitives';\nimport { Button } from './button';\n\nexport type PlaybackRateButtonProps = Omit<PlaybackRateButtonPrimitive.Props, 'children'>;\n\nexport function PlaybackRateButton({ className, ...props }: PlaybackRateButtonProps = {}) {\n  return (\n    <PlaybackRateButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-playback-rate-button', resolveClassName(className, state))}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;AASA,SAAgB,mBAAmB,EAAE,WAAW,GAAG,UAAmC,CAAC,GAAG;CACxF,OACE,oBAACA,sBAAD;EACE,QAAQ,oBAAC,QAAD,CAAS,CAAA;EACjB,YAAY,UAAU,GAAG,8BAA8B,iBAAiB,WAAW,KAAK,CAAC;EACzF,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"playback-rate-button.js","names":["{ className, ...props }: PlaybackRateButtonProps = {}","<Button />","(state) => cn('media-playback-rate-button', resolveClassName(className, state))","<PlaybackRateButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-playback-rate-button', resolveClassName(className, state))}\n      {...props}\n    />"],"sources":["../../../../../../../src/internal/skins/shared/components/buttons/playback-rate-button.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport { resolveClassName } from '@videojs/utils/style';\n\nimport { PlaybackRateButton as PlaybackRateButtonPrimitive } from '../../../../skin-primitives';\nimport { Button } from './button';\n\nexport type PlaybackRateButtonProps = Omit<PlaybackRateButtonPrimitive.Props, 'children'>;\n\nexport function PlaybackRateButton({ className, ...props }: PlaybackRateButtonProps = {}) {\n  return (\n    <PlaybackRateButtonPrimitive\n      render={<Button />}\n      className={(state) => cn('media-playback-rate-button', resolveClassName(className, state))}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAUA,SAAgB,mBAAA,IAA0E;;CAAvDA,IAAAA;;EAAmD,KAAA,OAAA,KAAA,IAAA,CAAC,IAApDA;;;;CAAE,IAAA;CAAc,IAAA;CAAhBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,cAAW,SAAbA;;;;;;;;CAGrBC,IAAAA;;EAAC,KAAA,oBAAA,QAAD,CAAS,CAAA;;;CACNC,IAAAA;CAA6D,IAAA,EAAA,OAAA,WAAA;EAA7D,MAAC,UAAU,GAAG,8BAA8B,iBAAiB,WAAW,KAAK,CAAC;EAAjB,EAAA,KAAA;;;CAF1EC,IAAAA;CAGM,IAAA,EAAA,OAAA,SAAA,EAAA,OADOD,IAAAA;EAFb,KAAA,oBAAC,sBAAD;GACE,QAAQD;GACR,WAAWC;GACX,GAAI;EACL,CAAA;EADK,EAAA,KAAA;EADOA,EAAAA,KAAAA;;;CAHf,OACEC;AAMJ"}

package/dist/dev/internal/skins/shared/components/dialogs/error-dialog.js

@@ -0,0 +1,46 @@
+import { DialogBackdrop } from "../../../../../ui/dialog/backdrop.js";
+import { DialogPopup } from "../../../../../ui/dialog/popup.js";
+import { ErrorDialogClose } from "../../../../../ui/error-dialog/close.js";
+import { ErrorDialogDescription } from "../../../../../ui/error-dialog/description.js";
+import { ErrorDialogRoot } from "../../../../../ui/error-dialog/root.js";
+import { ErrorDialogTitle } from "../../../../../ui/error-dialog/title.js";
+import { Button } from "../buttons/button.js";
+import { c } from "react-compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/internal/skins/shared/components/dialogs/error-dialog.tsx
+/** @jsxImportSource react */
+function ErrorDialog() {
+	const $ = c(3);
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = /* @__PURE__ */ jsx(DialogBackdrop, { className: "media-dialog-backdrop" });
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsxs("div", {
+			className: "media-dialog-content",
+			children: [/* @__PURE__ */ jsx(ErrorDialogTitle, { className: "media-dialog-title" }), /* @__PURE__ */ jsx(ErrorDialogDescription, { className: "media-dialog-description" })]
+		});
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsxs(ErrorDialogRoot, { children: [t0, /* @__PURE__ */ jsxs(DialogPopup, {
+			className: "media-dialog-popup",
+			children: [t1, /* @__PURE__ */ jsx("div", {
+				className: "media-dialog-actions",
+				children: /* @__PURE__ */ jsx(ErrorDialogClose, {
+					render: /* @__PURE__ */ jsx(Button, {}),
+					className: "media-dialog-close"
+				})
+			})]
+		})] });
+		$[2] = t2;
+	} else t2 = $[2];
+	return t2;
+}
+//#endregion
+export { ErrorDialog };
+
+//# sourceMappingURL=error-dialog.js.map

package/dist/dev/internal/skins/shared/components/dialogs/error-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-dialog.js","names":["<ErrorDialogPrimitive.Backdrop className={'media-dialog-backdrop'} />","ErrorDialogPrimitive.Backdrop","<div className={'media-dialog-content'}>\n          <ErrorDialogPrimitive.Title className={'media-dialog-title'} />\n          <ErrorDialogPrimitive.Description className={'media-dialog-description'} />\n        </div>","ErrorDialogPrimitive.Title","ErrorDialogPrimitive.Description","<ErrorDialogPrimitive.Root>\n      <ErrorDialogPrimitive.Backdrop className={'media-dialog-backdrop'} />\n      <ErrorDialogPrimitive.Popup className={'media-dialog-popup'}>\n        <div className={'media-dialog-content'}>\n          <ErrorDialogPrimitive.Title className={'media-dialog-title'} />\n          <ErrorDialogPrimitive.Description className={'media-dialog-description'} />\n        </div>\n        <div className={'media-dialog-actions'}>\n          <ErrorDialogPrimitive.Close render={<Button />} className={'media-dialog-close'} />\n        </div>\n      </ErrorDialogPrimitive.Popup>\n    </ErrorDialogPrimitive.Root>","ErrorDialogPrimitive.Root","ErrorDialogPrimitive.Popup","ErrorDialogPrimitive.Close"],"sources":["../../../../../../../src/internal/skins/shared/components/dialogs/error-dialog.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { ErrorDialog as ErrorDialogPrimitive } from '../../../../skin-primitives';\nimport { Button } from '../buttons/button';\n\nexport function ErrorDialog() {\n  return (\n    <ErrorDialogPrimitive.Root>\n      <ErrorDialogPrimitive.Backdrop className={'media-dialog-backdrop'} />\n      <ErrorDialogPrimitive.Popup className={'media-dialog-popup'}>\n        <div className={'media-dialog-content'}>\n          <ErrorDialogPrimitive.Title className={'media-dialog-title'} />\n          <ErrorDialogPrimitive.Description className={'media-dialog-description'} />\n        </div>\n        <div className={'media-dialog-actions'}>\n          <ErrorDialogPrimitive.Close render={<Button />} className={'media-dialog-close'} />\n        </div>\n      </ErrorDialogPrimitive.Popup>\n    </ErrorDialogPrimitive.Root>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAKA,SAAgB,cAAc;;CAGxBA,IAAAA;;EAACC,KAAAA,oBAAAA,gBAAD,EAA+B,WAAW,wBAA0B,CAAA;;;CAElEC,IAAAA;;EAAC,KAAA,qBAAA,OAAD;GAAK,WAAW;GAAhB,UAAA,CACE,oBAACC,kBAAD,EAA4B,WAAW,qBAAuB,CAAA,GAC9D,oBAACC,wBAAD,EAAkC,WAAW,2BAA6B,CAAA,CACvE;;;;CANTC,IAAAA;;EAACC,KAAAA,qBAAAA,iBAAD,EAAA,UAAA,CACEN,IACA,qBAACO,aAAD;GAA4B,WAAW;GAAvC,UAAA,CACEL,IAIA,oBAAC,OAAD;IAAK,WAAW;IACd,UAAA,oBAACM,kBAAD;KAA4B,QAAQ,oBAAC,QAAD,CAAS,CAAA;KAAG,WAAW;IAAuB,CAAA;GAC/E,CAAA,CACqB;EACH,CAAA,CAAA,EAAA,CAAA;;;CAZ7B,OACEH;AAaJ"}

package/dist/dev/internal/skins/shared/components/display/poster.js

@@ -0,0 +1,66 @@
+import { PosterImage } from "../../../../../ui/poster/image.js";
+import { PosterRoot } from "../../../../../ui/poster/root.js";
+import { c } from "react-compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn, resolveClassName } from "@videojs/utils/style";
+//#region src/internal/skins/shared/components/display/poster.tsx
+/** @jsxImportSource react */
+function Poster(t0) {
+	const $ = c(16);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	let children;
+	let className;
+	let props;
+	let renderImage;
+	if ($[2] !== t1) {
+		({children, className, renderImage, ...props} = t1);
+		$[2] = t1;
+		$[3] = children;
+		$[4] = className;
+		$[5] = props;
+		$[6] = renderImage;
+	} else {
+		children = $[3];
+		className = $[4];
+		props = $[5];
+		renderImage = $[6];
+	}
+	let t2;
+	if ($[7] !== className) {
+		t2 = (state) => cn("media-poster", resolveClassName(className, state));
+		$[7] = className;
+		$[8] = t2;
+	} else t2 = $[8];
+	let t3;
+	if ($[9] !== props || $[10] !== renderImage) {
+		t3 = /* @__PURE__ */ jsx(PosterImage, {
+			render: renderImage,
+			className: "media-poster-image",
+			...props
+		});
+		$[9] = props;
+		$[10] = renderImage;
+		$[11] = t3;
+	} else t3 = $[11];
+	let t4;
+	if ($[12] !== children || $[13] !== t2 || $[14] !== t3) {
+		t4 = /* @__PURE__ */ jsxs(PosterRoot, {
+			className: t2,
+			children: [t3, children]
+		});
+		$[12] = children;
+		$[13] = t2;
+		$[14] = t3;
+		$[15] = t4;
+	} else t4 = $[15];
+	return t4;
+}
+//#endregion
+export { Poster };
+
+//# sourceMappingURL=poster.js.map

package/dist/dev/internal/skins/shared/components/display/poster.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"poster.js","names":["{ children, className, renderImage, ...props }: PosterProps = {}","(state) => cn('media-poster', resolveClassName(className, state))","<PosterPrimitive.Image render={renderImage} className={'media-poster-image'} {...props} />","PosterPrimitive.Image","<PosterPrimitive.Root className={(state) => cn('media-poster', resolveClassName(className, state))}>\n      <PosterPrimitive.Image render={renderImage} className={'media-poster-image'} {...props} />\n\n      {children}\n    </PosterPrimitive.Root>","PosterPrimitive.Root"],"sources":["../../../../../../../src/internal/skins/shared/components/display/poster.tsx"],"sourcesContent":["/** @jsxImportSource react */\n\nimport { cn } from '@videojs/utils/style';\nimport { resolveClassName } from '@videojs/utils/style';\n\nimport { Poster as PosterPrimitive } from '../../../../skin-primitives';\n\nexport interface PosterProps extends Omit<PosterPrimitive.ImageProps, 'children' | 'render'> {\n  /** Draws the poster image in place of the one the skin renders. */\n  renderImage?: PosterPrimitive.ImageProps['render'];\n\n  children?: PosterPrimitive.RootProps['children'];\n}\n\nexport function Poster({ children, className, renderImage, ...props }: PosterProps = {}) {\n  return (\n    <PosterPrimitive.Root className={(state) => cn('media-poster', resolveClassName(className, state))}>\n      <PosterPrimitive.Image render={renderImage} className={'media-poster-image'} {...props} />\n\n      {children}\n    </PosterPrimitive.Root>\n  );\n}\n"],"mappings":";;;;;;;AAcA,SAAgB,OAAA,IAAyE;;CAAlEA,IAAAA;;EAA8D,KAAA,OAAA,KAAA,IAAA,CAAC,IAA/DA;;;;CAAE,IAAA;CAAU,IAAA;CAA2B,IAAA;CAAhB,IAAA;CAAvBA,IAAAA,EAAAA,OAAAA,IAAAA;EAAE,CAAA,CAAA,UAAU,WAAW,gBAAa,SAApCA;;;;;;;;;;;;CAEcC,IAAAA;CAA+C,IAAA,EAAA,OAAA,WAAA;EAA/C,MAAC,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,KAAK,CAAC;EAAjB,EAAA,KAAA;;;CAC9EC,IAAAA;CAAiF,IAAA,EAAA,OAAA,SAAA,EAAA,QAAlD,aAAA;EAA/B,KAAA,oBAACC,aAAD;GAAuB,QAAQ;GAAa,WAAW;GAAsB,GAAI;EAAQ,CAAA;EAAR,EAAA,KAAA;EAAlD,EAAA,MAAA;;;CADjCC,IAAAA;CAGG,IAAA,EAAA,QAAA,YAAA,EAAA,QAH8BH,MAAAA,EAAAA,QAC/BC,IAAAA;EADF,KAAA,qBAACG,YAAD;GAAsB,WAAWJ;GAAjC,UAAA,CACEC,IAEC,QACmB;;EADnB,EAAA,MAAA;EAH8BD,EAAAA,MAAAA;EAC/BC,EAAAA,MAAAA;;;CAFJ,OACEE;AAMJ"}