@mpxjs/webpack-plugin 2.10.14-beta.7 → 2.10.14-beta.9

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

@@ -12,11 +12,12 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
     const keyboardAvoid = useContext(KeyboardAvoidContext);
     // fix: 某些特殊机型下隐藏键盘可能会先触发一次 keyboardWillShow，
     // 比如机型 iPhone 11 Pro，可能会导致显隐动画冲突
-    // 因此增加状态标记 + cancelAnimation 来优化
+    // 因此增加状态标记 + clearTimeout + cancelAnimation 来优化
     const isShow = useRef(false);
+    const timerRef = useRef(null);
     const animatedStyle = useAnimatedStyle(() => ({
-        // translate/position top可能会导致底部渲染区域缺失
-        marginTop: -offset.value,
+        // translate/position top可能会导致底部渲染区域缺失(需要 android 配置聚焦时禁用高度缩小)，margin-top 会导致 portal 的定位失效，无法顶起 portal
+        transform: [{ translateY: -offset.value }],
         flexBasis: basic.value
     }));
     const resetKeyboard = () => {
@@ -24,6 +25,7 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
             return;
         }
         isShow.current = false;
+        timerRef.current && clearTimeout(timerRef.current);
         if (keyboardAvoid?.current) {
             const inputRef = keyboardAvoid.current.ref?.current;
             if (inputRef && inputRef.isFocused()) {
@@ -38,19 +40,19 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
     };
     const onTouchEnd = ({ nativeEvent }) => {
         if (nativeEvent.origin !== 'input') {
-            if (keyboardAvoid?.current?.holdKeyboard) {
-                return;
-            }
             Keyboard.isVisible() && Keyboard.dismiss();
         }
     };
     useEffect(() => {
         let subscriptions = [];
-        function keybaordAvoding(evt) {
+        function keybaordAvoding(evt, ios = false) {
             if (!keyboardAvoid?.current || isShow.current) {
                 return;
             }
             isShow.current = true;
+            if (ios) {
+                timerRef.current && clearTimeout(timerRef.current);
+            }
             const { endCoordinates } = evt;
             const { ref, cursorSpacing = 0, adjustPosition, onKeyboardShow } = keyboardAvoid.current;
             keyboardAvoid.current.keyboardHeight = endCoordinates.height;
@@ -83,17 +85,23 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
                         });
                     });
                 };
