@draftbit/core 50.5.1 → 50.5.2-e4d422.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "50.5.1",
+  "version": "50.5.2-e4d422.2+e4d422e",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "types": "lib/typescript/src/index.d.ts",
@@ -42,7 +42,7 @@
     "@date-io/date-fns": "^1.3.13",
     "@dotlottie/react-player": "1.6.1",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/theme": "50.5.1",
+    "@draftbit/theme": "^50.5.2-e4d422.2+e4d422e",
     "@expo/vector-icons": "^14.0.0",
     "@gorhom/bottom-sheet": "5.0.0-alpha.7",
     "@lottiefiles/react-lottie-player": "3.5.3",
@@ -122,5 +122,5 @@
     ],
     "testEnvironment": "node"
   },
-  "gitHead": "87aecd4f285cba9cac8b715c6414d4b8be12a76f"
+  "gitHead": "e4d422ea6fdc6b6d0f9e62c7cc62c6b7f8f6cd8e"
 }

package/src/components/Swiper/Swiper.js

@@ -1,8 +1,8 @@
 import { withTheme } from "@draftbit/theme";
-import React from "react";
+import React, { forwardRef, useImperativeHandle } from "react";
 import { View } from "react-native";
 import SwiperComponent from "react-native-web-swiper";
-const Swiper = ({ theme, vertical = false, loop = false, timeout = 0, from = 0, prevTitle = "", nextTitle = "", prevTitleColor, nextTitleColor, dotsTouchable = true, dotColor = theme.colors.foreground.brand, dotActiveColor = theme.colors.branding.primary, data, keyExtractor, renderItem, children: childrenProp, onIndexChanged: onIndexChangedProp, onSwipe, onSwipedNext, onSwipedPrevious, minDistanceForAction, minDistanceToCapture, style, }) => {
+const Swiper = forwardRef(({ theme, vertical = false, loop = false, timeout = 0, from = 0, prevTitle = "", nextTitle = "", prevTitleColor, nextTitleColor, dotsTouchable = true, dotColor = theme === null || theme === void 0 ? void 0 : theme.colors.foreground.brand, dotActiveColor = theme === null || theme === void 0 ? void 0 : theme.colors.branding.primary, data, keyExtractor, renderItem, children: childrenProp, onIndexChanged: onIndexChangedProp, onSwipe, onSwipedNext, onSwipedPrevious, minDistanceForAction, minDistanceToCapture, style, }, ref) => {
     var _a;
     const [currentIndex, setCurrentIndex] = React.useState(0);
     const numberOfItems = (_a = data === null || data === void 0 ? void 0 : data.length) !== null && _a !== void 0 ? _a : React.Children.count(childrenProp);
@@ -56,6 +56,20 @@ const Swiper = ({ theme, vertical = false, loop = false, timeout = 0, from = 0,
             swiperRef.current.forceUpdate();
         }
     }, [children]);
+    useImperativeHandle(ref, () => ({
+        swipeTo: (index) => {
+            var _a;
+            (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.goTo(index);
+        },
+        swipeNext: () => {
+            var _a;
+            (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.goToNext();
+        },
+        swipePrev: () => {
+            var _a;
+            (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.goToPrev();
+        },
+    }));
     return (React.createElement(View, { style: style },
         React.createElement(SwiperComponent, { ref: swiperRef, from: from, loop: loop, timeout: timeout, vertical: vertical, onIndexChanged: onIndexChanged, minDistanceForAction: minDistanceForAction, minDistanceToCapture: minDistanceToCapture, controlsProps: {
                 prevTitle,
@@ -70,6 +84,6 @@ const Swiper = ({ theme, vertical = false, loop = false, timeout = 0, from = 0,
                     ? { dotActiveStyle: { backgroundColor: dotActiveColor } }
                     : {}),
             } }, children)));
-};
+});
 export default withTheme(Swiper);
 //# sourceMappingURL=Swiper.js.map

package/src/components/Swiper/Swiper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Swiper.js","sourceRoot":"","sources":["Swiper.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Swiper.js","sourceRoot":"","sources":["Swiper.tsx"],"names":[],"mappings":"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"}

package/src/components/Swiper/Swiper.tsx

@@ -1,8 +1,14 @@
 import { ReadTheme, withTheme } from "@draftbit/theme";
-import React from "react";
+import React, { forwardRef, useImperativeHandle } from "react";
 import { View, StyleProp, ViewStyle } from "react-native";
 import SwiperComponent from "react-native-web-swiper";
 
+export interface SwiperRef {
+  swipeTo: (index: number) => void;
+  swipeNext: () => void;
+  swipePrev: () => void;
+}
+
 export interface SwiperProps<T> {
   onSwipe?: (index: number) => void;
   onSwipedNext?: (index: number) => void;
@@ -29,123 +35,140 @@ export interface SwiperProps<T> {
   theme: ReadTheme;
 }
 
-const Swiper = ({
-  theme,
-  vertical = false,
-  loop = false,
-  timeout = 0,
-  from = 0,
-  prevTitle = "",
-  nextTitle = "",
-  prevTitleColor,
-  nextTitleColor,
-  dotsTouchable = true,
-  dotColor = theme.colors.foreground.brand,
-  dotActiveColor = theme.colors.branding.primary,
-  data,
-  keyExtractor,
-  renderItem,
-  children: childrenProp,
-  onIndexChanged: onIndexChangedProp,
-  onSwipe,
-  onSwipedNext,
-  onSwipedPrevious,
-  minDistanceForAction,
-  minDistanceToCapture,
-  style,
-}: SwiperProps<any>) => {
-  const [currentIndex, setCurrentIndex] = React.useState(0);
-  const numberOfItems = data?.length ?? React.Children.count(childrenProp);
-  const swiperRef = React.useRef<any>(null);
-
-  const onIndexChanged = (index: number) => {
-    const previous = currentIndex;
-    const current = index;
+const Swiper = forwardRef<SwiperRef, SwiperProps<any>>(
+  (
+    {
+      theme,
+      vertical = false,
+      loop = false,
+      timeout = 0,
+      from = 0,
+      prevTitle = "",
+      nextTitle = "",
+      prevTitleColor,
+      nextTitleColor,
+      dotsTouchable = true,
+      dotColor = theme?.colors.foreground.brand,
+      dotActiveColor = theme?.colors.branding.primary,
+      data,
+      keyExtractor,
+      renderItem,
+      children: childrenProp,
+      onIndexChanged: onIndexChangedProp,
+      onSwipe,
+      onSwipedNext,
+      onSwipedPrevious,
+      minDistanceForAction,
+      minDistanceToCapture,
+      style,
+    }: SwiperProps<any>,
+    ref
+  ) => {
+    const [currentIndex, setCurrentIndex] = React.useState(0);
+    const numberOfItems = data?.length ?? React.Children.count(childrenProp);
+    const swiperRef = React.useRef<any>(null);
 
-    onIndexChangedProp?.(index);
-    setCurrentIndex(index);
+    const onIndexChanged = (index: number) => {
+      const previous = currentIndex;
+      const current = index;
 
-    if (previous === numberOfItems - 1 && current === 0) {
-      //Last -> first swipe
-      onSwipedNext?.(previous);
-    } else if (previous === 0 && current === numberOfItems - 1) {
-      //First -> last swipe
-      onSwipedPrevious?.(previous);
-    } else if (current > previous) {
-      onSwipedNext?.(previous);
-    } else if (current < previous) {
-      onSwipedPrevious?.(previous);
-    }
-    onSwipe?.(previous);
-  };
+      onIndexChangedProp?.(index);
+      setCurrentIndex(index);
 
-  const children: React.ReactNode = React.useMemo(
-    () =>
-      Array.isArray(data) && renderItem
-        ? data.map((item, index) => {
-            const component = renderItem({ item, index });
+      if (previous === numberOfItems - 1 && current === 0) {
+        //Last -> first swipe
+        onSwipedNext?.(previous);
+      } else if (previous === 0 && current === numberOfItems - 1) {
+        //First -> last swipe
+        onSwipedPrevious?.(previous);
+      } else if (current > previous) {
+        onSwipedNext?.(previous);
+      } else if (current < previous) {
+        onSwipedPrevious?.(previous);
+      }
+      onSwipe?.(previous);
+    };
 
-            if (!component) {
-              return null;
-            }
+    const children: React.ReactNode = React.useMemo(
+      () =>
+        Array.isArray(data) && renderItem
+          ? data.map((item, index) => {
+              const component = renderItem({ item, index });
 
-            const key = keyExtractor ? keyExtractor(item, index) : index;
-            return React.cloneElement(component, {
-              key,
-            });
-          })
-        : childrenProp,
-    [childrenProp, data, renderItem, keyExtractor]
-  );
+              if (!component) {
+                return null;
+              }
 
-  /*
-  react-native-web-swiper assigns it's 'children' attribute as follows: `children = (() => React.Children.toArray(this.props.children))();`
-  This is probelematic when state is involved due to anoynmous function effectivley creating new components everytime, losing any state
-  
-  This is a monkey patch that updates the 'children' attribute to just use the children from the props
-  Can be removed when/if https://github.com/reactrondev/react-native-web-swiper/pull/102 is merged
-  */
-  React.useEffect(() => {
-    const childrenArray = React.Children.toArray(
-      swiperRef.current?.props?.children
+              const key = keyExtractor ? keyExtractor(item, index) : index;
+              return React.cloneElement(component, {
+                key,
+              });
+            })
+          : childrenProp,
+      [childrenProp, data, renderItem, keyExtractor]
     );
-    if (swiperRef.current) {
-      swiperRef.current.children = childrenArray;
-      swiperRef.current.count = childrenArray.length;
-      swiperRef.current.forceUpdate();
-    }
-  }, [children]);
 
-  return (
-    <View style={style}>
-      {/* @ts-ignore */}
-      <SwiperComponent
-        ref={swiperRef}
-        from={from}
-        loop={loop}
-        timeout={timeout}
-        vertical={vertical}
-        onIndexChanged={onIndexChanged}
-        minDistanceForAction={minDistanceForAction}
-        minDistanceToCapture={minDistanceToCapture}
-        controlsProps={{
-          prevTitle,
-          nextTitle,
-          prevTitleStyle: { color: prevTitleColor },
-          nextTitleStyle: { color: nextTitleColor },
-          dotsTouchable,
-          ...(dotColor
-            ? { dotProps: { badgeStyle: { backgroundColor: dotColor } } }
-            : {}),
-          ...(dotActiveColor
-            ? { dotActiveStyle: { backgroundColor: dotActiveColor } }
-            : {}),
-        }}
-      >
-        {children}
-      </SwiperComponent>
-    </View>
-  );
-};
+    /*
+    react-native-web-swiper assigns it's 'children' attribute as follows: `children = (() => React.Children.toArray(this.props.children))();`
+    This is probelematic when state is involved due to anoynmous function effectivley creating new components everytime, losing any state
+    
+    This is a monkey patch that updates the 'children' attribute to just use the children from the props
+    Can be removed when/if https://github.com/reactrondev/react-native-web-swiper/pull/102 is merged
+    */
+    React.useEffect(() => {
+      const childrenArray = React.Children.toArray(
+        swiperRef.current?.props?.children
+      );
+      if (swiperRef.current) {
+        swiperRef.current.children = childrenArray;
+        swiperRef.current.count = childrenArray.length;
+        swiperRef.current.forceUpdate();
+      }
+    }, [children]);
+
+    useImperativeHandle(ref, () => ({
+      swipeTo: (index: number) => {
+        swiperRef.current?.goTo(index);
+      },
+      swipeNext: () => {
+        swiperRef.current?.goToNext();
+      },
+      swipePrev: () => {
+        swiperRef.current?.goToPrev();
+      },
+    }));
+
+    return (
+      <View style={style}>
+        {/* @ts-ignore */}
+        <SwiperComponent
+          ref={swiperRef}
+          from={from}
+          loop={loop}
+          timeout={timeout}
+          vertical={vertical}
+          onIndexChanged={onIndexChanged}
+          minDistanceForAction={minDistanceForAction}
+          minDistanceToCapture={minDistanceToCapture}
+          controlsProps={{
+            prevTitle,
+            nextTitle,
+            prevTitleStyle: { color: prevTitleColor },
+            nextTitleStyle: { color: nextTitleColor },
+            dotsTouchable,
+            ...(dotColor
+              ? { dotProps: { badgeStyle: { backgroundColor: dotColor } } }
+              : {}),
+            ...(dotActiveColor
+              ? { dotActiveStyle: { backgroundColor: dotActiveColor } }
+              : {}),
+          }}
+        >
+          {children}
+        </SwiperComponent>
+      </View>
+    );
+  }
+);
 
 export default withTheme(Swiper);