@xsolla/xui-b2c-video-player 0.217.0

package/native/index.js

@@ -0,0 +1,545 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  VideoPlayer: () => VideoPlayer,
+  formatPlaybackTime: () => formatPlaybackTime
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/VideoPlayer.tsx
+var import_react = require("react");
+
+// ../../foundation/primitives-native/src/Box.tsx
+var import_react_native = require("react-native");
+var import_jsx_runtime = require("react/jsx-runtime");
+var roleToAccessibilityRole = {
+  button: "button",
+  link: "link",
+  img: "image",
+  image: "image",
+  summary: "summary",
+  switch: "switch",
+  checkbox: "checkbox",
+  radio: "radio",
+  heading: "header",
+  text: "text",
+  search: "search",
+  alert: "alert",
+  none: "none",
+  presentation: "none",
+  progressbar: "progressbar",
+  scrollbar: "scrollbar",
+  adjustable: "adjustable",
+  tab: "tab",
+  menu: "menu",
+  menuitem: "menuitem",
+  list: "list",
+  timer: "timer"
+};
+var toGapValue = (gap) => {
+  if (gap === void 0) return void 0;
+  if (typeof gap === "number") return gap;
+  const pxMatch = /^(\d+(?:\.\d+)?)px$/.exec(gap);
+  if (pxMatch) return Number(pxMatch[1]);
+  const asNumber = Number(gap);
+  return Number.isFinite(asNumber) ? asNumber : void 0;
+};
+var Box = ({
+  children,
+  onPress,
+  onLayout,
+  onMoveShouldSetResponder,
+  onResponderGrant,
+  onResponderMove,
+  onResponderRelease,
+  onResponderTerminate,
+  backgroundColor,
+  borderColor,
+  borderWidth,
+  borderBottomWidth,
+  borderBottomColor,
+  borderTopWidth,
+  borderTopColor,
+  borderLeftWidth,
+  borderLeftColor,
+  borderRightWidth,
+  borderRightColor,
+  borderRadius,
+  borderStyle,
+  height,
+  padding,
+  paddingHorizontal,
+  paddingVertical,
+  margin,
+  marginTop,
+  marginBottom,
+  marginLeft,
+  marginRight,
+  flexDirection,
+  flexWrap,
+  alignItems,
+  justifyContent,
+  alignSelf,
+  position,
+  top,
+  bottom,
+  left,
+  right,
+  width,
+  minWidth,
+  minHeight,
+  maxWidth,
+  maxHeight,
+  flex,
+  flexShrink,
+  gap,
+  overflow,
+  opacity,
+  zIndex,
+  hoverStyle,
+  pressStyle,
+  style,
+  disabled,
+  "data-testid": dataTestId,
+  testID,
+  as,
+  src,
+  alt,
+  ...rest
+}) => {
+  const getContainerStyle = (pressed) => ({
+    backgroundColor: pressed && pressStyle?.backgroundColor ? pressStyle.backgroundColor : backgroundColor,
+    borderColor,
+    borderWidth,
+    borderBottomWidth,
+    borderBottomColor,
+    borderTopWidth,
+    borderTopColor,
+    borderLeftWidth,
+    borderLeftColor,
+    borderRightWidth,
+    borderRightColor,
+    borderRadius,
+    borderStyle,
+    overflow,
+    opacity: opacity ?? (disabled ? 0.5 : void 0),
+    zIndex,
+    height,
+    width,
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
+    padding,
+    paddingHorizontal,
+    paddingVertical,
+    margin,
+    marginTop,
+    marginBottom,
+    marginLeft,
+    marginRight,
+    flexDirection,
+    flexWrap,
+    alignItems,
+    justifyContent,
+    alignSelf,
+    position,
+    top,
+    bottom,
+    left,
+    right,
+    flex,
+    flexShrink,
+    gap: toGapValue(gap),
+    ...style
+  });
+  const finalTestID = dataTestId || testID;
+  const {
+    role,
+    tabIndex,
+    onKeyDown,
+    onKeyUp,
+    "aria-label": ariaLabel,
+    "aria-labelledby": _ariaLabelledBy,
+    "aria-current": _ariaCurrent,
+    "aria-disabled": ariaDisabled,
+    "aria-live": ariaLive,
+    "aria-busy": ariaBusy,
+    className,
+    "data-testid": _dataTestId,
+    cursor: _cursor,
+    type: _type,
+    ...nativeRest
+  } = rest;
+  const accessibilityRole = typeof role === "string" && roleToAccessibilityRole[role] || (as === "button" ? "button" : void 0);
+  const isDisabled = Boolean(disabled || ariaDisabled);
+  const accessibilityState = {
+    disabled: isDisabled || void 0,
+    busy: Boolean(ariaBusy) || void 0
+  };
+  const accessibilityLiveRegion = ariaLive === "polite" || ariaLive === "assertive" ? ariaLive : void 0;
+  if (as === "img" && src) {
+    const imageStyle = {
+      width,
+      height,
+      borderRadius,
+      position,
+      top,
+      bottom,
+      left,
+      right,
+      ...style
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_react_native.Image,
+      {
+        source: { uri: src },
+        style: imageStyle,
+        testID: finalTestID,
+        accessibilityLabel: typeof ariaLabel === "string" ? ariaLabel : alt,
+        resizeMode: "cover",
+        ...nativeRest
+      }
+    );
+  }
+  if (onPress || as === "button") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_react_native.Pressable,
+      {
+        onPress: !isDisabled && onPress ? onPress : void 0,
+        disabled: isDisabled,
+        onLayout,
+        onMoveShouldSetResponder,
+        onResponderGrant,
+        onResponderMove,
+        onResponderRelease,
+        onResponderTerminate,
+        style: ({ pressed }) => getContainerStyle(pressed),
+        testID: finalTestID,
+        accessibilityRole,
+        accessibilityLabel: typeof ariaLabel === "string" ? ariaLabel : void 0,
+        accessibilityState,
+        accessibilityLiveRegion,
+        ...nativeRest,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_react_native.View,
+    {
+      style: getContainerStyle(),
+      testID: finalTestID,
+      onLayout,
+      onMoveShouldSetResponder,
+      onResponderGrant,
+      onResponderMove,
+      onResponderRelease,
+      onResponderTerminate,
+      accessibilityRole,
+      accessibilityLabel: typeof ariaLabel === "string" ? ariaLabel : void 0,
+      accessibilityState,
+      accessibilityLiveRegion,
+      ...nativeRest,
+      children
+    }
+  );
+};
+
+// src/VideoPlayer.tsx
+var import_xui_core = require("@xsolla/xui-core");
+var import_xui_button = require("@xsolla/xui-button");
+var import_xui_slider = require("@xsolla/xui-slider");
+var import_xui_tag = require("@xsolla/xui-tag");
+var import_xui_b2c_currency_tag = require("@xsolla/xui-b2c-currency-tag");
+var import_xui_typography = require("@xsolla/xui-typography");
+var import_xui_icons_base = require("@xsolla/xui-icons-base");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CONTROL_BAR_HEIGHT = 64;
+var CONTROL_BAR_PADDING = 12;
+var HEADER_COPY_GAP = 12;
+var SIDE_CONTROL_GAP = 12;
+var SUCCESS_REWARD_VEIL = "linear-gradient(rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0.64))";
+var LABEL_REWARD_PADDING = 6;
+var isCurrencyReward = (reward) => reward.kind === "currency";
+var formatPlaybackTime = (seconds) => {
+  const safe = Number.isFinite(seconds) && seconds > 0 ? Math.floor(seconds) : 0;
+  const minutes = Math.floor(safe / 60);
+  const remainder = safe % 60;
+  return `${String(minutes).padStart(2, "0")}:${String(remainder).padStart(
+    2,
+    "0"
+  )}`;
+};
+var VideoPlayer = ({
+  view = "full",
+  title,
+  description,
+  rewards,
+  currentTime,
+  duration = 0,
+  playing,
+  muted,
+  expanded,
+  disabled = false,
+  onPlayPause,
+  onMute,
+  onExpand,
+  onSeek,
+  overlayThemeMode = "dark",
+  "aria-label": ariaLabel = "Video player",
+  testID,
+  themeMode,
+  themeProductContext = "b2c"
+}) => {
+  const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
+  const { theme: overlayTheme } = (0, import_xui_core.useResolvedTheme)({
+    themeMode: overlayThemeMode,
+    themeProductContext
+  });
+  const [internalTime, setInternalTime] = (0, import_react.useState)(currentTime ?? 0);
+  const [internalPlaying, setInternalPlaying] = (0, import_react.useState)(playing ?? false);
+  const [internalMuted, setInternalMuted] = (0, import_react.useState)(muted ?? false);
+  const [internalExpanded, setInternalExpanded] = (0, import_react.useState)(expanded ?? false);
+  const resolvedTime = currentTime ?? internalTime;
+  const isPlaying = playing ?? internalPlaying;
+  const isMuted = muted ?? internalMuted;
+  const isExpanded = expanded ?? internalExpanded;
+  const isCompact = view === "compact";
+  const isSeekable = duration > 0;
+  const overlayContentColor = overlayTheme.colors.content.static.light;
+  const copyColor = theme.colors.content.static.light;
+  const handleSeek = (next) => {
+    setInternalTime(next);
+    onSeek?.(next);
+  };
+  const handlePlayPause = () => {
+    const next = !isPlaying;
+    setInternalPlaying(next);
+    onPlayPause?.(next);
+  };
+  const handleMute = () => {
+    const next = !isMuted;
+    setInternalMuted(next);
+    onMute?.(next);
+  };
+  const handleExpand = () => {
+    const next = !isExpanded;
+    setInternalExpanded(next);
+    onExpand?.(next);
+  };
+  const hasRewards = Boolean(rewards && rewards.length > 0);
+  const hasCopy = Boolean(title || description);
+  const showHeader = !isCompact && (hasRewards || hasCopy);
+  const controlBar = /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    Box,
+    {
+      flexDirection: "row",
+      alignItems: "center",
+      width: "100%",
+      height: CONTROL_BAR_HEIGHT,
+      gap: theme.spacing.lg,
+      padding: CONTROL_BAR_PADDING,
+      borderRadius: theme.shape.cell.borderRadius,
+      backgroundColor: overlayTheme.colors.layer.scrim,
+      style: { backdropFilter: "blur(8px)", WebkitBackdropFilter: "blur(8px)" },
+      testID: testID ? `${testID}-controls` : "video-player-controls",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          Box,
+          {
+            flex: 1,
+            minWidth: 0,
+            flexDirection: "row",
+            alignItems: "center",
+            gap: theme.spacing.sm,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_xui_button.IconButton,
+                {
+                  variant: "tertiary",
+                  tone: "mono",
+                  size: "xs",
+                  themeMode: overlayThemeMode,
+                  themeProductContext,
+                  disabled,
+                  icon: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.Pause, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.Play, {}),
+                  "aria-label": isPlaying ? "Pause" : "Play",
+                  "aria-pressed": isPlaying,
+                  onPress: handlePlayPause,
+                  testID: testID ? `${testID}-play-pause` : "video-player-play-pause"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box, { flex: 1, minWidth: 0, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_xui_slider.Slider,
+                {
+                  value: resolvedTime,
+                  min: 0,
+                  max: isSeekable ? duration : 1,
+                  step: 1,
+                  size: "sm",
+                  disabled: disabled || !isSeekable,
+                  onChange: handleSeek,
+                  "aria-label": "Seek",
+                  themeMode: overlayThemeMode,
+                  themeProductContext,
+                  testID: testID ? `${testID}-seek` : "video-player-seek"
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_xui_typography.Typography,
+                {
+                  variant: "bodySm",
+                  color: overlayContentColor,
+                  productContext: themeProductContext,
+                  align: "right",
+                  noWrap: true,
+                  testID: testID ? `${testID}-time` : "video-player-time",
+                  children: formatPlaybackTime(resolvedTime)
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box, { flexDirection: "row", alignItems: "center", gap: SIDE_CONTROL_GAP, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            import_xui_button.IconButton,
+            {
+              variant: "tertiary",
+              tone: "mono",
+              size: "sm",
+              themeMode: overlayThemeMode,
+              themeProductContext,
+              disabled,
+              icon: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.VolumeMute, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.VolumeUp, {}),
+              "aria-label": isMuted ? "Unmute" : "Mute",
+              "aria-pressed": isMuted,
+              onPress: handleMute,
+              testID: testID ? `${testID}-mute` : "video-player-mute"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            import_xui_button.IconButton,
+            {
+              variant: "tertiary",
+              tone: "mono",
+              size: "sm",
+              themeMode: overlayThemeMode,
+              themeProductContext,
+              disabled,
+              icon: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.ExitFullScreen, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base.FullScreen, {}),
+              "aria-label": isExpanded ? "Collapse" : "Expand",
+              "aria-pressed": isExpanded,
+              onPress: handleExpand,
+              testID: testID ? `${testID}-expand` : "video-player-expand"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    Box,
+    {
+      role: "group",
+      "aria-label": ariaLabel,
+      flexDirection: "column",
+      justifyContent: "space-between",
+      width: "100%",
+      gap: theme.spacing.lg,
+      testID: testID || "video-player",
+      children: [
+        showHeader && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box, { flexDirection: "column", gap: HEADER_COPY_GAP, children: [
+          hasRewards && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Box, { flexDirection: "row", alignItems: "center", gap: theme.spacing.xs, children: rewards?.map((reward) => {
+            const rewardTestID = testID ? `${testID}-reward-${reward.key}` : `video-player-reward-${reward.key}`;
+            if (isCurrencyReward(reward)) {
+              return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_xui_b2c_currency_tag.CurrencyTag,
+                {
+                  currency: reward.currency,
+                  value: reward.value,
+                  sublabel: reward.sublabel,
+                  size: "sm",
+                  themeProductContext,
+                  testID: rewardTestID
+                },
+                reward.key
+              );
+            }
+            const tone = reward.tone ?? "primary";
+            return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_xui_tag.Tag,
+              {
+                size: "sm",
+                tone,
+                iconLeft: reward.icon,
+                themeMode: "light",
+                themeProductContext,
+                style: {
+                  ...reward.icon ? {} : {
+                    paddingLeft: LABEL_REWARD_PADDING,
+                    paddingRight: LABEL_REWARD_PADDING
+                  },
+                  ...tone === "success" ? { backgroundImage: SUCCESS_REWARD_VEIL } : {}
+                },
+                testID: rewardTestID,
+                children: reward.label
+              },
+              reward.key
+            );
+          }) }),
+          hasCopy && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Box, { flexDirection: "column", children: [
+            title && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_xui_typography.Typography,
+              {
+                variant: "bodyLgAccent",
+                color: copyColor,
+                productContext: themeProductContext,
+                noWrap: true,
+                children: title
+              }
+            ),
+            description && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_xui_typography.Typography,
+              {
+                variant: "bodySm",
+                color: copyColor,
+                productContext: themeProductContext,
+                noWrap: true,
+                style: { opacity: 0.5 },
+                children: description
+              }
+            )
+          ] })
+        ] }),
+        controlBar
+      ]
+    }
+  );
+};
+VideoPlayer.displayName = "VideoPlayer";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  VideoPlayer,
+  formatPlaybackTime
+});
+//# sourceMappingURL=index.js.map

