@ray-js/ipc-player-integration 0.0.1-beta-5 → 0.0.1-beta-6

package/lib/ctx/store.d.ts

@@ -1,4 +1,5 @@
 import { RetAtom } from '../interface';
+export { getDefaultStore } from 'jotai';
 export declare const topContent: import("jotai").PrimitiveAtom<never[]> & {
     init: never[];
 };
@@ -8,4 +9,3 @@ type ExtractReturnType<T> = {
 };
 export declare const useStore: <V, T extends Record<string, RetAtom<V>>>(options: T) => ExtractReturnType<T>;
 export declare const updateAtom: <T>(atom: RetAtom<T>, value: T | ((prevValue: T) => T)) => void;
-export {};

package/lib/ctx/store.js

@@ -1,5 +1,6 @@
 import { useRef } from 'react';
 import { atom, useAtomValue, getDefaultStore } from 'jotai';
+export { getDefaultStore } from 'jotai';
 export const topContent = atom([]);
 export const useAtom = defaultValue => {
   const ref = useRef();

package/lib/hooks/useVideoBitKbps/index.js

@@ -1,3 +1,4 @@
+import { getVideoBitrateKbps } from '../../utils/ipcApi';
 import { useEffect, useState } from 'react';
 export const useVideoBitKbps = devId => {
   const [bitKbps, setBitKbps] = useState('');
@@ -11,34 +12,9 @@ export const useVideoBitKbps = devId => {
     // };
   }, []);
   const init = async () => {
-    let res = await getVideoBitrateKbps();
+    const res = await getVideoBitrateKbps(devId);
     console.log('res===bitKbps', res);
-    res += 'KB/S';
-    setBitKbps(res);
-  };
-  const getVideoBitrateKbps = () => {
-    return new Promise((resolve, reject) => {
-      ty.ipc.getVideoBitrateKbps({
-        devId,
-        extendParam: {},
-        success: _ref => {
-          let {
-            kpbs = '0'
-          } = _ref;
-          resolve(kpbs);
-        },
-        fail: _ref2 => {
-          let {
-            errorMsg,
-            errorCode
-          } = _ref2;
-          return reject(errorMsg);
-        }
-      });
-    }).catch(error => {
-      console.log('res===getVideoBitrateKbps', error);
-      return '0';
-    });
+    setBitKbps(res.kpbs + 'KB/S');
   };
   return bitKbps;
 };

package/lib/iconfont/iconfont.css

