diff options
Diffstat (limited to 'src/view/com/pager/Pager.web.tsx')
-rw-r--r-- | src/view/com/pager/Pager.web.tsx | 88 |
1 files changed, 43 insertions, 45 deletions
diff --git a/src/view/com/pager/Pager.web.tsx b/src/view/com/pager/Pager.web.tsx index 7be2b11ec..fe4febbb7 100644 --- a/src/view/com/pager/Pager.web.tsx +++ b/src/view/com/pager/Pager.web.tsx @@ -14,51 +14,49 @@ interface Props { renderTabBar: RenderTabBarFn onPageSelected?: (index: number) => void } -export const Pager = React.forwardRef( - ( - { - children, - tabBarPosition = 'top', - initialPage = 0, - renderTabBar, - onPageSelected, - }: React.PropsWithChildren<Props>, - ref, - ) => { - const [selectedPage, setSelectedPage] = React.useState(initialPage) +export const Pager = React.forwardRef(function PagerImpl( + { + children, + tabBarPosition = 'top', + initialPage = 0, + renderTabBar, + onPageSelected, + }: React.PropsWithChildren<Props>, + ref, +) { + const [selectedPage, setSelectedPage] = React.useState(initialPage) - React.useImperativeHandle(ref, () => ({ - setPage: (index: number) => setSelectedPage(index), - })) + React.useImperativeHandle(ref, () => ({ + setPage: (index: number) => setSelectedPage(index), + })) - const onTabBarSelect = React.useCallback( - (index: number) => { - setSelectedPage(index) - onPageSelected?.(index) - }, - [setSelectedPage, onPageSelected], - ) + const onTabBarSelect = React.useCallback( + (index: number) => { + setSelectedPage(index) + onPageSelected?.(index) + }, + [setSelectedPage, onPageSelected], + ) - return ( - <View> - {tabBarPosition === 'top' && - renderTabBar({ - selectedPage, - onSelect: onTabBarSelect, - })} - {React.Children.map(children, (child, i) => ( - <View - style={selectedPage === i ? undefined : s.hidden} - key={`page-${i}`}> - {child} - </View> - ))} - {tabBarPosition === 'bottom' && - renderTabBar({ - selectedPage, - onSelect: onTabBarSelect, - })} - </View> - ) - }, -) + return ( + <View> + {tabBarPosition === 'top' && + renderTabBar({ + selectedPage, + onSelect: onTabBarSelect, + })} + {React.Children.map(children, (child, i) => ( + <View + style={selectedPage === i ? undefined : s.hidden} + key={`page-${i}`}> + {child} + </View> + ))} + {tabBarPosition === 'bottom' && + renderTabBar({ + selectedPage, + onSelect: onTabBarSelect, + })} + </View> + ) +}) |