package/native/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/index.tsx","../../src/VideoPlayer.tsx","../../../../foundation/primitives-native/src/Box.tsx"],"sourcesContent":["export { VideoPlayer, formatPlaybackTime } from \"./VideoPlayer\";\n\nexport type {\n  VideoPlayerProps,\n  VideoPlayerCurrencyReward,\n  VideoPlayerLabelReward,\n  VideoPlayerRewardChip,\n  VideoPlayerRewardTone,\n  VideoPlayerView,\n} from \"./types\";\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Slider } from \"@xsolla/xui-slider\";\nimport { Tag } from \"@xsolla/xui-tag\";\nimport { CurrencyTag } from \"@xsolla/xui-b2c-currency-tag\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport {\n  ExitFullScreen,\n  FullScreen,\n  Pause,\n  Play,\n  VolumeMute,\n  VolumeUp,\n} from \"@xsolla/xui-icons-base\";\nimport type {\n  VideoPlayerCurrencyReward,\n  VideoPlayerProps,\n  VideoPlayerRewardChip,\n} from \"./types\";\n\n/** Height of the control bar, per Figma `VideoPlayer` (node 1923:9871). */\nconst CONTROL_BAR_HEIGHT = 64;\n\n/** Padding inside the bar. Figma `VideoPlayerBar` uses 12px, which is not on the spacing scale. */\nconst CONTROL_BAR_PADDING = 12;\n\n/** Gap between the reward row and the copy. Figma container gap is 12px. */\nconst HEADER_COPY_GAP = 12;\n\n/** Gap between mute and expand. Figma `Controls` gap is 12px. */\nconst SIDE_CONTROL_GAP = 12;\n\n/**\n * Light-mode success chips in this spec veil `background/success/primary`\n * (`#95ff80`) with 64% white. `Tag` paints the solid token, so the veil is\n * layered on top. Figma node `1738:8181`.\n */\nconst SUCCESS_REWARD_VEIL =\n  \"linear-gradient(rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0.64))\";\n\n/**\n * Figma `tag/sm` insets the label by `padding-x` (4) plus the text-container\n * `gap` (2). `Tag` only applies the outer 4px.\n */\nconst LABEL_REWARD_PADDING = 6;\n\nconst isCurrencyReward = (\n  reward: VideoPlayerRewardChip\n): reward is VideoPlayerCurrencyReward => reward.kind === \"currency\";\n\n/**\n * Formats a position in seconds as `mm:ss`. Values past an hour keep counting\n * in minutes (`72:30`) rather than growing a third segment, matching the\n * fixed-width clock slot in the design.\n */\nexport const formatPlaybackTime = (seconds: number): string => {\n  const safe =\n    Number.isFinite(seconds) && seconds > 0 ? Math.floor(seconds) : 0;\n  const minutes = Math.floor(safe / 60);\n  const remainder = safe % 60;\n\n  return `${String(minutes).padStart(2, \"0\")}:${String(remainder).padStart(\n    2,\n    \"0\"\n  )}`;\n};\n\n/**\n * B2C video player overlay chrome.\n *\n * This is **not** an HTML5 `<video>` wrapper — it renders the chrome that sits\n * on top of a video surface: optional reward chips (`Tag` and `CurrencyTag`),\n * title and description copy, and a control bar with play/pause, a seek\n * slider, the elapsed clock, mute, and expand/collapse.\n *\n * Spec: Figma `VideoPlayer` component set —\n * https://www.figma.com/design/SOOtaT80JAVJf7PKlFnt7Q/B2C-Components%E2%80%A8Xsolla-UI-Toolkit?node-id=1909-5990\n * (node `1923:9871`).\n */\nexport const VideoPlayer: React.FC<VideoPlayerProps> = ({\n  view = \"full\",\n  title,\n  description,\n  rewards,\n  currentTime,\n  duration = 0,\n  playing,\n  muted,\n  expanded,\n  disabled = false,\n  onPlayPause,\n  onMute,\n  onExpand,\n  onSeek,\n  overlayThemeMode = \"dark\",\n  \"aria-label\": ariaLabel = \"Video player\",\n  testID,\n  themeMode,\n  themeProductContext = \"b2c\",\n}) => {\n  const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n  const { theme: overlayTheme } = useResolvedTheme({\n    themeMode: overlayThemeMode,\n    themeProductContext,\n  });\n\n  const [internalTime, setInternalTime] = useState(currentTime ?? 0);\n  const [internalPlaying, setInternalPlaying] = useState(playing ?? false);\n  const [internalMuted, setInternalMuted] = useState(muted ?? false);\n  const [internalExpanded, setInternalExpanded] = useState(expanded ?? false);\n\n  const resolvedTime = currentTime ?? internalTime;\n  const isPlaying = playing ?? internalPlaying;\n  const isMuted = muted ?? internalMuted;\n  const isExpanded = expanded ?? internalExpanded;\n\n  const isCompact = view === \"compact\";\n  const isSeekable = duration > 0;\n  const overlayContentColor = overlayTheme.colors.content.static.light;\n  const copyColor = theme.colors.content.static.light;\n\n  const handleSeek = (next: number) => {\n    setInternalTime(next);\n    onSeek?.(next);\n  };\n\n  const handlePlayPause = () => {\n    const next = !isPlaying;\n    setInternalPlaying(next);\n    onPlayPause?.(next);\n  };\n\n  const handleMute = () => {\n    const next = !isMuted;\n    setInternalMuted(next);\n    onMute?.(next);\n  };\n\n  const handleExpand = () => {\n    const next = !isExpanded;\n    setInternalExpanded(next);\n    onExpand?.(next);\n  };\n\n  const hasRewards = Boolean(rewards && rewards.length > 0);\n  const hasCopy = Boolean(title || description);\n  const showHeader = !isCompact && (hasRewards || hasCopy);\n\n  const controlBar = (\n    <Box\n      flexDirection=\"row\"\n      alignItems=\"center\"\n      width=\"100%\"\n      height={CONTROL_BAR_HEIGHT}\n      gap={theme.spacing.lg}\n      padding={CONTROL_BAR_PADDING}\n      borderRadius={theme.shape.cell.borderRadius}\n      backgroundColor={overlayTheme.colors.layer.scrim}\n      style={{ backdropFilter: \"blur(8px)\", WebkitBackdropFilter: \"blur(8px)\" }}\n      testID={testID ? `${testID}-controls` : \"video-player-controls\"}\n    >\n      <Box\n        flex={1}\n        minWidth={0}\n        flexDirection=\"row\"\n        alignItems=\"center\"\n        gap={theme.spacing.sm}\n      >\n        <IconButton\n          variant=\"tertiary\"\n          tone=\"mono\"\n          size=\"xs\"\n          themeMode={overlayThemeMode}\n          themeProductContext={themeProductContext}\n          disabled={disabled}\n          icon={isPlaying ? <Pause /> : <Play />}\n          aria-label={isPlaying ? \"Pause\" : \"Play\"}\n          aria-pressed={isPlaying}\n          onPress={handlePlayPause}\n          testID={testID ? `${testID}-play-pause` : \"video-player-play-pause\"}\n        />\n\n        <Box flex={1} minWidth={0}>\n          <Slider\n            value={resolvedTime}\n            min={0}\n            max={isSeekable ? duration : 1}\n            step={1}\n            size=\"sm\"\n            disabled={disabled || !isSeekable}\n            onChange={handleSeek}\n            aria-label=\"Seek\"\n            themeMode={overlayThemeMode}\n            themeProductContext={themeProductContext}\n            testID={testID ? `${testID}-seek` : \"video-player-seek\"}\n          />\n        </Box>\n\n        <Typography\n          variant=\"bodySm\"\n          color={overlayContentColor}\n          productContext={themeProductContext}\n          align=\"right\"\n          noWrap\n          testID={testID ? `${testID}-time` : \"video-player-time\"}\n        >\n          {formatPlaybackTime(resolvedTime)}\n        </Typography>\n      </Box>\n\n      <Box flexDirection=\"row\" alignItems=\"center\" gap={SIDE_CONTROL_GAP}>\n        <IconButton\n          variant=\"tertiary\"\n          tone=\"mono\"\n          size=\"sm\"\n          themeMode={overlayThemeMode}\n          themeProductContext={themeProductContext}\n          disabled={disabled}\n          icon={isMuted ? <VolumeMute /> : <VolumeUp />}\n          aria-label={isMuted ? \"Unmute\" : \"Mute\"}\n          aria-pressed={isMuted}\n          onPress={handleMute}\n          testID={testID ? `${testID}-mute` : \"video-player-mute\"}\n        />\n\n        <IconButton\n          variant=\"tertiary\"\n          tone=\"mono\"\n          size=\"sm\"\n          themeMode={overlayThemeMode}\n          themeProductContext={themeProductContext}\n          disabled={disabled}\n          icon={isExpanded ? <ExitFullScreen /> : <FullScreen />}\n          aria-label={isExpanded ? \"Collapse\" : \"Expand\"}\n          aria-pressed={isExpanded}\n          onPress={handleExpand}\n          testID={testID ? `${testID}-expand` : \"video-player-expand\"}\n        />\n      </Box>\n    </Box>\n  );\n\n  return (\n    <Box\n      role=\"group\"\n      aria-label={ariaLabel}\n      flexDirection=\"column\"\n      justifyContent=\"space-between\"\n      width=\"100%\"\n      gap={theme.spacing.lg}\n      testID={testID || \"video-player\"}\n    >\n      {showHeader && (\n        <Box flexDirection=\"column\" gap={HEADER_COPY_GAP}>\n          {hasRewards && (\n            <Box flexDirection=\"row\" alignItems=\"center\" gap={theme.spacing.xs}>\n              {rewards?.map((reward) => {\n                const rewardTestID = testID\n                  ? `${testID}-reward-${reward.key}`\n                  : `video-player-reward-${reward.key}`;\n\n                if (isCurrencyReward(reward)) {\n                  return (\n                    <CurrencyTag\n                      key={reward.key}\n                      currency={reward.currency}\n                      value={reward.value}\n                      sublabel={reward.sublabel}\n                      size=\"sm\"\n                      themeProductContext={themeProductContext}\n                      testID={rewardTestID}\n                    />\n                  );\n                }\n\n                const tone = reward.tone ?? \"primary\";\n\n                return (\n                  <Tag\n                    key={reward.key}\n                    size=\"sm\"\n                    tone={tone}\n                    iconLeft={reward.icon}\n                    /*\n                     * Reward chips are bound to the Light token set in Figma so\n                     * they keep their contrast against the video behind them.\n                     */\n                    themeMode=\"light\"\n                    themeProductContext={themeProductContext}\n                    style={{\n                      ...(reward.icon\n                        ? {}\n                        : {\n                            paddingLeft: LABEL_REWARD_PADDING,\n                            paddingRight: LABEL_REWARD_PADDING,\n                          }),\n                      ...(tone === \"success\"\n                        ? { backgroundImage: SUCCESS_REWARD_VEIL }\n                        : {}),\n                    }}\n                    testID={rewardTestID}\n                  >\n                    {reward.label}\n                  </Tag>\n                );\n              })}\n            </Box>\n          )}\n\n          {hasCopy && (\n            <Box flexDirection=\"column\">\n              {title && (\n                <Typography\n                  variant=\"bodyLgAccent\"\n                  color={copyColor}\n                  productContext={themeProductContext}\n                  noWrap\n                >\n                  {title}\n                </Typography>\n              )}\n\n              {description && (\n                <Typography\n                  variant=\"bodySm\"\n                  color={copyColor}\n                  productContext={themeProductContext}\n                  noWrap\n                  style={{ opacity: 0.5 }}\n                >\n                  {description}\n                </Typography>\n              )}\n            </Box>\n          )}\n        </Box>\n      )}\n\n      {controlBar}\n    </Box>\n  );\n};\n\nVideoPlayer.displayName = \"VideoPlayer\";\n","import React from \"react\";\nimport {\n  View,\n  Pressable,\n  Image,\n  ViewStyle,\n  ImageStyle,\n  DimensionValue,\n  AnimatableNumericValue,\n  AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n  button: \"button\",\n  link: \"link\",\n  img: \"image\",\n  image: \"image\",\n  summary: \"summary\",\n  switch: \"switch\",\n  checkbox: \"checkbox\",\n  radio: \"radio\",\n  heading: \"header\",\n  text: \"text\",\n  search: \"search\",\n  alert: \"alert\",\n  none: \"none\",\n  presentation: \"none\",\n  progressbar: \"progressbar\",\n  scrollbar: \"scrollbar\",\n  adjustable: \"adjustable\",\n  tab: \"tab\",\n  menu: \"menu\",\n  menuitem: \"menuitem\",\n  list: \"list\",\n  timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n  if (gap === undefined) return undefined;\n  if (typeof gap === \"number\") return gap;\n  const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n  if (pxMatch) return Number(pxMatch[1]);\n  const asNumber = Number(gap);\n  return Number.isFinite(asNumber) ? asNumber : undefined;\n};\n\nexport const Box: React.FC<BoxProps> = ({\n  children,\n  onPress,\n  onLayout,\n  onMoveShouldSetResponder,\n  onResponderGrant,\n  onResponderMove,\n  onResponderRelease,\n  onResponderTerminate,\n  backgroundColor,\n  borderColor,\n  borderWidth,\n  borderBottomWidth,\n  borderBottomColor,\n  borderTopWidth,\n  borderTopColor,\n  borderLeftWidth,\n  borderLeftColor,\n  borderRightWidth,\n  borderRightColor,\n  borderRadius,\n  borderStyle,\n  height,\n  padding,\n  paddingHorizontal,\n  paddingVertical,\n  margin,\n  marginTop,\n  marginBottom,\n  marginLeft,\n  marginRight,\n  flexDirection,\n  flexWrap,\n  alignItems,\n  justifyContent,\n  alignSelf,\n  position,\n  top,\n  bottom,\n  left,\n  right,\n  width,\n  minWidth,\n  minHeight,\n  maxWidth,\n  maxHeight,\n  flex,\n  flexShrink,\n  gap,\n  overflow,\n  opacity,\n  zIndex,\n  hoverStyle,\n  pressStyle,\n  style,\n  disabled,\n  \"data-testid\": dataTestId,\n  testID,\n  as,\n  src,\n  alt,\n  ...rest\n}) => {\n  const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n    backgroundColor:\n      pressed && pressStyle?.backgroundColor\n        ? pressStyle.backgroundColor\n        : backgroundColor,\n    borderColor,\n    borderWidth,\n    borderBottomWidth,\n    borderBottomColor,\n    borderTopWidth,\n    borderTopColor,\n    borderLeftWidth,\n    borderLeftColor,\n    borderRightWidth,\n    borderRightColor,\n    borderRadius: borderRadius as AnimatableNumericValue,\n    borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n    overflow,\n    opacity: opacity ?? (disabled ? 0.5 : undefined),\n    zIndex,\n    height: height as DimensionValue,\n    width: width as DimensionValue,\n    minWidth: minWidth as DimensionValue,\n    minHeight: minHeight as DimensionValue,\n    maxWidth: maxWidth as DimensionValue,\n    maxHeight: maxHeight as DimensionValue,\n    padding: padding as DimensionValue,\n    paddingHorizontal: paddingHorizontal as DimensionValue,\n    paddingVertical: paddingVertical as DimensionValue,\n    margin: margin as DimensionValue,\n    marginTop: marginTop as DimensionValue,\n    marginBottom: marginBottom as DimensionValue,\n    marginLeft: marginLeft as DimensionValue,\n    marginRight: marginRight as DimensionValue,\n    flexDirection,\n    flexWrap,\n    alignItems,\n    justifyContent,\n    alignSelf,\n    position: position as ViewStyle[\"position\"],\n    top: top as DimensionValue,\n    bottom: bottom as DimensionValue,\n    left: left as DimensionValue,\n    right: right as DimensionValue,\n    flex,\n    flexShrink,\n    gap: toGapValue(gap),\n    ...(style as ViewStyle),\n  });\n\n  const finalTestID = dataTestId || testID;\n\n  // Map web a11y props; drop the rest of the web-only attributes before\n  // spreading onto RN hosts (unknown props warn at runtime).\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const {\n    role,\n    tabIndex,\n    onKeyDown,\n    onKeyUp,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": _ariaLabelledBy,\n    \"aria-current\": _ariaCurrent,\n    \"aria-disabled\": ariaDisabled,\n    \"aria-live\": ariaLive,\n    \"aria-busy\": ariaBusy,\n    className,\n    \"data-testid\": _dataTestId,\n    cursor: _cursor,\n    type: _type,\n    ...nativeRest\n  } = rest as Record<string, unknown>;\n\n  const accessibilityRole =\n    (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n    (as === \"button\" ? \"button\" : undefined);\n  const isDisabled = Boolean(disabled || ariaDisabled);\n  const accessibilityState = {\n    disabled: isDisabled || undefined,\n    busy: Boolean(ariaBusy) || undefined,\n  };\n  const accessibilityLiveRegion =\n    ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\n\n  // Handle as=\"img\" for React Native\n  if (as === \"img\" && src) {\n    const imageStyle: ImageStyle = {\n      width: width as DimensionValue,\n      height: height as DimensionValue,\n      borderRadius: borderRadius as number,\n      position: position as ImageStyle[\"position\"],\n      top: top as DimensionValue,\n      bottom: bottom as DimensionValue,\n      left: left as DimensionValue,\n      right: right as DimensionValue,\n      ...(style as ImageStyle),\n    };\n\n    return (\n      <Image\n        source={{ uri: src }}\n        style={imageStyle}\n        testID={finalTestID}\n        accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n        resizeMode=\"cover\"\n        {...nativeRest}\n      />\n    );\n  }\n\n  // Prefer Pressable whenever the node is interactive or explicitly a button,\n  // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n  if (onPress || as === \"button\") {\n    return (\n      <Pressable\n        onPress={!isDisabled && onPress ? onPress : undefined}\n        disabled={isDisabled}\n        onLayout={onLayout}\n        onMoveShouldSetResponder={onMoveShouldSetResponder}\n        onResponderGrant={onResponderGrant}\n        onResponderMove={onResponderMove}\n        onResponderRelease={onResponderRelease}\n        onResponderTerminate={onResponderTerminate}\n        style={({ pressed }) => getContainerStyle(pressed)}\n        testID={finalTestID}\n        accessibilityRole={accessibilityRole}\n        accessibilityLabel={\n          typeof ariaLabel === \"string\" ? ariaLabel : undefined\n        }\n        accessibilityState={accessibilityState}\n        accessibilityLiveRegion={accessibilityLiveRegion}\n        {...nativeRest}\n      >\n        {children}\n      </Pressable>\n    );\n  }\n\n  return (\n    <View\n      style={getContainerStyle()}\n      testID={finalTestID}\n      onLayout={onLayout}\n      onMoveShouldSetResponder={onMoveShouldSetResponder}\n      onResponderGrant={onResponderGrant}\n      onResponderMove={onResponderMove}\n      onResponderRelease={onResponderRelease}\n      onResponderTerminate={onResponderTerminate}\n      accessibilityRole={accessibilityRole}\n      accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n      accessibilityState={accessibilityState}\n      accessibilityLiveRegion={accessibilityLiveRegion}\n      {...nativeRest}\n    >\n      {children}\n    </View>\n  );\n};\n"],"mappings":"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","names":["import_jsx_runtime"]}