chore: update dependencies

BREAKING CHANGE:

Peer dependency changed to reanimated 3.8.1

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+yarn commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+yarn lint && yarn typescript

documentation/buildDocs.ts

@@ -81,15 +81,13 @@ const overrideProps: OverrideProps = {
   'Tabs.Container': {
     HeaderComponent: {
       type: {
-        name:
-          '((props: TabBarProps<T>) => React.ReactElement) | null | undefined',
+        name: '((props: TabBarProps<T>) => React.ReactElement) | null | undefined',
       },
       defaultValue: null,
     },
     TabBarComponent: {
       type: {
-        name:
-          '((props: TabBarProps<T>) => React.ReactElement) | null | undefined',
+        name: '((props: TabBarProps<T>) => React.ReactElement) | null | undefined',
       },
       defaultValue: { value: 'MaterialTabBar' },
     },
@@ -109,15 +107,13 @@ const overrideProps: OverrideProps = {
     },
     pagerProps: {
       type: {
-        name:
-          "Omit<FlatListProps<number>, 'data' | 'keyExtractor' | 'renderItem' | 'horizontal' | 'pagingEnabled' | 'onScroll' | 'showsHorizontalScrollIndicator' | 'getItemLayout'>",
+        name: "Omit<FlatListProps<number>, 'data' | 'keyExtractor' | 'renderItem' | 'horizontal' | 'pagingEnabled' | 'onScroll' | 'showsHorizontalScrollIndicator' | 'getItemLayout'>",
       },
       defaultValue: null,
     },
     onTabChange: {
       type: {
-        name:
-          '(data: { prevIndex: number index: number prevTabName: T tabName: T }) => void',
+        name: '(data: { prevIndex: number index: number prevTabName: T tabName: T }) => void',
       },
       defaultValue: null,
     },

example/ios/Podfile.lock

@@ -908,7 +908,7 @@ PODS:
   - React-Mapbuffer (0.73.2):
     - glog
     - React-debug
-  - react-native-pager-view (6.2.3):
+  - react-native-pager-view (6.3.0):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
@@ -1081,7 +1081,7 @@ PODS:
     - React-perflogger (= 0.73.2)
   - RNFlashList (1.6.4):
     - React-Core
-  - RNGestureHandler (2.14.1):
+  - RNGestureHandler (2.16.0):
     - glog
     - RCT-Folly (= 2022.05.16.00)
     - React-Core
@@ -1321,7 +1321,7 @@ SPEC CHECKSUMS:
   React-jsinspector: 03644c063fc3621c9a4e8bf263a8150909129618
   React-logger: 66b168e2b2bee57bd8ce9e69f739d805732a5570
   React-Mapbuffer: 9ee041e1d7be96da6d76a251f92e72b711c651d6
-  react-native-pager-view: d81ab2060b9caf57ca8c3a0d57467ff407cdb825
+  react-native-pager-view: ffde7887fb8dbf2d5b7a5df6d558f9e9a32942c5
   React-nativeconfig: d753fbbc8cecc8ae413d615599ac378bbf6999bb
   React-NativeModulesApple: 964f4eeab1b4325e8b6a799cf4444c3fd4eb0a9c
   React-perflogger: 29efe63b7ef5fbaaa50ef6eaa92482f98a24b97e
@@ -1343,7 +1343,7 @@ SPEC CHECKSUMS:
   React-utils: f5bc61e7ea3325c0732ae2d755f4441940163b85
   ReactCommon: 45b5d4f784e869c44a6f5a8fad5b114ca8f78c53
   RNFlashList: b521ebdd7f9352673817f1d98e8bdc0c8cf8545b
-  RNGestureHandler: 25b969a1ffc806b9f9ad2e170d4a3b049c6af85e
+  RNGestureHandler: 727b656d5a3fa247aac2c8cc70b8757356066451
   RNReanimated: 3e23d4be380e295e504b7b3b3a357df60e1168a2
   SocketRocket: f32cd54efbe0f095c4d7594881e52619cfe80b17
   Yoga: e64aa65de36c0832d04e8c7bd614396c77a80047

example/package.json

@@ -12,8 +12,8 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-native": "0.73.2",
-    "react-native-gesture-handler": "~2.14.0",
-    "react-native-pager-view": "6.2.3",
+    "react-native-gesture-handler": "~2.16.0",
+    "react-native-pager-view": "~6.3.0",
     "react-native-reanimated": "^3.8.1",
     "react-native-web": "~0.19.6",
     "use-debounce": "^5.2.0",

example/src/AnimatedHeader.tsx

@@ -7,10 +7,10 @@ import Animated, {
   useDerivedValue,
 } from 'react-native-reanimated'
 
-import { useCurrentTabScrollY } from '../../src/hooks'
 import ExampleComponent from './Shared/ExampleComponent'
 import ReText from './Shared/ReText'
 import { ExampleComponentType } from './types'
+import { useCurrentTabScrollY } from '../../src/hooks'
 
 const title = 'Animated Header'
 

example/src/ConditionalTabs.tsx

@@ -2,9 +2,9 @@ import React, { useState } from 'react'
 import { View, Text, StyleSheet } from 'react-native'
 import { TouchableOpacity } from 'react-native-gesture-handler'
 
-import { TabBarProps } from '../../src/types'
 import ExampleComponent from './Shared/ExampleComponent'
 import { ExampleComponentType } from './types'
+import { TabBarProps } from '../../src/types'
 
 const title = 'Conditional Tabs'
 

example/src/FlashList.tsx

@@ -7,10 +7,10 @@ import Animated, {
   useDerivedValue,
 } from 'react-native-reanimated'
 
-import { useCurrentTabScrollY } from '../../src/hooks'
 import ExampleComponent from './Shared/ExampleComponentFlashList'
 import ReText from './Shared/ReText'
 import { ExampleComponentType } from './types'
+import { useCurrentTabScrollY } from '../../src/hooks'
 
 const title = 'FlashList (contacts tab)'
 

example/src/MasonryFlashList.tsx

@@ -7,10 +7,10 @@ import Animated, {
   useDerivedValue,
 } from 'react-native-reanimated'
 
-import { useCurrentTabScrollY } from '../../src/hooks'
 import ExampleComponent from './Shared/ExampleComponentMasonryFlashList'
 import ReText from './Shared/ReText'
 import { ExampleComponentType } from './types'
+import { useCurrentTabScrollY } from '../../src/hooks'
 
 const title = 'MasonryFlashList'
 

example/src/ScrollOnHeader.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
 import { View } from 'react-native'
 
-import { TabBarProps } from '../../src/types'
 import ExampleComponent from './Shared/ExampleComponent'
 import Header from './Shared/Header'
 import { ExampleComponentType } from './types'
+import { TabBarProps } from '../../src/types'
 
 const title = 'Scroll On Header'
 

example/src/Shared/ExampleComponentCustomLabels.tsx

@@ -13,12 +13,12 @@ import Animated, {
   useAnimatedStyle,
 } from 'react-native-reanimated'
 
-import { TabName } from '../../../src/types'
 import Albums from './Albums'
 import Article from './Article'
 import Contacts from './Contacts'
 import { HEADER_HEIGHT } from './Header'
 import SectionContacts from './SectionContacts'
+import { TabName } from '../../../src/types'
 
 type Props = {
   emptyContacts?: boolean
@@ -83,13 +83,14 @@ function TabItem<T extends TabName>({
 const Example = React.forwardRef<CollapsibleRef, Props>(
   ({ emptyContacts, ...props }, ref) => {
     const makeLabel = useCallback(
-      <T extends TabName>(label: string) => (props: TabItemProps<T>) => (
-        <TabItem
-          index={props.index}
-          indexDecimal={props.indexDecimal}
-          label={label}
-        />
-      ),
+      <T extends TabName>(label: string) =>
+        (props: TabItemProps<T>) => (
+          <TabItem
+            index={props.index}
+            indexDecimal={props.indexDecimal}
+            label={label}
+          />
+        ),
       []
     )
 

example/src/Shared/ExampleMasonry.tsx

@@ -125,6 +125,8 @@ const ExampleMasonry: React.FC<{
 
   React.useEffect(() => {
     refresh()
+    // refresh just once
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
   return (

example/yarn.lock

@@ -5680,21 +5680,21 @@ react-is@^17.0.1:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
   integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
 
-react-native-gesture-handler@~2.14.0:
-  version "2.14.1"
-  resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-2.14.1.tgz#930640231024b7921435ab476aa501dd4a6b2e01"
-  integrity sha512-YiM1BApV4aKeuwsM6O4C2ufwewYEKk6VMXOt0YqEZFMwABBFWhXLySFZYjBSNRU2USGppJbfHP1q1DfFQpKhdA==
+react-native-gesture-handler@~2.16.0:
+  version "2.16.0"
+  resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-2.16.0.tgz#45a00b5988e74ebc58f130c8d1443319c8e678db"
+  integrity sha512-1hFkx7RIfeJSyTQQ0Nkv4icFVZ5+XjQkd47OgZMBFzoB7ecL+nFSz8KLi3OCWOhq+nbHpSPlSG5VF3CQNCJpWA==
   dependencies:
     "@egjs/hammerjs" "^2.0.17"
     hoist-non-react-statics "^3.3.0"
     invariant "^2.2.4"
     lodash "^4.17.21"
     prop-types "^15.7.2"
 
-react-native-pager-view@6.2.3:
-  version "6.2.3"
-  resolved "https://registry.yarnpkg.com/react-native-pager-view/-/react-native-pager-view-6.2.3.tgz#698f6387fdf06cecc3d8d4792604419cb89cb775"
-  integrity sha512-dqVpXWFtPNfD3D2QQQr8BP+ullS5MhjRJuF8Z/qml4QTILcrWaW8F5iAxKkQR3Jl0ikcEryG/+SQlNcwlo0Ggg==
+react-native-pager-view@~6.3.0:
+  version "6.3.0"
+  resolved "https://registry.yarnpkg.com/react-native-pager-view/-/react-native-pager-view-6.3.0.tgz#7e734e84b1692f877591335373f6fd92f0d67aa6"
+  integrity sha512-ufJOoVa9pFL1J/yb4hpsCqp8n1qTlcF5VvwqvCacHX//D7hSeRscsiIXg1u1pXNWwllvACb+mqxec/3Uj2mxrA==
 
 react-native-reanimated@^3.8.1:
   version "3.8.1"

package.json

@@ -19,7 +19,7 @@
     "bootstrap": "yarn example && yarn",
     "prepack": "bob build",
     "docs": "ts-node ./documentation/buildDocs.ts",
-    "prepare": "bob build"
+    "prepare": "bob build && husky install"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -46,52 +46,46 @@
   },
   "homepage": "https://github.com/PedroBern/react-native-collapsible-tab-view#readme",
   "devDependencies": {
-    "@commitlint/config-conventional": "^9.1.1",
-    "@microsoft/tsdoc": "^0.13.0",
+    "@commitlint/config-conventional": "^19.1.0",
+    "@microsoft/tsdoc": "^0.14.2",
     "@release-it/conventional-changelog": "^8.0.1",
-    "@shopify/flash-list": "^1.5.0",
-    "@types/react": "~18.0.27",
-    "@types/react-native": "0.71.6",
-    "babel-jest": "^26.2.2",
-    "babel-preset-react-native": "^4.0.0",
-    "commitlint": "^9.1.0",
-    "eslint": "^7.6.0",
-    "eslint-config-universe": "^7.0.1",
-    "eslint-plugin-react": "^7.22.0",
-    "eslint-plugin-react-native": "^3.10.0",
+    "@shopify/flash-list": "^1.6.4",
+    "@types/react": "~18.2.74",
+    "@types/react-native": "0.73.0",
+    "babel-jest": "^29.7.0",
+    "babel-preset-react-native": "^4.0.1",
+    "commitlint": "^19.2.1",
+    "eslint": "^8.57.0",
+    "eslint-config-universe": "^12.0.0",
+    "eslint-plugin-react": "^7.34.0",
+    "eslint-plugin-react-native": "^4.1.0",
     "eslint-plugin-react-native-globals": "^0.1.2",
-    "husky": "^4.2.5",
-    "jest": "^26.2.2",
-    "prettier": "^2.2.1",
-    "react": "~16.11.0",
+    "husky": "^9.0.11",
+    "jest": "^29.7.0",
+    "prettier": "^3.2.5",
+    "react": "~18.2.0",
     "react-docgen-typescript": "^1.20.5",
-    "react-native": "~0.71.6",
+    "react-native": "~0.73.6",
     "react-native-builder-bob": "^0.18.2",
-    "react-native-gesture-handler": "~1.6.0",
-    "react-native-pager-view": "^5",
-    "react-native-reanimated": "3.1.0",
+    "react-native-gesture-handler": "~2.16.0",
+    "react-native-pager-view": "^6.3.0",
+    "react-native-reanimated": "3.8.1",
     "release-it": "^17.1.1",
-    "ts-node": "^9.1.1",
-    "typescript": "^3.9.7"
+    "ts-node": "^10.9.2",
+    "typescript": "^5.4.3"
   },
   "peerDependencies": {
     "@shopify/flash-list": ">=1.0.0",
     "react": "*",
     "react-native": "*",
     "react-native-pager-view": "*",
-    "react-native-reanimated": ">=2.15.0"
+    "react-native-reanimated": ">=3.8.1"
   },
   "peerDependenciesMeta": {
     "@shopify/flash-list": {
       "optional": true
     }
   },
-  "husky": {
-    "hooks": {
-      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
-      "pre-commit": "yarn lint && yarn typescript"
-    }
-  },
   "jest": {
     "preset": "react-native",
     "modulePathIgnorePatterns": [

src/Container.tsx

@@ -143,15 +143,17 @@ export const Container = React.memo(
         setData(tabNamesArray)
       }, [tabNamesArray])
 
-      const focusedTab: ContextType['focusedTab'] = useDerivedValue<TabName>(() => {
-        return tabNames.value[index.value]
-      }, [tabNames])
+      const focusedTab: ContextType['focusedTab'] =
+        useDerivedValue<TabName>(() => {
+          return tabNames.value[index.value]
+        }, [tabNames])
       const calculateNextOffset = useSharedValue(index.value)
-      const headerScrollDistance: ContextType['headerScrollDistance'] = useDerivedValue(() => {
-        return headerHeight.value !== undefined
-          ? headerHeight.value - minHeaderHeight
-          : 0
-      }, [headerHeight, minHeaderHeight])
+      const headerScrollDistance: ContextType['headerScrollDistance'] =
+        useDerivedValue(() => {
+          return headerHeight.value !== undefined
+            ? headerHeight.value - minHeaderHeight
+            : 0
+        }, [headerHeight, minHeaderHeight])
 
       const indexDecimal: ContextType['indexDecimal'] = useSharedValue(
         index.value

src/FlashList.tsx

@@ -36,10 +36,10 @@ const ensureFlastList = () => {
 
   try {
     const flashListModule = require('@shopify/flash-list')
-    AnimatedFlashList = (Animated.createAnimatedComponent(
+    AnimatedFlashList = Animated.createAnimatedComponent(
       flashListModule.FlashList
-    ) as unknown) as React.ComponentClass<FlashListProps<any>>
-  } catch (error) {
+    ) as unknown as React.ComponentClass<FlashListProps<any>>
+  } catch {
     console.error(
       'The optional dependency @shopify/flash-list is not installed. Please install it to use the FlashList component.'
     )
@@ -102,10 +102,10 @@ function FlashListImpl<R>(
   })
 
   const scrollContentSizeChangeHandlers = useChainCallback(
-    React.useMemo(() => [scrollContentSizeChange, onContentSizeChange], [
-      onContentSizeChange,
-      scrollContentSizeChange,
-    ])
+    React.useMemo(
+      () => [scrollContentSizeChange, onContentSizeChange],
+      [onContentSizeChange, scrollContentSizeChange]
+    )
   )
 
   const memoRefreshControl = React.useMemo(
@@ -120,9 +120,10 @@ function FlashListImpl<R>(
 
   const contentInsetValue = useConvertAnimatedToValue<number>(contentInset)
 
-  const memoContentInset = React.useMemo(() => ({ top: contentInsetValue }), [
-    contentInsetValue,
-  ])
+  const memoContentInset = React.useMemo(
+    () => ({ top: contentInsetValue }),
+    [contentInsetValue]
+  )
 
   const memoContentOffset = React.useMemo(
     () => ({ x: 0, y: -contentInsetValue }),