codeherence · e-younan · Jun 9, 2023 · Jun 8, 2023 · Jun 8, 2023 · Jun 8, 2023
diff --git a/.husky/commit-msg b/.husky/commit-msg
@@ -1,4 +1,42 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
+#!/bin/sh
 
-npx --no -- commitlint --edit "$1"
+if [ "$LEFTHOOK" = "0" ]; then
+  exit 0
+fi
+
+call_lefthook()
+{
+  dir="$(git rev-parse --show-toplevel)"
+  osArch=$(echo "$(uname)" | tr '[:upper:]' '[:lower:]')
+  cpuArch=$(echo "$(uname -m)" | sed 's/aarch64/arm64/')
+
+  if lefthook -h >/dev/null 2>&1
+  then
+    eval lefthook $@
+  elif test -f "$dir/node_modules/lefthook/bin/index.js"
+  then
+    eval "\"$dir/node_modules/lefthook/bin/index.js\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif bundle exec lefthook -h >/dev/null 2>&1
+  then
+    bundle exec lefthook $@
+  elif yarn lefthook -h >/dev/null 2>&1
+  then
+    yarn lefthook $@
+  elif pnpm lefthook -h >/dev/null 2>&1
+  then
+    pnpm lefthook $@
+  elif npx @evilmartians/lefthook -h >/dev/null 2>&1
+  then
+    npx @evilmartians/lefthook $@
+  else
+    echo "Can't find lefthook in PATH"
+  fi
+}
+
+call_lefthook "run commit-msg $@"
diff --git a/.husky/commit-msg.old b/.husky/commit-msg.old
@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no -- commitlint --edit "$1"
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -1,4 +1,42 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
+#!/bin/sh
 
-npm test
+if [ "$LEFTHOOK" = "0" ]; then
+  exit 0
+fi
+
+call_lefthook()
+{
+  dir="$(git rev-parse --show-toplevel)"
+  osArch=$(echo "$(uname)" | tr '[:upper:]' '[:lower:]')
+  cpuArch=$(echo "$(uname -m)" | sed 's/aarch64/arm64/')
+
+  if lefthook -h >/dev/null 2>&1
+  then
+    eval lefthook $@
+  elif test -f "$dir/node_modules/lefthook/bin/index.js"
+  then
+    eval "\"$dir/node_modules/lefthook/bin/index.js\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif bundle exec lefthook -h >/dev/null 2>&1
+  then
+    bundle exec lefthook $@
+  elif yarn lefthook -h >/dev/null 2>&1
+  then
+    yarn lefthook $@
+  elif pnpm lefthook -h >/dev/null 2>&1
+  then
+    pnpm lefthook $@
+  elif npx @evilmartians/lefthook -h >/dev/null 2>&1
+  then
+    npx @evilmartians/lefthook $@
+  else
+    echo "Can't find lefthook in PATH"
+  fi
+}
+
+call_lefthook "run pre-commit $@"
diff --git a/.husky/pre-commit.old b/.husky/pre-commit.old
@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npm test
diff --git a/.husky/prepare-commit-msg b/.husky/prepare-commit-msg
@@ -0,0 +1,42 @@
+#!/bin/sh
+
+if [ "$LEFTHOOK" = "0" ]; then
+  exit 0
+fi
+
+call_lefthook()
+{
+  dir="$(git rev-parse --show-toplevel)"
+  osArch=$(echo "$(uname)" | tr '[:upper:]' '[:lower:]')
+  cpuArch=$(echo "$(uname -m)" | sed 's/aarch64/arm64/')
+
+  if lefthook -h >/dev/null 2>&1
+  then
+    eval lefthook $@
+  elif test -f "$dir/node_modules/lefthook/bin/index.js"
+  then
+    eval "\"$dir/node_modules/lefthook/bin/index.js\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif test -f "$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook"
+  then
+    eval "\"$dir/node_modules/@evilmartians/lefthook-installer/bin/lefthook_${osArch}_${cpuArch}/lefthook\" $@"
+  elif bundle exec lefthook -h >/dev/null 2>&1
+  then
+    bundle exec lefthook $@
+  elif yarn lefthook -h >/dev/null 2>&1
+  then
+    yarn lefthook $@
+  elif pnpm lefthook -h >/dev/null 2>&1
+  then
+    pnpm lefthook $@
+  elif npx @evilmartians/lefthook -h >/dev/null 2>&1
+  then
+    npx @evilmartians/lefthook $@
+  else
+    echo "Can't find lefthook in PATH"
+  fi
+}
+
+call_lefthook "run prepare-commit-msg $@"
diff --git a/docs/docs/01-getting-started.mdx b/docs/docs/01-getting-started.mdx
@@ -16,11 +16,12 @@ Before using this package, please make sure that you install the correct version
 
 <br />
 
