@ray-js/ipc-player-integration 0.0.1-beta-22 → 0.0.1-beta-24

package/lib/plugins/recordVideo/recordVideo.less

@@ -3,13 +3,26 @@
   color: var(--iconColor);
 }
 .ipc-player-plugin-record-video-toast-wrap {
-  z-index: 110;
+  z-index: 400;
   position: absolute;
   top: calc(7px * var(--ipc-player-size-scale, 1));
   left: 50%;
   transform: translateX(-50%);
 }
+
+// 计时器显示
+.ipc-player-plugin-record-video-toast-show {
+  transform: translate(0, 0) !important;
+  transition: transform ease-in 3s;
+}
+// 计时器隐藏
+.ipc-player-plugin-record-video-toast-hide {
+  transform: translate(0, -110%) !important;
+  transition: transform 0.3s ease-in-out;
+}
+
 .ipc-player-plugin-record-video-toast {
+  transform: translate(0, -110%);
   display: flex;
   padding: calc(12px * var(--ipc-player-size-scale, 1));
   align-items: center;
@@ -21,21 +34,65 @@
     width: calc(6px * var(--ipc-player-size-scale, 1));
     height: calc(6px * var(--ipc-player-size-scale, 1));
     border-radius: calc(6px * var(--ipc-player-size-scale, 1));
-    background-color: #FF3838;
   }
   .ipc-player-plugin-record-video-toast-time {
     font-size: calc(12px * var(--ipc-player-size-scale, 1));;
-    font-weight: 600;
+    font-weight: 700;
     color: var(--fontColor);
     margin-left: calc(8px * var(--ipc-player-size-scale, 1));;
     display: flex;
     align-items: center;
+    font-family: Manrope !important;
     .ipc-player-plugin-record-video-toast-time-warp {
-      width: calc(17px * var(--ipc-player-size-scale, 1));;
       text-align: center;
     }
     .ipc-player-plugin-record-video-toast-time-delimiter {
       margin: 0 calc(2px * var(--ipc-player-size-scale, 1));;
     }
   }
+}
+
+/** 录制成功弹窗 */
+.ipc-player-plugin-record-success-toast-wrap {
+  position: absolute;
+}
+.ipc-player-plugin-record-success-toast {
+  flex: 1;
+  border-radius: calc(8px * var(--ipc-player-size-scale, 1));;
+  background-color: var(--shot-card-bg-color);
+  display: flex;
+  align-items: center;
+  padding: calc(8px * var(--ipc-player-size-scale, 1)) calc(12px * var(--ipc-player-size-scale, 1));
+  z-index: 100;
+  .ipc-player-plugin-record-success-toast-image-box {
+    border-radius: calc(4px * var(--ipc-player-size-scale, 1));
+    overflow: hidden;
+    width: calc(66px * var(--ipc-player-size-scale, 1));
+    height: calc(66px * 0.57 * var(--ipc-player-size-scale, 1));
+  }
+  .ipc-player-plugin-record-success-toast-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  .ipc-player-plugin-record-success-toast-title {
+    flex: 1;
+    margin-left: calc(12px * var(--ipc-player-size-scale, 1));
+    font-size: calc(14px * var(--ipc-player-size-scale, 1));
+    color: var(--fontColor);
+    margin-right: calc(12px * var(--ipc-player-size-scale, 1));
+    word-break: break-word;
+    
+  }
+  .ipc-player-plugin-record-success-toast-bottom {
+    border: 1px solid #1989FA;
+    min-width: calc(52px * var(--ipc-player-size-scale, 1));
+    max-width: calc(100px * var(--ipc-player-size-scale, 1));
+    border-radius: calc(4px * var(--ipc-player-size-scale, 1));
+    padding: calc(5px * var(--ipc-player-size-scale, 1)) calc(11px * var(--ipc-player-size-scale, 1));
+    font-size: calc(14px * var(--ipc-player-size-scale, 1));
+    white-space: nowrap;
+    overflow: hidden; 
+    text-overflow: ellipsis; 
+  }
 }

package/lib/plugins/resolution/fullResolutionControl.js

@@ -12,6 +12,7 @@ export const FullResolutionControl = props => {
     setResolution,
     setFullResolutionActive
   } = props;
+  console.log(props, 'props========');
   const {
     screenType,
     fullResolutionActive,
@@ -51,5 +52,5 @@ export const FullResolutionControl = props => {
     style: item === resolution && {
       color: brandColor
     }
-  }, I18n.t(`ipc_player_resolution_${item}`))));
+  }, Strings.getLang(`ipc_player_resolution_${item}`))));
 };

