@mpxjs/webpack-plugin 2.9.69-beta.1 → 2.9.69-beta.10

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

@@ -10,7 +10,7 @@ import useInnerProps from './getInnerListeners';
 import Animated from 'react-native-reanimated';
 import useAnimationHooks from './useAnimationHooks';
 import useNodesRef from './useNodesRef';
-import { parseUrl, PERCENT_REGEX, splitStyle, splitProps, useTransformStyle, wrapChildren, useLayout, renderImage, pickStyle, extendObject, useHoverStyle } from './utils';
+import { parseUrl, PERCENT_REGEX, splitStyle, splitProps, useTransformStyle, wrapChildren, useLayout, renderImage, pickStyle, extendObject, useHover } from './utils';
 import { error } from '@mpxjs/utils';
 import LinearGradient from 'react-native-linear-gradient';
 import { GestureDetector } from 'react-native-gesture-handler';
@@ -442,7 +442,7 @@ function inheritStyle(innerStyle = {}) {
         }
         : undefined);
 }
-function wrapImage(imageStyle, innerStyle, enableFastImage) {
+function useWrapImage(imageStyle, innerStyle, enableFastImage) {
     // 预处理数据
     const preImageInfo = preParseImage(imageStyle);
     // 预解析
@@ -535,7 +535,8 @@ function wrapWithChildren(props, { hasVarDec, enableBackground, textStyle, backg
         textProps
     });
     return [
-        enableBackground ? wrapImage(backgroundStyle, innerStyle, enableFastImage) : null,
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        enableBackground ? useWrapImage(backgroundStyle, innerStyle, enableFastImage) : null,
         children
     ];
 }
@@ -551,7 +552,8 @@ const _View = forwardRef((viewProps, ref) => {
             flexWrap: 'nowrap'
         }
         : {};
-    const { isHover, enableHoverStyle, gesture } = useHoverStyle({ hoverStyle, hoverStartTime, hoverStayTime });
+    const enableHover = !!hoverStyle;
+    const { isHover, gesture } = useHover({ enableHover, hoverStartTime, hoverStayTime });
     const styleObj = extendObject({}, defaultStyle, style, isHover ? hoverStyle : {});
     const { normalStyle, hasSelfPercent, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(styleObj, {
         enableVar,
@@ -572,20 +574,14 @@ const _View = forwardRef((viewProps, ref) => {
     });
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
     const viewStyle = extendObject({}, innerStyle, layoutStyle);
-    enableAnimation = enableAnimation || !!animation;
-    const enableAnimationRef = useRef(enableAnimation);
-    if (enableAnimationRef.current !== enableAnimation) {
-        error('[Mpx runtime error]: animation use should be stable in the component lifecycle, or you can set [enable-animation] with true.');
-    }
-    const finalStyle = enableAnimationRef.current
-        ? [viewStyle, useAnimationHooks({
-                animation,
-                style: viewStyle
-            })]
-        : viewStyle;
+    const { enableStyleAnimation, animationStyle } = useAnimationHooks({
+        enableAnimation,
+        animation,
+        style: viewStyle
+    });
     const innerProps = useInnerProps(props, extendObject({
         ref: nodeRef,
-        style: finalStyle
+        style: enableStyleAnimation ? [viewStyle, animationStyle] : viewStyle
     }, layoutProps), [
         'hover-start-time',
         'hover-stay-time',
@@ -604,11 +600,11 @@ const _View = forwardRef((viewProps, ref) => {
         innerStyle,
         enableFastImage
     });
-    const BaseComponent = enableAnimation
-        ? createElement(Animated.View, extendObject({}, innerProps, { style: finalStyle }), childNode)
+    const BaseComponent = enableStyleAnimation
+        ? createElement(Animated.View, innerProps, childNode)
         : createElement(View, innerProps, childNode);
-    return enableHoverStyle
-        ? createElement(GestureDetector, { gesture }, BaseComponent)
+    return enableHover
+        ? createElement(GestureDetector, { gesture: gesture }, BaseComponent)
         : BaseComponent;
 });
 _View.displayName = 'MpxView';

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

@@ -1,22 +1,61 @@
-import { forwardRef, useRef, useContext, useMemo, createElement, useCallback, useEffect } from 'react';
-import { warn, getFocusedNavigation, isFunction } from '@mpxjs/utils';
-import { Portal } from '@ant-design/react-native';
+import { forwardRef, useRef, useContext, useMemo, useState, useCallback, useEffect } from 'react';
+import { warn, isFunction } from '@mpxjs/utils';
+import Portal from './mpx-portal';
 import { getCustomEvent } from './getInnerListeners';
 import { promisify, redirectTo, navigateTo, navigateBack, reLaunch, switchTab } from '@mpxjs/api-proxy';
 import { WebView } from 'react-native-webview';
 import useNodesRef from './useNodesRef';
-import { getCurrentPage, extendObject } from './utils';
+import { getCurrentPage } from './utils';
+import { useNavigation } from '@react-navigation/native';
 import { RouteContext } from './context';
-import { BackHandler } from 'react-native';
+import { BackHandler, StyleSheet, View, Text } from 'react-native';
+const styles = StyleSheet.create({
+    loadErrorContext: {
+        display: 'flex',
+        alignItems: 'center'
+    },
+    loadErrorText: {
+        fontSize: 12,
+        color: '#666666',
+        paddingTop: '40%',
+        paddingBottom: 20,
+        paddingLeft: '10%',
+        paddingRight: '10%',
+        textAlign: 'center'
+    },
+    loadErrorButton: {
+        color: '#666666',
+        textAlign: 'center',
+        padding: 10,
+        borderColor: '#666666',
+        borderStyle: 'solid',
+        borderWidth: StyleSheet.hairlineWidth,
+        borderRadius: 10
+    }
+});
 const _WebView = forwardRef((props, ref) => {
     const { src, bindmessage, bindload, binderror } = props;
     const mpx = global.__mpx;
+    const errorText = {
+        'zh-CN': {
+            text: '网络不可用，请检查网络设置',
+            button: '重新加载'
+        },
+        'en-US': {
+            text: 'The network is not available. Please check the network settings',
+            button: 'Reload'
+        }
+    };
+    const currentErrorText = errorText[mpx.i18n.locale || 'zh-CN'];
     if (props.style) {
         warn('The web-view component does not support the style prop.');
     }
     const pageId = useContext(RouteContext);
+    const [pageLoadErr, setPageLoadErr] = useState(false);
     const currentPage = useMemo(() => getCurrentPage(pageId), [pageId]);
     const webViewRef = useRef(null);
+    const [isLoaded, setIsLoaded] = useState(true);
+    const fristLoaded = useRef(false);
     const defaultWebViewStyle = {
         position: 'absolute',
         left: 0,
@@ -25,6 +64,7 @@ const _WebView = forwardRef((props, ref) => {
         bottom: 0
     };
     const canGoBack = useRef(false);
+    const isNavigateBack = useRef(false);
     const onAndroidBackPress = useCallback(() => {
         if (canGoBack.current) {
             webViewRef.current?.goBack();
@@ -33,20 +73,27 @@ const _WebView = forwardRef((props, ref) => {
         return false;
     }, [canGoBack]);
     const beforeRemoveHandle = useCallback((e) => {
-        if (canGoBack.current) {
+        if (canGoBack.current && !isNavigateBack.current) {
             webViewRef.current?.goBack();
             e.preventDefault();
         }
+        isNavigateBack.current = false;
     }, [canGoBack]);
-    const navigation = getFocusedNavigation();
-    navigation?.addListener('beforeRemove', beforeRemoveHandle);
+    const navigation = useNavigation();
     useEffect(() => {
         if (__mpx_mode__ === 'android') {
             BackHandler.addEventListener('hardwareBackPress', onAndroidBackPress);
-            return () => {
-                BackHandler.removeEventListener('hardwareBackPress', onAndroidBackPress);
-            };
         }
+        const addListener = navigation?.addListener.bind(navigation);
+        const beforeRemoveSubscription = addListener?.('beforeRemove', beforeRemoveHandle);
+        return () => {
+            if (__mpx_mode__ === 'android') {
+                BackHandler.removeEventListener('hardwareBackPress', onAndroidBackPress);
+            }
+            if (isFunction(beforeRemoveSubscription)) {
+                beforeRemoveSubscription();
+            }
+        };
     }, []);
     useNodesRef(props, ref, webViewRef, {
         style: defaultWebViewStyle
@@ -54,25 +101,11 @@ const _WebView = forwardRef((props, ref) => {
     if (!src) {
         return null;
     }
-    const _load = function (res) {
-        const result = {
-            type: 'load',
-            timeStamp: res.timeStamp,
-            detail: {
-                src: res.nativeEvent?.url
-            }
-        };
-        bindload(result);
-    };
-    const _error = function (res) {
-        const result = {
-            type: 'error',
-            timeStamp: res.timeStamp,
-            detail: {
-                src: ''
-            }
-        };
-        binderror(result);
+    const _reload = function () {
+        if (__mpx_mode__ === 'android') {
+            fristLoaded.current = false; // 安卓需要重新设置
+        }
+        setPageLoadErr(false);
     };
     const injectedJavaScript = `
     if (window.ReactNativeWebView && window.ReactNativeWebView.postMessage) {
@@ -102,7 +135,7 @@ const _WebView = forwardRef((props, ref) => {
   `;
     const sendMessage = function (params) {
         return `
-      window.mpxWebviewMessageCallback(${params})
+      window.mpxWebviewMessageCallback && window.mpxWebviewMessageCallback(${params})
       true;
     `;
     };
@@ -155,6 +188,7 @@ const _WebView = forwardRef((props, ref) => {
                 asyncCallback = navObj.navigateTo(...params);
                 break;
             case 'navigateBack':
+                isNavigateBack.current = true;
                 asyncCallback = navObj.navigateBack(...params);
                 break;
             case 'redirectTo':
@@ -201,28 +235,70 @@ const _WebView = forwardRef((props, ref) => {
             }
         });
     };
-    const events = {};
-    if (bindload) {
-        extendObject(events, {
-            onLoad: _load
-        });
-    }
-    if (binderror) {
-        extendObject(events, {
-            onError: _error
-        });
-    }
-    return createElement(Portal, null, createElement(WebView, extendObject({
-        style: defaultWebViewStyle,
-        source: { uri: src },
-        ref: webViewRef,
-        javaScriptEnabled: true,
-        onNavigationStateChange: _changeUrl,
-        onMessage: _message,
-        injectedJavaScript: injectedJavaScript,
-        onLoadProgress: _onLoadProgress,
-        allowsBackForwardNavigationGestures: true
-    }, events)));
+    let isLoadError = false;
+    let statusCode = '';
+    const onLoadEndHandle = function (res) {
+        fristLoaded.current = true;
+        setIsLoaded(true);
+        const src = res.nativeEvent?.url;
+        if (isLoadError) {
+            isLoadError = false;
+            isNavigateBack.current = false;
+            const result = {
+                type: 'error',
+                timeStamp: res.timeStamp,
+                detail: {
+                    src,
+                    statusCode
+                }
+            };
+            binderror && binderror(result);
+        }
+        else {
+            const result = {
+                type: 'load',
+                timeStamp: res.timeStamp,
+                detail: {
+                    src
+                }
+            };
+            bindload?.(result);
+        }
+    };
+    const onLoadEnd = function (res) {
+        if (__mpx_mode__ === 'android') {
+            setTimeout(() => {
+                onLoadEndHandle(res);
+            }, 0);
+        }
+        else {
+            onLoadEndHandle(res);
+        }
+    };
+    const onHttpError = function (res) {
+        isLoadError = true;
+        statusCode = res.nativeEvent?.statusCode;
+    };
+    const onError = function () {
+        statusCode = '';
+        isLoadError = true;
+        if (!fristLoaded.current) {
+            setPageLoadErr(true);
+        }
+    };
+    const onLoadStart = function () {
+        if (!fristLoaded.current) {
+            setIsLoaded(false);
+        }
+    };
+    return (<Portal key={pageLoadErr ? 'error' : 'webview'}>
+        {pageLoadErr
+            ? (<View style={[styles.loadErrorContext, defaultWebViewStyle]}>
+              <View style={styles.loadErrorText}><Text style={{ fontSize: 14, color: '#999999' }}>{currentErrorText.text}</Text></View>
+              <View style={styles.loadErrorButton} onTouchEnd={_reload}><Text style={{ fontSize: 12, color: '#666666' }}>{currentErrorText.button}</Text></View>
+            </View>)
+            : (<WebView style={defaultWebViewStyle} source={{ uri: src }} pointerEvents={isLoaded ? 'auto' : 'none'} ref={webViewRef} javaScriptEnabled={true} onNavigationStateChange={_changeUrl} onMessage={_message} injectedJavaScript={injectedJavaScript} onLoadProgress={_onLoadProgress} onLoadEnd={onLoadEnd} onHttpError={onHttpError} onError={onError} onLoadStart={onLoadStart} allowsBackForwardNavigationGestures={true}></WebView>)}
+      </Portal>);
 });
 _WebView.displayName = 'MpxWebview';
 export default _WebView;

package/lib/runtime/components/react/dist/pickerFaces.js

@@ -30,9 +30,6 @@ export const createFaces = (itemHeight, visibleCount) => {
             for (let i = 0; i < index; i++) {
                 offset += freeSpaces[i];
             }
-            if (index === 0) {
-                offset *= 0.6;
-            }
             return offset;
         });
         return [screenHeights, offsets];
@@ -41,15 +38,13 @@ export const createFaces = (itemHeight, visibleCount) => {
         const map = {
             0: 0,
             1: 0.8,
-            2: 0.9 // 0.35
-            // 3: 0.45, // 0.45
-            // 4: 0.5 // 0.5
+            2: 0.9
         };
         return map[index] ?? Math.min(1, map[2] + index * 0.05);
     };
     const degrees = getDegreesRelativeCenter();
     const [screenHeight, offsets] = getScreenHeightsAndOffsets(degrees);
-    const scales = [1, 0.925, 0.8];
+    const scales = [0.973, 0.9, 0.8];
     return [
         // top items
         ...degrees

package/lib/runtime/components/react/dist/useAnimationHooks.js

@@ -1,12 +1,13 @@
 import { useEffect, useMemo, useRef } from 'react';
 import { Easing, useSharedValue, withTiming, useAnimatedStyle, withSequence, withDelay, makeMutable, cancelAnimation } from 'react-native-reanimated';
+import { error } from '@mpxjs/utils';
 // 微信 timingFunction 和 RN Easing 对应关系
 const EasingKey = {
     linear: Easing.linear,
-    ease: Easing.ease,
-    'ease-in': Easing.in(Easing.ease),
-    'ease-in-out': Easing.inOut(Easing.ease),
-    'ease-out': Easing.out(Easing.ease)
+    ease: Easing.inOut(Easing.ease),
+    'ease-in': Easing.in(Easing.poly(3)),
+    'ease-in-out': Easing.inOut(Easing.poly(3)),
+    'ease-out': Easing.out(Easing.poly(3))
     // 'step-start': '',
     // 'step-end': ''
 };
@@ -132,19 +133,29 @@ const formatStyle = (style) => {
     });
 };
 export default function useAnimationHooks(props) {
-    const { style = {}, animation } = props;
+    const { style = {}, animation, enableAnimation } = props;
+    const enableStyleAnimation = enableAnimation || !!animation;
+    const enableAnimationRef = useRef(enableStyleAnimation);
+    if (enableAnimationRef.current !== enableStyleAnimation) {
+        error('[Mpx runtime error]: animation use should be stable in the component lifecycle, or you can set [enable-animation] with true.');
+    }
+    if (!enableAnimationRef.current)
+        return { enableStyleAnimation: false };
     const originalStyle = formatStyle(style);
     // id 标识
     const id = animation?.id || -1;
     // 有动画样式的 style key
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     const animatedStyleKeys = useSharedValue([]);
     // 记录动画key的style样式值 没有的话设置为false
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     const animatedKeys = useRef({});
     // const animatedKeys = useRef({} as {[propName: keyof ExtendedViewStyle]: boolean|number|string})
     // ** 全量 style prop sharedValue
     // 不能做增量的原因：
     // 1 尝试用 useRef，但 useAnimatedStyle 访问后的 ref 不能在增加新的值，被冻结
     // 2 尝试用 useSharedValue，因为实际触发的 style prop 需要是 sharedValue 才能驱动动画，若外层 shareValMap 也是 sharedValue，动画无法驱动。
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     const shareValMap = useMemo(() => {
         return Object.keys(InitialValue).reduce((valMap, key) => {
             const defaultVal = getInitialVal(key, isTransform(key));
@@ -153,6 +164,7 @@ export default function useAnimationHooks(props) {
         }, {});
     }, []);
     // ** 获取动画样式prop & 驱动动画
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     useEffect(() => {
         if (id === -1)
             return;
@@ -174,6 +186,7 @@ export default function useAnimationHooks(props) {
     //   })
     // }, [style])
     // ** 清空动画
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     useEffect(() => {
         return () => {
             Object.values(shareValMap).forEach((value) => {
@@ -206,14 +219,13 @@ export default function useAnimationHooks(props) {
             }
             // 添加每个key的多次step动画
             animatedKeys.forEach(key => {
+                const ruleV = isTransform(key) ? transform.get(key) : rules.get(key);
                 // key不存在，第一轮取shareValMap[key]value，非第一轮取上一轮的
-                const toVal = rules.get(key) !== undefined
-                    ? rules.get(key)
-                    : transform.get(key) !== undefined
-                        ? transform.get(key)
-                        : index > 0
-                            ? lastValueMap[key]
-                            : shareValMap[key].value;
+                const toVal = ruleV !== undefined
+                    ? ruleV
+                    : index > 0
+                        ? lastValueMap[key]
+                        : shareValMap[key].value;
                 const animation = getAnimation({ key, value: toVal }, { delay, duration, easing }, needSetCallback ? setTransformOrigin : undefined);
                 needSetCallback = false;
                 if (!sequence[key]) {
@@ -307,7 +319,8 @@ export default function useAnimationHooks(props) {
         }, {});
     }
     // ** 生成动画样式
-    return useAnimatedStyle(() => {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const animationStyle = useAnimatedStyle(() => {
         // console.info(`useAnimatedStyle styles=`, originalStyle)
         return animatedStyleKeys.value.reduce((styles, key) => {
             // console.info('getAnimationStyles', key, shareValMap[key].value)
@@ -326,4 +339,8 @@ export default function useAnimationHooks(props) {
             return styles;
         }, {});
     });
+    return {
+        enableStyleAnimation: enableAnimationRef.current,
+        animationStyle
+    };
 }

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

@@ -451,13 +451,14 @@ export function wrapChildren(props = {}, { hasVarDec, varContext, textStyle, tex
 export const debounce = (func, delay) => {
     let timer;
     const wrapper = (...args) => {
-        clearTimeout(timer);
+        timer && clearTimeout(timer);
         timer = setTimeout(() => {
             func(...args);
         }, delay);
     };
     wrapper.clear = () => {
-        clearTimeout(timer);
+        timer && clearTimeout(timer);
+        timer = null;
     };
     return wrapper;
 };
@@ -558,3 +559,60 @@ export function useHoverStyle({ hoverStyle, hoverStartTime, hoverStayTime, disab
         enableHoverStyle
     };
 }
+export function useHover({ enableHover, hoverStartTime, hoverStayTime, disabled }) {
+    const enableHoverRef = useRef(enableHover);
+    if (enableHoverRef.current !== enableHover) {
+        error('[Mpx runtime error]: hover-class use should be stable in the component lifecycle.');
+    }
+    if (!enableHoverRef.current)
+        return { isHover: false };
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const gestureRef = useContext(ScrollViewContext).gestureRef;
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const [isHover, setIsHover] = useState(false);
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const dataRef = useRef({});
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useEffect(() => {
+        return () => {
+            dataRef.current.startTimer && clearTimeout(dataRef.current.startTimer);
+            dataRef.current.stayTimer && clearTimeout(dataRef.current.stayTimer);
+        };
+    }, []);
+    const setStartTimer = () => {
+        if (disabled)
+            return;
+        dataRef.current.startTimer && clearTimeout(dataRef.current.startTimer);
+        dataRef.current.startTimer = setTimeout(() => {
+            setIsHover(true);
+        }, +hoverStartTime);
+    };
+    const setStayTimer = () => {
+        if (disabled)
+            return;
+        dataRef.current.stayTimer && clearTimeout(dataRef.current.stayTimer);
+        dataRef.current.startTimer && clearTimeout(dataRef.current.startTimer);
+        dataRef.current.stayTimer = setTimeout(() => {
+            setIsHover(false);
+        }, +hoverStayTime);
+    };
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const gesture = useMemo(() => {
+        return Gesture.Pan()
+            .onTouchesDown(() => {
+            'worklet';
+            runOnJS(setStartTimer)();
+        })
+            .onTouchesUp(() => {
+            'worklet';
+            runOnJS(setStayTimer)();
+        });
+    }, []);
+    if (gestureRef) {
+        gesture.simultaneousWithExternalGesture(gestureRef);
+    }
+    return {
+        isHover,
+        gesture
+    };
+}

package/lib/runtime/components/react/getInnerListeners.ts

@@ -126,8 +126,8 @@ function checkIsNeedPress (e: NativeTouchEvent, type: 'bubble' | 'capture', ref:
   const currentPageX = nativeEvent.changedTouches[0].pageX
   const currentPageY = nativeEvent.changedTouches[0].pageY
   if (
-    Math.abs(currentPageX - tapDetailInfo.x) > 1 ||
-        Math.abs(currentPageY - tapDetailInfo.y) > 1
+    Math.abs(currentPageX - tapDetailInfo.x) > 3 ||
+        Math.abs(currentPageY - tapDetailInfo.y) > 3
   ) {
     ref.current!.needPress[type] = false
     ref.current!.startTimer[type] &&

package/lib/runtime/components/react/locale-provider.tsx

@@ -0,0 +1,83 @@
+import { createContext, useMemo, memo, ReactNode } from 'react'
+import { extendObject } from './utils'
+
+interface Locale {
+  /** zh_CN */
+  locale: string
+  DatePicker: {
+    /** 确定 */
+    okText: string
+    /** 取消 */
+    dismissText: string
+    /** 请选择 */
+    extra: string
+    DatePickerLocale: {
+      /** 年 */
+      year: string
+      /** 月 */
+      month: string
+      /** 日 */
+      day: string
+      /** 时 */
+      hour: string
+      /** 分 */
+      minute: string
+      /** 上午 */
+      am: string
+      /** 下午 */
+      pm: string
+    }
+  }
+  DatePickerView: {
+    /** 年 */
+    year: string
+    /** 月 */
+    month: string
+    /** 日 */
+    day: string
+    /** 时 */
+    hour: string
+    /** 分 */
+    minute: string
+    /** 上午 */
+    am: string
+    /** 下午 */
+    pm: string
+  }
+  Picker: {
+    /** 确定 */
+    okText: string
+    /** 取消 */
+    dismissText: string
+    /** 请选择 */
+    extra: string
+  }
+}
+export type LocaleContextProps = {
+  antLocale: Partial<Locale & { exist: boolean }>
+}
+export interface LocaleProviderProps {
+  children?: ReactNode,
+  locale?: LocaleContextProps
+}
+
+export const LocaleContext = createContext<
+  LocaleContextProps | undefined
+>(undefined)
+
+const LocaleProvider = (props :LocaleProviderProps): JSX.Element => {
+  const locale = useMemo(() => {
+    return {
+      antLocale: extendObject({}, props.locale, { exist: true })
+    }
+  }, [props.locale])
+  return (
+    <LocaleContext.Provider value={locale}>
+      {props.children}
+    </LocaleContext.Provider>
+  )
+}
+
+LocaleProvider.displayName = 'LocaleProvider'
+
+export default memo(LocaleProvider)