@mpxjs/webpack-plugin 2.10.4-beta.16 → 2.10.4-beta.18

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

@@ -90,7 +90,7 @@ const Input = forwardRef((props, ref) => {
     });
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
     useEffect(() => {
-        if (inputValue !== value) {
+        if (value !== tmpValue.current) {
             const parsed = parseValue(value);
             tmpValue.current = parsed;
             setInputValue(parsed);

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

@@ -43,7 +43,7 @@ import { IntersectionObserverContext, ScrollViewContext } from './context';
 const AnimatedScrollView = RNAnimated.createAnimatedComponent(ScrollView);
 const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const { textProps, innerProps: props = {} } = splitProps(scrollViewProps);
-    const { enhanced = false, bounces = true, style = {}, binddragstart, binddragging, binddragend, bindtouchstart, bindtouchmove, bindtouchend, 'scroll-x': scrollX = false, 'scroll-y': scrollY = false, 'enable-back-to-top': enableBackToTop = false, 'enable-trigger-intersection-observer': enableTriggerIntersectionObserver = false, 'paging-enabled': pagingEnabled = false, 'upper-threshold': upperThreshold = 50, 'lower-threshold': lowerThreshold = 50, 'scroll-with-animation': scrollWithAnimation = false, 'refresher-enabled': refresherEnabled, 'refresher-default-style': refresherDefaultStyle, 'refresher-background': refresherBackground, 'refresher-threshold': refresherThreshold = 45, 'show-scrollbar': showScrollbar = true, 'scroll-into-view': scrollIntoView = '', 'scroll-top': scrollTop = 0, 'scroll-left': scrollLeft = 0, 'refresher-triggered': refresherTriggered, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'simultaneous-handlers': originSimultaneousHandlers, 'wait-for': waitFor, 'enable-sticky': enableSticky, 'scroll-event-throttle': scrollEventThrottle = 0, __selectRef } = props;
+    const { enhanced = false, bounces = true, style = {}, binddragstart, binddragging, binddragend, bindtouchstart, bindtouchmove, bindtouchend, 'scroll-x': scrollX = false, 'scroll-y': scrollY = false, 'enable-back-to-top': enableBackToTop = false, 'enable-trigger-intersection-observer': enableTriggerIntersectionObserver = false, 'paging-enabled': pagingEnabled = false, 'upper-threshold': upperThreshold = 50, 'lower-threshold': lowerThreshold = 50, 'scroll-with-animation': scrollWithAnimation = false, 'refresher-enabled': refresherEnabled, 'refresher-default-style': refresherDefaultStyle, 'refresher-background': refresherBackground, 'refresher-threshold': refresherThreshold = 45, 'show-scrollbar': showScrollbar = true, 'scroll-into-view': scrollIntoView = '', 'scroll-top': scrollTop = 0, 'scroll-left': scrollLeft = 0, 'refresher-triggered': refresherTriggered, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'simultaneous-handlers': originSimultaneousHandlers, 'wait-for': waitFor, 'enable-sticky': enableSticky, 'scroll-event-throttle': scrollEventThrottle = 0, 'scroll-into-view-offset': scrollIntoViewOffset = 0, __selectRef } = props;
     const scrollOffset = useRef(new RNAnimated.Value(0)).current;
     const simultaneousHandlers = flatGesture(originSimultaneousHandlers);
     const waitForHandlers = flatGesture(waitFor);
@@ -68,7 +68,7 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const hasCallScrollToLower = useRef(false);
     const initialTimeout = useRef(null);
     const intersectionObservers = useContext(IntersectionObserverContext);
-    const firstScrollIntoViewChange = useRef(false);
+    const firstScrollIntoViewChange = useRef(true);
     const refreshColor = {
         black: ['#000'],
         white: ['#fff']
@@ -88,7 +88,8 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
             pagingEnabled,
             fastDeceleration: false,
             decelerationDisabled: false,
-            scrollTo
+            scrollTo,
+            scrollIntoView: handleScrollIntoView
         },
         gestureRef: scrollViewRef
     });
@@ -118,14 +119,16 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     }, [scrollTop, scrollLeft]);
     useEffect(() => {
         if (scrollIntoView && __selectRef) {
-            if (!firstScrollIntoViewChange.current) {
-                setTimeout(handleScrollIntoView);
+            if (firstScrollIntoViewChange.current) {
+                setTimeout(() => {
+                    handleScrollIntoView(scrollIntoView, { offset: scrollIntoViewOffset, animated: scrollWithAnimation });
+                });
             }
             else {
-                handleScrollIntoView();
+                handleScrollIntoView(scrollIntoView, { offset: scrollIntoViewOffset, animated: scrollWithAnimation });
             }
         }
-        firstScrollIntoViewChange.current = true;
+        firstScrollIntoViewChange.current = false;
     }, [scrollIntoView]);
     useEffect(() => {
         if (refresherEnabled) {
@@ -145,13 +148,15 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     function scrollTo({ top = 0, left = 0, animated = false }) {
         scrollToOffset(left, top, animated);
     }
-    function handleScrollIntoView() {
-        const refs = __selectRef(`#${scrollIntoView}`, 'node');
+    function handleScrollIntoView(selector = '', { offset = 0, animated = true } = {}) {
+        const refs = __selectRef(`#${selector}`, 'node');
         if (!refs)
             return;
         const { nodeRef } = refs.getNodeInstance();
         nodeRef.current?.measureLayout(scrollViewRef.current, (left, top) => {
-            scrollToOffset(left, top);
+            const adjustedLeft = scrollX ? left + offset : left;
+            const adjustedTop = scrollY ? top + offset : top;
+            scrollToOffset(adjustedLeft, adjustedTop, animated);
         });
     }
     function selectLength(size) {

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

@@ -216,7 +216,7 @@ const Input = forwardRef<HandlerRef<TextInput, FinalInputProps>, FinalInputProps
   const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef })
 
   useEffect(() => {
-    if (inputValue !== value) {
+    if (value !== tmpValue.current) {
       const parsed = parseValue(value)
       tmpValue.current = parsed
       setInputValue(parsed)

package/lib/runtime/components/react/mpx-scroll-view.tsx

@@ -73,6 +73,7 @@ interface ScrollViewProps {
   'wait-for'?: Array<GestureHandler>;
   'simultaneous-handlers'?: Array<GestureHandler>;
   'scroll-event-throttle'?:number;
+  'scroll-into-view-offset'?: number;
   bindscrolltoupper?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
   bindscrolltolower?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
   bindscroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
@@ -148,6 +149,7 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
     'wait-for': waitFor,
     'enable-sticky': enableSticky,
     'scroll-event-throttle': scrollEventThrottle = 0,
+    'scroll-into-view-offset': scrollIntoViewOffset = 0,
     __selectRef
   } = props
 
@@ -184,7 +186,7 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
   const initialTimeout = useRef<ReturnType<typeof setTimeout> | null>(null)
   const intersectionObservers = useContext(IntersectionObserverContext)
 
-  const firstScrollIntoViewChange = useRef<boolean>(false)
+  const firstScrollIntoViewChange = useRef<boolean>(true)
 
   const refreshColor = {
     black: ['#000'],
@@ -216,7 +218,8 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
       pagingEnabled,
       fastDeceleration: false,
       decelerationDisabled: false,
-      scrollTo
+      scrollTo,
+      scrollIntoView: handleScrollIntoView
     },
     gestureRef: scrollViewRef
   })
@@ -255,13 +258,15 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
 
   useEffect(() => {
     if (scrollIntoView && __selectRef) {
-      if (!firstScrollIntoViewChange.current) {
-        setTimeout(handleScrollIntoView)
+      if (firstScrollIntoViewChange.current) {
+        setTimeout(() => {
+          handleScrollIntoView(scrollIntoView, { offset: scrollIntoViewOffset, animated: scrollWithAnimation })
+        })
       } else {
-        handleScrollIntoView()
+        handleScrollIntoView(scrollIntoView, { offset: scrollIntoViewOffset, animated: scrollWithAnimation })
       }
     }
-    firstScrollIntoViewChange.current = true
+    firstScrollIntoViewChange.current = false
   }, [scrollIntoView])
 
   useEffect(() => {
@@ -284,14 +289,16 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
     scrollToOffset(left, top, animated)
   }
 
-  function handleScrollIntoView () {
-    const refs = __selectRef!(`#${scrollIntoView}`, 'node')
+  function handleScrollIntoView (selector = '', { offset = 0, animated = true } = {}) {
+    const refs = __selectRef!(`#${selector}`, 'node')
     if (!refs) return
     const { nodeRef } = refs.getNodeInstance()
     nodeRef.current?.measureLayout(
       scrollViewRef.current,
       (left: number, top: number) => {
-        scrollToOffset(left, top)
+        const adjustedLeft = scrollX ? left + offset : left
+        const adjustedTop = scrollY ? top + offset : top
+        scrollToOffset(adjustedLeft, adjustedTop, animated)
       }
     )
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.10.4-beta.16",
+  "version": "2.10.4-beta.18",
   "description": "mpx compile core",
   "keywords": [
     "mpx"