chore: added props validation (#6)

package.json

@@ -36,6 +36,7 @@
     "bootstrap": "yarn install && yarn example"
   },
   "dependencies": {
+    "invariant": "^2.2.4",
     "lodash.isequal": "^4.5.0",
     "react-native-redash": "^14.2.3"
   },
@@ -45,6 +46,7 @@
     "@react-native-community/bob": "^0.16.2",
     "@react-native-community/eslint-config": "^2.0.0",
     "@release-it/conventional-changelog": "^1.1.4",
+    "@types/invariant": "^2.2.33",
     "@types/lodash.isequal": "^4.5.5",
     "@types/react": "^16.9.19",
     "@types/react-native": "0.61.10",

src/components/bottomSheet/BottomSheet.tsx

@@ -8,6 +8,7 @@ import React, {
 } from 'react';
 import { ViewStyle } from 'react-native';
 import isEqual from 'lodash.isequal';
+import invariant from 'invariant';
 import Animated, {
   useCode,
   onChange,
@@ -95,6 +96,54 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
     },
     ref
   ) => {
+    //#region validate props
+    // validate `snapPoints`
+    invariant(
+      _snapPoints,
+      `'snapPoints' was not provided! please provide at least one snap point.`
+    );
+
+    invariant(
+      _snapPoints.length > 0,
+      `'snapPoints' was provided with no points! please provide at least one snap point.`
+    );
+
+    // validate `initialSnapIndex`
+    invariant(
+      typeof initialSnapIndex === 'number',
+      `'initialSnapIndex' was provided but with wrong type ! expected type is a number.`
+    );
+
+    invariant(
+      initialSnapIndex >= -1 && initialSnapIndex <= _snapPoints.length - 1,
+      `'initialSnapIndex' was provided but out of the provided snap points range! expected value to be between -1, ${
+        _snapPoints.length - 1
+      }`
+    );
+
+    // topInset
+    invariant(
+      typeof topInset === 'number',
+      `'topInset' was provided but with wrong type ! expected type is a number.`
+    );
+
+    // validate animations
+    invariant(
+      typeof animationDuration === 'number',
+      `'animationDuration' was provided but with wrong type ! expected type is a number.`
+    );
+
+    invariant(
+      animationDuration > 0,
+      `'animationDuration' was provided but the value is very low! expected value to be greater than 0`
+    );
+
+    invariant(
+      typeof animationEasing === 'function',
+      `'animationEasing' was provided but with wrong type ! expected type is a Animated.EasingFunction.`
+    );
+    //#endregion
+
     //#region refs
     const currentPositionIndexRef = useRef<number>(initialSnapIndex);
     const rootTapGestureRef = useRef<TapGestureHandler>(null);
@@ -110,9 +159,7 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
       flashScrollableIndicators,
     } = useScrollable();
 
-    /**
-     *
-     */
+    // normalize snap points
     const { snapPoints, sheetHeight } = useMemo(() => {
       const normalizedSnapPoints = normalizeSnapPoints(_snapPoints, topInset);
       const maxSnapPoint =
@@ -228,8 +275,17 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
       },
       [setScrollableRef, refreshUIElements]
     );
-    const handleOnSnapTo = useCallback(
+    //#endregion
+
+    //#region methods
+    const handleSnapTo = useCallback(
       (index: number) => {
+        invariant(
+          index >= -1 && index <= snapPoints.length - 1,
+          `'index' was provided but out of the provided snap points range! expected value to be between -1, ${
+            snapPoints.length - 1
+          }`
+        );
         autoSnapTo.setValue(snapPoints[index]);
       },
       // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -259,16 +315,16 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
     );
     const contextVariables = useMemo(
       () => ({
-        snapTo: handleOnSnapTo,
+        snapTo: handleSnapTo,
         close: handleClose,
       }),
-      [handleOnSnapTo, handleClose]
+      [handleSnapTo, handleClose]
     );
     //#endregion
 
     //#region effects
     useImperativeHandle(ref, () => ({
-      snapTo: handleOnSnapTo,
+      snapTo: handleSnapTo,
       close: handleClose,
     }));
 

src/utilities/normalizeSnapPoints.ts

@@ -1,4 +1,5 @@
 import { Dimensions } from 'react-native';
+import { validateSnapPoint } from './validateSnapPoint';
 
 const { height: windowHeight } = Dimensions.get('window');
 
@@ -9,8 +10,9 @@ export const normalizeSnapPoints = (
   snapPoints: Array<number | string>,
   topInset: number
 ) =>
-  snapPoints.map(snapPoint =>
-    typeof snapPoint === 'number'
+  snapPoints.map(snapPoint => {
+    validateSnapPoint(snapPoint);
+    return typeof snapPoint === 'number'
       ? snapPoint
-      : (Number(snapPoint.split('%')[0]) * (windowHeight - topInset)) / 100
-  );
+      : (Number(snapPoint.split('%')[0]) * (windowHeight - topInset)) / 100;
+  });

src/utilities/validateSnapPoint.ts

@@ -0,0 +1,20 @@
+import invariant from 'invariant';
+
+export const validateSnapPoint = (snapPoint: any) => {
+  invariant(
+    typeof snapPoint === 'number' || typeof snapPoint === 'string',
+    `'${snapPoint}' is not a valid snap point! expected types are string or number.`
+  );
+
+  invariant(
+    typeof snapPoint === 'number' ||
+      (typeof snapPoint === 'string' && snapPoint.includes('%')),
+    `'${snapPoint}' is not a valid percentage snap point! expected percentage snap point must include '%'. e.g. '50%'`
+  );
+
+  invariant(
+    typeof snapPoint === 'number' ||
+      (typeof snapPoint === 'string' && Number(snapPoint.split('%')[0])),
+    `'${snapPoint}' is not a valid percentage snap point! expected percentage snap point must be only numbers and '%'. e.g. '50%'`
+  );
+};

yarn.lock

@@ -1609,6 +1609,11 @@
   resolved "https://registry.yarnpkg.com/@types/http-cache-semantics/-/http-cache-semantics-4.0.0.tgz#9140779736aa2655635ee756e2467d787cfe8a2a"
   integrity sha512-c3Xy026kOF7QOTn00hbIllV1dLR9hG9NkSrLQgCVs8NF6sBU+VGWjD3wLPhmh1TYAc7ugCFsvHYMN4VcBN1U1A==
 
+"@types/invariant@^2.2.33":
+  version "2.2.33"
+  resolved "https://registry.yarnpkg.com/@types/invariant/-/invariant-2.2.33.tgz#ec5eec29c63bf5e4ca164e9feb3ef7337cdcbadb"
+  integrity sha512-/jUNmS8d4bCKdqslfxW6dg/9Gksfzxz67IYfqApHn+HvHlMVXwYv2zpTDnS/yaK9BB0i0GlBTaYci0EFE62Hmw==
+
 "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz#4ba8ddb720221f432e443bd5f9117fd22cfd4762"