@ray-js/ipc-player-integration 0.0.35-beta.14 → 0.0.35-beta.15

package/lib/ui/bottomLeftContent.js

@@ -1,4 +1,3 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import "core-js/modules/esnext.iterator.constructor.js";
 import "core-js/modules/esnext.iterator.find.js";
 import React, { useMemo } from 'react';
@@ -9,6 +8,10 @@ import { useComponentHideState } from './hooks';
 import { TrialBadge, useTrialBadge } from '../widgets/trialBadge';
 /** 右侧透明渐变宽度，用于提示横向可滑动 */
 const FADE_MASK = 'linear-gradient(to right, #000 calc(100% - 48px), transparent 100%)';
+
+/** TrialBadge 组件高度 40px + 间距 */
+const BADGE_HEIGHT_VERTICAL = 44;
+const BADGE_HEIGHT_FULL = 48;
 const BottomLeftContent = _ref => {
   let {
     ctx,
@@ -53,40 +56,32 @@ const BottomLeftContent = _ref => {
     handleCountdownEnd
   } = useTrialBadge(ctx.event, ctx.devId, trialRemainingSec);
   const paddingLeftPx = screenType === 'vertical' ? 0 : 25;
-  const containerHeight = screenType === 'vertical' ? '40px' : '58px';
-  const trialBadgeStyle = screenType === 'vertical' ? {
-    position: 'absolute',
-    left: '0px',
-    bottom: '48px',
-    marginBottom: 4,
-    zIndex: 101,
-    width: 'max-content'
-  } : {
-    position: 'absolute',
-    left: '25px',
-    bottom: '72px',
-    marginBottom: 8,
-    zIndex: 101,
-    width: 'max-content'
-  };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, showSmartImageQuality && showTrialBadge && canOpenSettings && gRawData && !isLowPhone && trialRemainingSec > 0 && /*#__PURE__*/React.createElement(CoverView, {
-    style: _objectSpread(_objectSpread({}, trialBadgeStyle), {}, {
+  const showBadge = showSmartImageQuality && showTrialBadge && canOpenSettings && gRawData && !isLowPhone && trialRemainingSec > 0;
+  const bottomBarHeight = screenType === 'vertical' ? 40 : 58;
+  const badgeAreaHeight = screenType === 'vertical' ? BADGE_HEIGHT_VERTICAL : BADGE_HEIGHT_FULL;
+  const containerHeight = showBadge ? `${bottomBarHeight + badgeAreaHeight}px` : `${bottomBarHeight}px`;
+  return /*#__PURE__*/React.createElement(CoverView, {
+    className: clsx('ipc-player-bottom-left-content-wrap'),
+    style: {
+      right: `${reservedRight}px`,
+      height: containerHeight,
+      display: 'flex',
+      flexDirection: 'column',
+      justifyContent: 'flex-end',
       opacity: shouldHide ? 0 : 1,
       pointerEvents: shouldHide ? 'none' : 'auto'
-    }),
-    onClick: e => e.stopPropagation()
+    }
+  }, showBadge && /*#__PURE__*/React.createElement(View, {
+    style: {
+      paddingLeft: screenType === 'vertical' ? '0px' : '25px',
+      marginBottom: screenType === 'vertical' ? '4px' : '8px'
+    }
   }, /*#__PURE__*/React.createElement(TrialBadge, {
     brandColor: brandColor,
     trialRemainingSec: trialRemainingSec,
     onSubscribe: handleTrialSubscribe,
     onCountdownEnd: handleCountdownEnd
-  })), /*#__PURE__*/React.createElement(CoverView, {
-    className: clsx('ipc-player-bottom-left-content-wrap'),
-    style: {
-      right: `${reservedRight}px`,
-      height: containerHeight
-    }
-  }, /*#__PURE__*/React.createElement(View, {
+  })), /*#__PURE__*/React.createElement(View, {
     style: {
       paddingBottom: screenType === 'vertical' ? '14px' : '32px',
       paddingLeft: `${paddingLeftPx}px`,
@@ -100,6 +95,6 @@ const BottomLeftContent = _ref => {
       maskImage: FADE_MASK
     },
     className: clsx('ipc-player-bottom-left-content-container')
-  }, children)));
+  }, children));
 };
 export default BottomLeftContent;

package/lib/ui/ui.less

@@ -157,7 +157,7 @@
   // 左下角子元素内容区域样式
   .ipc-player-bottom-left-content-container {
     display: flex;
-    flex-direction: inherit;
+    flex-direction: row;
   }
 
   // 右下角子元素内容区域样式

package/lib/widgets/tryExperience/tryExperience.js

@@ -152,7 +152,10 @@ export const TryExperience = props => {
   if (hideTryExperienceMenu) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, imgSrc && canOpenSettings && gRawData && /*#__PURE__*/React.createElement(View, {
+  if (!imgSrc || !canOpenSettings || !gRawData) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(View, {
     className: clsx(className),
     onClick: onTryExperience
   }, /*#__PURE__*/React.createElement(View, {
@@ -161,5 +164,5 @@ export const TryExperience = props => {
     className: "try-experience-icon",
     src: imgSrc,
     mode: "heightFix"
-  }))));
+  })));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/ipc-player-integration",
-  "version": "0.0.35-beta.14",
+  "version": "0.0.35-beta.15",
   "description": "IPC 融合播放器",
   "main": "lib/index",
   "files": [