@hero-design/rn 8.24.0-alpha.1 → 8.25.0

package/.turbo/turbo-build.log

@@ -1,9 +1,9 @@
-@hero-design/rn:build: cache hit, replaying output 8983885250e58031
-@hero-design/rn:build: $ yarn build:js && yarn build:types
-@hero-design/rn:build: $ rollup -c
-@hero-design/rn:build: 
-@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
-@hero-design/rn:build: (!) Plugin replace: @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
-@hero-design/rn:build: (!) Plugin node-resolve: preferring built-in module 'events' over local alternative at '/Volumes/Data/Projects/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
-@hero-design/rn:build: created lib/index.js, es/index.js in 30.6s
-@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly --project tsconfig.prod.json
+@hero-design/rn:build: cache hit, replaying output b28cdc306082cd71
+@hero-design/rn:build: $ yarn build:js && yarn build:types
+@hero-design/rn:build: $ rollup -c
+@hero-design/rn:build: 
+@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
+@hero-design/rn:build: (!) Plugin replace: @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
+@hero-design/rn:build: (!) Plugin node-resolve: preferring built-in module 'events' over local alternative at '/root/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
+@hero-design/rn:build: created lib/index.js, es/index.js in 27.2s
+@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly --project tsconfig.prod.json

package/.turbo/turbo-publish:npm.log

@@ -1,9 +0,0 @@
-@hero-design/rn:publish:npm: cache hit, replaying output 507c34f3e0a508f6
-@hero-design/rn:publish:npm: $ yarn publish --access public
-@hero-design/rn:publish:npm: [1/4] Bumping version...
-@hero-design/rn:publish:npm: info Current version: 8.12.0-rc.0
-@hero-design/rn:publish:npm: [2/4] Logging in...
-@hero-design/rn:publish:npm: [3/4] Publishing...
-@hero-design/rn:publish:npm: success Published.
-@hero-design/rn:publish:npm: [4/4] Revoking token...
-@hero-design/rn:publish:npm: info Not revoking login token, specified via config file.

package/es/index.js

@@ -981,9 +981,9 @@ var blue$1 = colorScales.blue,
   purple$1 = colorScales.purple,
   vermilion$3 = colorScales.vermilion,
   smalt = colorScales.smalt,
-  violet$1 = colorScales.violet,
+  violet$2 = colorScales.violet,
   yellow$1 = colorScales.yellow;
