@mpxjs/webpack-plugin 2.10.17-beta.2 → 2.10.17-beta.4

package/lib/runtime/components/react/dist/mpx-swiper.jsx

@@ -13,23 +13,23 @@ import Portal from './mpx-portal';
 const styles = {
     pagination_x: {
         position: 'absolute',
-        bottom: 25,
+        bottom: 0,
         left: 0,
         right: 0,
         flexDirection: 'row',
         flex: 1,
         justifyContent: 'center',
-        alignItems: 'center'
+        alignItems: 'flex-end'
     },
     pagination_y: {
         position: 'absolute',
-        right: 15,
+        right: 0,
         top: 0,
         bottom: 0,
         flexDirection: 'column',
         flex: 1,
         justifyContent: 'center',
-        alignItems: 'center'
+        alignItems: 'flex-end'
     },
     pagerWrapperx: {
         position: 'absolute',
@@ -49,16 +49,6 @@ const styles = {
         justifyContent: 'flex-start'
     }
 };
-const dotCommonStyle = {
-    width: 8,
-    height: 8,
-    borderRadius: 4,
-    marginLeft: 3,
-    marginRight: 3,
-    marginTop: 3,
-    marginBottom: 3,
-    zIndex: 98
-};
 const activeDotStyle = {
     zIndex: 99
 };
@@ -71,7 +61,17 @@ const easeMap = {
     easeInOutCubic: Easing.inOut(Easing.cubic)
 };
 const SwiperWrapper = forwardRef((props, ref) => {
-    const { 'indicator-dots': showPagination, 'indicator-color': dotColor = 'rgba(0, 0, 0, .3)', 'indicator-active-color': activeDotColor = '#000000', 'enable-var': enableVar = false, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'external-var-context': externalVarContext, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, autoplay = false, circular = false, disableGesture = false, current: propCurrent = 0, bindchange } = props;
+    const { 'indicator-dots': showPagination, 'indicator-color': dotColor = 'rgba(0, 0, 0, .3)', 'indicator-width': dotWidth = 8, 'indicator-height': dotHeight = 8, 'indicator-radius': dotRadius = 4, 'indicator-spacing': dotSpacing = 4, 'indicator-margin': paginationMargin = 10, 'indicator-active-color': activeDotColor = '#000000', 'enable-var': enableVar = false, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'external-var-context': externalVarContext, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, autoplay = false, circular = false, disableGesture = false, current: propCurrent = 0, bindchange } = props;
+    const dotCommonStyle = {
+        width: dotWidth,
+        height: dotHeight,
+        borderRadius: dotRadius,
+        marginLeft: dotSpacing,
+        marginRight: dotSpacing,
+        marginTop: dotSpacing,
+        marginBottom: dotSpacing,
+        zIndex: 98
+    };
     const easeingFunc = props['easing-function'] || 'default';
     const easeDuration = props.duration || 500;
     const horizontal = props.vertical !== undefined ? !props.vertical : true;
@@ -152,6 +152,7 @@ const SwiperWrapper = forwardRef((props, ref) => {
         'style',
         'indicator-dots',
         'indicator-color',
+        'indicator-width',
         'indicator-active-color',
         'previous-margin',
         'vertical',
@@ -193,7 +194,17 @@ const SwiperWrapper = forwardRef((props, ref) => {
         for (let i = 0; i < children.length; i++) {
             dots.push(<View style={[dotCommonStyle, { backgroundColor: unActionColor }]} key={i}></View>);
         }
-        return (<View pointerEvents="none" style={styles['pagination_' + dir]}>
+        let paginationStyle = styles['pagination_' + dir];
+        if (paginationMargin) {
+            paginationStyle = {
+                ...paginationStyle,
+                marginBottom: paginationMargin,
+                marginLeft: paginationMargin,
+                marginRight: paginationMargin,
+                marginTop: paginationMargin
+            };
+        }
+        return (<View pointerEvents="none" style={paginationStyle} key="pagination">
         <View style={[styles['pagerWrapper' + dir]]}>
           <Animated.View style={[
                 dotCommonStyle,
@@ -770,6 +781,7 @@ const SwiperWrapper = forwardRef((props, ref) => {
         style: [normalStyle, layoutStyle, styles.swiper]
     }, layoutProps, innerProps);
     const animateComponent = createElement(Animated.View, {
+        key: 'swiperContainer',
         style: [{ flexDirection: dir === 'x' ? 'row' : 'column', width: '100%', height: '100%' }, animatedStyles]
     }, wrapChildren({
         children: arrPages

package/lib/runtime/components/react/dist/mpx-view.d.ts

@@ -6,7 +6,8 @@
  */
 import { View, NativeSyntheticEvent, ViewProps } from 'react-native';
 import { ReactNode } from 'react';
-import type { AnimationProp } from './useAnimationHooks';
+import { AnimationType } from './animationHooks/index';
+import type { AnimationProp } from './animationHooks/utils';
 import { ExtendedViewStyle } from './types/common';
 import { HandlerRef } from './useNodesRef';
 export interface _ViewProps extends ViewProps {
@@ -23,7 +24,7 @@ export interface _ViewProps extends ViewProps {
     'parent-font-size'?: number;
     'parent-width'?: number;
     'parent-height'?: number;
-    'enable-animation'?: boolean;
+    'enable-animation'?: boolean | AnimationType;
     bindtouchstart?: (event: NativeSyntheticEvent<TouchEvent> | unknown) => void;
     bindtouchmove?: (event: NativeSyntheticEvent<TouchEvent> | unknown) => void;
     bindtouchend?: (event: NativeSyntheticEvent<TouchEvent> | unknown) => void;

package/lib/runtime/components/react/dist/mpx-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mpx-view.d.ts","sourceRoot":"","sources":["../mpx-view.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,IAAI,EAAa,oBAAoB,EAAE,SAAS,EAAoD,MAAM,cAAc,CAAA;AACjI,OAAO,EAA2C,SAAS,EAAsB,MAAM,OAAO,CAAA;AAI9F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAClD,OAAoB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAOvD,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;IAClC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC5E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC3E,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC1E,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC/E,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;CACjF;AAsoBD,QAAA,MAAM,KAAK,qHAiIT,CAAA;AAIF,eAAe,KAAK,CAAA"}
+{"version":3,"file":"mpx-view.d.ts","sourceRoot":"","sources":["../mpx-view.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,IAAI,EAAa,oBAAoB,EAAE,SAAS,EAAoD,MAAM,cAAc,CAAA;AACjI,OAAO,EAA2C,SAAS,EAAsB,MAAM,OAAO,CAAA;AAG9F,OAA0B,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AACzE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAClD,OAAoB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAOvD,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;IAClC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kBAAkB,CAAC,EAAE,OAAO,GAAG,aAAa,CAAA;IAC5C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC5E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC3E,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC1E,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;IAC/E,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,UAAU,CAAC,GAAG,OAAO,KAAK,IAAI,CAAA;CACjF;AAsoBD,QAAA,MAAM,KAAK,qHAgIT,CAAA;AAIF,eAAe,KAAK,CAAA"}

package/lib/runtime/components/react/dist/mpx-view.jsx

@@ -8,7 +8,7 @@ import { View, StyleSheet, Image } from 'react-native';
 import { useRef, useState, useEffect, forwardRef, createElement } from 'react';
 import useInnerProps from './getInnerListeners';
 import Animated from 'react-native-reanimated';
-import useAnimationHooks from './useAnimationHooks';
+import useAnimationHooks from './animationHooks/index';
 import useNodesRef from './useNodesRef';
 import { parseUrl, PERCENT_REGEX, splitStyle, splitProps, useTransformStyle, wrapChildren, useLayout, renderImage, pickStyle, extendObject, useHover } from './utils';
 import { error, isFunction } from '@mpxjs/utils';
@@ -203,7 +203,7 @@ function backgroundSize(imageProps, preImageInfo, imageSize, layoutInfo) {
         else { // 数值类型      ImageStyle
             // 数值类型设置为 stretch
             imageProps.resizeMode = 'stretch';
-            if (type === 'linear' && (!layoutWidth || !layoutHeight)) {
+            if (type === 'linear' && (!layoutWidth || !layoutHeight) && (isPercent(width) || isPercent(height))) {
                 // ios 上 linear 组件只要重新触发渲染，在渲染过程中外层容器 width 或者 height 被设置为 0，通过设置 % 的方式会渲染不出来，即使后面再更新为正常宽高也渲染不出来
                 // 所以 hack 手动先将 linear 宽高也设置为 0，后面再更新为正确的数值或 %。
                 dimensions = {

package/lib/runtime/components/react/dist/mpx-web-view.jsx

@@ -184,7 +184,7 @@ const _WebView = forwardRef((props, ref) => {
                 }
                 break;
             case 'postMessage':
-                bindmessage && bindmessage(getCustomEvent('messsage', {}, {
+                bindmessage && bindmessage(getCustomEvent('message', {}, {
                     detail: {
                         data: params[0]?.data
                     }

package/lib/runtime/components/react/dist/utils.d.ts

@@ -32,6 +32,7 @@ export declare function splitStyle<T extends Record<string, any>>(styleObj: T):
     backgroundStyle?: Partial<T>;
     innerStyle?: Partial<T>;
 };
+export declare function parseValues(str: string, char?: string): string[];
 interface TransformStyleConfig {
     enableVar?: boolean;
     externalVarContext?: Record<string, any>;

package/lib/runtime/components/react/dist/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../utils.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../utils.tsx"],"names":[],"mappings":"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"}

package/lib/runtime/components/react/dist/utils.jsx

@@ -1,6 +1,6 @@
 import { useEffect, useCallback, useMemo, useRef, isValidElement, useContext, useState, Children, cloneElement, createElement } from 'react';
 import { Image } from 'react-native';
-import { isObject, isFunction, isNumber, hasOwn, diffAndCloneA, error, warn } from '@mpxjs/utils';
+import { isObject, isFunction, isNumber, hasOwn, diffAndCloneA, error, warn, isEmptyObject } from '@mpxjs/utils';
 import { VarContext, ScrollViewContext, RouteContext } from './context';
 import { ExpressionParser, parseFunc, ReplaceSource } from './parser';
 import { initialWindowMetrics } from 'react-native-safe-area-context';
@@ -193,7 +193,7 @@ function transformVar(styleObj, varKeyPaths, varContext, visitOther) {
             const resolved = resolveVar(value, varContext);
             if (resolved === undefined) {
                 delete target[key];
-                error(`Can not resolve css var at ${varKeyPath.join('.')}:${value}.`);
+                // error(`Can not resolve css var at ${varKeyPath.join('.')}:${value}.`)
                 return;
             }
             target[key] = resolved;
@@ -241,6 +241,10 @@ function transformStringify(styleObj) {
     if (isNumber(styleObj.fontWeight)) {
         styleObj.fontWeight = '' + styleObj.fontWeight;
     }
+    // transformOrigin 20px 需要转换为 transformOrigin '20'
+    if (isNumber(styleObj.transformOrigin)) {
+        styleObj.transformOrigin = '' + styleObj.transformOrigin;
+    }
 }
 function transformPosition(styleObj, meta) {
     if (styleObj.position === 'fixed') {
@@ -249,7 +253,7 @@ function transformPosition(styleObj, meta) {
     }
 }
 // 多value解析
-function parseValues(str, char = ' ') {
+export function parseValues(str, char = ' ') {
     let stack = 0;
     let temp = '';
     const result = [];
@@ -261,11 +265,11 @@ function parseValues(str, char = ' ') {
             stack--;
         }
         // 非括号内 或者 非分隔字符且非空
-        if (stack !== 0 || (str[i] !== char && str[i] !== ' ')) {
+        if (stack !== 0 || str[i] !== char) {
             temp += str[i];
         }
         if ((stack === 0 && str[i] === char) || i === str.length - 1) {
-            result.push(temp);
+            result.push(temp.trim());
             temp = '';
         }
     }
@@ -274,6 +278,8 @@ function parseValues(str, char = ' ') {
 // parse string transform, eg: transform: 'rotateX(45deg) rotateZ(0.785398rad)'
 function parseTransform(transformStr) {
     const values = parseValues(transformStr);
+    // Todo transform 排序不一致时，transform动画会闪烁，故这里同样的排序输出 transform
+    values.sort();
     const transform = [];
     values.forEach(item => {
         const match = item.match(/([/\w]+)\((.+)\)/);
@@ -337,6 +343,14 @@ function transformBoxShadow(styleObj) {
         return `${res}${idx === 0 ? '' : ' '}${global.__formatValue(i)}`;
     }, '');
 }
+function transformZIndex(styleObj) {
+    if (!styleObj.zIndex || typeof styleObj.zIndex === 'number')
+        return;
+    if (styleObj.zIndex === 'auto') {
+        error('Property [z-index] does not supported [auto], please check again!');
+        styleObj.zIndex = 0;
+    }
+}
 export function useTransformStyle(styleObj = {}, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight }) {
     const varStyle = {};
     const unoVarStyle = {};
@@ -386,17 +400,19 @@ export function useTransformStyle(styleObj = {}, { enableVar, externalVarContext
             envKeyPaths.push(keyPath.slice());
         }
     }
-    function calcVisitor({ value, keyPath }) {
+    function calcVisitor({ key, value, keyPath }) {
         if (calcUseRegExp.test(value)) {
+            // calc translate & border-radius 的百分比计算
+            if (hasOwn(selfPercentRule, key) && /%/.test(value)) {
+                hasSelfPercent = true;
+                percentKeyPaths.push(keyPath.slice());
+            }
             calcKeyPaths.push(keyPath.slice());
         }
     }
     function percentVisitor({ key, value, keyPath }) {
-        if (hasOwn(selfPercentRule, key) && PERCENT_REGEX.test(value)) {
-            hasSelfPercent = true;
-            percentKeyPaths.push(keyPath.slice());
-        }
-        else if ((key === 'fontSize' || key === 'lineHeight') && PERCENT_REGEX.test(value)) {
+        // fixme 去掉 translate & border-radius 的百分比计算
+        if ((key === 'fontSize' || key === 'lineHeight') && PERCENT_REGEX.test(value)) {
             percentKeyPaths.push(keyPath.slice());
         }
     }
@@ -405,6 +421,8 @@ export function useTransformStyle(styleObj = {}, { enableVar, externalVarContext
             [envVisitor, percentVisitor, calcVisitor].forEach(visitor => visitor({ target, key, value, keyPath }));
         }
     }
+    // transform 字符串格式转化数组格式(先转数组再处理css var)
+    transformTransform(styleObj);
     // traverse var & generate normalStyle
     traverseStyle(styleObj, [varVisitor]);
     hasVarDec = hasVarDec || !!externalVarContext;
@@ -467,8 +485,11 @@ export function useTransformStyle(styleObj = {}, { enableVar, externalVarContext
     transformStringify(normalStyle);
     // transform rpx to px
     transformBoxShadow(normalStyle);
-    // transform 字符串格式转化数组格式
-    transformTransform(normalStyle);
+    // transform z-index auto to 0
+    transformZIndex(normalStyle);
+    if (Array.isArray(normalStyle.transform)) {
+        normalStyle.transform = normalStyle.transform.filter(item => !isEmptyObject(item));
+    }
     return {
         hasVarDec,
         varContextRef,

package/lib/runtime/components/react/mpx-camera.tsx

@@ -0,0 +1,327 @@
+import React, { createElement, forwardRef, useRef, useCallback, useContext, useState, useEffect } from 'react'
+import { useTransformStyle, useLayout, extendObject } from './utils'
+import useInnerProps, { getCustomEvent } from './getInnerListeners'
+import { noop } from '@mpxjs/utils'
+import { RouteContext } from './context'
+
+const qualityValue = {
+  high: 90,
+  normal: 75,
+  low: 50,
+  original: 100
+}
+
+interface CameraProps {
+  mode?: 'normal' | 'scanCode'
+  resolution?: 'low' | 'medium' | 'high'
+  devicePosition?: 'front' | 'back'
+  flash?: 'auto' | 'on' | 'off'
+  frameSize?: 'small' | 'medium' | 'large'
+  style?: Record<string, any>
+  bindstop?: () => void
+  binderror?: (error: { message: string }) => void
+  bindinitdone?: (result: { type: string, data: string }) => void
+  bindscancode?: (result: { type: string, data: string }) => void
+  'parent-font-size'?: number
+  'parent-width'?: number
+  'parent-height'?: number
+  'enable-var'?: boolean
+  'external-var-context'?: any
+}
+
+interface TakePhotoOptions {
+  quality?: 'high' | 'normal' | 'low' | 'original'
+  success?: (result: { errMsg: string, tempImagePath: string }) => void
+  fail?: (result: { errMsg: string }) => void
+  complete?: (result: { errMsg: string, tempImagePath?: string }) => void
+}
+
+interface RecordOptions {
+  timeout?: number
+  success?: (result: { errMsg: string }) => void
+  fail?: (result: { errMsg: string, error?: any }) => void
+  complete?: (result: { errMsg: string }) => void
+  timeoutCallback?: (result: { errMsg: string, error?: any }) => void
+}
+
+interface StopRecordOptions {
+  success?: (result: { errMsg: string, tempVideoPath: string, duration: number }) => void
+  fail?: (result: { errMsg: string }) => void
+  complete?: (result: { errMsg: string, tempVideoPath?: string, duration?: number }) => void
+}
+
+interface CameraRef {
+  setZoom: (zoom: number) => void
+  takePhoto: (options?: TakePhotoOptions) => void
+  startRecord: (options?: RecordOptions) => void
+  stopRecord: (options?: StopRecordOptions) => void
+}
+
+type HandlerRef<T, P> = {
+  current: T | null
+}
+
+let RecordRes: any = null
+
+const _camera = forwardRef<HandlerRef<any, CameraProps>, CameraProps>((props: CameraProps, ref): JSX.Element | null => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const { Camera, useCameraDevice, useCodeScanner, useCameraFormat } = require('react-native-vision-camera')
+  const cameraRef = useRef<any>(null)
+  const {
+    mode = 'normal',
+    resolution = 'medium',
+    devicePosition = 'back',
+    flash = 'auto',
+    frameSize = 'medium',
+    bindinitdone,
+    bindstop,
+    bindscancode,
+    'parent-font-size': parentFontSize,
+    'parent-width': parentWidth,
+    'parent-height': parentHeight,
+    'enable-var': enableVar,
+    'external-var-context': externalVarContext,
+    style = {}
+  } = props
+  const styleObj = extendObject(
+    {},
+    style
+  )
+  const {
+    normalStyle,
+    hasSelfPercent,
+    setWidth,
+    setHeight
+  } = useTransformStyle(styleObj, {
+    enableVar,
+    externalVarContext,
+    parentFontSize,
+    parentWidth,
+    parentHeight
+  })
+  const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: cameraRef })
+  const isPhoto = mode === 'normal'
+  const device = useCameraDevice(devicePosition || 'back')
+  const { navigation } = useContext(RouteContext) || {}
+  const [zoomValue, setZoomValue] = useState<number>(1)
+  const [hasPermission, setHasPermission] = useState<boolean | null>(null)
+  const hasCamera = useRef(false)
+
+  // 先定义常量，避免在条件判断后使用
+  const maxZoom = device?.maxZoom || 1
+  const RESOLUTION_MAPPING: Record<string, { width: number, height: number }> = {
+    low: { width: 640, height: 480 },
+    medium: { width: 1280, height: 720 },
+    high: { width: 1920, height: 1080 }
+  }
+  const FRAME_SIZE_MAPPING: Record<string, { width: number, height: number }> = {
+    small: { width: 480, height: 360 },
+    medium: { width: 720, height: 540 },
+    large: { width: 1080, height: 810 }
+  }
+
+  const format = useCameraFormat(device, [
+    {
+      photoResolution: RESOLUTION_MAPPING[resolution],
+      videoResolution: FRAME_SIZE_MAPPING[frameSize] || RESOLUTION_MAPPING[resolution]
+    }
+  ])
+
+  const codeScanner = useCodeScanner({
+    codeTypes: ['qr', 'ean-13'],
+    onCodeScanned: (codes: any[]) => {
+      const result = codes.map(code => code.value).join(',')
+      bindscancode && bindscancode(getCustomEvent('scancode', {}, {
+        detail: {
+          result: codes.map(code => code.value).join(',')
+        }
+      }))
+    }
+  })
+
+  const onInitialized = useCallback(() => {
+    bindinitdone && bindinitdone(getCustomEvent('initdone', {}, {
+      detail: {
+        maxZoom
+      }
+    }))
+  }, [bindinitdone, maxZoom])
+
+  const onStopped = useCallback(() => {
+    bindstop && bindstop()
+  }, [bindstop])
+
+  const camera: CameraRef = {
+    setZoom: (zoom: number) => {
+      setZoomValue(zoom)
+    },
+    takePhoto: (options: TakePhotoOptions = {}) => {
+      const { success = noop, fail = noop, complete = noop } = options
+      cameraRef.current?.takePhoto?.({
+        flash,
+        quality: qualityValue[options.quality || 'normal'] as number
+      } as any).then((res: { path: any }) => {
+        const result = {
+          errMsg: 'takePhoto:ok',
+          tempImagePath: res.path
+        }
+        success(result)
+        complete(result)
+      }).catch(() => {
+        const result = {
+          errMsg: 'takePhoto:fail'
+        }
+        fail(result)
+        complete(result)
+      })
+    },
+    startRecord: (options: RecordOptions = {}) => {
+      let { timeout = 30, success = noop, fail = noop, complete = noop, timeoutCallback = noop } = options
+      timeout = timeout > 300 ? 300 : timeout
+      let recordTimer: NodeJS.Timeout | null = null
+      let isTimeout = false
+      try {
+        const result = {
+          errMsg: 'startRecord:ok'
+        }
+        success(result)
+        complete(result)
+
+        cameraRef.current?.startRecording?.({
+          flash,
+          onRecordingError: (error: any) => {
+            if (recordTimer) clearTimeout(recordTimer)
+            const errorResult = {
+              errMsg: 'startRecord:fail during recording',
+              error: error
+            }
+            timeoutCallback(errorResult)
+          },
+          onRecordingFinished: (video: any) => {
+            RecordRes = video
+            if (recordTimer) clearTimeout(recordTimer)
+          }
+        })
+
+        recordTimer = setTimeout(() => { // 超时自动停止
+          isTimeout = true
+          cameraRef.current?.stopRecording().catch(() => {
+            // 忽略停止录制时的错误
+          })
+        }, timeout * 1000)
+      } catch (error: any) {
+        if (recordTimer) clearTimeout(recordTimer)
+        const result = {
+          errMsg: 'startRecord:fail ' + (error.message || 'unknown error')
+        }
+        fail(result)
+        complete(result)
+      }
+    },
+    stopRecord: (options: StopRecordOptions = {}) => {
+      const { success = noop, fail = noop, complete = noop } = options
+      try {
+        cameraRef.current?.stopRecording().then(() => {
+          setTimeout(() => {
+            if (RecordRes) {
+              const result = {
+                errMsg: 'stopRecord:ok',
+                tempVideoPath: RecordRes?.path,
+                duration: RecordRes.duration * 1000 // 转成ms
+              }
+              RecordRes = null
+              success(result)
+              complete(result)
+            }
+          }, 200) // 延时200ms，确保录制结果已准备好
+        }).catch((e: any) => {
+          const result = {
+            errMsg: 'stopRecord:fail ' + (e.message || 'promise rejected')
+          }
+          fail(result)
+          complete(result)
+        })
+      } catch (error: any) {
+        const result = {
+          errMsg: 'stopRecord:fail ' + (error.message || 'unknown error')
+        }
+        fail(result)
+        complete(result)
+      }
+    }
+  }
+
+  useEffect(() => {
+    if (navigation) {
+      if (navigation && !navigation.camera) {
+        navigation.camera = camera
+      } else {
+        hasCamera.current = true
+        navigation.camera.multi = true
+      }
+    }
+    const checkCameraPermission = async () => {
+      try {
+        const cameraPermission = global?.__mpx?.config?.rnConfig?.cameraPermission
+        if (typeof cameraPermission === 'function') {
+          const permissionResult = await cameraPermission()
+          setHasPermission(permissionResult === true)
+        } else {
+          setHasPermission(true)
+        }
+      } catch (error) {
+        setHasPermission(false)
+      }
+    }
+    checkCameraPermission()
+    return () => {
+      if (navigation && navigation.camera) {
+        navigation.camera = null
+      }
+    }
+  }, [])
+
+  const innerProps = useInnerProps(
+    extendObject(
+      {},
+      props,
+      layoutProps,
+      {
+        ref: cameraRef,
+        style: extendObject({}, normalStyle, layoutStyle),
+        isActive: true,
+        photo: true,
+        video: true,
+        onInitialized,
+        onStopped,
+        device,
+        format,
+        codeScanner: !isPhoto ? codeScanner : undefined,
+        zoom: zoomValue
+      }
+    ),
+    [
+      'mode',
+      'resolution',
+      'frame-size',
+      'bindinitdone',
+      'bindstop',
+      'flash',
+      'bindscancode',
+      'binderror'
+    ],
+    {
+      layoutRef
+    }
+  )
+
+  if (!hasPermission || hasCamera.current || !device) {
+    return null
+  }
+
+  return createElement(Camera, innerProps)
+})
+
+_camera.displayName = 'MpxCamera'
+
+export default _camera