@@ -7,7 +7,6 @@
 
 .icon-panel {
   font-family: "icon-panel" !important;
-  font-size: 16px;
   font-style: normal;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;

package/lib/interface.d.ts

@@ -54,6 +54,8 @@ export type ComponentConfig<T = ReturnType<UseCtx> & Record<string, any>> = {
     id: string;
     content: (props: T) => React.ReactElement;
     initProps?: T;
+    absolutePosition?: Pick<React.CSSProperties, 'top' | 'left' | 'right' | 'bottom'>;
+    absoluteContentClassName?: string;
 };
 export type ComponentConfigProps = {
     IPCPlayerContext: IpcContext;

package/lib/plugins/battery/battery.less

@@ -1,16 +1,15 @@
 .ipc-player-plugin-battery {
   display: flex;
   align-items: center;
-  background-color: red;
-  height: 48rpx;
-  padding: 0 18rpx;
-  border-radius: 48rpx;
+  height: calc(24px * var(--ipc-player-size-scale, 1));
+  padding: 0 calc(9px * var(--ipc-player-size-scale, 1));
+  border-radius: calc(24px * var(--ipc-player-size-scale, 1));
   background-color: rgba(255, 255, 255, 0.1);
   backdrop-filter: blur(10px);
   &.ipc-player-plugin-battery-absolute {
     position: absolute;
     top: 50%;
-    left: 11px;
+    left: calc(16px * var(--ipc-player-size-scale, 1));
     transform: translateY(-50%);
   }
   &.ipc-player-plugin-battery-relative {
@@ -21,26 +20,26 @@
   }
   .ipc-player-plugin-battery-border {
     position: relative;
-    width: 32rpx;
-    height: 24rpx;
+    width: calc(16px * var(--ipc-player-size-scale, 1));
+    height: calc(12px * var(--ipc-player-size-scale, 1));;
     box-sizing: border-box;
-    border: 4rpx solid #fff;
-    margin-right: 8rpx;
-    border-radius: 6rpx;
+    border: calc(2px * var(--ipc-player-size-scale, 1)) solid #fff;
+    margin-right: calc(4px * var(--ipc-player-size-scale, 1));;
+    border-radius: calc(3px * var(--ipc-player-size-scale, 1));;
     overflow: visible;
     .ipc-player-plugin-battery-border-1 {
       position: absolute;
-      height: 10rpx;
-      width: 5rpx;
+      height: calc(5px * var(--ipc-player-size-scale, 1));
+      width: calc(2px * var(--ipc-player-size-scale, 1));
       background-color: #fff;
-      left: -7rpx;
-      top: 4rpx;
-      border-radius: 4rpx;
+      left: calc(-3.5px * var(--ipc-player-size-scale, 1));
+      top: calc(2px * var(--ipc-player-size-scale, 1));
+      border-radius: calc(2px * var(--ipc-player-size-scale, 1));
     }
     .ipc-player-plugin-battery-value-wrap {
       position: absolute;
-      width: 20rpx;
-      height: 12rpx;
+      width: calc(10px * var(--ipc-player-size-scale, 1));
+      height: calc(6px * var(--ipc-player-size-scale, 1));
       left: 50%;
       top: 50%;
       transform: translate(-50%, -50%);
@@ -59,8 +58,8 @@
 
 
 .ipc-player-plugin-battery-text {
-  font-size: 24rpx;
-  line-height: 24rpx;
+  font-size: calc(12px * var(--ipc-player-size-scale, 1));
+  line-height: calc(12px * var(--ipc-player-size-scale, 1));
   color: var(--fontColor);
   font-family: 'Manrope';
   font-weight: 600;

package/lib/plugins/fullScreen/fullScreen.js

@@ -1,9 +1,11 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import React from 'react';
-import { View, setPageOrientation, CoverView } from '@ray-js/ray';
+import React, { useContext } from 'react';
+import { View, setPageOrientation } from '@ray-js/ray';
+import { UIEventContext } from '../../ui/context';
+import { startTimeToHideAllComponent, showAllComponent } from '../../ui/constant';
 import { useStore } from '../../ctx/store';
 import { VerticalScreen } from './verticalScreen';
-import { VoiceIntercom } from '../voiceIntercom';
+import { VoiceIntercom } from './voiceIntercom';
 import './fullScreen.less';
 const VerticalScreenId = 'VerticalScreen';
 const VoiceIntercomId = 'VoiceIntercom';
@@ -19,6 +21,9 @@ export function FullScreen(props) {
   } = useStore({
     screenType: screenTypeAtom
   });
+  const {
+    event
+  } = useContext(UIEventContext);
   const handFull = () => {
     ty.hideMenuButton();
     ty.hideStatusBar();
@@ -26,36 +31,38 @@ export function FullScreen(props) {
       type: 'custom'
     });
 
-    // 显示全屏按钮5s后隐藏
-    // showFullButtonAnd5sHide();
     // 添加全屏后，返回竖屏的控件
     addContent('top', {
       id: VerticalScreenId,
       content: VerticalScreen,
       initProps: _objectSpread(_objectSpread({}, props), {}, {
-        onClick: handClick.bind(null, 'vertical')
+        onClick: () => {
+          event.emit(showAllComponent);
+          handClick('vertical');
+        }
       })
     });
     // 全屏后，添加语音对讲控件
     addContent('absolute', {
       id: VoiceIntercomId,
       content: props => {
-        return /*#__PURE__*/React.createElement(CoverView, {
+        return /*#__PURE__*/React.createElement(View, {
           className: "ipc-player-plugin-full-screen-voice"
         }, /*#__PURE__*/React.createElement(VoiceIntercom, props));
       },
+      absoluteContentClassName: 'ipc-player-plugin-full-screen-voice-warp',
       initProps: _objectSpread({}, props)
     });
   };
   const handClick = target => {
     const pageOrientation = target === 'vertical' ? 'portrait' : 'landscape';
     setScreenType(target);
-    handFull(); // todo
     setPageOrientation({
       pageOrientation,
       success: () => {
         if (target === 'full') {
           handFull();
+          event.emit(startTimeToHideAllComponent);
         } else {
           ty.setNavigationBarBack({
             type: 'system'

package/lib/plugins/fullScreen/fullScreen.less

@@ -2,15 +2,23 @@
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
-  right: 18px;
+  right: calc(16px * var(--ipc-player-size-scale, 1));
   color: var(--iconColor);
-  font-size: var(--iconFontSize);
+  font-size: calc(var(--iconFontSize) * var(--ipc-player-size-scale, 1));
 }
 
-.ipc-player-plugin-full-screen-voice {
+.ipc-player-plugin-full-screen-voice-warp {
   position: absolute;
   top: 50%;
-  transform: translateY(-50%);
-  right: 20px;
+  transform: translate(0, -50%);
+  right: calc(10px * var(--ipc-player-size-scale, 1));;
   z-index: 3;
+}
+
+.ipc-player-plugin-full-screen-voice {
+  transform: translate(0, 0);
+  transition: transform ease-in 0.3s;
+  &.ipc-player-plugin-full-screen-voice-hide {
+    transform: translate(180%, 0);
+  }
 }

package/lib/plugins/fullScreen/verticalScreen.less

@@ -3,9 +3,11 @@
   padding: 10rpx;
   top: 50%;
   transform: translateY(-50%);
-  left: 24px;
+  // left: 24px;
+  left: calc(12px * var(--ipc-player-size-scale, 1));
   .ipc-player-plugin-vertical-screen-icon {
-    font-size: var(--iconFontSize);
+    // font-size: var(--iconFontSize);
+    font-size: calc(var(--iconFontSize) * var(--ipc-player-size-scale, 1));
     color: var(--iconColor);
   }
 }

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

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { ComponentConfigProps } from '../../interface';
+type Props = ComponentConfigProps;
+export declare function VoiceIntercom(props: Props): React.JSX.Element;
+export {};

package/lib/plugins/fullScreen/voiceIntercom.js

@@ -0,0 +1,32 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useContext } from 'react';
+import { CoverView } from '@ray-js/ray';
+import clsx from 'clsx';
+import { VoiceIntercom as Component } from '../voiceIntercom';
+import { useComponentHideState } from '../../ui/hooks';
+import { UIEventContext } from '../../ui/context';
+import { startTimeToHideAllComponent, pauseTimeToHideAllComponent } from '../../ui/constant';
+import { useStore } from '../../ctx/store';
+export function VoiceIntercom(props) {
+  const {
+    screenType
+  } = useStore({
+    screenType: props.screenType
+  });
+  const [shouldHide] = useComponentHideState(screenType);
+  const {
+    event
+  } = useContext(UIEventContext);
+  return /*#__PURE__*/React.createElement(CoverView, {
+    className: clsx('ipc-player-plugin-full-screen-voice', {
+      'ipc-player-plugin-full-screen-voice-hide': shouldHide
+    })
+  }, /*#__PURE__*/React.createElement(Component, _extends({}, props, {
+    onTouchStart: () => {
+      event.emit(pauseTimeToHideAllComponent);
+    },
+    onTouchEnd: () => {
+      event.emit(startTimeToHideAllComponent);
+    }
+  })));
+}

package/lib/plugins/muted/muted.js

@@ -44,8 +44,8 @@ export const Muted = props => {
       display: 'flex'
     }
   }, isMuted ? /*#__PURE__*/React.createElement(Text, {
-    className: "text-icon icon-panel icon-panel-jingyin"
+    className: "ipc-player-plugin-muted-text-icon icon-panel icon-panel-jingyin"
   }) : /*#__PURE__*/React.createElement(Text, {
-    className: "text-icon icon-panel icon-panel-yinliang"
+    className: "ipc-player-plugin-muted-text-icon icon-panel icon-panel-yinliang"
   }));
 };

package/lib/plugins/muted/muted.less

@@ -1,5 +1,4 @@
-.text-icon {
-    color: var(--iconColor);
-    font-size: var(--iconFontSize);
-    padding: 8rpx;
+.ipc-player-plugin-muted-text-icon {
+  color: var(--iconColor);
+  font-size: calc(var(--iconFontSize) * var(--ipc-player-size-scale, 1));
 }

package/lib/plugins/recordVideo/recordVideo.less

@@ -1,37 +1,37 @@
 .ipc-player-plugin-record-video-icon {
-  font-size: var(--iconFontSize);
+  font-size: calc(var(--iconFontSize) * var(--ipc-player-size-scale, 1));
   color: var(--iconColor);
 }
 .ipc-player-plugin-record-video-toast {
   z-index: 2;
   position: absolute;
   display: flex;
-  padding: 24rpx;
+  padding: calc(12px * var(--ipc-player-size-scale, 1));
   align-items: center;
   left: 50%;
   transform: translateX(-50%);
-  top: 14rpx;
+  top: calc(7px * var(--ipc-player-size-scale, 1));
   background-color: var(--bg-color);
-  border-radius: 16rpx;
+  border-radius: calc(8px * var(--ipc-player-size-scale, 1));
   .ipc-player-plugin-record-video-toast-point {
-    width: 12rpx;
-    height: 12rpx;
-    border-radius: 12rpx;
+    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: 24rpx;
+    font-size: calc(12px * var(--ipc-player-size-scale, 1));;
     font-weight: 600;
     color: var(--fontColor);
-    margin-left: 16rpx;
+    margin-left: calc(8px * var(--ipc-player-size-scale, 1));;
     display: flex;
     align-items: center;
     .ipc-player-plugin-record-video-toast-time-warp {
-      width: 34rpx;
+      width: calc(17px * var(--ipc-player-size-scale, 1));;
       text-align: center;
     }
     .ipc-player-plugin-record-video-toast-time-delimiter {
-      margin: 0 4rpx;
+      margin: 0 calc(2px * var(--ipc-player-size-scale, 1));;
     }
   }
 }

package/lib/plugins/screenshot/screenshot.less

@@ -1,38 +1,42 @@
 .ipc-player-plugin-screenshot-icon {
   color: var(--iconColor);
-  font-size: var(--iconFontSize);
+  font-size: calc(var(--iconFontSize) * var(--ipc-player-size-scale, 1));
 }
 .ipc-player-plugin-screenshot-toast {
   position: absolute;
   width: 90%;
-  border-radius: 16rpx;
+  border-radius: calc(8px * var(--ipc-player-size-scale, 1));;
   background-color: var(--bg-color);
   left: 50%;
   transform: translateX(-50%);
-  top: 32rpx;
+  top: calc(16px * var(--ipc-player-size-scale, 1));
   display: flex;
   align-items: center;
-  padding: 16rpx 32rpx;
+  padding: calc(8px * var(--ipc-player-size-scale, 1)) calc(16px * var(--ipc-player-size-scale, 1));
   z-index: 3;
   .ipc-player-plugin-screenshot-toast-image {
-    width: 132rpx;
-    height: 74rpx;
-    border-radius: 8rpx;
+    width: calc(66px * var(--ipc-player-size-scale, 1));
+    height: calc(37px * var(--ipc-player-size-scale, 1));
+    border-radius: calc(4px * var(--ipc-player-size-scale, 1));
   }
   .ipc-player-plugin-screenshot-toast-title {
-    margin-left: 24rpx;
-    font-size: 28rpx;
+    margin-left: calc(12px * var(--ipc-player-size-scale, 1));
+    font-size: calc(14px * var(--ipc-player-size-scale, 1));
     color: var(--fontColor);
-    line-height: 40rpx;
+    line-height: calc(20px * var(--ipc-player-size-scale, 1));
     max-width: 60%;
   }
   .ipc-player-plugin-screenshot-toast-bottom {
     position: absolute;
-    right: 32rpx;
+    // right: 32rpx;
+    right: calc(16px * var(--ipc-player-size-scale, 1));
     border: 1rpx solid #1989FA;
-    border-radius: 8rpx;
-    padding: 10rpx 22rpx;
+    // border-radius: 8rpx;
+    border-radius: calc(4px * var(--ipc-player-size-scale, 1));
+    // padding: 10rpx 22rpx;
+    padding: calc(5px * var(--ipc-player-size-scale, 1)) calc(11px * var(--ipc-player-size-scale, 1));
     color: #1989FA;
-    font-size: 28rpx;
+    // font-size: 28rpx;
+    font-size: calc(14px * var(--ipc-player-size-scale, 1));
   }
 }

package/lib/plugins/tempHumidity/tempHumidity.js

@@ -17,22 +17,20 @@ export const TempHumidity = props => {
   const tempRender = () => {
     if (tempUnit === '1') {
       return tempF && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-        className: "text-icon-tempHumidity icon-panel icon-panel-wendu"
+        className: "ipc-player-plugin-tempHumidity-text-icon icon-panel icon-panel-wendu"
       }), /*#__PURE__*/React.createElement(Text, {
         className: "tempHumidity"
       }, tempF));
     }
     return tempC && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-      className: "text-icon-tempHumidity icon-panel icon-panel-wendu"
-    }), /*#__PURE__*/React.createElement(Text, {
-      className: "tempHumidity"
-    }, tempC), /*#__PURE__*/React.createElement(Text, {
-      className: "divider"
+      className: "ipc-player-plugin-tempHumidity-text-icon icon-panel icon-panel-wendu"
+    }), /*#__PURE__*/React.createElement(Text, null, tempC), /*#__PURE__*/React.createElement(Text, {
+      className: "ipc-player-plugin-tempHumidity-divider"
     }, "/"));
   };
   const humRender = () => {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-      className: "text-icon-tempHumidity icon-panel icon-panel-shidu"
+      className: "ipc-player-plugin-tempHumidity-text-icon icon-panel icon-panel-shidu"
     }), /*#__PURE__*/React.createElement(Text, {
       className: "tempHumidity"
     }, `${humidity}`));

package/lib/plugins/tempHumidity/tempHumidity.less

@@ -1,21 +1,24 @@
 .ipc-player-plugin-tempHumidity {
     display: flex;
     align-items: center;
-    padding: 5px 8px;
-    border-radius: 12.5px;
+    height: calc(24px * var(--ipc-player-size-scale, 1));
+    padding: 0 calc(8px * var(--ipc-player-size-scale, 1));
+    border-radius: calc(24px * var(--ipc-player-size-scale, 1));
     opacity: 1;
     background: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(10px);
     color: var(--iconColor);
+    font-size: calc(12px * var(--ipc-player-size-scale, 1));
 }
 
-.divider {
-    margin: 0 4px;
+.ipc-player-plugin-tempHumidity-divider {
+    margin: calc(4px * var(--ipc-player-size-scale, 1));
     color: var(--iconColor);
 }
 
-.text-icon-tempHumidity {
+// .text-icon-tempHumidity {
+.ipc-player-plugin-tempHumidity-text-icon {
     color: var(--iconColor);
-    font-size: var(--iconFontSize);
-    margin-right: 4rpx;
+    font-size: calc(12px * var(--ipc-player-size-scale, 1));
+    margin-right: calc(2px * var(--ipc-player-size-scale, 1));
 }

package/lib/plugins/videoBitKbps/videoBitKbps.js

@@ -1,13 +1,103 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { View } from '@ray-js/ray';
 import { useVideoBitKbps } from '../../hooks';
 import './videoBitKbps.less';
+import { getCurrentSupportedTalkMode, getMobileOrientation, getVideoBitrateKbps, requestWifiSignal, isSupportedTalk, isSupportFloatWindow, openFloatWindow, setScreenOrientation, wakeUpDevice } from '../../utils/ipcApi';
 export const VideoBitKbps = props => {
   const {
-    devId
+    devId,
+    IPCPlayerContext
   } = props;
   const bitKbps = useVideoBitKbps(devId);
+  useEffect(() => {
+    // TODO: test
+    // test();
+  }, []);
+  useEffect(() => {
+    // TODO: test
+    testOther();
+  }, []);
+  const testOther = async () => {
+    console.log('res===ttt');
+    try {
+      await requestWifiSignal(devId);
+    } catch (error) {
+      console.log('res===catch', error);
+    }
+    await getVideoBitrateKbps(devId); // 过
+    await wakeUpDevice(devId); // 过
+    await getMobileOrientation(); // 过
+    await setScreenOrientation('portrait'); // xxx
+    await isSupportFloatWindow(devId);
+    await isSupportedTalk(devId);
+    await getCurrentSupportedTalkMode(devId);
+    await openFloatWindow(devId); // 无
+  };
+
+  // const test = () => {
+  //   console.log('res===ppp test');
+  //   //  缩放倍数
+  //   IPCPlayerContext.setScaleMultiple({
+  //     scaleMultiple: 1,
+  //     success: res => {
+  //       console.log('res===ppp setScaleMultiple success', res);
+  //     },
+  //     fail: error => {
+  //       console.log('res===ppp setScaleMultiple fail', error);
+  //     },
+  //   });
+
+  //   IPCPlayerContext.setTrackingStatus({
+  //     // status: false,  // 非必传
+  //     success: res => {
+  //       console.log('res===ppp setTrackingStatus success', res);
+  //     },
+  //     fail: error => {
+  //       console.log('res===ppp setTrackingStatus fail', error);
+  //     },
+  //   });
+
+  //   IPCPlayerContext.setScalable({
+  //     scaleble: 1,
+  //     success: res => {
+  //       console.log('res===ppp setScalable success', res);
+  //     },
+  //     fail: error => {
+  //       console.log('res===ppp setScalable fail', error);
+  //     },
+  //   });
+
+  //   IPCPlayerContext.isPTZControllable({
+  //     success: res => {
+  //       console.log('res===ppp isPTZControllable success', res);
+  //     },
+  //     fail: error => {
+  //       console.log('res===ppp isPTZControllable fail', error);
+  //     },
+  //   });
+
+  //   IPCPlayerContext.setRotateZ({
+  //     rotateZ: 0,
+  //     success: res => {
+  //       console.log('res===ppp setRotateZ success', res);
+  //     },
+  //     fail: error => {
+  //       console.log('res===ppp setRotateZ fail', error);
+  //     },
+  //   });
+
+  //   // IPCPlayerContext.setMaxScaleMultiple({
+  //   //   maxScaleMultiple: 90, // 0-360
+  //   //   success: (res) => {
+  //   //     console.log('res===ppp maxScaleMultiple success', res);
+  //   //   },
+  //   //   fail: (error) => {
+  //   //     console.log('res===ppp maxScaleMultiple fail', error);
+  //   //   }
+  //   // })
+  // };
+
   return /*#__PURE__*/React.createElement(View, {
-    className: "videoBitKbps"
+    className: "ipc-player-plugin-videoBitKbps"
   }, bitKbps);
 };

package/lib/plugins/videoBitKbps/videoBitKbps.less

@@ -1,11 +1,12 @@
-.videoBitKbps {
+.ipc-player-plugin-videoBitKbps {
     display: flex;
     align-items: center;
-    padding: 5px 8px;
-    border-radius: 12.5px;
+    height: calc(24px * var(--ipc-player-size-scale, 1));
+    padding: 0 calc(8px * var(--ipc-player-size-scale, 1));
+    border-radius: calc(24px * var(--ipc-player-size-scale, 1));
     opacity: 1;
     background: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(10px);
-    margin-right: 8px;
     color: var(--iconColor);
+    font-size: calc(12px * var(--ipc-player-size-scale, 1));
 }

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

@@ -1,9 +1,12 @@
 import React from 'react';
+import { TouchEventHandler } from '@ray-js/components/lib/types';
 import './voiceIntercom.less';
 import { ComponentConfigProps } from '../../interface';
 type Props = ComponentConfigProps & {
     style?: React.CSSProperties;
     className?: string;
+    onTouchStart?: TouchEventHandler['onTouchStart'];
+    onTouchEnd?: TouchEventHandler['onTouchEnd'];
 };
-export declare function VoiceIntercom({ style, className, recording: recordingAtom, intercom: intercomAtom, setIntercom, mute: muteAtom, setMute, getStreamStatus, }: Props): React.JSX.Element;
+export declare function VoiceIntercom({ style, className, recording: recordingAtom, intercom: intercomAtom, setIntercom, mute: muteAtom, setMute, getStreamStatus, onTouchStart, onTouchEnd, }: Props): React.JSX.Element;
 export {};