-({
+var palette$b = {
   black: '#000000',
   white: '#ffffff',
   blue: blue$1.base,
@@ -1058,21 +1058,38 @@ var blue$1 = colorScales.blue,
   smaltLight45: smalt.lighten45,
   smaltLight75: smalt.lighten75,
   smaltLight90: smalt.lighten90,
-  violet: violet$1.base,
-  violetDark15: violet$1.darken15,
-  violetDark30: violet$1.darken30,
-  violetDark45: violet$1.darken45,
-  violetDark60: violet$1.darken60,
-  violetDark75: violet$1.darken75,
-  violetLight30: violet$1.lighten30,
-  violetLight60: violet$1.lighten60,
-  violetLight75: violet$1.lighten75,
-  violetLight90: violet$1.lighten90,
+  violet: violet$2.base,
+  violetDark15: violet$2.darken15,
+  violetDark30: violet$2.darken30,
+  violetDark45: violet$2.darken45,
+  violetDark60: violet$2.darken60,
+  violetDark75: violet$2.darken75,
+  violetLight30: violet$2.lighten30,
+  violetLight60: violet$2.lighten60,
+  violetLight75: violet$2.lighten75,
+  violetLight90: violet$2.lighten90,
   yellow: yellow$1.base,
   yellowDark15: yellow$1.darken15,
   yellowDark75: yellow$1.darken75,
   yellowLight60: yellow$1.lighten60,
   yellowLight90: yellow$1.lighten90
+};
+var mauve$4 = colorScales.mauve,
+  violet$1 = colorScales.violet;
+Object.assign(Object.assign({}, palette$b), {
+  mauve: mauve$4.base,
+  mauveLight80: mauve$4.lighten80,
+  violetDark50: violet$1.darken50
+});
+var apple$4 = colorScales.apple,
+  hitPink$1 = colorScales.hitPink;
+Object.assign(Object.assign({}, palette$b), {
+  apple: apple$4.base,
+  appleDark20: apple$4.darken20,
+  appleDark50: apple$4.darken50,
+  appleLight90: apple$4.lighten90,
+  hitPink: hitPink$1.base,
+  hitPinkLight80: hitPink$1.lighten80
 });
 var aliceBlue$1 = colorScales.aliceBlue,
   antiFlashWhite$1 = colorScales.antiFlashWhite,
@@ -1239,7 +1256,7 @@ var currant$1 = colorScales.currant,
   vermilion = colorScales.vermilion,
   mauve$3 = colorScales.mauve,
   violet1$3 = colorScales.violet1,
-  violet$2 = colorScales.violet,
+  violet$3 = colorScales.violet,
   scarletGum$2 = colorScales.scarletGum;
 var palette$6 = {
   currant: currant$1.base,
@@ -1258,9 +1275,9 @@ var palette$6 = {
   pastelRed: pastelRed.base,
   vermilion: vermilion.base,
   mauve: mauve$3.base,
-  violetLight30: violet$2.lighten30,
+  violetLight30: violet$3.lighten30,
   violet1: violet1$3.base,
-  violet: violet$2.base,
+  violet: violet$3.base,
   scarletGum: scarletGum$2.base
 };
 var violet1$2 = colorScales.violet1,
@@ -2240,12 +2257,17 @@ var getErrorTheme = function getErrorTheme(theme) {
     title: theme.fonts.playful.semiBold,
     description: theme.fonts.playful.regular
   };
+  var lineHeight = {
+    title: theme.lineHeights.xxxlarge,
+    description: theme.lineHeights.xlarge
+  };
   return {
     fontSizes: fontSizes,
     colors: colors,
     sizes: sizes,
     space: space,
-    fonts: fonts
+    fonts: fonts,
+    lineHeight: lineHeight
   };
 };
 
@@ -11289,6 +11311,7 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setFlatListWidth = _useState4[1];
   var itemWidth = flatListWidth * ITEM_WIDTH_RATE;
   var carouselRef = useRef(null);
+  var viewPosition = Platform.OS === 'ios' ? VIEW_POSITION_CENTER : undefined;
   var _snapToIndex = useCallback(function (index) {
     var _carouselRef$current;
     var validIndex = 0;
@@ -11302,7 +11325,7 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
     (_carouselRef$current = carouselRef.current) === null || _carouselRef$current === void 0 ? void 0 : _carouselRef$current.scrollToIndex({
       index: validIndex,
       animated: true,
-      viewPosition: VIEW_POSITION_CENTER
+      viewPosition: viewPosition
     });
   }, [carouselRef, itemWidth]);
   /*
@@ -11317,7 +11340,7 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
     (_carouselRef$current2 = carouselRef.current) === null || _carouselRef$current2 === void 0 ? void 0 : _carouselRef$current2.scrollToIndex({
       index: nextIndex,
       animated: true,
-      viewPosition: VIEW_POSITION_CENTER
+      viewPosition: viewPosition
     });
   }, [carouselRef, currentIndex, itemWidth, items.length]);
   React.useImperativeHandle(ref, function () {
@@ -11372,16 +11395,31 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
       }
     }, /*#__PURE__*/React.createElement(StyledShadow, null, /*#__PURE__*/React.createElement(StyledCard, null, item)));
   }, [itemWidth]);