-| react-native-header | react-native | react-native-reanimated | react-native-safe-area-context |
-| ------------------- | ------------ | ----------------------- | ------------------------------ |
-| 0.6.x               | >= 0.65      | >= 2.11.0               | >= 4.1.0                       |
-| 0.7.x               | >= 0.65      | >= 2.0.0                | >= 4.1.0                       |
-| 0.8.x               | >= 0.65      | >= 2.0.0                | >= 4.1.0                       |
+| react-native-header | react-native | react-native-reanimated | react-native-safe-area-context | @shopify/flash-list |
+| ------------------- | ------------ | ----------------------- | ------------------------------ | ------------------- |
+| 0.6.x               | >= 0.65      | >= 2.11.0               | >= 4.1.0                       | N/A                 |
+| 0.7.x               | >= 0.65      | >= 2.0.0                | >= 4.1.0                       | N/A                 |
+| 0.8.x               | >= 0.65      | >= 2.0.0                | >= 4.1.0                       | N/A                 |
+| 0.9.x               | >= 0.65      | >= 2.0.0                | >= 4.1.0                       | >= 3.2.0            |
 
 ## Pre-requisites
 
@@ -31,6 +32,8 @@ Before you can use `react-native-header`, you need to have the following librari
 
 If you haven't installed these libraries yet, please follow the installation instructions on their respective documentation pages.
 