-                (isIOS ? () => setTimeout(callback) : callback)();
+                (isIOS ? () => (timerRef.current = setTimeout(callback)) : callback)();
             }
         }
         if (isIOS) {
-            subscriptions = [Keyboard.addListener('keyboardWillShow', keybaordAvoding), Keyboard.addListener('keyboardWillHide', resetKeyboard)];
+            subscriptions = [
+                Keyboard.addListener('keyboardWillShow', (evt) => {
+                    keybaordAvoding(evt, true);
+                }),
+                Keyboard.addListener('keyboardWillHide', resetKeyboard)
+            ];
         }
         else {
             subscriptions = [Keyboard.addListener('keyboardDidShow', keybaordAvoding), Keyboard.addListener('keyboardDidHide', resetKeyboard)];
         }
         return () => {
             subscriptions.forEach(subscription => subscription.remove());
+            timerRef.current && clearTimeout(timerRef.current);
         };
     }, [keyboardAvoid]);
     return (<View style={style} onTouchEnd={onTouchEnd} onTouchMove={onTouchEnd}>

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

@@ -18,4 +18,3 @@ export interface LabelProps {
 }
 declare const Label: import("react").ForwardRefExoticComponent<LabelProps & import("react").RefAttributes<HandlerRef<View, LabelProps>>>;
 export default Label;
-//# sourceMappingURL=mpx-label.d.ts.map

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

@@ -18,4 +18,3 @@ interface MovableAreaProps {
 }
 declare const _MovableArea: import("react").ForwardRefExoticComponent<MovableAreaProps & import("react").RefAttributes<HandlerRef<View, MovableAreaProps>>>;
 export default _MovableArea;
-//# sourceMappingURL=mpx-movable-area.d.ts.map

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

@@ -4,8 +4,8 @@
  * ✔ out-of-bounds
  * ✔ x
  * ✔ y
- * ✔ damping
- * ✔ friction
+ * ✘ damping
+ * ✘ friction
  * ✔ disabled
  * ✘ scale
  * ✘ scale-min
@@ -30,8 +30,6 @@ interface MovableViewProps {
     y?: number;
     disabled?: boolean;
     animation?: boolean;
-    damping?: number;
-    friction?: number;
     id?: string;
     changeThrottleTime?: number;
     bindchange?: (event: unknown) => void;
@@ -63,4 +61,3 @@ interface MovableViewProps {
 }
 declare const _MovableView: import("react").ForwardRefExoticComponent<MovableViewProps & import("react").RefAttributes<HandlerRef<View, MovableViewProps>>>;
 export default _MovableView;
-//# sourceMappingURL=mpx-movable-view.d.ts.map

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

@@ -4,8 +4,8 @@
  * ✔ out-of-bounds
  * ✔ x
  * ✔ y
- * ✔ damping
- * ✔ friction
+ * ✘ damping
+ * ✘ friction
  * ✔ disabled
  * ✘ scale
  * ✘ scale-min
@@ -24,96 +24,8 @@ import useNodesRef from './useNodesRef';
 import { MovableAreaContext } from './context';
 import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback } from './utils';
 import { GestureDetector, Gesture } from 'react-native-gesture-handler';
-import Animated, { useSharedValue, useAnimatedStyle, runOnJS, runOnUI, withTiming, Easing } from 'react-native-reanimated';
+import Animated, { useSharedValue, useAnimatedStyle, withDecay, runOnJS, runOnUI, withSpring } from 'react-native-reanimated';
 import { collectDataset, noop } from '@mpxjs/utils';
-// 超出边界处理函数，参考微信小程序的超出边界衰减效果
-const applyBoundaryDecline = (newValue, range) => {
-    'worklet';
-    const decline = (distance) => {
-        'worklet';
-        return Math.sqrt(Math.abs(distance));
-    };
-    if (newValue < range[0]) {
-        const overDistance = range[0] - newValue;
-        return range[0] - decline(overDistance);
-    }
-    else if (newValue > range[1]) {
-        const overDistance = newValue - range[1];
-        return range[1] + decline(overDistance);
-    }
-    return newValue;
-};
-// 参考微信小程序的弹簧阻尼系统实现
-const withWechatSpring = (toValue, dampingParam = 20, callback) => {
-    'worklet';
-    // 弹簧参数计算
-    const m = 1; // 质量
-    const k = 9 * Math.pow(dampingParam, 2) / 40; // 弹簧系数
-    const c = dampingParam; // 阻尼系数
-    // 判别式：r = c² - 4mk
-    const discriminant = c * c - 4 * m * k;
-    // 计算动画持续时间和缓动函数
-    let duration;
-    let easingFunction;
-    if (Math.abs(discriminant) < 0.01) {
-        // 临界阻尼 (discriminant ≈ 0)
-        // 使用cubic-out模拟临界阻尼的平滑过渡
-        duration = Math.max(350, Math.min(800, 2000 / dampingParam));
-        easingFunction = Easing.out(Easing.cubic);
-    }
-    else if (discriminant > 0) {
-        // 过阻尼 (discriminant > 0)
-        // 使用指数缓动模拟过阻尼的缓慢收敛
-        duration = Math.max(450, Math.min(1000, 2500 / dampingParam));
-        easingFunction = Easing.out(Easing.exp);
-    }
-    else {
-        // 欠阻尼 (discriminant < 0) - 会产生振荡
-        // 计算振荡频率和衰减率
-        const dampingRatio = c / (2 * Math.sqrt(m * k)); // 阻尼比
-        // 根据阻尼比调整动画参数
-        if (dampingRatio < 0.7) {
-            // 明显振荡
-            duration = Math.max(600, Math.min(1200, 3000 / dampingParam));
-            // 创建带振荡的贝塞尔曲线
-            easingFunction = Easing.bezier(0.175, 0.885, 0.32, 1.275);
-        }
-        else {
-            // 轻微振荡
-            duration = Math.max(400, Math.min(800, 2000 / dampingParam));
-            easingFunction = Easing.bezier(0.25, 0.46, 0.45, 0.94);
-        }
-    }
-    return withTiming(toValue, {
-        duration,
-        easing: easingFunction
-    }, callback);
-};
-// 参考微信小程序friction的惯性动画
-const withWechatDecay = (velocity, currentPosition, clampRange, frictionValue = 2, callback) => {
-    'worklet';
-    // 微信小程序friction算法: delta = -1.5 * v² / a, 其中 a = -f * v / |v|
-    // 如果friction小于等于0，设置为默认值2
-    const validFriction = frictionValue <= 0 ? 2 : frictionValue;
-    const f = 1000 * validFriction;
-    const acceleration = velocity !== 0 ? -f * velocity / Math.abs(velocity) : 0;
-    const delta = acceleration !== 0 ? (-1.5 * velocity * velocity) / acceleration : 0;
-    let finalPosition = currentPosition + delta;
-    // 边界限制
-    if (finalPosition < clampRange[0]) {
-        finalPosition = clampRange[0];
-    }
-    else if (finalPosition > clampRange[1]) {
-        finalPosition = clampRange[1];
-    }
-    // 计算动画时长
-    const distance = Math.abs(finalPosition - currentPosition);
-    const duration = Math.min(1500, Math.max(200, distance * 8));
-    return withTiming(finalPosition, {
-        duration,
-        easing: Easing.out(Easing.cubic)
-    }, callback);
-};
 const styles = StyleSheet.create({
     container: {
         position: 'absolute',
@@ -129,7 +41,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const hasLayoutRef = useRef(false);
     const propsRef = useRef({});
     propsRef.current = (props || {});
-    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, damping = 20, friction = 2, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'disable-event-passthrough': disableEventPassthrough = false, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindchange } = props;
+    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'disable-event-passthrough': disableEventPassthrough = false, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindchange } = props;
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(Object.assign({}, style, styles.container), { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const navigation = useNavigation();
     const prevSimultaneousHandlersRef = useRef(originSimultaneousHandlers || []);
@@ -194,12 +106,18 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 const { x: newX, y: newY } = checkBoundaryPosition({ positionX: Number(x), positionY: Number(y) });
                 if (direction === 'horizontal' || direction === 'all') {
                     offsetX.value = animation
-                        ? withWechatSpring(newX, damping)
+                        ? withSpring(newX, {
+                            duration: 1500,
+                            dampingRatio: 0.8
+                        })
                         : newX;
                 }
                 if (direction === 'vertical' || direction === 'all') {
                     offsetY.value = animation
-                        ? withWechatSpring(newY, damping)
+                        ? withSpring(newY, {
+                            duration: 1500,
+                            dampingRatio: 0.8
+                        })
                         : newY;
                 }
                 if (bindchange) {
@@ -375,7 +293,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         triggerEndOnJS
     });
     const runOnJSCallback = useRunOnJSCallback(runOnJSCallbackRef);
-    // 节流版本的change事件触发
+    // 节流版本的 change 事件触发
     const handleTriggerChangeThrottled = useCallback(({ x, y, type }) => {
         'worklet';
         const now = Date.now();
@@ -439,7 +357,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                     offsetX.value = x;
                 }
                 else {
-                    offsetX.value = applyBoundaryDecline(newX, draggableXRange.value);
+                    offsetX.value = newX;
                 }
             }
             if (direction === 'vertical' || direction === 'all') {
@@ -449,7 +367,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                     offsetY.value = y;
                 }
                 else {
-                    offsetY.value = applyBoundaryDecline(newY, draggableYRange.value);
+                    offsetY.value = newY;
                 }
             }
             if (bindchange) {
@@ -479,12 +397,18 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 if (x !== offsetX.value || y !== offsetY.value) {
                     if (x !== offsetX.value) {
                         offsetX.value = animation
-                            ? withWechatSpring(x, damping)
+                            ? withSpring(x, {
+                                duration: 1500,
+                                dampingRatio: 0.8
+                            })
                             : x;
                     }
                     if (y !== offsetY.value) {
                         offsetY.value = animation
-                            ? withWechatSpring(y, damping)
+                            ? withSpring(y, {
+                                duration: 1500,
+                                dampingRatio: 0.8
+                            })
                             : y;
                     }
                     if (bindchange) {
@@ -496,10 +420,14 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 }
             }
             else if (inertia) {
-                // 惯性处理 - 使用微信小程序friction算法
+                // 惯性处理
                 if (direction === 'horizontal' || direction === 'all') {
                     xInertialMotion.value = true;
-                    offsetX.value = withWechatDecay(e.velocityX / 10, offsetX.value, draggableXRange.value, friction, () => {
+                    offsetX.value = withDecay({
+                        velocity: e.velocityX / 10,
+                        rubberBandEffect: outOfBounds,
+                        clamp: draggableXRange.value
+                    }, () => {
                         xInertialMotion.value = false;
                         if (bindchange) {
                             runOnJS(runOnJSCallback)('handleTriggerChange', {
@@ -511,7 +439,11 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 }
                 if (direction === 'vertical' || direction === 'all') {
                     yInertialMotion.value = true;
-                    offsetY.value = withWechatDecay(e.velocityY / 10, offsetY.value, draggableYRange.value, friction, () => {
+                    offsetY.value = withDecay({
+                        velocity: e.velocityY / 10,
+                        rubberBandEffect: outOfBounds,
+                        clamp: draggableYRange.value
+                    }, () => {
                         yInertialMotion.value = false;
                         if (bindchange) {
                             runOnJS(runOnJSCallback)('handleTriggerChange', {

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface MpxNavContainerProps {
+    children?: React.ReactNode;
+}
+export default function MpxNavContainer(props: MpxNavContainerProps): import("react").ReactNode;
+export declare function NavSharedProvider({ children }: {
+    children?: React.ReactNode;
+}): import("react").JSX.Element;
+export {};

package/lib/runtime/components/react/dist/mpx-nav-container.jsx

@@ -0,0 +1,23 @@
+import { useNavShared } from './useNavShared';
+import { NavSharedContext } from './context';
+import { useLayoutEffect, useMemo, useState } from 'react';
+import { isAndroid } from './utils';
+export default function MpxNavContainer(props) {
+    const [, setCustomNav] = useNavShared();
+    useLayoutEffect(() => {
+        if (!isAndroid)
+            return;
+        if (props.children) {
+            setCustomNav(props.children);
+        }
+        return () => {
+            setCustomNav(undefined);
+        };
+    }, [props.children]);
+    return isAndroid ? null : props.children;
+}
+export function NavSharedProvider({ children }) {
+    const [customNav, setCustomNav] = useState();
+    const value = useMemo(() => ({ customNav, setCustomNav }), [customNav]);
+    return <NavSharedContext.Provider value={value}>{children}</NavSharedContext.Provider>;
+}

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

@@ -7,4 +7,3 @@ interface _NavigatorProps extends _ViewProps {
 }
 declare const _Navigator: import("react").ForwardRefExoticComponent<_NavigatorProps & import("react").RefAttributes<any>>;
 export default _Navigator;
-//# sourceMappingURL=mpx-navigator.d.ts.map

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

@@ -4,4 +4,3 @@ import { DateProps } from './type';
 import { HandlerRef } from '../useNodesRef';
 declare const PickerDate: React.ForwardRefExoticComponent<Omit<DateProps, "ref"> & React.RefAttributes<HandlerRef<View, DateProps>>>;
 export default PickerDate;
-//# sourceMappingURL=date.d.ts.map

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

@@ -5,4 +5,3 @@ export declare const years: string[];
 export declare const months: string[];
 export declare const daysInMonthLength: (year: number, month: number) => 30 | 28 | 29 | 31;
 export declare const daysInMonth: (year: number, month: number) => string[];
-//# sourceMappingURL=dateData.d.ts.map

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

@@ -4,4 +4,3 @@ import { HandlerRef } from '../useNodesRef';
 import { PickerProps } from './type';
 declare const Picker: React.ForwardRefExoticComponent<(Omit<import("./type").DateProps, "ref"> | Omit<import("./type").SelectorProps, "ref"> | Omit<import("./type").MultiSelectorProps, "ref"> | Omit<import("./type").TimeProps, "ref"> | Omit<import("./type").RegionProps, "ref">) & React.RefAttributes<HandlerRef<View, PickerProps>>>;
 export default Picker;
-//# sourceMappingURL=index.d.ts.map

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

@@ -4,4 +4,3 @@ import { MultiSelectorProps } from './type';
 import { HandlerRef } from '../useNodesRef';
 declare const PickerMultiSelector: React.ForwardRefExoticComponent<Omit<MultiSelectorProps, "ref"> & React.RefAttributes<HandlerRef<View, MultiSelectorProps>>>;
 export default PickerMultiSelector;
-//# sourceMappingURL=multiSelector.d.ts.map

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

@@ -4,4 +4,3 @@ import { RegionProps } from './type';
 import { HandlerRef } from '../useNodesRef';
 declare const PickerRegion: React.ForwardRefExoticComponent<Omit<RegionProps, "ref"> & React.RefAttributes<HandlerRef<View, RegionProps>>>;
 export default PickerRegion;
-//# sourceMappingURL=region.d.ts.map

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

@@ -1,3 +1,2 @@
 import { RegionObj } from './type';
 export declare const regionData: RegionObj[];
-//# sourceMappingURL=regionData.d.ts.map

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

@@ -4,4 +4,3 @@ import { SelectorProps } from './type';
 import { HandlerRef } from '../useNodesRef';
 declare const PickerSelector: React.ForwardRefExoticComponent<Omit<SelectorProps, "ref"> & React.RefAttributes<HandlerRef<View, SelectorProps>>>;
 export default PickerSelector;
-//# sourceMappingURL=selector.d.ts.map

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

@@ -4,4 +4,3 @@ import { TimeProps } from './type';
 import { HandlerRef } from '../useNodesRef';
 declare const PickerTime: React.ForwardRefExoticComponent<Omit<TimeProps, "ref"> & React.RefAttributes<HandlerRef<View, TimeProps>>>;
 export default PickerTime;
-//# sourceMappingURL=time.d.ts.map

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

@@ -104,4 +104,3 @@ export interface FormType {
 }
 export type PickerProps = SelectorProps | MultiSelectorProps | TimeProps | DateProps | RegionProps;
 export type LanguageCode = 'zh-CN' | 'en-US';
-//# sourceMappingURL=type.d.ts.map

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

@@ -21,7 +21,6 @@ interface PickerViewProps {
     style?: {
         [key: string]: any;
     };
-    'enable-wheel-animation'?: boolean;
     'indicator-style'?: Record<string, any>;
     'mask-style'?: Record<string, any>;
     'enable-var'?: boolean;
@@ -30,4 +29,3 @@ interface PickerViewProps {
 }
 declare const _PickerView: React.ForwardRefExoticComponent<PickerViewProps & React.RefAttributes<HandlerRef<View, PickerViewProps>>>;
 export default _PickerView;
-//# sourceMappingURL=index.d.ts.map

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

@@ -17,7 +17,7 @@ const styles = {
 };
 const DefaultPickerItemH = 36;
 const _PickerView = forwardRef((props, ref) => {
-    const { children, value = [], bindchange, style, 'enable-wheel-animation': enableWheelAnimation = true, 'indicator-style': indicatorStyle = {}, 'mask-style': pickerMaskStyle = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext } = props;
+    const { children, value = [], bindchange, style, 'indicator-style': indicatorStyle = {}, 'mask-style': pickerMaskStyle = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext } = props;
     const { height: indicatorH, ...pickerIndicatorStyle } = indicatorStyle;
     const nodeRef = useRef(null);
     const cloneRef = useRef(null);
@@ -67,7 +67,7 @@ const _PickerView = forwardRef((props, ref) => {
             columnData,
             ref: cloneRef,
             columnIndex: index,
-            key: `pick-view-${index}-${columnData.length}`,
+            key: `pick-view-${index}`,
             wrapperStyle: {
                 height: normalStyle?.height || DefaultPickerItemH,
                 itemHeight: indicatorH || DefaultPickerItemH
@@ -75,8 +75,7 @@ const _PickerView = forwardRef((props, ref) => {
             onSelectChange: onSelectChange.bind(null, index),
             initialIndex,
             pickerIndicatorStyle,
-            pickerMaskStyle,
-            enableWheelAnimation
+            pickerMaskStyle
         });
         const realElement = React.cloneElement(child, wrappedProps);
         return wrapChildren({

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

@@ -6,4 +6,3 @@ export declare const usePickerViewColumnAnimationContext: () => ContextValue;
 export declare const PickerViewStyleContext: import("react").Context<Record<string, any> | undefined>;
 export declare const usePickerViewStyleContext: () => Record<string, any> | undefined;
 export {};
-//# sourceMappingURL=pickerVIewContext.d.ts.map

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

@@ -17,8 +17,6 @@ interface ColumnProps {
     };
     pickerMaskStyle: Record<string, any>;
     pickerIndicatorStyle: Record<string, any>;
-    enableWheelAnimation?: boolean;
 }
 declare const _PickerViewColumn: React.ForwardRefExoticComponent<ColumnProps & React.RefAttributes<HandlerRef<ScrollView & View, ColumnProps>>>;
 export default _PickerViewColumn;
-//# sourceMappingURL=index.d.ts.map

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

@@ -5,13 +5,12 @@ import { useTransformStyle, splitStyle, splitProps, useLayout, usePrevious, isAn
 import useNodesRef from '../useNodesRef';
 import PickerIndicator from './pickerViewIndicator';
 import PickerMask from './pickerViewMask';
-import MpxPickerViewColumnItem from './pickerViewColumnItem';
-import MpxPickerViewColumnItemLite from './pickerViewColumnItemLite';
+import MpxPickerVIewColumnItem from './pickerViewColumnItem';
 import { PickerViewColumnAnimationContext } from '../mpx-picker-view/pickerVIewContext';
 import { calcHeightOffsets } from './pickerViewFaces';
 const visibleCount = 5;
 const _PickerViewColumn = forwardRef((props, ref) => {
-    const { columnData, columnIndex, initialIndex, onSelectChange, style, wrapperStyle, pickerMaskStyle, pickerIndicatorStyle, enableWheelAnimation = true, 'enable-var': enableVar, 'external-var-context': externalVarContext } = props;
+    const { columnData, columnIndex, initialIndex, onSelectChange, style, wrapperStyle, pickerMaskStyle, pickerIndicatorStyle, 'enable-var': enableVar, 'external-var-context': externalVarContext } = props;
     const { normalStyle, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext });
     const { textStyle = {} } = splitStyle(normalStyle);
     const { textProps = {} } = splitProps(props);
@@ -44,7 +43,6 @@ const _PickerViewColumn = forwardRef((props, ref) => {
     const contentContainerStyle = useMemo(() => {
         return [{ paddingVertical: paddingHeight }];
     }, [paddingHeight]);
-    const initialContentOffsetY = useMemo(() => initialIndex * itemRawH, [initialIndex, itemRawH]);
     const getIndex = useCallback((y) => {
         const calc = Math.round(y / itemRawH);
         return Math.max(0, Math.min(calc, maxIndex));
@@ -94,6 +92,16 @@ const _PickerViewColumn = forwardRef((props, ref) => {
             activeIndex.current = initialIndex;
         }, isIOS ? 0 : 200);
     }, [itemRawH, maxIndex, initialIndex]);
+    const onContentSizeChange = useCallback((_w, h) => {
+        const y = initialIndex * itemRawH;
+        if (y <= h) {
+            clearTimerScrollTo();
+            timerScrollTo.current = setTimeout(() => {
+                scrollViewRef.current?.scrollTo({ x: 0, y, animated: false });
+                activeIndex.current = initialIndex;
+            }, 0);
+        }
+    }, [itemRawH, initialIndex]);
     const onItemLayout = useCallback((e) => {
         const { height: rawH } = e.nativeEvent.layout;
         const roundedH = Math.round(rawH);
@@ -149,8 +157,8 @@ const _PickerViewColumn = forwardRef((props, ref) => {
     }, [itemRawH, maxIndex, snapToOffsets, onMomentumScrollEnd, resetScrollPosition]);
     const onScroll = useCallback((e) => {
         // 全局注册的振动触感 hook
-        const onPickerVibrate = global.__mpx?.config?.rnConfig?.onPickerVibrate;
-        if (typeof onPickerVibrate !== 'function') {
+        const pickerVibrate = global.__mpx?.config?.rnConfig?.pickerVibrate;
+        if (typeof pickerVibrate !== 'function') {
             return;
         }
         const { y } = e.nativeEvent.contentOffset;
@@ -164,7 +172,7 @@ const _PickerViewColumn = forwardRef((props, ref) => {
                         y: currentId * itemRawH
                     };
                     // vibrateShort({ type: 'selection' })
-                    onPickerVibrate();
+                    pickerVibrate();
                 }
             }
         }
@@ -209,9 +217,7 @@ const _PickerViewColumn = forwardRef((props, ref) => {
         }
     }, [itemRawH, maxIndex, calcOffset, onMomentumScrollEnd]);
     const renderInnerchild = () => columnData.map((item, index) => {
-        return enableWheelAnimation
-            ? (<MpxPickerViewColumnItem key={index} item={item} index={index} itemHeight={itemHeight} textStyle={textStyle} textProps={textProps} visibleCount={visibleCount} onItemLayout={onItemLayout}/>)
-            : (<MpxPickerViewColumnItemLite key={index} item={item} index={index} itemHeight={itemHeight} textStyle={textStyle} textProps={textProps} onItemLayout={onItemLayout}/>);
+        return (<MpxPickerVIewColumnItem key={index} item={item} index={index} itemHeight={itemHeight} textStyle={textStyle} textProps={textProps} visibleCount={visibleCount} onItemLayout={onItemLayout}/>);
     });
     const renderScollView = () => {
         const innerProps = extendObject({}, layoutProps, {
@@ -232,17 +238,17 @@ const _PickerViewColumn = forwardRef((props, ref) => {
             onScrollEndDrag,
             onMomentumScrollBegin,
             onMomentumScrollEnd,
-            contentContainerStyle,
-            contentOffset: { x: 0, y: initialContentOffsetY }
+            onContentSizeChange,
+            contentContainerStyle
         });
         return createElement(PickerViewColumnAnimationContext.Provider, { value: offsetYShared }, createElement(Reanimated.ScrollView, innerProps, renderInnerchild()));
     };
     const renderIndicator = () => (<PickerIndicator itemHeight={itemHeight} indicatorItemStyle={pickerIndicatorStyle}/>);
     const renderMask = () => (<PickerMask itemHeight={itemHeight} maskContainerStyle={pickerMaskStyle}/>);
     return (<View style={[styles.wrapper, normalStyle]}>
-      {renderScollView()}
-      {renderMask()}
-      {renderIndicator()}
+        {renderScollView()}
+        {renderMask()}
+        {renderIndicator()}
     </View>);
 });
 const styles = StyleSheet.create({

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

@@ -12,4 +12,3 @@ interface PickerColumnItemProps {
 }
 declare const PickerViewColumnItem: React.FC<PickerColumnItemProps>;
 export default PickerViewColumnItem;
-//# sourceMappingURL=pickerViewColumnItem.d.ts.map

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

@@ -1,20 +1,23 @@
-import React, { useMemo } from 'react';
-import Reanimated, { Extrapolation, interpolate, useAnimatedStyle } from 'react-native-reanimated';
+import React, { useEffect } from 'react';
+import Reanimated, { Extrapolation, interpolate, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
 import { extendObject } from '../utils';
 import { createFaces } from './pickerViewFaces';
 import { usePickerViewColumnAnimationContext, usePickerViewStyleContext } from '../mpx-picker-view/pickerVIewContext';
 const PickerViewColumnItem = ({ item, index, itemHeight, itemWidth = '100%', textStyle, textProps, visibleCount, onItemLayout }) => {
     const textStyleFromAncestor = usePickerViewStyleContext();
     const offsetYShared = usePickerViewColumnAnimationContext();
-    const facesShared = useMemo(() => createFaces(itemHeight, visibleCount), [itemHeight, visibleCount]);
+    const facesShared = useSharedValue(createFaces(itemHeight, visibleCount));
+    useEffect(() => {
+        facesShared.value = createFaces(itemHeight, visibleCount);
+    }, [itemHeight]);
     const animatedStyles = useAnimatedStyle(() => {
-        const inputRange = facesShared.map((f) => itemHeight * (index + f.index));
+        const inputRange = facesShared.value.map((f) => itemHeight * (index + f.index));
         return {
-            opacity: interpolate(offsetYShared.value, inputRange, facesShared.map((x) => x.opacity), Extrapolation.CLAMP),
+            opacity: interpolate(offsetYShared.value, inputRange, facesShared.value.map((x) => x.opacity), Extrapolation.CLAMP),
             transform: [
-                { translateY: interpolate(offsetYShared.value, inputRange, facesShared.map((x) => x.offsetY), Extrapolation.EXTEND) },
-                { rotateX: interpolate(offsetYShared.value, inputRange, facesShared.map((x) => x.deg), Extrapolation.CLAMP) + 'deg' },
-                { scale: interpolate(offsetYShared.value, inputRange, facesShared.map((x) => x.scale), Extrapolation.EXTEND) }
+                { translateY: interpolate(offsetYShared.value, inputRange, facesShared.value.map((x) => x.offsetY), Extrapolation.EXTEND) },
+                { rotateX: interpolate(offsetYShared.value, inputRange, facesShared.value.map((x) => x.deg), Extrapolation.CLAMP) + 'deg' },
+                { scale: interpolate(offsetYShared.value, inputRange, facesShared.value.map((x) => x.scale), Extrapolation.EXTEND) }
             ]
         };
     });

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

@@ -14,4 +14,3 @@ export declare const degToRad: (deg: number) => number;
 export declare const calcPickerHeight: (faces: Faces[], itemHeight: number) => number;
 export declare const calcHeightOffsets: (itemHeight: number) => number[];
 export declare const createFaces: (itemHeight: number, visibleCount: number) => Faces[];
-//# sourceMappingURL=pickerViewFaces.d.ts.map

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

@@ -10,4 +10,3 @@ declare const _PickerViewIndicator: {
     displayName: string;
 };
 export default _PickerViewIndicator;
-//# sourceMappingURL=pickerViewIndicator.d.ts.map

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

@@ -9,4 +9,3 @@ declare const _PickerViewMask: {
     displayName: string;
 };
 export default _PickerViewMask;
-//# sourceMappingURL=pickerViewMask.d.ts.map

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

@@ -20,4 +20,3 @@ declare const createPopupManager: (options?: IUsePopupOptions) => {
     remove: () => void;
 };
 export { createPopupManager };
-//# sourceMappingURL=index.d.ts.map