From cf9fb225b0d840fedae02fb4303ea7c807444eb6 Mon Sep 17 00:00:00 2001
From: wangshunnn <wangshunnn@gmail.com>
Date: Tue, 26 Nov 2024 17:02:49 +0800
Subject: [PATCH] fix: picker overlay

---
 .../react/mpx-picker-view-column.tsx           |  2 +-
 .../runtime/components/react/pickerOverlay.tsx | 18 ++++++++++++------
 .../lib/runtime/components/react/utils.tsx     |  7 +++----
 3 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx
index c5f5413d8..078aa0e47 100644
--- a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx
+++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx
@@ -70,7 +70,7 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
 
   const pickerItemH = useMemo(
     () => {
-      const match = (itemHeight + '').match(/^(\d+)px$/) || [0]
+      const match = (itemHeight + '').match(/\d+/g) || [0]
       return +match[0] || DefaultPickerItemH
     },
     [itemHeight]
diff --git a/packages/webpack-plugin/lib/runtime/components/react/pickerOverlay.tsx b/packages/webpack-plugin/lib/runtime/components/react/pickerOverlay.tsx
index 4a646028b..9400a19a7 100644
--- a/packages/webpack-plugin/lib/runtime/components/react/pickerOverlay.tsx
+++ b/packages/webpack-plugin/lib/runtime/components/react/pickerOverlay.tsx
@@ -7,18 +7,24 @@ type OverlayProps = {
   overlayContainerStyle?: ViewStyle
 }
 
-const Overlay = ({ itemHeight, overlayItemStyle, overlayContainerStyle }: OverlayProps) => {
-  const itemWidth = overlayItemStyle?.width
-  if (typeof itemWidth === 'string') {
-    const match = itemWidth.match(/^(\d+)px$/)
+const transPx2Number = (value?: string | number) => {
+  if (typeof value === 'string') {
+    const match = value.toString().match(/\d+/g)
     if (match) {
-      overlayItemStyle!.width = +match[1]
+      return +match[0]
     }
   }
+  return value
+}
+
+const Overlay = ({ itemHeight, overlayItemStyle, overlayContainerStyle }: OverlayProps) => {
+  let { width, borderRadius, ...restStyle } = overlayItemStyle || {}
+  width = transPx2Number(width)
+  borderRadius = transPx2Number(borderRadius)
   return (
     <View style={[styles.overlayContainer, overlayContainerStyle]} pointerEvents={'none'}>
       <View
-        style={[{ height: itemHeight }, styles.selection, overlayItemStyle]}
+        style={[styles.selection, { height: itemHeight, width, borderRadius }, restStyle]}
       />
     </View>
   )
diff --git a/packages/webpack-plugin/lib/runtime/components/react/utils.tsx b/packages/webpack-plugin/lib/runtime/components/react/utils.tsx
index 73906ad88..bf0f3612a 100644
--- a/packages/webpack-plugin/lib/runtime/components/react/utils.tsx
+++ b/packages/webpack-plugin/lib/runtime/components/react/utils.tsx
@@ -563,10 +563,9 @@ export const useStableCallback = <T extends AnyFunc | null | undefined>(
 
 export const usePrevious = <T, >(value: T): T | undefined => {
   const ref = useRef<T | undefined>(undefined)
-  useEffect(() => {
-    ref.current = value
-  })
-  return ref.current
+  const prev = ref.current
+  ref.current = value
+  return prev
 }
 
 export interface GestureHandler {