+If you intend to use the [FlashListWithHeaders](/docs/components/flash-list-with-headers) component, please ensure that you review the [Compatibilty table](/docs/getting-started#compatibility) above and install the correct versions of each library.
+
 ## Installation
 
 Once you have [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated) and [react-native-safe-area-context](https://github.com/th3rdwave/react-native-safe-area-context) set up in your project, you can install `react-native-header`:

diff --git a/...omponents/01-scroll-view-with-headers.mdx → ...reference/01-scroll-view-with-headers.mdx b/...omponents/01-scroll-view-with-headers.mdx → ...reference/01-scroll-view-with-headers.mdx
diff --git a/.../components/02-flat-list-with-headers.mdx → ...i-reference/02-flat-list-with-headers.mdx b/.../components/02-flat-list-with-headers.mdx → ...i-reference/02-flat-list-with-headers.mdx
diff --git a/...mponents/03-section-list-with-headers.mdx → ...eference/03-section-list-with-headers.mdx b/...mponents/03-section-list-with-headers.mdx → ...eference/03-section-list-with-headers.mdx
diff --git a/docs/docs/03-api-reference/04-flash-list-with-headers.mdx b/docs/docs/03-api-reference/04-flash-list-with-headers.mdx
@@ -0,0 +1,88 @@
+---
+title: FlashListWithHeaders
+hide_table_of_contents: false
+slug: /components/Flash-list-with-headers
+description: Shopify's FlashList paired with React Native Header.
+---
+
+Component that extends Shopify's [FlashList](https://shopify.github.io/flash-list/docs/) to add support for
+headers exported from this library.
+
+The implementation of this component relies on the [HeaderComponent](/docs/components/flash-list-with-headers#headercomponent)
+and [LargeHeaderComponent](/docs/components/flash-list-with-headers#largeheadercomponent) props.
+The [HeaderComponent](/docs/components/flash-list-with-headers#headercomponent) is rendered above
+the FlashList and the [LargeHeaderComponent](/docs/components/flash-list-with-headers#largeheadercomponent)
+is rendered as the `ListHeaderComponent` of the FlashList. Using these two props will allow for
+animations/built-in features in this library to work properly.
+
+## Note
+
+This component is only available in react-native-header version >= `0.9.x`. Please review the [Compatibility matrix](/docs/getting-started#compatibility) and ensure
+you have the correct dependencies installed in your project before using this component.
+
+## Props
+
+This component uses the FlashList under the hood, which inherits [all of the props
+from the FlashList component](https://shopify.github.io/flash-list/docs/usage).
+
+### HeaderComponent
+
+The component to render above the FlashList. This accepts a function that returns a React Element
+to display as the header. The function will be called with the following arguments:
+
+- `showNavBar`: An animated value that will be 0 when the header's subcomponents should be hidden
+  and 1 when they should be shown. This is useful for animating the header's subcomponents. The
+  [Header](/docs/components/header) component uses this value to animate its left, center, and
+  right children.
+
+### LargeHeaderComponent
+
+An optional component to render as the large header for this component. This accepts a function
+that returns a React Element to display as the large header. The function will be called with the
+following arguments:
+
+- `scrollY`: An animated value that keeps track of the current scroll position of the FlashList.
+  This prop is useful for creating custom animations on the large header. In our [example](/docs/example),
+  we use the [ScalingView](/docs/components/scaling-view) component to scale the large header
+  when the user pulls down on the FlashList (to mimic native iOS behaviour).
+- `showNavBar`: An animated value that keeps track of whether or not the small header is hidden.
+  This prop is useful if you want to create your own custom animations based on whether or not the
+  small header is hidden.
+
+### ignoreLeftSafeArea
+
+An optional boolean that determines whether or not to ignore the left safe area. Defaults to
+`false`. The safe area adjustments are used to make sure that the scroll container does not
+overlap with the notch/headers on different phones - leave this prop as false if you want to
+respect those safe areas.
+
+### ignoreRightSafeArea
+
+An optional boolean that determines whether or not to ignore the right safe area. Defaults to
+`false`. The safe area adjustments are used to make sure that the scroll container does not
+overlap with the notch/headers on different phones - leave this prop as `false` if you want to
+respect those safe areas.
+
+### disableAutoFixScroll
+
+An optional to disable the auto fix scroll mechanism. This is useful if you want to disable the
+auto scroll when the large header is partially visible. Defaults to `false`.
+
+### containerStyle
+
+An optional style object that will be applied to the parent container of the scroll container.
+
+### largeHeaderContainerStyle
+
+An optional style object that will be applied to the large header container.
+
+### largeHeaderShown
+
+An optional animated [Shared Value](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/shared-values/)
+that will be mutated by the library when the large header is shown or hidden. This is useful if you
+would like to track when the large header is shown or hidden.
+
+### onLargeHeaderLayout
+
+An optional callback that will be called when the large header is laid out. This is useful if you
+want to access the layout of the large header to calculate the height of the large header.
diff --git a/...03-api-reference/components/04-header.mdx → docs/docs/03-api-reference/05-header.mdx b/...03-api-reference/components/04-header.mdx → docs/docs/03-api-reference/05-header.mdx
diff --git a/...-reference/components/05-large-header.mdx → ...docs/03-api-reference/06-large-header.mdx b/...-reference/components/05-large-header.mdx → ...docs/03-api-reference/06-large-header.mdx
diff --git a/...i-reference/components/07-fading-view.mdx → .../docs/03-api-reference/07-fading-view.mdx b/...i-reference/components/07-fading-view.mdx → .../docs/03-api-reference/07-fading-view.mdx
diff --git a/...-reference/components/06-scaling-view.mdx → ...docs/03-api-reference/08-scaling-view.mdx b/...-reference/components/06-scaling-view.mdx → ...docs/03-api-reference/08-scaling-view.mdx
diff --git a/docs/docs/03-api-reference/components/_category_.json b/docs/docs/03-api-reference/components/_category_.json
diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock
@@ -12,7 +12,7 @@ PODS:
   - EXJSONUtils (0.5.1)
   - EXManifests (0.5.2):
     - EXJSONUtils
-  - Expo (48.0.9):
+  - Expo (48.0.19):
     - ExpoModulesCore
   - expo-dev-client (2.1.6):
     - EXManifests
@@ -88,11 +88,11 @@ PODS:
     - expo-dev-menu/SafeAreaView
   - ExpoKeepAwake (12.0.1):
     - ExpoModulesCore
-  - ExpoModulesCore (1.2.6):
+  - ExpoModulesCore (1.2.7):
     - React-Core
     - React-RCTAppDelegate
     - ReactCommon/turbomodule/core
-  - EXSplashScreen (0.18.1):
+  - EXSplashScreen (0.18.2):
     - ExpoModulesCore
     - React-Core
   - EXUpdatesInterface (0.9.1)
@@ -361,7 +361,7 @@ PODS:
   - React-jsinspector (0.71.4)
   - React-logger (0.71.4):
     - glog
-  - react-native-blur (4.3.0):
+  - react-native-blur (4.3.2):
     - React-Core
   - react-native-safe-area-context (4.5.0):
     - RCT-Folly
@@ -453,7 +453,9 @@ PODS:
     - React-jsi (= 0.71.4)
     - React-logger (= 0.71.4)
     - React-perflogger (= 0.71.4)
-  - RNReanimated (2.14.4):
+  - RNFlashList (1.4.3):
+    - React-Core
+  - RNReanimated (3.3.0-nightly-20230607-2426f3209):
     - DoubleConversion
     - FBLazyVector
     - FBReactNativeSpec
@@ -483,7 +485,7 @@ PODS:
   - RNScreens (3.20.0):
     - React-Core
     - React-RCTImage
-  - RNSVG (13.8.0):
+  - RNSVG (13.9.0):
     - React-Core
   - Yoga (1.14.0)
 
@@ -540,6 +542,7 @@ DEPENDENCIES:
   - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
   - React-runtimeexecutor (from `../node_modules/react-native/ReactCommon/runtimeexecutor`)
   - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
+  - "RNFlashList (from `../node_modules/@shopify/flash-list`)"
   - RNReanimated (from `../node_modules/react-native-reanimated`)
   - RNScreens (from `../node_modules/react-native-screens`)
   - RNSVG (from `../node_modules/react-native-svg`)
@@ -651,6 +654,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/runtimeexecutor"
   ReactCommon:
     :path: "../node_modules/react-native/ReactCommon"
+  RNFlashList:
+    :path: "../node_modules/@shopify/flash-list"
   RNReanimated:
     :path: "../node_modules/react-native-reanimated"
   RNScreens:
@@ -669,14 +674,14 @@ SPEC CHECKSUMS:
   EXFont: 6ea3800df746be7233208d80fe379b8ed74f4272
   EXJSONUtils: 48b1e764ac35160e6f54d21ab60d7d9501f3e473
   EXManifests: 500666d48e8dd7ca5a482c9e729e4a7a6c34081b
-  Expo: 863488a600a4565698a79577117c70b170054d08
+  Expo: 8448e3a2aa1b295f029c81551e1ab6d986517fdb
   expo-dev-client: 84792ce20d34fa5c882cdc3ca338ea1b2cde5013
   expo-dev-launcher: c50f1b78ea294f5762902b768952898d17739983
   expo-dev-menu: 9f454e0353860c80c55a9805e16dfebf4fd2da5e
   expo-dev-menu-interface: 6c82ae323c4b8724dead4763ce3ff24a2108bdb1
   ExpoKeepAwake: 69f5f627670d62318410392d03e0b5db0f85759a
-  ExpoModulesCore: 6e0259511f4c4341b6b8357db393624df2280828
-  EXSplashScreen: cd7fb052dff5ba8311d5c2455ecbebffe1b7a8ca
+  ExpoModulesCore: 653958063a301098b541ae4dfed1ac0b98db607b
+  EXSplashScreen: 0e0a9ba0cf7553094e93213099bd7b42e6e237e9
   EXUpdatesInterface: dd699d1930e28639dcbd70a402caea98e86364ca
   FBLazyVector: 446e84642979fff0ba57f3c804c2228a473aeac2
   FBReactNativeSpec: 241709e132e3bf1526c1c4f00bc5384dd39dfba9
@@ -698,7 +703,7 @@ SPEC CHECKSUMS:
   React-jsiexecutor: d6b7fa9260aa3cb40afee0507e3bc1d17ecaa6f2
   React-jsinspector: 1f51e775819199d3fe9410e69ee8d4c4161c7b06
   React-logger: 0d58569ec51d30d1792c5e86a8e3b78d24b582c6
-  react-native-blur: 50c9feabacbc5f49b61337ebc32192c6be7ec3c3
+  react-native-blur: cfdad7b3c01d725ab62a8a729f42ea463998afa2
   react-native-safe-area-context: 39c2d8be3328df5d437ac1700f4f3a4f75716acc
   React-perflogger: 0bb0522a12e058f6eb69d888bc16f40c16c4b907
   React-RCTActionSheet: bfd675a10f06a18728ea15d82082d48f228a213a
@@ -713,9 +718,10 @@ SPEC CHECKSUMS:
   React-RCTVibration: ad17efcfb2fa8f6bfd8ac0cf48d96668b8b28e0b
   React-runtimeexecutor: 8fa50b38df6b992c76537993a2b0553d3b088004
   ReactCommon: b49a4b00ca6d181ff74b17c12b2d59ac4add0bde
-  RNReanimated: cc5e3aa479cb9170bcccf8204291a6950a3be128
+  RNFlashList: ade81b4e928ebd585dd492014d40fb8d0e848aab
+  RNReanimated: cd48763253ed39d3c4097c677865c6182fba64e2
   RNScreens: 218801c16a2782546d30bd2026bb625c0302d70f
-  RNSVG: c1e76b81c76cdcd34b4e1188852892dc280eb902
+  RNSVG: 53c661b76829783cdaf9b7a57258f3d3b4c28315
   Yoga: 79dd7410de6f8ad73a77c868d3d368843f0c93e0
 
 PODFILE CHECKSUM: 675d5c47e1336b7b792d33fad9d8fbf19b97d359