package/lib/plugins/resolution/resolution.js

@@ -13,6 +13,7 @@ export const Resolution = props => {
     IPCPlayerContext,
     setResolution,
     addContent,
+    deleteContent,
     setFullResolutionActive,
     className
   } = props;
@@ -30,6 +31,8 @@ export const Resolution = props => {
   return /*#__PURE__*/React.createElement(View, {
     onClick: () => {
       if (screenType === 'full') {
+        // 移除全屏清晰度空间
+        deleteContent('absolute', fullResolutionId);
         // 添加全屏清晰度空间
         addContent('absolute', {
           id: fullResolutionId,

package/lib/plugins/resolution/resolution.less

@@ -40,8 +40,7 @@
   justify-content: center;
   align-items: center;
   background-color: transparent;
-  // transform: translate(200%, 0);
-  z-index: 3;
+  z-index: 345;
 }
 
 .ipc-player-plugin-full-resolution-control-text {

package/lib/plugins/screenshot/screenshot.js

@@ -1,8 +1,9 @@
 import React, { useRef } from 'react';
 import { View, Image, Text } from '@ray-js/ray';
+import { useSetState, useUpdateEffect } from 'ahooks';
 import clsx from 'clsx';
 import IpcUtils from '@ray-js/ray-ipc-utils';
-import Strings from '@/i18n';
+import Strings from '../../i18n';
 import { useStore } from '../../ctx/store';
 import './screenshot.less';
 const CLOSE_TIME = 5000;
@@ -23,18 +24,37 @@ export function Screenshot(props) {
     screenType: props.screenType,
     brandColor: props.brandColor
   });
-  useRef();
+
+  /** 记录截屏url */
+  const [state, setState] = useSetState({
+    showShot: false,
+    shotUrl: ''
+  });
+  useUpdateEffect(() => {
+    if (state.showShot && screenType) {
+      showShotToast();
+    }
+  }, [state.showShot, screenType]);
+  const timer = useRef();
   const timeToCloseToast = () => {
-    // clearInterval(timer.current);
-    // // @ts-ignore
-    // timer.current = setTimeout(() => {
-    //   deleteContent('absolute', 'plugin-screenshot-toast');
-    // }, CLOSE_TIME);
+    clearInterval(timer.current);
+    // @ts-ignore
+    timer.current = setTimeout(() => {
+      setState({
+        showShot: false,
+        shotUrl: ''
+      });
+      deleteContent('absolute', 'plugin-screenshot-toast');
+    }, CLOSE_TIME);
   };
+
+  /** 跳转相册 */
   const handCheck = () => {
     IpcUtils.goToIpcPageNativeRoute('ipc_album_panel', devId);
   };
-  const showToast = str => {
+
+  /** 添加截屏成功弹窗 */
+  const showShotToast = () => {
     deleteContent('absolute', 'plugin-screenshot-toast');
     addContent('absolute', {
       id: 'plugin-screenshot-toast',
@@ -42,7 +62,10 @@ export function Screenshot(props) {
       absolutePosition: {
         top: screenType === 'vertical' ? '12px' : '60px',
         left: screenType === 'vertical' ? '16px' : '50%',
-        right: screenType === 'vertical' ? '16px' : '50%'
+        right: screenType === 'vertical' ? '16px' : 'unset',
+        display: 'flex',
+        width: screenType === 'vertical' ? 'auto' : '400px',
+        marginLeft: screenType === 'vertical' ? '0' : '-200px'
       },
       content: () => {
         return /*#__PURE__*/React.createElement(View, {
@@ -51,7 +74,7 @@ export function Screenshot(props) {
           className: "ipc-player-plugin-screenshot-toast-image-box"
         }, /*#__PURE__*/React.createElement(Image, {
           className: "ipc-player-plugin-screenshot-toast-image",
-          src: str
+          src: state.shotUrl
         })), /*#__PURE__*/React.createElement(View, {
           className: "ipc-player-plugin-screenshot-toast-title"
         }, Strings.getLang('ipc_player_screenshot_success_tip')), /*#__PURE__*/React.createElement(View, {
@@ -61,7 +84,7 @@ export function Screenshot(props) {
             color: brandColor,
             borderColor: brandColor
           }
-        }, Strings.getLang('ipc_player_shot_or_record_check')));
+        }, Strings.getLang('ipc_player_shot_success_check')));
       }
     });
     timeToCloseToast();
@@ -74,11 +97,15 @@ export function Screenshot(props) {
         saveToAlbum,
         // 保存到 IPC 相册
         success: res => {
-          showToast(res.tempImagePath);
+          console.log(res, 'res');
+          setState({
+            showShot: true,
+            shotUrl: res.tempImagePath
+          });
         },
         fail: err => {
           const errObj = err.innerError || err || {};
-          const errMsg = errObj.errorMsg || I18n.t('error_screenshot');
+          const errMsg = errObj.errorMsg || Strings.getLang('ipc_player_error_screenshot_error_tip');
           toast({
             title: errMsg
           });

package/lib/plugins/screenshot/screenshot.less

@@ -4,12 +4,9 @@
 }
 .ipc-player-plugin-screenshot-toast-wrap {
   position: absolute;
-  // max-width: 300px;
-  // left: 50%;
-  // transform: translateX(-50%);
-  // top: calc(16px * var(--ipc-player-size-scale, 1));
 }
 .ipc-player-plugin-screenshot-toast {
+  flex: 1;
   border-radius: calc(8px * var(--ipc-player-size-scale, 1));;
   background-color: var(--shot-card-bg-color);
   display: flex;

package/lib/plugins/voiceIntercom/voiceIntercom.d.ts

@@ -9,5 +9,5 @@ type Props = ComponentConfigProps & {
     onTouchStart?: TouchEventHandler['onTouchStart'];
     onTouchEnd?: TouchEventHandler['onTouchEnd'];
 };
-export declare function VoiceIntercom({ style, className, iconClassName, recording: recordingAtom, intercom: intercomAtom, intercomMode: intercomModeAtom, setIntercom, mute: muteAtom, setMute, getStreamStatus, onTouchStart, onTouchEnd, }: Props): React.JSX.Element;
+export declare const VoiceIntercom: (props: Props) => React.JSX.Element;
 export {};

package/lib/plugins/voiceIntercom/voiceIntercom.js

@@ -7,34 +7,39 @@ import { useStore, getDefaultStore } from '../../ctx/store';
 import './voiceIntercom.less';
 import { PlayerStreamStatus, IntercomMode } from '../../interface';
 import { UIEventContext } from '../../ui/context';
+import { radialGradient } from '../../utils';
 import { startTimeToHideAllComponent, pauseTimeToHideAllComponent } from '../../ui/constant';
 const NILL = () => null;
-export function VoiceIntercom(_ref) {
-  let {
+export const VoiceIntercom = props => {
+  const {
     style,
     className,
     iconClassName,
-    recording: recordingAtom,
-    intercom: intercomAtom,
-    intercomMode: intercomModeAtom,
+    // recording: recordingAtom,
+    // intercom: intercomAtom,
+    // intercomMode: intercomModeAtom,
     setIntercom,
-    mute: muteAtom,
+    // mute: muteAtom,
     setMute,
     getStreamStatus,
     onTouchStart = NILL,
     onTouchEnd = NILL
-  } = _ref;
+  } = props;
   const {
     event
   } = useContext(UIEventContext);
   const {
+    recording,
     mute,
     intercom,
-    intercomMode
+    intercomMode,
+    brandColor
   } = useStore({
-    mute: muteAtom,
-    intercom: intercomAtom,
-    intercomMode: intercomModeAtom
+    recording: props.recording,
+    mute: props.mute,
+    intercom: props.intercom,
+    intercomMode: props.intercomMode,
+    brandColor: props.brandColor
   });
   // 对讲开始之前的静音状态
   const originMuteStatusBeforeVoice = useRef(mute);
@@ -70,17 +75,19 @@ export function VoiceIntercom(_ref) {
     event.emit(startTimeToHideAllComponent);
   };
   return /*#__PURE__*/React.createElement(View, {
-    style: _objectSpread({}, style),
+    style: _objectSpread(_objectSpread({}, style), {
+      background: radialGradient(brandColor)
+    }),
     className: clsx('ipc-player-plugin-voice-intercom', className),
     onTouchStart: async e => {
       onTouchStart(e);
-      const store = getDefaultStore();
+      getDefaultStore();
       if (loading.current) return;
       loading.current = true;
-      const _intercom = store.get(intercomAtom);
-      const _recording = store.get(recordingAtom);
-      const target = !_intercom;
-      if (target && _recording) {
+      // const _intercom = store.get(intercomAtom);
+      // const _recording = store.get(recordingAtom);
+      const target = !intercom;
+      if (target && recording) {
         console.log('录制中，无法对讲');
         loading.current = false;
         return;
@@ -104,4 +111,4 @@ export function VoiceIntercom(_ref) {
   }) : /*#__PURE__*/React.createElement(View, {
     className: clsx('icon-panel', 'icon-panel-one-way-intercom', 'intercom-default-icon', iconClassName)
   }));
-}
+};

package/lib/ui/bottomLeftContent.js

@@ -18,16 +18,16 @@ const BottomLeftContent = _ref => {
   });
   const [shouldHide] = useComponentHideState(screenType);
   return /*#__PURE__*/React.createElement(CoverView, {
-    className: clsx('ipc-player-bottom-left-content-wrap', {
-      'ipc-player-bottom-left-content-hide': shouldHide || fullResolutionActive,
-      'ipc-player-bottom-left-content-show': !shouldHide && !fullResolutionActive
-    })
+    className: clsx('ipc-player-bottom-left-content-wrap')
   }, /*#__PURE__*/React.createElement(View, {
     style: {
       paddingBottom: screenType === 'vertical' ? '14px' : '20px',
       paddingLeft: screenType === 'vertical' ? 0 : '25px'
     },
-    className: clsx('ipc-player-bottom-left-content-container')
+    className: clsx('ipc-player-bottom-left-content-container', {
+      'ipc-player-bottom-left-content-hide': shouldHide || fullResolutionActive,
+      'ipc-player-bottom-left-content-show': !shouldHide && !fullResolutionActive
+    })
   }, children));
 };
 export default BottomLeftContent;

package/lib/ui/bottomRightContent.js

@@ -18,16 +18,16 @@ const BottomRightContent = _ref => {
   });
   const [shouldHide] = useComponentHideState(screenType);
   return /*#__PURE__*/React.createElement(CoverView, {
-    className: clsx('ipc-player-bottom-right-content-wrap', {
-      'ipc-player-bottom-right-content-hide': shouldHide || fullResolutionActive,
-      'ipc-player-bottom-right-content-show': !shouldHide && !fullResolutionActive
-    })
+    className: clsx('ipc-player-bottom-right-content-wrap')
   }, /*#__PURE__*/React.createElement(View, {
     style: {
       paddingBottom: screenType === 'vertical' ? '14px' : '20px',
       paddingRight: screenType === 'vertical' ? 0 : '25px'
     },
-    className: clsx('ipc-player-bottom-right-content-container')
+    className: clsx('ipc-player-bottom-right-content-container', {
+      'ipc-player-bottom-right-content-hide': shouldHide || fullResolutionActive,
+      'ipc-player-bottom-right-content-show': !shouldHide && !fullResolutionActive
+    })
   }, children));
 };
 export default BottomRightContent;

package/lib/ui/topLeftContent.js

@@ -18,20 +18,16 @@ const TopLeftContent = _ref => {
   });
   const [shouldHide] = useComponentHideState(screenType);
   return /*#__PURE__*/React.createElement(CoverView, {
-    className: clsx('ipc-player-top-left-content-wrap', {
-      'ipc-player-top-left-content-hide': shouldHide || fullResolutionActive,
-      'ipc-player-top-left-content-show': !shouldHide && !fullResolutionActive
-    })
+    className: clsx('ipc-player-top-left-content-wrap')
   }, /*#__PURE__*/React.createElement(View, {
     style: {
       paddingTop: screenType === 'vertical' ? '12px' : '16px',
       paddingLeft: screenType === 'vertical' ? 0 : '25px'
-    }
-    // className={clsx('ipc-player-content-item', 'ipc-player-top-content', {
-    //   'ipc-player-top-content-hide': shouldHide || fullResolutionActive,
-    // })}
-    ,
-    className: clsx('ipc-player-top-left-content-container')
+    },
+    className: clsx('ipc-player-top-left-content-container', {
+      'ipc-player-top-left-content-hide': shouldHide || fullResolutionActive,
+      'ipc-player-top-left-content-show': !shouldHide && !fullResolutionActive
+    })
   }, children));
 };
 export default TopLeftContent;

package/lib/ui/topRightContent.js

@@ -18,16 +18,16 @@ const TopRightContent = _ref => {
   });
   const [shouldHide] = useComponentHideState(screenType);
   return /*#__PURE__*/React.createElement(CoverView, {
-    className: clsx('ipc-player-top-right-content-wrap', {
-      'ipc-player-top-right-content-hide': shouldHide || fullResolutionActive,
-      'ipc-player-top-right-content-show': !shouldHide && !fullResolutionActive
-    })
+    className: clsx('ipc-player-top-right-content-wrap')
   }, /*#__PURE__*/React.createElement(View, {
     style: {
       paddingTop: screenType === 'vertical' ? '12px' : '16px',
       paddingRight: screenType === 'vertical' ? 0 : '25px'
     },
-    className: clsx('ipc-player-top-right-content-container')
+    className: clsx('ipc-player-top-right-content-container', {
+      'ipc-player-top-right-content-hide': shouldHide || fullResolutionActive,
+      'ipc-player-top-right-content-show': !shouldHide && !fullResolutionActive
+    })
   }, children));
 };
 export default TopRightContent;

package/lib/ui/ui.d.ts

@@ -22,6 +22,7 @@ type Props = {
     privateState?: boolean;
     deviceOnline?: boolean;
     CSSVariable?: Partial<CSSVariable>;
+    brandColor?: string;
 };
 export declare const IPCPlayerIntegration: React.MemoExoticComponent<(props: Props) => React.JSX.Element>;
 export {};

package/lib/ui/ui.js

@@ -44,13 +44,15 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     style,
     CSSVariable = defaultCSSVariable,
     privateState = false,
-    deviceOnline = true
+    deviceOnline = true,
+    brandColor = '#FF592A'
   } = props;
   const instance = getCtxInstance(props.instance, devId);
   const {
     setPlayState,
     setScreenType,
-    setFullResolutionActive
+    setFullResolutionActive,
+    setBrandColor
   } = instance;
   const prevTriggerEvent = useRef();
   const eventRef = useRef();
@@ -58,6 +60,9 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
   if (!eventRef.current) {
     eventRef.current = getEventInstance();
   }
+  useEffect(() => {
+    setBrandColor(brandColor);
+  }, []);
   const {
     event
   } = useContext(UIEventContext);
@@ -267,30 +272,30 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     ,
     onZoomChange: data => {
       console.log(`zoomChange事件: ${JSON.stringify(data)}`);
-      ty.showToast({
-        title: `zoomChange事件: ${JSON.stringify(data)}`
-      });
-      setTimeout(() => {
-        ty.hideToast();
-      }, 3000);
+      // ty.showToast({
+      //   title: `zoomChange事件: ${JSON.stringify(data)}`,
+      // });
+      // setTimeout(() => {
+      //   ty.hideToast();
+      // }, 3000);
     },
     onCameraPreviewFailure: data => {
       console.log(`onCameraPreviewFailure事件: ${JSON.stringify(data)}`);
-      ty.showToast({
-        title: `onCameraPreviewFailure事件: ${JSON.stringify(data)}`
-      });
-      setTimeout(() => {
-        ty.hideToast();
-      }, 3000);
+      // ty.showToast({
+      //   title: `onCameraPreviewFailure事件: ${JSON.stringify(data)}`,
+      // });
+      // setTimeout(() => {
+      //   ty.hideToast();
+      // }, 3000);
     },
     onCameraNotifyWeakNetwork: data => {
       console.log(`onCameraNotifyWeakNetwork: ${JSON.stringify(data)}`);
-      ty.showToast({
-        title: `onCameraNotifyWeakNetwork: ${JSON.stringify(data)}`
-      });
-      setTimeout(() => {
-        ty.hideToast();
-      }, 3000);
+      // ty.showToast({
+      //   title: `onCameraNotifyWeakNetwork: ${JSON.stringify(data)}`,
+      // });
+      // setTimeout(() => {
+      //   ty.hideToast();
+      // }, 3000);
     },
     clarity: resolution === 'HD' ? 'hd' : 'normal',
     privateState: privateState,
@@ -305,7 +310,6 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
     ctx: instance
   }, renderBottomRightContent), playerReady && (() => {
     if (!absoluteContent || !(absoluteContent !== null && absoluteContent !== void 0 && absoluteContent.length)) return null;
-    console.log(absoluteContent, 'absoluteContent');
     return absoluteContent.map(item => {
       return /*#__PURE__*/React.createElement(CoverView, {
         key: item.id,

package/lib/utils/device/index.d.ts

@@ -11,3 +11,9 @@ export interface IDpCode {
 }
 export declare function getDpIdsByCodes<T extends string>(devId: string, dpIds: T[]): Promise<Record<T, string>>;
 export declare const showMathPowValue: (value: any, scale: any) => string | 0;
+export declare const getDevInfo: <T>(deviceId: string) => Promise<any>;
+/**
+ * 根据DpCode获取枚举型DP的range是否包含对应项
+ * @param result: {code: number, msg: string}
+ */
+export declare const getEnumRangeIsValid: (devId: any, dpCode: any, rangValue: any) => Promise<any>;

package/lib/utils/device/index.js

@@ -1,3 +1,4 @@
+import IpcUtils from '@ray-js/ray-ipc-utils';
 export function getDpValue(options) {
   return new Promise((resolve, reject) => {
     ty.device.getDeviceInfo({
@@ -52,4 +53,55 @@ export const showMathPowValue = (value, scale) => {
     v = (Number(value) / Math.pow(10, scale)).toFixed(1);
   }
   return v;
+};
+export const getDevInfo = deviceId => {
+  return new Promise(resolve => {
+    try {
+      ty.device.getDeviceInfo({
+        deviceId,
+        success: res => {
+          resolve({
+            code: 0,
+            data: res
+          });
+        },
+        fail: err => {
+          resolve({
+            code: -1,
+            msg: err
+          });
+        }
+      });
+    } catch (err) {
+      resolve({
+        code: -1,
+        msg: String(err)
+      });
+    }
+  });
+};
+
+/**
+ * 根据DpCode获取枚举型DP的range是否包含对应项
+ * @param result: {code: number, msg: string}
+ */
+
+export const getEnumRangeIsValid = async (devId, dpCode, rangValue) => {
+  const infoData = await IpcUtils.getDevInfo(devId);
+  if (infoData.code === 0) {
+    var _targetSchema$propert;
+    const {
+      schema
+    } = infoData.data;
+    const arrayFromValues = Object.values(schema);
+    const targetSchema = arrayFromValues.find(item => item.code === dpCode);
+    if ((targetSchema === null || targetSchema === void 0 || (_targetSchema$propert = targetSchema.property) === null || _targetSchema$propert === void 0 ? void 0 : _targetSchema$propert.type) === 'enum') {
+      const {
+        range
+      } = targetSchema.property;
+      return range.includes(rangValue);
+    }
+    return false;
+  }
+  return false;
 };

package/lib/utils/index.d.ts

@@ -0,0 +1,3 @@
+/** 美克风对讲按钮径向渐变 */
+export declare const radialGradient: (color: any) => string;
+export declare const adjustBrightness: (hex: any, factor: any) => string;

package/lib/utils/index.js

@@ -0,0 +1,15 @@
+/** 美克风对讲按钮径向渐变 */
+export const radialGradient = color => {
+  return `radial-gradient(at center, ${adjustBrightness(color, 0.88)}, ${adjustBrightness(color, 1.2)})`;
+};
+export const adjustBrightness = (hex, factor) => {
+  const color = parseInt(hex.slice(1), 16); // 去掉 # 转为数字
+  let r = color >> 16 & 0xff;
+  let g = color >> 8 & 0xff;
+  let b = color >> 0 & 0xff;
+  r = Math.min(255, Math.max(30, Math.floor(r * factor)));
+  g = Math.min(255, Math.max(30, Math.floor(g * factor)));
+  b = Math.min(255, Math.max(30, Math.floor(b * factor)));
+  const hexString = 1 << 24 | r << 16 | g << 8 | b;
+  return `#${hexString.toString(16).slice(1)}`;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/ipc-player-integration",
-  "version": "0.0.1-beta-22",
+  "version": "0.0.1-beta-24",
   "description": "IPC 播放器功能集成",
   "main": "lib/index",
   "files": [
@@ -33,9 +33,9 @@
   },
   "peerDependencies": {},
   "dependencies": {
-    "@ray-js/ray-ipc-player": "2.0.19-beta-beta-1",
+    "@ray-js/ray-ipc-player": "2.0.20-beta-1",
     "@ray-js/ray-ipc-utils": "1.1.0-beta-12",
-    "@ray-js/ipc-ptz-zoom": "0.0.2-beta-1",
+    "@ray-js/ipc-ptz-zoom": "0.0.2-beta-3",
     "clsx": "^1.2.1",
     "jotai": "^2.10.2",
     "@ray-js/panel-sdk": "^1.13.1"