@fountain-ui/core 2.0.0-beta.21 → 2.0.0-beta.22

package/build/commonjs/Tabs/ScrollableTabsView.js

@@ -18,12 +18,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function ScrollableTabsView(props) {
   const {
     coordinates,
+    initialIndex,
     ...scrollViewProps
   } = props;
   const {
     scrollViewRef,
     onLayout
-  } = (0, _useScrollViewReaction.default)(coordinates);
+  } = (0, _useScrollViewReaction.default)(initialIndex, coordinates);
   return /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, _extends({
     ref: scrollViewRef,
     onLayout: onLayout

package/build/commonjs/Tabs/ScrollableTabsView.js.map

@@ -1 +1 @@
-{"version":3,"names":["ScrollableTabsView","props","coordinates","scrollViewProps","scrollViewRef","onLayout","useScrollViewReaction"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n    coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n    const {\n        coordinates,\n        ...scrollViewProps\n    } = props;\n\n    const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);\n\n    return (\n        <ScrollView\n            ref={scrollViewRef}\n            onLayout={onLayout}\n            {...scrollViewProps}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;;;;;AAMe,SAASA,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAM;IAAEG,aAAF;IAAiBC;EAAjB,IAA8B,IAAAC,8BAAA,EAAsBJ,WAAtB,CAApC;EAEA,oBACI,6BAAC,uBAAD;IACI,GAAG,EAAEE,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;;AAAA"}
+{"version":3,"names":["ScrollableTabsView","props","coordinates","initialIndex","scrollViewProps","scrollViewRef","onLayout","useScrollViewReaction"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n    initialIndex: number;\n    coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n    const {\n        coordinates,\n        initialIndex,\n        ...scrollViewProps\n    } = props;\n\n    const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);\n\n    return (\n        <ScrollView\n            ref={scrollViewRef}\n            onLayout={onLayout}\n            {...scrollViewProps}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;;;;;AAOe,SAASA,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEFC,YAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAM;IAAEI,aAAF;IAAiBC;EAAjB,IAA8B,IAAAC,8BAAA,EAAsBJ,YAAtB,EAAoCD,WAApC,CAApC;EAEA,oBACI,6BAAC,uBAAD;IACI,GAAG,EAAEG,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;;AAAA"}

package/build/commonjs/Tabs/Tabs.js

@@ -143,6 +143,7 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(function Tabs(props, ref) {
     coordinates: coordinates,
     directionalLockEnabled: true,
     horizontal: true,
+    initialIndex: realInitialIndex,
     scrollsToTop: false,
     showsHorizontalScrollIndicator: false,
     showsVerticalScrollIndicator: false,

package/build/commonjs/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","forwardRef","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","useImperativeHandle","styles","coordinates","updateCoordinate","useTabCoordinates","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","useEffect","subscribe","tabElements","React","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","cloneElement","enableIndicator","undefined","tabIndicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n    const {\n        children,\n        initialIndex = 0,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        style,\n        variant = 'primary',\n        UNSTABLE_sharedIndex,\n    } = props;\n\n    const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n    const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n    const realInitialIndex = sharedIndex.initialValue;\n\n    const setTab = (newIndex: number) => {\n        sharedIndex.animatedValue.setValue(newIndex);\n    };\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            setTab,\n        }),\n        [sharedIndex],\n    );\n\n    const styles = useStyles();\n\n    const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n    const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n    const indexStore = useIndexStore(sharedIndex);\n\n    useEffect(() => {\n        return indexStore.subscribe(newIndex => {\n            onChange?.(newIndex);\n        });\n    }, [indexStore, onChange]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            updateCoordinate(index, x, width);\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            setTab(index);\n\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        // @ts-ignore\n        const tabElement = cloneElement(child, {\n            enableIndicator: !disableIndicator && !canRenderIndicator,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n\n        return (\n            <IndexAwareTab\n                children={tabElement}\n                index={index}\n                initialIndex={realInitialIndex}\n            />\n        );\n    });\n\n    const tabIndicator = canRenderIndicator ? (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            initialIndex={realInitialIndex}\n            scrollable={scrollable}\n        />\n    ) : null;\n\n    return (\n        <InternalContext.Provider value={{ indexStore }}>\n            <View\n                style={css([\n                    styles.root,\n                    scrollable ? undefined : styles.fixedRoot,\n                    style,\n                ])}\n            >\n                {scrollable ? (\n                    <ScrollableTabsView\n                        automaticallyAdjustContentInsets={false}\n                        bounces={false}\n                        contentContainerStyle={styles.scrollableContainer}\n                        coordinates={coordinates}\n                        directionalLockEnabled={true}\n                        horizontal={true}\n                        scrollsToTop={false}\n                        showsHorizontalScrollIndicator={false}\n                        showsVerticalScrollIndicator={false}\n                        keyboardDismissMode={keyboardDismissMode}\n                        keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                    >\n                        {tabElements}\n                        {tabIndicator}\n                    </ScrollableTabsView>\n                ) : (\n                    <React.Fragment>\n                        {tabElements}\n                        {tabIndicator}\n                    </React.Fragment>\n                )}\n            </View>\n        </InternalContext.Provider>\n    );\n});\n\nexport default Tabs;\n"],"mappings":"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"}
+{"version":3,"names":["useStyles","theme","useTheme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","forwardRef","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","useSyncAnimatedValue","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","useImperativeHandle","styles","coordinates","updateCoordinate","useTabCoordinates","canRenderIndicator","isEveryTabCoordinatesDefined","indexStore","useIndexStore","useEffect","subscribe","tabElements","React","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","cloneElement","enableIndicator","undefined","tabIndicator","css"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n    const {\n        children,\n        initialIndex = 0,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        style,\n        variant = 'primary',\n        UNSTABLE_sharedIndex,\n    } = props;\n\n    const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n    const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n    const realInitialIndex = sharedIndex.initialValue;\n\n    const setTab = (newIndex: number) => {\n        sharedIndex.animatedValue.setValue(newIndex);\n    };\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            setTab,\n        }),\n        [sharedIndex],\n    );\n\n    const styles = useStyles();\n\n    const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n    const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n    const indexStore = useIndexStore(sharedIndex);\n\n    useEffect(() => {\n        return indexStore.subscribe(newIndex => {\n            onChange?.(newIndex);\n        });\n    }, [indexStore, onChange]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            updateCoordinate(index, x, width);\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            setTab(index);\n\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        // @ts-ignore\n        const tabElement = cloneElement(child, {\n            enableIndicator: !disableIndicator && !canRenderIndicator,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n\n        return (\n            <IndexAwareTab\n                children={tabElement}\n                index={index}\n                initialIndex={realInitialIndex}\n            />\n        );\n    });\n\n    const tabIndicator = canRenderIndicator ? (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            initialIndex={realInitialIndex}\n            scrollable={scrollable}\n        />\n    ) : null;\n\n    return (\n        <InternalContext.Provider value={{ indexStore }}>\n            <View\n                style={css([\n                    styles.root,\n                    scrollable ? undefined : styles.fixedRoot,\n                    style,\n                ])}\n            >\n                {scrollable ? (\n                    <ScrollableTabsView\n                        automaticallyAdjustContentInsets={false}\n                        bounces={false}\n                        contentContainerStyle={styles.scrollableContainer}\n                        coordinates={coordinates}\n                        directionalLockEnabled={true}\n                        horizontal={true}\n                        initialIndex={realInitialIndex}\n                        scrollsToTop={false}\n                        showsHorizontalScrollIndicator={false}\n                        showsVerticalScrollIndicator={false}\n                        keyboardDismissMode={keyboardDismissMode}\n                        keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                    >\n                        {tabElements}\n                        {tabIndicator}\n                    </ScrollableTabsView>\n                ) : (\n                    <React.Fragment>\n                        {tabElements}\n                        {tabIndicator}\n                    </React.Fragment>\n                )}\n            </View>\n        </InternalContext.Provider>\n    );\n});\n\nexport default Tabs;\n"],"mappings":"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"}

package/build/commonjs/Tabs/useScrollViewReaction.js

@@ -11,7 +11,7 @@ var _InternalContext = _interopRequireDefault(require("./InternalContext"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function useScrollViewReaction(coordinates) {
+function useScrollViewReaction(initialIndex, coordinates) {
   const scrollViewRef = (0, _react.useRef)(null);
   const lastScrolledXRef = (0, _react.useRef)(NaN);
   const {
@@ -34,23 +34,31 @@ function useScrollViewReaction(coordinates) {
   const onLayout = (0, _react.useCallback)(() => {
     scrollToX(lastScrolledXRef.current);
   }, []);
-  (0, _react.useEffect)(() => {
-    const computeNextScrollX = index => {
-      const prevIndex = index - 1;
-      const prevCoordinate = coordinates[prevIndex];
+  const computeNextScrollX = (0, _react.useCallback)(index => {
+    const prevIndex = index - 1;
+    const prevCoordinate = coordinates[prevIndex];
 
-      if (prevCoordinate) {
-        const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
-        return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
-      }
+    if (prevCoordinate) {
+      const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
+      return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
+    }
 
-      return 0;
-    };
+    return 0;
+  }, [coordinates]);
+  (0, _react.useEffect)(() => {
+    if (Number.isNaN(lastScrolledXRef.current)) {
+      const x = computeNextScrollX(initialIndex);
 
+      if (x > 0) {
+        scrollToX(x);
+      }
+    }
+  }, [initialIndex, computeNextScrollX]);
+  (0, _react.useEffect)(() => {
     return indexStore.subscribe(currentIndex => {
       scrollToX(computeNextScrollX(currentIndex));
     });
-  }, [indexStore, coordinates]);
+  }, [indexStore, computeNextScrollX]);
   return {
     scrollViewRef,
     onLayout

package/build/commonjs/Tabs/useScrollViewReaction.js.map

@@ -1 +1 @@
-{"version":3,"names":["useScrollViewReaction","coordinates","scrollViewRef","useRef","lastScrolledXRef","NaN","indexStore","useContext","InternalContext","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","useCallback","useEffect","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n    scrollViewRef: MutableRefObject<ScrollView | null>;\n    onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n    coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const lastScrolledXRef = useRef<number>(NaN);\n\n    const { indexStore } = useContext(InternalContext);\n\n    const scrollToX = (x: number) => {\n        if (Number.isFinite(x)) {\n            scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n            lastScrolledXRef.current = x;\n        }\n    };\n\n    const onLayout = useCallback(() => {\n        scrollToX(lastScrolledXRef.current);\n    }, []);\n\n    useEffect(() => {\n        const computeNextScrollX = (index: number) => {\n            const prevIndex = index - 1;\n            const prevCoordinate = coordinates[prevIndex];\n\n            if (prevCoordinate) {\n                const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n                return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n            }\n\n            return 0;\n        };\n\n        return indexStore.subscribe(currentIndex => {\n            scrollToX(computeNextScrollX(currentIndex));\n        });\n    }, [indexStore, coordinates]);\n\n    return { scrollViewRef, onLayout };\n};\n"],"mappings":";;;;;;;AACA;;AAGA;;;;AAOe,SAASA,qBAAT,CACXC,WADW,EAEU;EACrB,MAAMC,aAAa,GAAG,IAAAC,aAAA,EAA0B,IAA1B,CAAtB;EAEA,MAAMC,gBAAgB,GAAG,IAAAD,aAAA,EAAeE,GAAf,CAAzB;EAEA,MAAM;IAAEC;EAAF,IAAiB,IAAAC,iBAAA,EAAWC,wBAAX,CAAvB;;EAEA,MAAMC,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAR,aAAa,CAACW,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAZ,gBAAgB,CAACS,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/BT,SAAS,CAACL,gBAAgB,CAACS,OAAlB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,IAAAM,gBAAA,EAAU,MAAM;IACZ,MAAMC,kBAAkB,GAAIC,KAAD,IAAmB;MAC1C,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;MACA,MAAME,cAAc,GAAGtB,WAAW,CAACqB,SAAD,CAAlC;;MAEA,IAAIC,cAAJ,EAAoB;QAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;QACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;MACH;;MAED,OAAO,CAAP;IACH,CAVD;;IAYA,OAAOlB,UAAU,CAACuB,SAAX,CAAqBC,YAAY,IAAI;MACxCrB,SAAS,CAACW,kBAAkB,CAACU,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAhBD,EAgBG,CAACxB,UAAD,EAAaL,WAAb,CAhBH;EAkBA,OAAO;IAAEC,aAAF;IAAiBe;EAAjB,CAAP;AACH;;AAAA"}
+{"version":3,"names":["useScrollViewReaction","initialIndex","coordinates","scrollViewRef","useRef","lastScrolledXRef","NaN","indexStore","useContext","InternalContext","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","useCallback","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","useEffect","isNaN","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n    scrollViewRef: MutableRefObject<ScrollView | null>;\n    onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n    initialIndex: number,\n    coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const lastScrolledXRef = useRef<number>(NaN);\n\n    const { indexStore } = useContext(InternalContext);\n\n    const scrollToX = (x: number) => {\n        if (Number.isFinite(x)) {\n            scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n            lastScrolledXRef.current = x;\n        }\n    };\n\n    const onLayout = useCallback(() => {\n        scrollToX(lastScrolledXRef.current);\n    }, []);\n\n    const computeNextScrollX = useCallback((index: number): number => {\n        const prevIndex = index - 1;\n        const prevCoordinate = coordinates[prevIndex];\n\n        if (prevCoordinate) {\n            const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n            return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n        }\n\n        return 0;\n    }, [coordinates]);\n\n    useEffect(() => {\n        if (Number.isNaN(lastScrolledXRef.current)) {\n            const x = computeNextScrollX(initialIndex);\n            if (x > 0) {\n                scrollToX(x);\n            }\n        }\n    }, [initialIndex, computeNextScrollX]);\n\n    useEffect(() => {\n        return indexStore.subscribe(currentIndex => {\n            scrollToX(computeNextScrollX(currentIndex));\n        });\n    }, [indexStore, computeNextScrollX]);\n\n    return { scrollViewRef, onLayout };\n};\n"],"mappings":";;;;;;;AACA;;AAGA;;;;AAOe,SAASA,qBAAT,CACXC,YADW,EAEXC,WAFW,EAGU;EACrB,MAAMC,aAAa,GAAG,IAAAC,aAAA,EAA0B,IAA1B,CAAtB;EAEA,MAAMC,gBAAgB,GAAG,IAAAD,aAAA,EAAeE,GAAf,CAAzB;EAEA,MAAM;IAAEC;EAAF,IAAiB,IAAAC,iBAAA,EAAWC,wBAAX,CAAvB;;EAEA,MAAMC,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAR,aAAa,CAACW,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAZ,gBAAgB,CAACS,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAG,IAAAC,kBAAA,EAAY,MAAM;IAC/BT,SAAS,CAACL,gBAAgB,CAACS,OAAlB,CAAT;EACH,CAFgB,EAEd,EAFc,CAAjB;EAIA,MAAMM,kBAAkB,GAAG,IAAAD,kBAAA,EAAaE,KAAD,IAA2B;IAC9D,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;IACA,MAAME,cAAc,GAAGrB,WAAW,CAACoB,SAAD,CAAlC;;IAEA,IAAIC,cAAJ,EAAoB;MAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;MACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAV0B,EAUxB,CAACtB,WAAD,CAVwB,CAA3B;EAYA,IAAA2B,gBAAA,EAAU,MAAM;IACZ,IAAIjB,MAAM,CAACkB,KAAP,CAAazB,gBAAgB,CAACS,OAA9B,CAAJ,EAA4C;MACxC,MAAMH,CAAC,GAAGS,kBAAkB,CAACnB,YAAD,CAA5B;;MACA,IAAIU,CAAC,GAAG,CAAR,EAAW;QACPD,SAAS,CAACC,CAAD,CAAT;MACH;IACJ;EACJ,CAPD,EAOG,CAACV,YAAD,EAAemB,kBAAf,CAPH;EASA,IAAAS,gBAAA,EAAU,MAAM;IACZ,OAAOtB,UAAU,CAACwB,SAAX,CAAqBC,YAAY,IAAI;MACxCtB,SAAS,CAACU,kBAAkB,CAACY,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAJD,EAIG,CAACzB,UAAD,EAAaa,kBAAb,CAJH;EAMA,OAAO;IAAEjB,aAAF;IAAiBe;EAAjB,CAAP;AACH;;AAAA"}

package/build/module/Tabs/ScrollableTabsView.js

@@ -6,12 +6,13 @@ import useScrollViewReaction from './useScrollViewReaction';
 export default function ScrollableTabsView(props) {
   const {
     coordinates,
+    initialIndex,
     ...scrollViewProps
   } = props;
   const {
     scrollViewRef,
     onLayout
-  } = useScrollViewReaction(coordinates);
+  } = useScrollViewReaction(initialIndex, coordinates);
   return /*#__PURE__*/React.createElement(ScrollView, _extends({
     ref: scrollViewRef,
     onLayout: onLayout

package/build/module/Tabs/ScrollableTabsView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ScrollView","useScrollViewReaction","ScrollableTabsView","props","coordinates","scrollViewProps","scrollViewRef","onLayout"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n    coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n    const {\n        coordinates,\n        ...scrollViewProps\n    } = props;\n\n    const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);\n\n    return (\n        <ScrollView\n            ref={scrollViewRef}\n            onLayout={onLayout}\n            {...scrollViewProps}\n        />\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,cAA3B;AAEA,OAAOC,qBAAP,MAAkC,yBAAlC;AAMA,eAAe,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAM;IAAEG,aAAF;IAAiBC;EAAjB,IAA8BN,qBAAqB,CAACG,WAAD,CAAzD;EAEA,oBACI,oBAAC,UAAD;IACI,GAAG,EAAEE,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;AAAA"}
+{"version":3,"names":["React","ScrollView","useScrollViewReaction","ScrollableTabsView","props","coordinates","initialIndex","scrollViewProps","scrollViewRef","onLayout"],"sources":["ScrollableTabsView.tsx"],"sourcesContent":["import React from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport { ScrollView } from 'react-native';\nimport TabCoordinate from './TabCoordinate';\nimport useScrollViewReaction from './useScrollViewReaction';\n\nexport interface ScrollableTabsViewProps extends ScrollViewProps {\n    initialIndex: number;\n    coordinates: TabCoordinate[];\n}\n\nexport default function ScrollableTabsView(props: ScrollableTabsViewProps) {\n    const {\n        coordinates,\n        initialIndex,\n        ...scrollViewProps\n    } = props;\n\n    const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);\n\n    return (\n        <ScrollView\n            ref={scrollViewRef}\n            onLayout={onLayout}\n            {...scrollViewProps}\n        />\n    );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,cAA3B;AAEA,OAAOC,qBAAP,MAAkC,yBAAlC;AAOA,eAAe,SAASC,kBAAT,CAA4BC,KAA5B,EAA4D;EACvE,MAAM;IACFC,WADE;IAEFC,YAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAM;IAAEI,aAAF;IAAiBC;EAAjB,IAA8BP,qBAAqB,CAACI,YAAD,EAAeD,WAAf,CAAzD;EAEA,oBACI,oBAAC,UAAD;IACI,GAAG,EAAEG,aADT;IAEI,QAAQ,EAAEC;EAFd,GAGQF,eAHR,EADJ;AAOH;AAAA"}

package/build/module/Tabs/Tabs.js

@@ -118,6 +118,7 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
     coordinates: coordinates,
     directionalLockEnabled: true,
     horizontal: true,
+    initialIndex: realInitialIndex,
     scrollsToTop: false,
     showsHorizontalScrollIndicator: false,
     showsVerticalScrollIndicator: false,

package/build/module/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","styles","coordinates","updateCoordinate","canRenderIndicator","indexStore","subscribe","tabElements","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","enableIndicator","undefined","tabIndicator"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n    const {\n        children,\n        initialIndex = 0,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        style,\n        variant = 'primary',\n        UNSTABLE_sharedIndex,\n    } = props;\n\n    const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n    const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n    const realInitialIndex = sharedIndex.initialValue;\n\n    const setTab = (newIndex: number) => {\n        sharedIndex.animatedValue.setValue(newIndex);\n    };\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            setTab,\n        }),\n        [sharedIndex],\n    );\n\n    const styles = useStyles();\n\n    const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n    const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n    const indexStore = useIndexStore(sharedIndex);\n\n    useEffect(() => {\n        return indexStore.subscribe(newIndex => {\n            onChange?.(newIndex);\n        });\n    }, [indexStore, onChange]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            updateCoordinate(index, x, width);\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            setTab(index);\n\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        // @ts-ignore\n        const tabElement = cloneElement(child, {\n            enableIndicator: !disableIndicator && !canRenderIndicator,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n\n        return (\n            <IndexAwareTab\n                children={tabElement}\n                index={index}\n                initialIndex={realInitialIndex}\n            />\n        );\n    });\n\n    const tabIndicator = canRenderIndicator ? (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            initialIndex={realInitialIndex}\n            scrollable={scrollable}\n        />\n    ) : null;\n\n    return (\n        <InternalContext.Provider value={{ indexStore }}>\n            <View\n                style={css([\n                    styles.root,\n                    scrollable ? undefined : styles.fixedRoot,\n                    style,\n                ])}\n            >\n                {scrollable ? (\n                    <ScrollableTabsView\n                        automaticallyAdjustContentInsets={false}\n                        bounces={false}\n                        contentContainerStyle={styles.scrollableContainer}\n                        coordinates={coordinates}\n                        directionalLockEnabled={true}\n                        horizontal={true}\n                        scrollsToTop={false}\n                        showsHorizontalScrollIndicator={false}\n                        showsVerticalScrollIndicator={false}\n                        keyboardDismissMode={keyboardDismissMode}\n                        keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                    >\n                        {tabElements}\n                        {tabIndicator}\n                    </ScrollableTabsView>\n                ) : (\n                    <React.Fragment>\n                        {tabElements}\n                        {tabIndicator}\n                    </React.Fragment>\n                )}\n            </View>\n        </InternalContext.Provider>\n    );\n});\n\nexport default Tabs;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,YAAhB,EAA8BC,UAA9B,EAA0CC,SAA1C,EAAqDC,mBAArD,QAAgF,OAAhF;AAEA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,oBAAT,QAAqC,UAArC;AAGA,OAAOC,YAAP,MAAyB,gBAAzB;AACA,OAAOC,kBAAP,MAA+B,sBAA/B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,SAASC,4BAAT,QAA6C,SAA7C;;AAUA,MAAMC,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAGV,QAAQ,EAAtB;EAEA,OAAO;IACHW,IAAI,EAAE,EADH;IAEHC,SAAS,EAAE;MACPC,aAAa,EAAE;IADR,CAFR;IAKHC,QAAQ,EAAE;MACNC,IAAI,EAAE;IADA,CALP;IAQHC,mBAAmB,EAAE;MACjBC,iBAAiB,EAAEP,KAAK,CAACQ,OAAN,CAAc,CAAd;IADF;EARlB,CAAP;AAYH,CAfD;;AAiBA,MAAMC,IAAI,gBAAGxB,UAAU,CAA0B,SAASwB,IAAT,CAAcC,KAAd,EAAqBC,GAArB,EAA0B;EACvE,MAAM;IACFC,QADE;IAEFC,YAAY,GAAG,CAFb;IAGFC,gBAAgB,GAAG,KAHjB;IAIFC,mBAAmB,GAAG,MAJpB;IAKFC,yBAAyB,GAAG,OAL1B;IAMFC,QANE;IAOFC,UAAU,GAAG,KAPX;IAQFC,KARE;IASFC,OAAO,GAAG,SATR;IAUFC;EAVE,IAWFX,KAXJ;EAaA,MAAMY,mBAAmB,GAAG/B,oBAAoB,CAAC;IAAEgC,YAAY,EAAEV;EAAhB,CAAD,CAAhD;EACA,MAAMW,WAAW,GAAGH,oBAAoB,IAAIC,mBAA5C;EACA,MAAMG,gBAAgB,GAAGD,WAAW,CAACD,YAArC;;EAEA,MAAMG,MAAM,GAAIC,QAAD,IAAsB;IACjCH,WAAW,CAACI,aAAZ,CAA0BC,QAA1B,CAAmCF,QAAnC;EACH,CAFD;;EAIAxC,mBAAmB,CACfwB,GADe,EAEf,OAAO;IACHe;EADG,CAAP,CAFe,EAKf,CAACF,WAAD,CALe,CAAnB;EAQA,MAAMM,MAAM,GAAG/B,SAAS,EAAxB;EAEA,MAAM,CAACgC,WAAD,EAAcC,gBAAd,IAAkCrC,iBAAiB,CAACiB,QAAD,CAAzD;EAEA,MAAMqB,kBAAkB,GAAGnC,4BAA4B,CAACiC,WAAD,EAAcnB,QAAd,CAAvD;EAEA,MAAMsB,UAAU,GAAGtC,aAAa,CAAC4B,WAAD,CAAhC;EAEAtC,SAAS,CAAC,MAAM;IACZ,OAAOgD,UAAU,CAACC,SAAX,CAAqBR,QAAQ,IAAI;MACpCV,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGU,QAAH,CAAR;IACH,CAFM,CAAP;EAGH,CAJQ,EAIN,CAACO,UAAD,EAAajB,QAAb,CAJM,CAAT;EAMA,MAAMmB,WAAW,GAAGrD,KAAK,CAACsD,QAAN,CAAeC,GAAf,CAAmB1B,QAAnB,EAA6B,CAAC2B,KAAD,EAAQC,KAAR,KAAkB;IAC/D,MAAMC,QAAQ,GAAIC,KAAD,IAA8B;MAC3C,MAAM;QAAEC,CAAF;QAAKC;MAAL,IAAeF,KAAK,CAACG,WAAN,CAAkBC,MAAvC;MAEAd,gBAAgB,CAACQ,KAAD,EAAQG,CAAR,EAAWC,KAAX,CAAhB;IACH,CAJD;;IAMA,MAAMG,WAAW,GAAIC,CAAD,IAA8B;MAC9C,IAAIhC,yBAAyB,KAAK,QAAlC,EAA4C;QACxCgC,CAAC,CAACC,cAAF;MACH;IACJ,CAJD;;IAMA,MAAMC,OAAO,GAAG,MAAM;MAAA;;MAClBxB,MAAM,CAACc,KAAD,CAAN,CADkB,CAGlB;;MACA,wCAAAD,KAAK,CAAC7B,KAAN,EAAYwC,OAAZ;IACH,CALD,CAb+D,CAoB/D;;;IACA,MAAMC,UAAU,gBAAGnE,YAAY,CAACuD,KAAD,EAAQ;MACnCa,eAAe,EAAE,CAACtC,gBAAD,IAAqB,CAACmB,kBADJ;MAEnCQ,QAFmC;MAGnCS,OAHmC;MAInCH,WAJmC;MAKnC3B,OALmC;MAMnCD,KAAK,EAAED,UAAU,GAAGmC,SAAH,GAAevB,MAAM,CAAC1B;IANJ,CAAR,CAA/B;IASA,oBACI,oBAAC,aAAD;MACI,QAAQ,EAAE+C,UADd;MAEI,KAAK,EAAEX,KAFX;MAGI,YAAY,EAAEf;IAHlB,EADJ;EAOH,CArCmB,CAApB;EAuCA,MAAM6B,YAAY,GAAGrB,kBAAkB,gBACnC,oBAAC,YAAD;IACI,WAAW,EAAEF,WADjB;IAEI,QAAQ,EAAEjB,gBAFd;IAGI,YAAY,EAAEW,gBAHlB;IAII,UAAU,EAAEP;EAJhB,EADmC,GAOnC,IAPJ;EASA,oBACI,oBAAC,eAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAE;MAAEgB;IAAF;EAAjC,gBACI,oBAAC,IAAD;IACI,KAAK,EAAE7C,GAAG,CAAC,CACPyC,MAAM,CAAC7B,IADA,EAEPiB,UAAU,GAAGmC,SAAH,GAAevB,MAAM,CAAC5B,SAFzB,EAGPiB,KAHO,CAAD;EADd,GAOKD,UAAU,gBACP,oBAAC,kBAAD;IACI,gCAAgC,EAAE,KADtC;IAEI,OAAO,EAAE,KAFb;IAGI,qBAAqB,EAAEY,MAAM,CAACxB,mBAHlC;IAII,WAAW,EAAEyB,WAJjB;IAKI,sBAAsB,EAAE,IAL5B;IAMI,UAAU,EAAE,IANhB;IAOI,YAAY,EAAE,KAPlB;IAQI,8BAA8B,EAAE,KARpC;IASI,4BAA4B,EAAE,KATlC;IAUI,mBAAmB,EAAEhB,mBAVzB;IAWI,yBAAyB,EAAEC;EAX/B,GAaKoB,WAbL,EAcKkB,YAdL,CADO,gBAkBP,oBAAC,KAAD,CAAO,QAAP,QACKlB,WADL,EAEKkB,YAFL,CAzBR,CADJ,CADJ;AAmCH,CA/HsB,CAAvB;AAiIA,eAAe7C,IAAf"}
+{"version":3,"names":["React","cloneElement","forwardRef","useEffect","useImperativeHandle","View","css","useTheme","useSyncAnimatedValue","TabIndicator","ScrollableTabsView","IndexAwareTab","useTabCoordinates","useIndexStore","InternalContext","isEveryTabCoordinatesDefined","useStyles","theme","root","fixedRoot","flexDirection","fixedTab","flex","scrollableContainer","paddingHorizontal","spacing","Tabs","props","ref","children","initialIndex","disableIndicator","keyboardDismissMode","keyboardShouldPersistTaps","onChange","scrollable","style","variant","UNSTABLE_sharedIndex","fallbackSharedIndex","initialValue","sharedIndex","realInitialIndex","setTab","newIndex","animatedValue","setValue","styles","coordinates","updateCoordinate","canRenderIndicator","indexStore","subscribe","tabElements","Children","map","child","index","onLayout","event","x","width","nativeEvent","layout","onMouseDown","e","preventDefault","onPress","tabElement","enableIndicator","undefined","tabIndicator"],"sources":["Tabs.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useEffect, useImperativeHandle } from 'react';\nimport type { GestureResponderEvent, LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport { useSyncAnimatedValue } from '../hooks';\nimport type TabsProps from './TabsProps';\nimport type { TabsInstance } from './types';\nimport TabIndicator from './TabIndicator';\nimport ScrollableTabsView from './ScrollableTabsView';\nimport IndexAwareTab from './IndexAwareTab';\nimport useTabCoordinates from './useTabCoordinates';\nimport useIndexStore from './useIndexStore';\nimport InternalContext from './InternalContext';\nimport { isEveryTabCoordinatesDefined } from './utils';\n\ntype TabsStyleKeys =\n    | 'root'\n    | 'fixedRoot'\n    | 'fixedTab'\n    | 'scrollableContainer';\n\ntype TabsStyles = NamedStylesStringUnion<TabsStyleKeys>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {},\n        fixedRoot: {\n            flexDirection: 'row',\n        },\n        fixedTab: {\n            flex: 1,\n        },\n        scrollableContainer: {\n            paddingHorizontal: theme.spacing(1),\n        },\n    };\n};\n\nconst Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {\n    const {\n        children,\n        initialIndex = 0,\n        disableIndicator = false,\n        keyboardDismissMode = 'none',\n        keyboardShouldPersistTaps = 'never',\n        onChange,\n        scrollable = false,\n        style,\n        variant = 'primary',\n        UNSTABLE_sharedIndex,\n    } = props;\n\n    const fallbackSharedIndex = useSyncAnimatedValue({ initialValue: initialIndex });\n    const sharedIndex = UNSTABLE_sharedIndex ?? fallbackSharedIndex;\n    const realInitialIndex = sharedIndex.initialValue;\n\n    const setTab = (newIndex: number) => {\n        sharedIndex.animatedValue.setValue(newIndex);\n    };\n\n    useImperativeHandle(\n        ref,\n        () => ({\n            setTab,\n        }),\n        [sharedIndex],\n    );\n\n    const styles = useStyles();\n\n    const [coordinates, updateCoordinate] = useTabCoordinates(children);\n\n    const canRenderIndicator = isEveryTabCoordinatesDefined(coordinates, children);\n\n    const indexStore = useIndexStore(sharedIndex);\n\n    useEffect(() => {\n        return indexStore.subscribe(newIndex => {\n            onChange?.(newIndex);\n        });\n    }, [indexStore, onChange]);\n\n    const tabElements = React.Children.map(children, (child, index) => {\n        const onLayout = (event: LayoutChangeEvent) => {\n            const { x, width } = event.nativeEvent.layout;\n\n            updateCoordinate(index, x, width);\n        };\n\n        const onMouseDown = (e: GestureResponderEvent) => {\n            if (keyboardShouldPersistTaps === 'always') {\n                e.preventDefault();\n            }\n        };\n\n        const onPress = () => {\n            setTab(index);\n\n            // @ts-ignore\n            child.props.onPress?.();\n        };\n\n        // @ts-ignore\n        const tabElement = cloneElement(child, {\n            enableIndicator: !disableIndicator && !canRenderIndicator,\n            onLayout,\n            onPress,\n            onMouseDown,\n            variant,\n            style: scrollable ? undefined : styles.fixedTab,\n        });\n\n        return (\n            <IndexAwareTab\n                children={tabElement}\n                index={index}\n                initialIndex={realInitialIndex}\n            />\n        );\n    });\n\n    const tabIndicator = canRenderIndicator ? (\n        <TabIndicator\n            coordinates={coordinates}\n            disabled={disableIndicator}\n            initialIndex={realInitialIndex}\n            scrollable={scrollable}\n        />\n    ) : null;\n\n    return (\n        <InternalContext.Provider value={{ indexStore }}>\n            <View\n                style={css([\n                    styles.root,\n                    scrollable ? undefined : styles.fixedRoot,\n                    style,\n                ])}\n            >\n                {scrollable ? (\n                    <ScrollableTabsView\n                        automaticallyAdjustContentInsets={false}\n                        bounces={false}\n                        contentContainerStyle={styles.scrollableContainer}\n                        coordinates={coordinates}\n                        directionalLockEnabled={true}\n                        horizontal={true}\n                        initialIndex={realInitialIndex}\n                        scrollsToTop={false}\n                        showsHorizontalScrollIndicator={false}\n                        showsVerticalScrollIndicator={false}\n                        keyboardDismissMode={keyboardDismissMode}\n                        keyboardShouldPersistTaps={keyboardShouldPersistTaps}\n                    >\n                        {tabElements}\n                        {tabIndicator}\n                    </ScrollableTabsView>\n                ) : (\n                    <React.Fragment>\n                        {tabElements}\n                        {tabIndicator}\n                    </React.Fragment>\n                )}\n            </View>\n        </InternalContext.Provider>\n    );\n});\n\nexport default Tabs;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,YAAhB,EAA8BC,UAA9B,EAA0CC,SAA1C,EAAqDC,mBAArD,QAAgF,OAAhF;AAEA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,oBAAT,QAAqC,UAArC;AAGA,OAAOC,YAAP,MAAyB,gBAAzB;AACA,OAAOC,kBAAP,MAA+B,sBAA/B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,SAASC,4BAAT,QAA6C,SAA7C;;AAUA,MAAMC,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAGV,QAAQ,EAAtB;EAEA,OAAO;IACHW,IAAI,EAAE,EADH;IAEHC,SAAS,EAAE;MACPC,aAAa,EAAE;IADR,CAFR;IAKHC,QAAQ,EAAE;MACNC,IAAI,EAAE;IADA,CALP;IAQHC,mBAAmB,EAAE;MACjBC,iBAAiB,EAAEP,KAAK,CAACQ,OAAN,CAAc,CAAd;IADF;EARlB,CAAP;AAYH,CAfD;;AAiBA,MAAMC,IAAI,gBAAGxB,UAAU,CAA0B,SAASwB,IAAT,CAAcC,KAAd,EAAqBC,GAArB,EAA0B;EACvE,MAAM;IACFC,QADE;IAEFC,YAAY,GAAG,CAFb;IAGFC,gBAAgB,GAAG,KAHjB;IAIFC,mBAAmB,GAAG,MAJpB;IAKFC,yBAAyB,GAAG,OAL1B;IAMFC,QANE;IAOFC,UAAU,GAAG,KAPX;IAQFC,KARE;IASFC,OAAO,GAAG,SATR;IAUFC;EAVE,IAWFX,KAXJ;EAaA,MAAMY,mBAAmB,GAAG/B,oBAAoB,CAAC;IAAEgC,YAAY,EAAEV;EAAhB,CAAD,CAAhD;EACA,MAAMW,WAAW,GAAGH,oBAAoB,IAAIC,mBAA5C;EACA,MAAMG,gBAAgB,GAAGD,WAAW,CAACD,YAArC;;EAEA,MAAMG,MAAM,GAAIC,QAAD,IAAsB;IACjCH,WAAW,CAACI,aAAZ,CAA0BC,QAA1B,CAAmCF,QAAnC;EACH,CAFD;;EAIAxC,mBAAmB,CACfwB,GADe,EAEf,OAAO;IACHe;EADG,CAAP,CAFe,EAKf,CAACF,WAAD,CALe,CAAnB;EAQA,MAAMM,MAAM,GAAG/B,SAAS,EAAxB;EAEA,MAAM,CAACgC,WAAD,EAAcC,gBAAd,IAAkCrC,iBAAiB,CAACiB,QAAD,CAAzD;EAEA,MAAMqB,kBAAkB,GAAGnC,4BAA4B,CAACiC,WAAD,EAAcnB,QAAd,CAAvD;EAEA,MAAMsB,UAAU,GAAGtC,aAAa,CAAC4B,WAAD,CAAhC;EAEAtC,SAAS,CAAC,MAAM;IACZ,OAAOgD,UAAU,CAACC,SAAX,CAAqBR,QAAQ,IAAI;MACpCV,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGU,QAAH,CAAR;IACH,CAFM,CAAP;EAGH,CAJQ,EAIN,CAACO,UAAD,EAAajB,QAAb,CAJM,CAAT;EAMA,MAAMmB,WAAW,GAAGrD,KAAK,CAACsD,QAAN,CAAeC,GAAf,CAAmB1B,QAAnB,EAA6B,CAAC2B,KAAD,EAAQC,KAAR,KAAkB;IAC/D,MAAMC,QAAQ,GAAIC,KAAD,IAA8B;MAC3C,MAAM;QAAEC,CAAF;QAAKC;MAAL,IAAeF,KAAK,CAACG,WAAN,CAAkBC,MAAvC;MAEAd,gBAAgB,CAACQ,KAAD,EAAQG,CAAR,EAAWC,KAAX,CAAhB;IACH,CAJD;;IAMA,MAAMG,WAAW,GAAIC,CAAD,IAA8B;MAC9C,IAAIhC,yBAAyB,KAAK,QAAlC,EAA4C;QACxCgC,CAAC,CAACC,cAAF;MACH;IACJ,CAJD;;IAMA,MAAMC,OAAO,GAAG,MAAM;MAAA;;MAClBxB,MAAM,CAACc,KAAD,CAAN,CADkB,CAGlB;;MACA,wCAAAD,KAAK,CAAC7B,KAAN,EAAYwC,OAAZ;IACH,CALD,CAb+D,CAoB/D;;;IACA,MAAMC,UAAU,gBAAGnE,YAAY,CAACuD,KAAD,EAAQ;MACnCa,eAAe,EAAE,CAACtC,gBAAD,IAAqB,CAACmB,kBADJ;MAEnCQ,QAFmC;MAGnCS,OAHmC;MAInCH,WAJmC;MAKnC3B,OALmC;MAMnCD,KAAK,EAAED,UAAU,GAAGmC,SAAH,GAAevB,MAAM,CAAC1B;IANJ,CAAR,CAA/B;IASA,oBACI,oBAAC,aAAD;MACI,QAAQ,EAAE+C,UADd;MAEI,KAAK,EAAEX,KAFX;MAGI,YAAY,EAAEf;IAHlB,EADJ;EAOH,CArCmB,CAApB;EAuCA,MAAM6B,YAAY,GAAGrB,kBAAkB,gBACnC,oBAAC,YAAD;IACI,WAAW,EAAEF,WADjB;IAEI,QAAQ,EAAEjB,gBAFd;IAGI,YAAY,EAAEW,gBAHlB;IAII,UAAU,EAAEP;EAJhB,EADmC,GAOnC,IAPJ;EASA,oBACI,oBAAC,eAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAE;MAAEgB;IAAF;EAAjC,gBACI,oBAAC,IAAD;IACI,KAAK,EAAE7C,GAAG,CAAC,CACPyC,MAAM,CAAC7B,IADA,EAEPiB,UAAU,GAAGmC,SAAH,GAAevB,MAAM,CAAC5B,SAFzB,EAGPiB,KAHO,CAAD;EADd,GAOKD,UAAU,gBACP,oBAAC,kBAAD;IACI,gCAAgC,EAAE,KADtC;IAEI,OAAO,EAAE,KAFb;IAGI,qBAAqB,EAAEY,MAAM,CAACxB,mBAHlC;IAII,WAAW,EAAEyB,WAJjB;IAKI,sBAAsB,EAAE,IAL5B;IAMI,UAAU,EAAE,IANhB;IAOI,YAAY,EAAEN,gBAPlB;IAQI,YAAY,EAAE,KARlB;IASI,8BAA8B,EAAE,KATpC;IAUI,4BAA4B,EAAE,KAVlC;IAWI,mBAAmB,EAAEV,mBAXzB;IAYI,yBAAyB,EAAEC;EAZ/B,GAcKoB,WAdL,EAeKkB,YAfL,CADO,gBAmBP,oBAAC,KAAD,CAAO,QAAP,QACKlB,WADL,EAEKkB,YAFL,CA1BR,CADJ,CADJ;AAoCH,CAhIsB,CAAvB;AAkIA,eAAe7C,IAAf"}

package/build/module/Tabs/useScrollViewReaction.js

@@ -1,6 +1,6 @@
 import { useCallback, useContext, useEffect, useRef } from 'react';
 import InternalContext from './InternalContext';
-export default function useScrollViewReaction(coordinates) {
+export default function useScrollViewReaction(initialIndex, coordinates) {
   const scrollViewRef = useRef(null);
   const lastScrolledXRef = useRef(NaN);
   const {
@@ -23,23 +23,31 @@ export default function useScrollViewReaction(coordinates) {
   const onLayout = useCallback(() => {
     scrollToX(lastScrolledXRef.current);
   }, []);
-  useEffect(() => {
-    const computeNextScrollX = index => {
-      const prevIndex = index - 1;
-      const prevCoordinate = coordinates[prevIndex];
+  const computeNextScrollX = useCallback(index => {
+    const prevIndex = index - 1;
+    const prevCoordinate = coordinates[prevIndex];
 
-      if (prevCoordinate) {
-        const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
-        return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
-      }
+    if (prevCoordinate) {
+      const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
+      return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
+    }
 
-      return 0;
-    };
+    return 0;
+  }, [coordinates]);
+  useEffect(() => {
+    if (Number.isNaN(lastScrolledXRef.current)) {
+      const x = computeNextScrollX(initialIndex);
 
+      if (x > 0) {
+        scrollToX(x);
+      }
+    }
+  }, [initialIndex, computeNextScrollX]);
+  useEffect(() => {
     return indexStore.subscribe(currentIndex => {
       scrollToX(computeNextScrollX(currentIndex));
     });
-  }, [indexStore, coordinates]);
+  }, [indexStore, computeNextScrollX]);
   return {
     scrollViewRef,
     onLayout

package/build/module/Tabs/useScrollViewReaction.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useContext","useEffect","useRef","InternalContext","useScrollViewReaction","coordinates","scrollViewRef","lastScrolledXRef","NaN","indexStore","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n    scrollViewRef: MutableRefObject<ScrollView | null>;\n    onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n    coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const lastScrolledXRef = useRef<number>(NaN);\n\n    const { indexStore } = useContext(InternalContext);\n\n    const scrollToX = (x: number) => {\n        if (Number.isFinite(x)) {\n            scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n            lastScrolledXRef.current = x;\n        }\n    };\n\n    const onLayout = useCallback(() => {\n        scrollToX(lastScrolledXRef.current);\n    }, []);\n\n    useEffect(() => {\n        const computeNextScrollX = (index: number) => {\n            const prevIndex = index - 1;\n            const prevCoordinate = coordinates[prevIndex];\n\n            if (prevCoordinate) {\n                const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n                return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n            }\n\n            return 0;\n        };\n\n        return indexStore.subscribe(currentIndex => {\n            scrollToX(computeNextScrollX(currentIndex));\n        });\n    }, [indexStore, coordinates]);\n\n    return { scrollViewRef, onLayout };\n};\n"],"mappings":"AACA,SAASA,WAAT,EAAsBC,UAAtB,EAAkCC,SAAlC,EAA6CC,MAA7C,QAA2D,OAA3D;AAGA,OAAOC,eAAP,MAA4B,mBAA5B;AAOA,eAAe,SAASC,qBAAT,CACXC,WADW,EAEU;EACrB,MAAMC,aAAa,GAAGJ,MAAM,CAAoB,IAApB,CAA5B;EAEA,MAAMK,gBAAgB,GAAGL,MAAM,CAASM,GAAT,CAA/B;EAEA,MAAM;IAAEC;EAAF,IAAiBT,UAAU,CAACG,eAAD,CAAjC;;EAEA,MAAMO,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAL,aAAa,CAACQ,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAV,gBAAgB,CAACO,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAGnB,WAAW,CAAC,MAAM;IAC/BW,SAAS,CAACH,gBAAgB,CAACO,OAAlB,CAAT;EACH,CAF2B,EAEzB,EAFyB,CAA5B;EAIAb,SAAS,CAAC,MAAM;IACZ,MAAMkB,kBAAkB,GAAIC,KAAD,IAAmB;MAC1C,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;MACA,MAAME,cAAc,GAAGjB,WAAW,CAACgB,SAAD,CAAlC;;MAEA,IAAIC,cAAJ,EAAoB;QAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;QACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;MACH;;MAED,OAAO,CAAP;IACH,CAVD;;IAYA,OAAOd,UAAU,CAACmB,SAAX,CAAqBC,YAAY,IAAI;MACxCnB,SAAS,CAACS,kBAAkB,CAACU,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAhBQ,EAgBN,CAACpB,UAAD,EAAaJ,WAAb,CAhBM,CAAT;EAkBA,OAAO;IAAEC,aAAF;IAAiBY;EAAjB,CAAP;AACH;AAAA"}
+{"version":3,"names":["useCallback","useContext","useEffect","useRef","InternalContext","useScrollViewReaction","initialIndex","coordinates","scrollViewRef","lastScrolledXRef","NaN","indexStore","scrollToX","x","Number","isFinite","current","scrollTo","y","animated","onLayout","computeNextScrollX","index","prevIndex","prevCoordinate","prevTabWidth","x2","x1","Math","floor","isNaN","subscribe","currentIndex"],"sources":["useScrollViewReaction.ts"],"sourcesContent":["import type { MutableRefObject } from 'react';\nimport { useCallback, useContext, useEffect, useRef } from 'react';\nimport type { ScrollView, ViewProps } from 'react-native';\nimport type TabCoordinate from './TabCoordinate';\nimport InternalContext from './InternalContext';\n\nexport interface UseScrollViewReaction {\n    scrollViewRef: MutableRefObject<ScrollView | null>;\n    onLayout: ViewProps['onLayout'];\n}\n\nexport default function useScrollViewReaction(\n    initialIndex: number,\n    coordinates: TabCoordinate[],\n): UseScrollViewReaction {\n    const scrollViewRef = useRef<ScrollView | null>(null);\n\n    const lastScrolledXRef = useRef<number>(NaN);\n\n    const { indexStore } = useContext(InternalContext);\n\n    const scrollToX = (x: number) => {\n        if (Number.isFinite(x)) {\n            scrollViewRef.current?.scrollTo({ x, y: 0, animated: true });\n\n            lastScrolledXRef.current = x;\n        }\n    };\n\n    const onLayout = useCallback(() => {\n        scrollToX(lastScrolledXRef.current);\n    }, []);\n\n    const computeNextScrollX = useCallback((index: number): number => {\n        const prevIndex = index - 1;\n        const prevCoordinate = coordinates[prevIndex];\n\n        if (prevCoordinate) {\n            const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;\n            return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);\n        }\n\n        return 0;\n    }, [coordinates]);\n\n    useEffect(() => {\n        if (Number.isNaN(lastScrolledXRef.current)) {\n            const x = computeNextScrollX(initialIndex);\n            if (x > 0) {\n                scrollToX(x);\n            }\n        }\n    }, [initialIndex, computeNextScrollX]);\n\n    useEffect(() => {\n        return indexStore.subscribe(currentIndex => {\n            scrollToX(computeNextScrollX(currentIndex));\n        });\n    }, [indexStore, computeNextScrollX]);\n\n    return { scrollViewRef, onLayout };\n};\n"],"mappings":"AACA,SAASA,WAAT,EAAsBC,UAAtB,EAAkCC,SAAlC,EAA6CC,MAA7C,QAA2D,OAA3D;AAGA,OAAOC,eAAP,MAA4B,mBAA5B;AAOA,eAAe,SAASC,qBAAT,CACXC,YADW,EAEXC,WAFW,EAGU;EACrB,MAAMC,aAAa,GAAGL,MAAM,CAAoB,IAApB,CAA5B;EAEA,MAAMM,gBAAgB,GAAGN,MAAM,CAASO,GAAT,CAA/B;EAEA,MAAM;IAAEC;EAAF,IAAiBV,UAAU,CAACG,eAAD,CAAjC;;EAEA,MAAMQ,SAAS,GAAIC,CAAD,IAAe;IAC7B,IAAIC,MAAM,CAACC,QAAP,CAAgBF,CAAhB,CAAJ,EAAwB;MAAA;;MACpB,yBAAAL,aAAa,CAACQ,OAAd,gFAAuBC,QAAvB,CAAgC;QAAEJ,CAAF;QAAKK,CAAC,EAAE,CAAR;QAAWC,QAAQ,EAAE;MAArB,CAAhC;MAEAV,gBAAgB,CAACO,OAAjB,GAA2BH,CAA3B;IACH;EACJ,CAND;;EAQA,MAAMO,QAAQ,GAAGpB,WAAW,CAAC,MAAM;IAC/BY,SAAS,CAACH,gBAAgB,CAACO,OAAlB,CAAT;EACH,CAF2B,EAEzB,EAFyB,CAA5B;EAIA,MAAMK,kBAAkB,GAAGrB,WAAW,CAAEsB,KAAD,IAA2B;IAC9D,MAAMC,SAAS,GAAGD,KAAK,GAAG,CAA1B;IACA,MAAME,cAAc,GAAGjB,WAAW,CAACgB,SAAD,CAAlC;;IAEA,IAAIC,cAAJ,EAAoB;MAChB,MAAMC,YAAY,GAAGD,cAAc,CAACE,EAAf,GAAoBF,cAAc,CAACG,EAAxD;MACA,OAAOC,IAAI,CAACC,KAAL,CAAWL,cAAc,CAACG,EAAf,GAAoBF,YAAY,GAAG,CAA9C,CAAP;IACH;;IAED,OAAO,CAAP;EACH,CAVqC,EAUnC,CAAClB,WAAD,CAVmC,CAAtC;EAYAL,SAAS,CAAC,MAAM;IACZ,IAAIY,MAAM,CAACgB,KAAP,CAAarB,gBAAgB,CAACO,OAA9B,CAAJ,EAA4C;MACxC,MAAMH,CAAC,GAAGQ,kBAAkB,CAACf,YAAD,CAA5B;;MACA,IAAIO,CAAC,GAAG,CAAR,EAAW;QACPD,SAAS,CAACC,CAAD,CAAT;MACH;IACJ;EACJ,CAPQ,EAON,CAACP,YAAD,EAAee,kBAAf,CAPM,CAAT;EASAnB,SAAS,CAAC,MAAM;IACZ,OAAOS,UAAU,CAACoB,SAAX,CAAqBC,YAAY,IAAI;MACxCpB,SAAS,CAACS,kBAAkB,CAACW,YAAD,CAAnB,CAAT;IACH,CAFM,CAAP;EAGH,CAJQ,EAIN,CAACrB,UAAD,EAAaU,kBAAb,CAJM,CAAT;EAMA,OAAO;IAAEb,aAAF;IAAiBY;EAAjB,CAAP;AACH;AAAA"}

package/build/typescript/Tabs/ScrollableTabsView.d.ts

@@ -1,6 +1,7 @@
 import type { ScrollViewProps } from 'react-native';
 import TabCoordinate from './TabCoordinate';
 export interface ScrollableTabsViewProps extends ScrollViewProps {
+    initialIndex: number;
     coordinates: TabCoordinate[];
 }
 export default function ScrollableTabsView(props: ScrollableTabsViewProps): JSX.Element;

package/build/typescript/Tabs/useScrollViewReaction.d.ts

@@ -5,4 +5,4 @@ export interface UseScrollViewReaction {
     scrollViewRef: MutableRefObject<ScrollView | null>;
     onLayout: ViewProps['onLayout'];
 }
-export default function useScrollViewReaction(coordinates: TabCoordinate[]): UseScrollViewReaction;
+export default function useScrollViewReaction(initialIndex: number, coordinates: TabCoordinate[]): UseScrollViewReaction;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fountain-ui/core",
-  "version": "2.0.0-beta.21",
+  "version": "2.0.0-beta.22",
   "author": "Fountain-UI Team",
   "description": "React components that implement Tappytoon's Fountain Design.",
   "license": "MIT",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d18fb7ba86bc8aa042122e5321b9c26381bd5d5f"
+  "gitHead": "e97185cf56e1f51817e29a7d1b7e43bcf8ef0342"
 }

package/src/Tabs/ScrollableTabsView.tsx

@@ -5,16 +5,18 @@ import TabCoordinate from './TabCoordinate';
 import useScrollViewReaction from './useScrollViewReaction';
 
 export interface ScrollableTabsViewProps extends ScrollViewProps {
+    initialIndex: number;
     coordinates: TabCoordinate[];
 }
 
 export default function ScrollableTabsView(props: ScrollableTabsViewProps) {
     const {
         coordinates,
+        initialIndex,
         ...scrollViewProps
     } = props;
 
-    const { scrollViewRef, onLayout } = useScrollViewReaction(coordinates);
+    const { scrollViewRef, onLayout } = useScrollViewReaction(initialIndex, coordinates);
 
     return (
         <ScrollView

package/src/Tabs/Tabs.tsx

@@ -148,6 +148,7 @@ const Tabs = forwardRef<TabsInstance, TabsProps>(function Tabs(props, ref) {
                         coordinates={coordinates}
                         directionalLockEnabled={true}
                         horizontal={true}
+                        initialIndex={realInitialIndex}
                         scrollsToTop={false}
                         showsHorizontalScrollIndicator={false}
                         showsVerticalScrollIndicator={false}

package/src/Tabs/useScrollViewReaction.ts

@@ -10,6 +10,7 @@ export interface UseScrollViewReaction {
 }
 
 export default function useScrollViewReaction(
+    initialIndex: number,
     coordinates: TabCoordinate[],
 ): UseScrollViewReaction {
     const scrollViewRef = useRef<ScrollView | null>(null);
@@ -30,23 +31,32 @@ export default function useScrollViewReaction(
         scrollToX(lastScrolledXRef.current);
     }, []);
 
-    useEffect(() => {
-        const computeNextScrollX = (index: number) => {
-            const prevIndex = index - 1;
-            const prevCoordinate = coordinates[prevIndex];
+    const computeNextScrollX = useCallback((index: number): number => {
+        const prevIndex = index - 1;
+        const prevCoordinate = coordinates[prevIndex];
 
-            if (prevCoordinate) {
-                const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
-                return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
-            }
+        if (prevCoordinate) {
+            const prevTabWidth = prevCoordinate.x2 - prevCoordinate.x1;
+            return Math.floor(prevCoordinate.x1 + prevTabWidth / 2);
+        }
+
+        return 0;
+    }, [coordinates]);
 
-            return 0;
-        };
+    useEffect(() => {
+        if (Number.isNaN(lastScrolledXRef.current)) {
+            const x = computeNextScrollX(initialIndex);
+            if (x > 0) {
+                scrollToX(x);
+            }
+        }
+    }, [initialIndex, computeNextScrollX]);
 
+    useEffect(() => {
         return indexStore.subscribe(currentIndex => {
             scrollToX(computeNextScrollX(currentIndex));
         });
-    }, [indexStore, coordinates]);
+    }, [indexStore, computeNextScrollX]);
 
     return { scrollViewRef, onLayout };
 };