+  var contentContainerPaddingHorizontal = theme.__hd__.cardCarousel.space.contentContainerPaddingHorizontal;
   return /*#__PURE__*/React.createElement(StyledWrapper$7, {
     style: style,
     testID: testID
   }, /*#__PURE__*/React.createElement(FlatList, {
     contentInset: {
       top: 0,
-      left: theme.__hd__.cardCarousel.space.contentContainerPaddingHorizontal,
+      left: contentContainerPaddingHorizontal,
       bottom: 0,
-      right: theme.__hd__.cardCarousel.space.contentContainerPaddingHorizontal
+      right: contentContainerPaddingHorizontal
     },
+    ListHeaderComponent: Platform.select({
+      android: /*#__PURE__*/React.createElement(View, {
+        style: {
+          width: contentContainerPaddingHorizontal
+        }
+      })
+    }),
+    ListFooterComponent: Platform.select({
+      android: /*#__PURE__*/React.createElement(View, {
+        style: {
+          width: contentContainerPaddingHorizontal
+        }
+      })
+    }),
     onLayout: flatListOnLayout,
     data: items,
     horizontal: true,
@@ -11398,7 +11436,9 @@ var CardCarousel = /*#__PURE__*/forwardRef(function (_ref, ref) {
     },
     decelerationRate: "fast",
     renderToHardwareTextureAndroid: true,
-    snapToInterval: itemWidth,
+    snapToInterval: Platform.select({
+      ios: itemWidth
+    }),
     onViewableItemsChanged: visibleSlideChanged,
     viewabilityConfig: {
       itemVisiblePercentThreshold: 80
@@ -12667,7 +12707,8 @@ var StyledErrorTitle = index$a(Typography.Text)(function (_ref8) {
     fontSize: theme.__hd__.error.fontSizes.title,
     textAlign: 'center',
     marginBottom: theme.__hd__.error.space.titleMarginBottom,
-    color: theme.__hd__.error.colors.title
+    color: theme.__hd__.error.colors.title,
+    lineHeight: theme.__hd__.error.lineHeight.title
   };
 });
 var StyledErrorDescription = index$a(Typography.Text)(function (_ref9) {
@@ -12676,7 +12717,8 @@ var StyledErrorDescription = index$a(Typography.Text)(function (_ref9) {
     fontFamily: theme.__hd__.error.fonts.description,
     fontSize: theme.__hd__.error.fontSizes.description,
     textAlign: 'center',
-    color: theme.__hd__.error.colors.description
+    color: theme.__hd__.error.colors.description,
+    lineHeight: theme.__hd__.error.lineHeight.description
   };
 });
 
@@ -13901,7 +13943,7 @@ var AnimatedSpinner = function AnimatedSpinner(_ref) {
       toValue: 1,
       duration: 1200,
       easing: Easing.linear,
-      useNativeDriver: true
+      useNativeDriver: Platform.OS !== 'web'
     }));
     animation.start();
     return function () {
@@ -14938,7 +14980,7 @@ var StyledSuccessModal = index$a(Modal)({
   width: '100%'
 });
 
-var _excluded$2 = ["variant", "title", "description", "image", "testID", "ctaText", "onCtaPress"];
+var _excluded$2 = ["variant", "title", "description", "image", "testID", "ctaText", "onCtaPress", "secondaryCtaText", "onSecondaryCtaPress"];
 var renderImage = function renderImage(image) {
   if ( /*#__PURE__*/isValidElement(image)) {
     return /*#__PURE__*/React.cloneElement(image, {
@@ -14962,13 +15004,20 @@ var SuccessPage = function SuccessPage(_ref) {
     ctaText = _ref.ctaText,
     _ref$onCtaPress = _ref.onCtaPress,
     onCtaPress = _ref$onCtaPress === void 0 ? noop$1 : _ref$onCtaPress,
+    secondaryCtaText = _ref.secondaryCtaText,
+    onSecondaryCtaPress = _ref.onSecondaryCtaPress,
     nativeProps = _objectWithoutProperties(_ref, _excluded$2);
+  var showSecondaryButton = secondaryCtaText && onSecondaryCtaPress;
   return /*#__PURE__*/React.createElement(StyledSuccessContainer, _extends$1({
     testID: testID,
     themeVariant: variant
   }, nativeProps), /*#__PURE__*/React.createElement(StyledSuccessContent, null, !!image && /*#__PURE__*/React.createElement(StyledSuccessImageContainer, null, renderImage(image)), /*#__PURE__*/React.createElement(StyledSuccessTitle, null, title), !!description && /*#__PURE__*/React.createElement(StyledSuccessDescription, null, description)), !!ctaText && /*#__PURE__*/React.createElement(StyledSuccessButtonContainer, null, /*#__PURE__*/React.createElement(StyledSuccessButtonPrimary, {
     text: ctaText,
     onPress: onCtaPress
+  }), !!showSecondaryButton && /*#__PURE__*/React.createElement(StyledSuccessButtonPrimary, {
+    variant: "text",
+    text: secondaryCtaText,
+    onPress: onSecondaryCtaPress
   })));
 };
 /**
@@ -15183,7 +15232,7 @@ var HeaderTabItem$1 = index$a(View)(function (_ref2) {
 var ContentWrapper$1 = index$a(AnimatedPagerView)({
   flex: 1
 });
-var TabScreen$1 = index$a(View)({
+index$a(View)({
   flex: 1
 });
 var StyledIndicator = index$a(Animated.View)(function (_ref3) {
@@ -15272,6 +15321,48 @@ var HeaderTabItemWrapper = index$a(View)(function (_ref5) {
   };
 });
 
+var SceneView = function SceneView(_ref) {
+  var _ref$lazy = _ref.lazy,
+    lazy = _ref$lazy === void 0 ? false : _ref$lazy,
+    _ref$lazyPreloadDista = _ref.lazyPreloadDistance,
+    lazyPreloadDistance = _ref$lazyPreloadDista === void 0 ? 1 : _ref$lazyPreloadDista,
+    children = _ref.children,
+    index = _ref.index,
+    selectedIndex = _ref.selectedIndex,
+    testID = _ref.testID;
+  var _React$useState = React.useState(Math.abs(selectedIndex - index) > lazyPreloadDistance),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    isLoading = _React$useState2[0],
+    setIsLoading = _React$useState2[1];
+  var focused = index === selectedIndex;
+  if (isLoading && Math.abs(selectedIndex - index) <= lazyPreloadDistance) {
+    // Always render the route when it becomes focused
+    setIsLoading(false);
+  }
+  React.useEffect(function () {
+    var timer;
+    if (!lazy && isLoading) {
+      // If lazy mode is not enabled, render the scene with a delay if not loaded already
+      // This improves the initial startup time as the scene is no longer blocking
+      timer = setTimeout(function () {
+        return setIsLoading(false);
+      }, 0);
+    }
+    return function () {
+      clearTimeout(timer);
+    };
+  }, [index, isLoading, lazy, focused]);
+  return /*#__PURE__*/React.createElement(TabScreen, {
+    accessibilityElementsHidden: !focused,
+    importantForAccessibility: focused ? 'auto' : 'no-hide-descendants',
+    style: [{
+      flex: 1,
+      overflow: 'hidden'
+    }, focused ? StyleSheet$1.absoluteFill : null],
+    testID: testID
+  }, focused || !isLoading ? children : null);
+};
+
 var useAnimatedValueArray = function useAnimatedValueArray(initialValues) {
   var refs = React.useRef([]);
   refs.current.length = initialValues.length;
@@ -15442,121 +15533,6 @@ var ScrollableTabHeader = function ScrollableTabHeader(_ref2) {
   }));
 };
 
-var ScrollableTab$1 = function ScrollableTab(_ref) {
-  var onTabPress = _ref.onTabPress,
-    selectedTabKey = _ref.selectedTabKey,
-    tabs = _ref.tabs,
-    containerStyle = _ref.containerStyle,
-    barStyle = _ref.barStyle,
-    _ref$lazy = _ref.lazy,
-    lazy = _ref$lazy === void 0 ? false : _ref$lazy,
-    _ref$lazyPreloadDista = _ref.lazyPreloadDistance,
-    lazyPreloadDistance = _ref$lazyPreloadDista === void 0 ? 1 : _ref$lazyPreloadDista,
-    _ref$swipeEnabled = _ref.swipeEnabled,
-    swipeEnabled = _ref$swipeEnabled === void 0 ? true : _ref$swipeEnabled,
-    componentTestID = _ref.testID;
-  var pagerViewRef = React.useRef(null);
-  var insets = useSafeAreaInsets();
-  var selectedTabIndex = tabs.findIndex(function (item) {
-    return item.key === selectedTabKey;
-  });
-  React.useEffect(function () {
-    var timeoutHandle = null;
-    if (selectedTabIndex !== -1) {
-      // If the selected tab is changed too quickly, the setPage is crashed and not work anymore
-      // We apply throttle to prevent this issue https://github.com/Thinkei/hero-design/issues/1715
-      timeoutHandle = setTimeout(function () {
-        var _pagerViewRef$current;
-        // use no animation to prevent unexpected behavior if users select tab too quickly
-        (_pagerViewRef$current = pagerViewRef.current) === null || _pagerViewRef$current === void 0 ? void 0 : _pagerViewRef$current.setPageWithoutAnimation(selectedTabIndex);
-      }, 200);
-    }
-    return function () {
-      if (timeoutHandle) {
-        clearTimeout(timeoutHandle);
-      }
-    };
-  }, [selectedTabIndex, pagerViewRef]);
-  return /*#__PURE__*/React.createElement(TabContainer, {
-    style: containerStyle,
-    testID: componentTestID
-  }, /*#__PURE__*/React.createElement(ScrollableTabHeader, {
-    tabs: tabs,
-    selectedIndex: selectedTabIndex,
-    onTabPress: onTabPress,
-    barStyle: barStyle,
-    insets: insets,
-    testID: componentTestID ? "".concat(componentTestID, "-tab-bar") : undefined
-  }), /*#__PURE__*/React.createElement(ContentWrapper, {
-    initialPage: selectedTabIndex,
-    ref: pagerViewRef,
-    onPageSelected: function onPageSelected(e) {
-      var index = e.nativeEvent.position;
-      var selectedItem = tabs[index];
-      if (selectedItem) {
-        onTabPress(selectedItem.key);
-      }
-    },
-    scrollEnabled: swipeEnabled
-  }, tabs.map(function (tab, index) {
-    var key = tab.key,
-      component = tab.component,
-      testID = tab.testID;
-    var active = selectedTabKey === key;
-    var isLazyScreen = lazy && Math.abs(selectedTabIndex - index) > lazyPreloadDistance;
-    return /*#__PURE__*/React.createElement(TabScreen, {
-      key: key,
-      testID: testID ? "tab-screen-".concat(testID) : undefined,
-      pointerEvents: active ? 'auto' : 'none',
-      accessibilityElementsHidden: !active,
-      importantForAccessibility: active ? 'auto' : 'no-hide-descendants',
-      collapsable: false
-    }, isLazyScreen ? null : component);
-  })));
-};
-
-var SceneView = function SceneView(_ref) {
-  var _ref$lazy = _ref.lazy,
-    lazy = _ref$lazy === void 0 ? false : _ref$lazy,
-    _ref$lazyPreloadDista = _ref.lazyPreloadDistance,
-    lazyPreloadDistance = _ref$lazyPreloadDista === void 0 ? 1 : _ref$lazyPreloadDista,
-    children = _ref.children,
-    index = _ref.index,
-    selectedIndex = _ref.selectedIndex,
-    testID = _ref.testID;
-  var _React$useState = React.useState(Math.abs(selectedIndex - index) > lazyPreloadDistance),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isLoading = _React$useState2[0],
-    setIsLoading = _React$useState2[1];
-  var focused = index === selectedIndex;
-  if (isLoading && Math.abs(selectedIndex - index) <= lazyPreloadDistance) {
-    // Always render the route when it becomes focused
-    setIsLoading(false);
-  }
-  React.useEffect(function () {
-    var timer;
-    if (!lazy && isLoading) {
-      // If lazy mode is not enabled, render the scene with a delay if not loaded already
-      // This improves the initial startup time as the scene is no longer blocking
-      timer = setTimeout(function () {
-        return setIsLoading(false);
-      }, 0);
-    }
-    return function () {
-      clearTimeout(timer);
-    };
-  }, [index, isLoading, lazy, focused]);
-  return /*#__PURE__*/React.createElement(TabScreen, {
-    accessibilityElementsHidden: !focused,
-    importantForAccessibility: focused ? 'auto' : 'no-hide-descendants',
-    style: [{
-      flex: 1,
-      overflow: 'hidden'
-    }, focused ? StyleSheet$1.absoluteFill : null],
-    testID: testID
-  }, focused || !isLoading ? children : null);
-};
-
 var TabContext = /*#__PURE__*/React.createContext(null);
 var ScreenContext = /*#__PURE__*/React.createContext(null);
 var useIsFocused = function useIsFocused() {
@@ -15568,6 +15544,7 @@ var useIsFocused = function useIsFocused() {
   var isFocused = context.selectedTabKey === key;
   return isFocused;
 };
+
 var ScrollableTab = function ScrollableTab(_ref) {
   var onTabPress = _ref.onTabPress,
     selectedTabKey = _ref.selectedTabKey,
@@ -15603,7 +15580,6 @@ var ScrollableTab = function ScrollableTab(_ref) {
       }
     };
   }, [selectedTabIndex, pagerViewRef]);
-  var indexRef = React.useRef(selectedTabIndex);
   var tabContextProviderValue = React.useMemo(function () {
     return {
       selectedTabKey: selectedTabKey
@@ -15632,7 +15608,6 @@ var ScrollableTab = function ScrollableTab(_ref) {
           onTabPress(selectedItem.key);
         });
       }
-      indexRef.current = index;
     },
     scrollEnabled: swipeEnabled
   }, tabs.map(function (tab, index) {
@@ -15640,22 +15615,18 @@ var ScrollableTab = function ScrollableTab(_ref) {
       component = tab.component,
       testID = tab.testID;
     return /*#__PURE__*/React.createElement(ScreenContext.Provider, {
-      value: key
+      value: key,
+      key: key
     }, /*#__PURE__*/React.createElement(SceneView, {
       testID: testID,
-      key: key,
       index: index,
-      selectedIndex: indexRef.current,
+      selectedIndex: selectedTabIndex,
       lazy: lazy,
       lazyPreloadDistance: lazyPreloadDistance
     }, component));
   }))));
 };
 
-var ScrollableTabsV2 = Object.assign(ScrollableTab, {
-  useIsFocused: useIsFocused
-});
-
 var getTabItem = function getTabItem(_ref) {
   var item = _ref.item,
     color = _ref.color,
@@ -15704,7 +15675,14 @@ var Tabs = function Tabs(_ref2) {
       (_pagerViewRef$current = pagerViewRef.current) === null || _pagerViewRef$current === void 0 ? void 0 : _pagerViewRef$current.setPage(selectedTabIndex);
     }
   }, [selectedTabIndex]);
-  return /*#__PURE__*/React.createElement(TabContainer$1, {
+  var tabContextProviderValue = React.useMemo(function () {
+    return {
+      selectedTabKey: selectedTabKey
+    };
+  }, [selectedTabKey]);
+  return /*#__PURE__*/React.createElement(TabContext.Provider, {
+    value: tabContextProviderValue
+  }, /*#__PURE__*/React.createElement(TabContainer$1, {
     style: containerStyle,
     testID: componentTestID
   }, /*#__PURE__*/React.createElement(HeaderTabWrapper$1, {
@@ -15769,21 +15747,22 @@ var Tabs = function Tabs(_ref2) {
     var key = tab.key,
       component = tab.component,
       testID = tab.testID;
-    var active = selectedTabKey === key;
-    var isLazyScreen = lazy && Math.abs(selectedTabIndex - index) > lazyPreloadDistance;
-    return /*#__PURE__*/React.createElement(TabScreen$1, {
+    return /*#__PURE__*/React.createElement(ScreenContext.Provider, {
+      value: key,
+      key: key
+    }, /*#__PURE__*/React.createElement(SceneView, {
+      testID: testID,
       key: key,
-      testID: testID ? "tab-screen-".concat(testID) : undefined,
-      pointerEvents: active ? 'auto' : 'none',
-      accessibilityElementsHidden: !active,
-      importantForAccessibility: active ? 'auto' : 'no-hide-descendants',
-      collapsable: false
-    }, isLazyScreen ? null : component);
-  })));
+      index: index,
+      selectedIndex: selectedTabIndex,
+      lazy: lazy,
+      lazyPreloadDistance: lazyPreloadDistance
+    }, component));
+  }))));
 };
 var index$2 = Object.assign(Tabs, {
-  Scroll: ScrollableTab$1,
-  ScrollV2: ScrollableTabsV2
+  Scroll: ScrollableTab,
+  useIsFocused: useIsFocused
 });
 
 var getFilledStyles = function getFilledStyles(themeIntent, theme) {
@@ -32672,11 +32651,10 @@ var RichTextEditor = function RichTextEditor(_ref) {
     return "\n      <!DOCTYPE html>\n      <html>\n        <head>\n          <meta charset=\"utf-8\">\n          <meta name=\"viewport\" content=\"width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0\">\n          <style>\n            body {\n              margin: 0;\n            }\n          </style>\n        </head>\n        <body>\n          <div id=\"root\"></div>\n          <script>\n            window.__editorConfigs = {\n              placeholder: \"".concat(placeholder, "\",\n              initialValue: ").concat(initialValueString, ",\n              isAndroid: ").concat(isAndroid ? 'true' : 'false', ",\n              autoFocus: ").concat(autoFocus, ",\n              style: {\n                padding: '0 !important',\n                fontSize: ").concat(theme.__hd__.richTextEditor.fontSizes.editor, ",\n                color: '").concat(theme.__hd__.richTextEditor.colors.text, "'\n              }\n            };\n            ").concat(heroEditorApp, "\n          </script>\n        </body>\n      </html>\n      ");
   }, []);
   var requestBlur = useCallback(function () {
-    if (webview.current) {
+    if (webview.current && isFocused) {
       requestBlurEditor(webview.current);
-      Keyboard.dismiss();
     }
-  }, []);
+  }, [isFocused]);
   useImperativeHandle(forwardedRef, function () {
     return {
       requestBlur: requestBlur