@draftbit/core 50.1.2-8b3aec.2 → 50.1.2

package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.tsx

@@ -7,19 +7,26 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A KeyboardAwareScrollView wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleKeyboardAwareScrollView: React.FC<
-  Omit<KeyboardAwareScrollViewProps, "contentContainerStyle">
-> = ({ style: styleProp, ...rest }) => {
-  const { style, contentContainerStyle } =
-    useSplitContentContainerStyles(styleProp);
+const SimpleStyleKeyboardAwareScrollView = React.forwardRef(
+  (
+    {
+      style: styleProp,
+      ...rest
+    }: Omit<KeyboardAwareScrollViewProps, "contentContainerStyle">,
+    ref: React.Ref<KeyboardAwareScrollView>
+  ) => {
+    const { style, contentContainerStyle } =
+      useSplitContentContainerStyles(styleProp);
 
-  return (
-    <KeyboardAwareScrollView
-      style={style}
-      contentContainerStyle={contentContainerStyle}
-      {...rest}
-    />
-  );
-};
+    return (
+      <KeyboardAwareScrollView
+        ref={ref}
+        style={style}
+        contentContainerStyle={contentContainerStyle}
+        {...rest}
+      />
+    );
+  }
+);
 
 export default SimpleStyleKeyboardAwareScrollView;

package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js

@@ -5,9 +5,9 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A MasonryFlashList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleMasonryFlashList = ({ style: styleProp, data, ...rest }) => {
+const SimpleStyleMasonryFlashList = React.forwardRef(({ style: styleProp, data, ...rest }, ref) => {
     const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
-    return (React.createElement(MasonryFlashList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
-};
+    return (React.createElement(MasonryFlashList, { ref: ref, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
+});
 export default SimpleStyleMasonryFlashList;
 //# sourceMappingURL=SimpleStyleMasonryFlashList.js.map

package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleStyleMasonryFlashList.js","sourceRoot":"","sources":["SimpleStyleMasonryFlashList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,2BAA2B,GAAG,CAAgB,EAClD,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EACiD,EAAE,EAAE;IAC5D,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,gBAAgB,IACf,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqC,EAC5D,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,2BAA2B,CAAC"}
+{"version":3,"file":"SimpleStyleMasonryFlashList.js","sourceRoot":"","sources":["SimpleStyleMasonryFlashList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAMvD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,2BAA2B,GAAG,KAAK,CAAC,UAAU,CAClD,CACE,EACE,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EACiD,EAC1D,GAAwC,EACxC,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,gBAAgB,IACf,GAAG,EAAE,GAAU,EACf,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqC,EAC5D,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,2BAA2B,CAAC"}

package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.tsx

@@ -1,28 +1,38 @@
 import React from "react";
 import { MasonryFlashList } from "@shopify/flash-list";
-import type { MasonryFlashListProps, ContentStyle } from "@shopify/flash-list";
+import type {
+  MasonryFlashListProps,
+  ContentStyle,
+  MasonryFlashListRef,
+} from "@shopify/flash-list";
 import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
 
 /**
  * A MasonryFlashList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleMasonryFlashList = <T extends any>({
-  style: styleProp,
-  data,
-  ...rest
-}: Omit<MasonryFlashListProps<T>, "contentContainerStyle">) => {
-  const { style, contentContainerStyle } =
-    useSplitContentContainerStyles(styleProp);
+const SimpleStyleMasonryFlashList = React.forwardRef(
+  <T extends any>(
+    {
+      style: styleProp,
+      data,
+      ...rest
+    }: Omit<MasonryFlashListProps<T>, "contentContainerStyle">,
+    ref: React.Ref<MasonryFlashListRef<any>>
+  ) => {
+    const { style, contentContainerStyle } =
+      useSplitContentContainerStyles(styleProp);
 
-  return (
-    <MasonryFlashList
-      style={style}
-      contentContainerStyle={contentContainerStyle as ContentStyle}
-      data={data}
-      {...rest}
-    />
-  );
-};
+    return (
+      <MasonryFlashList
+        ref={ref as any}
+        style={style}
+        contentContainerStyle={contentContainerStyle as ContentStyle}
+        data={data}
+        {...rest}
+      />
+    );
+  }
+);
 
 export default SimpleStyleMasonryFlashList;

package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js

@@ -5,9 +5,9 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A ScrollView wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleScrollView = ({ style: styleProp, ...rest }) => {
+const SimpleStyleScrollView = React.forwardRef(({ style: styleProp, ...rest }, ref) => {
     const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
-    return (React.createElement(ScrollView, { style: style, contentContainerStyle: contentContainerStyle, ...rest }));
-};
+    return (React.createElement(ScrollView, { ref: ref, style: style, contentContainerStyle: contentContainerStyle, ...rest }));
+});
 export default SimpleStyleScrollView;
 //# sourceMappingURL=SimpleStyleScrollView.js.map

package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleStyleScrollView.js","sourceRoot":"","sources":["SimpleStyleScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,qBAAqB,GAEvB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE;IACpC,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,KACxC,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"SimpleStyleScrollView.js","sourceRoot":"","sources":["SimpleStyleScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,EACE,KAAK,EAAE,SAAS,EAChB,GAAG,IAAI,EACwC,EACjD,GAA0B,EAC1B,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,KACxC,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.tsx

@@ -7,19 +7,26 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A ScrollView wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleScrollView: React.FC<
-  Omit<ScrollViewProps, "contentContainerStyle">
-> = ({ style: styleProp, ...rest }) => {
-  const { style, contentContainerStyle } =
-    useSplitContentContainerStyles(styleProp);
+const SimpleStyleScrollView = React.forwardRef(
+  (
+    {
+      style: styleProp,
+      ...rest
+    }: Omit<ScrollViewProps, "contentContainerStyle">,
+    ref: React.Ref<ScrollView>
+  ) => {
+    const { style, contentContainerStyle } =
+      useSplitContentContainerStyles(styleProp);
 
-  return (
-    <ScrollView
-      style={style}
-      contentContainerStyle={contentContainerStyle}
-      {...rest}
-    />
-  );
-};
+    return (
+      <ScrollView
+        ref={ref}
+        style={style}
+        contentContainerStyle={contentContainerStyle}
+        {...rest}
+      />
+    );
+  }
+);
 
 export default SimpleStyleScrollView;

package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js

@@ -5,11 +5,11 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A SectionList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleSectionList = ({ style: styleProp, data, ...rest }) => {
+const SimpleStyleSectionList = React.forwardRef(({ style: styleProp, data, ...rest }, ref) => {
     const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
     return (
     //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
-    React.createElement(SectionList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
-};
+    React.createElement(SectionList, { ref: ref, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
+});
 export default SimpleStyleSectionList;
 //# sourceMappingURL=SimpleStyleSectionList.js.map

package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleStyleSectionList.js","sourceRoot":"","sources":["SimpleStyleSectionList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAK7C,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,sBAAsB,GAAG,CAAmC,EAChE,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAIR,EAAE,EAAE;IACH,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO;IACL,gHAAgH;IAChH,oBAAC,WAAW,IACV,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"SimpleStyleSectionList.js","sourceRoot":"","sources":["SimpleStyleSectionList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAK7C,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAI9E;;;GAGG;AACH,MAAM,sBAAsB,GAAG,KAAK,CAAC,UAAU,CAC7C,CACE,EACE,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAIR,EACD,GAAyC,EACzC,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO;IACL,gHAAgH;IAChH,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.tsx

@@ -5,31 +5,39 @@ import type {
   FlashListSectionListProps,
 } from "../SectionList";
 import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
+import { FlatList } from "react-native-gesture-handler";
+import { FlashList } from "@shopify/flash-list";
 
 /**
  * A SectionList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleSectionList = <T extends { [key: string]: any }>({
-  style: styleProp,
-  data,
-  ...rest
-}: Omit<
-  FlatListSectionListProps<T> | FlashListSectionListProps<T>,
-  "contentContainerStyle"
->) => {
-  const { style, contentContainerStyle } =
-    useSplitContentContainerStyles(styleProp);
+const SimpleStyleSectionList = React.forwardRef(
+  <T extends { [key: string]: any }>(
+    {
+      style: styleProp,
+      data,
+      ...rest
+    }: Omit<
+      FlatListSectionListProps<T> | FlashListSectionListProps<T>,
+      "contentContainerStyle"
+    >,
+    ref: React.Ref<FlatList | FlashList<any>>
+  ) => {
+    const { style, contentContainerStyle } =
+      useSplitContentContainerStyles(styleProp);
 
-  return (
-    //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
-    <SectionList
-      style={style}
-      contentContainerStyle={contentContainerStyle}
-      data={data}
-      {...rest}
-    />
-  );
-};
+    return (
+      //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
+      <SectionList
+        ref={ref}
+        style={style}
+        contentContainerStyle={contentContainerStyle}
+        data={data}
+        {...rest}
+      />
+    );
+  }
+);
 
 export default SimpleStyleSectionList;

package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js

@@ -5,11 +5,11 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
  * A SwipeableList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleSwipeableList = ({ style: styleProp, data, ...rest }) => {
+const SimpleStyleSwipeableList = React.forwardRef(({ style: styleProp, data, ...rest }, ref) => {
     const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
     return (
     //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
-    React.createElement(SwipeableList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
-};
+    React.createElement(SwipeableList, { ref: ref, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
+});
 export default SimpleStyleSwipeableList;
 //# sourceMappingURL=SimpleStyleSwipeableList.js.map

package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleStyleSwipeableList.js","sourceRoot":"","sources":["SimpleStyleSwipeableList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,wBAAwB,GAAG,CAAmC,EAClE,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAIR,EAAE,EAAE;IACH,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO;IACL,gHAAgH;IAChH,oBAAC,aAAa,IACZ,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"SimpleStyleSwipeableList.js","sourceRoot":"","sources":["SimpleStyleSwipeableList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAI9E;;;GAGG;AACH,MAAM,wBAAwB,GAAG,KAAK,CAAC,UAAU,CAC/C,CACE,EACE,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAIR,EACD,GAAyC,EACzC,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO;IACL,gHAAgH;IAChH,oBAAC,aAAa,IACZ,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,wBAAwB,CAAC"}

package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.tsx

@@ -5,31 +5,39 @@ import type {
   FlatListSwipeableListProps,
 } from "../SwipeableItem";
 import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
+import { FlatList } from "react-native-gesture-handler";
+import { FlashList } from "@shopify/flash-list";
 
 /**
  * A SwipeableList wrapper that takes a single `style` prop and internally extracts
  * the appropriate style keys into the `contentContainerStyle`
  */
-const SimpleStyleSwipeableList = <T extends { [key: string]: any }>({
-  style: styleProp,
-  data,
-  ...rest
-}: Omit<
-  FlashListSwipeableListProps<T> | FlatListSwipeableListProps<T>,
-  "contentContainerStyle"
->) => {
-  const { style, contentContainerStyle } =
-    useSplitContentContainerStyles(styleProp);
+const SimpleStyleSwipeableList = React.forwardRef(
+  <T extends { [key: string]: any }>(
+    {
+      style: styleProp,
+      data,
+      ...rest
+    }: Omit<
+      FlashListSwipeableListProps<T> | FlatListSwipeableListProps<T>,
+      "contentContainerStyle"
+    >,
+    ref: React.Ref<FlatList | FlashList<any>>
+  ) => {
+    const { style, contentContainerStyle } =
+      useSplitContentContainerStyles(styleProp);
 
-  return (
-    //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
-    <SwipeableList
-      style={style}
-      contentContainerStyle={contentContainerStyle}
-      data={data}
-      {...rest}
-    />
-  );
-};
+    return (
+      //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
+      <SwipeableList
+        ref={ref}
+        style={style}
+        contentContainerStyle={contentContainerStyle}
+        data={data}
+        {...rest}
+      />
+    );
+  }
+);
 
 export default SimpleStyleSwipeableList;

package/src/components/SwipeableItem/SwipeableList.js

@@ -5,7 +5,7 @@ export const SwipeableListContext = React.createContext({
     onStartSwiping: () => { },
     onStopSwiping: () => { },
 });
-const SwipeableList = ({ disableScrollWhenSwiping = true, listComponent = "FlatList", ...rest }) => {
+const SwipeableList = React.forwardRef(({ disableScrollWhenSwiping = true, listComponent = "FlatList", ...rest }, ref) => {
     const [isSwiping, setIsSwiping] = React.useState(false);
     const onStartSwiping = () => {
         setIsSwiping(true);
@@ -17,13 +17,13 @@ const SwipeableList = ({ disableScrollWhenSwiping = true, listComponent = "FlatL
     const renderListComponent = () => {
         switch (listComponent) {
             case "FlatList":
-                return React.createElement(FlatList, { ...rest });
+                return (React.createElement(FlatList, { ref: ref, ...rest }));
             case "FlashList":
-                return React.createElement(FlashList, { ...rest });
+                return (React.createElement(FlashList, { ref: ref, ...rest }));
         }
     };
     return (React.createElement(SwipeableListContext.Provider, { value: { onStartSwiping, onStopSwiping } },
         React.createElement(React.Fragment, null, renderListComponent())));
-};
+});
 export default SwipeableList;
 //# sourceMappingURL=SwipeableList.js.map

package/src/components/SwipeableItem/SwipeableList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwipeableList.js","sourceRoot":"","sources":["SwipeableList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkB,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAiB,QAAQ,EAAE,MAAM,cAAc,CAAC;AAoBvD,MAAM,CAAC,MAAM,oBAAoB,GAC/B,KAAK,CAAC,aAAa,CAA2B;IAC5C,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;CACxB,CAAC,CAAC;AAEL,MAAM,aAAa,GAAG,CAAmB,EACvC,wBAAwB,GAAG,IAAI,EAC/B,aAAa,GAAG,UAAU,EAC1B,GAAG,IAAI,EACwD,EAAE,EAAE;IACnE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,YAAY,CAAC,IAAI,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,IAAI,CAAC,aAAa,GAAG,wBAAwB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC;IAElE,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,QAAQ,aAAa,EAAE;YACrB,KAAK,UAAU;gBACb,OAAO,oBAAC,QAAQ,OAAM,IAAyB,GAAI,CAAC;YACtD,KAAK,WAAW;gBACd,OAAO,oBAAC,SAAS,OAAM,IAA0B,GAAI,CAAC;SACzD;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,aAAa,EAAE;QACrE,0CAAG,mBAAmB,EAAE,CAAI,CACE,CACjC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"SwipeableList.js","sourceRoot":"","sources":["SwipeableList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkB,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAiB,QAAQ,EAAE,MAAM,cAAc,CAAC;AAoBvD,MAAM,CAAC,MAAM,oBAAoB,GAC/B,KAAK,CAAC,aAAa,CAA2B;IAC5C,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;CACxB,CAAC,CAAC;AAEL,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CACpC,CACE,EACE,wBAAwB,GAAG,IAAI,EAC/B,aAAa,GAAG,UAAU,EAC1B,GAAG,IAAI,EACwD,EACjE,GAAyC,EACzC,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,YAAY,CAAC,IAAI,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,IAAI,CAAC,aAAa,GAAG,wBAAwB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC;IAElE,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,QAAQ,aAAa,EAAE;YACrB,KAAK,UAAU;gBACb,OAAO,CACL,oBAAC,QAAQ,IACP,GAAG,EAAE,GAA0B,KAC1B,IAAyB,GAC9B,CACH,CAAC;YACJ,KAAK,WAAW;gBACd,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAA8B,KAC9B,IAA0B,GAC/B,CACH,CAAC;SACL;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,aAAa,EAAE;QACrE,0CAAG,mBAAmB,EAAE,CAAI,CACE,CACjC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/src/components/SwipeableItem/SwipeableList.tsx

@@ -26,37 +26,52 @@ export const SwipeableListContext =
     onStopSwiping: () => {},
   });
 
-const SwipeableList = <T extends object>({
-  disableScrollWhenSwiping = true,
-  listComponent = "FlatList",
-  ...rest
-}: FlashListSwipeableListProps<T> | FlatListSwipeableListProps<T>) => {
-  const [isSwiping, setIsSwiping] = React.useState(false);
-
-  const onStartSwiping = () => {
-    setIsSwiping(true);
-  };
-
-  const onStopSwiping = () => {
-    setIsSwiping(false);
-  };
-
-  rest.scrollEnabled = disableScrollWhenSwiping ? !isSwiping : true;
-
-  const renderListComponent = () => {
-    switch (listComponent) {
-      case "FlatList":
-        return <FlatList {...(rest as FlatListProps<T>)} />;
-      case "FlashList":
-        return <FlashList {...(rest as FlashListProps<T>)} />;
-    }
-  };
-
-  return (
-    <SwipeableListContext.Provider value={{ onStartSwiping, onStopSwiping }}>
-      <>{renderListComponent()}</>
-    </SwipeableListContext.Provider>
-  );
-};
+const SwipeableList = React.forwardRef(
+  <T extends object>(
+    {
+      disableScrollWhenSwiping = true,
+      listComponent = "FlatList",
+      ...rest
+    }: FlashListSwipeableListProps<T> | FlatListSwipeableListProps<T>,
+    ref: React.Ref<FlatList | FlashList<any>>
+  ) => {
+    const [isSwiping, setIsSwiping] = React.useState(false);
+
+    const onStartSwiping = () => {
+      setIsSwiping(true);
+    };
+
+    const onStopSwiping = () => {
+      setIsSwiping(false);
+    };
+
+    rest.scrollEnabled = disableScrollWhenSwiping ? !isSwiping : true;
+
+    const renderListComponent = () => {
+      switch (listComponent) {
+        case "FlatList":
+          return (
+            <FlatList
+              ref={ref as React.Ref<FlatList>}
+              {...(rest as FlatListProps<T>)}
+            />
+          );
+        case "FlashList":
+          return (
+            <FlashList
+              ref={ref as React.Ref<FlashList<T>>}
+              {...(rest as FlashListProps<T>)}
+            />
+          );
+      }
+    };
+
+    return (
+      <SwipeableListContext.Provider value={{ onStartSwiping, onStopSwiping }}>
+        <>{renderListComponent()}</>
+      </SwipeableListContext.Provider>
+    );
+  }
+);
 
 export default SwipeableList;

package/src/components/TabView/TabView.js

@@ -3,7 +3,7 @@ import { TabView, TabBar, } from "react-native-tab-view";
 import TabViewItem from "./TabViewItem";
 import { withTheme } from "../../theming";
 import { flattenReactFragments, extractStyles } from "../../utilities";
-const TabViewComponent = ({ Icon, onIndexChanged, onEndReached, initialTabIndex = 0, tabBarPosition, keyboardDismissMode, swipeEnabled, scrollEnabled, activeColor, inactiveColor, pressColor, indicatorColor, tabsBackgroundColor, iconSize = 16, style, theme, children: childrenProp, }) => {
+const TabViewComponent = ({ Icon, onIndexChanged, onEndReached, initialTabIndex = 0, tabBarPosition, keyboardDismissMode, swipeEnabled, scrollEnabled, activeColor, inactiveColor, pressColor, indicatorColor, tabsBackgroundColor, iconSize = 16, iconPosition = "top", style, theme, children: childrenProp, }) => {
     const [index, setIndex] = React.useState(initialTabIndex);
     const [routes, setRoutes] = React.useState([]);
     const { textStyles, viewStyles } = extractStyles(style);
@@ -30,9 +30,24 @@ const TabViewComponent = ({ Icon, onIndexChanged, onEndReached, initialTabIndex
         }
     };
     const renderTabBar = (props) => {
+        let tabFlexDirection;
+        switch (iconPosition) {
+            case "top":
+                tabFlexDirection = "column";
+                break;
+            case "bottom":
+                tabFlexDirection = "column-reverse";
+                break;
+            case "left":
+                tabFlexDirection = "row";
+                break;
+            case "right":
+                tabFlexDirection = "row-reverse";
+                break;
+        }
         return (React.createElement(TabBar, { ...props, activeColor: activeColor || theme.colors.primary, inactiveColor: inactiveColor || "rgb(200,200,200)", pressColor: pressColor || theme.colors.primary, scrollEnabled: scrollEnabled, indicatorStyle: {
                 backgroundColor: indicatorColor || theme.colors.primary,
-            }, labelStyle: [{ textTransform: "none" }, textStyles], renderIcon: ({ route, color }) => (route === null || route === void 0 ? void 0 : route.icon) ? (React.createElement(Icon, { name: route.icon, color: color, size: iconSize })) : null, style: {
+            }, labelStyle: [{ textTransform: "none" }, textStyles], tabStyle: { flexDirection: tabFlexDirection }, renderIcon: ({ route, color }) => (route === null || route === void 0 ? void 0 : route.icon) ? (React.createElement(Icon, { name: route.icon, color: color, size: iconSize })) : null, style: {
                 backgroundColor: tabsBackgroundColor || theme.colors.background,
             } }));
     };

package/src/components/TabView/TabView.js.map

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

package/src/components/TabView/TabView.tsx

@@ -22,6 +22,7 @@ type TabBarProps = SceneRendererProps & {
 };
 type TabBarPosition = "top" | "bottom";
 type KeyboardDismissMode = "none" | "auto" | "on-drag";
+type IconPosition = "top" | "bottom" | "left" | "right";
 
 type TabViewProps = {
   onIndexChanged?: (index: number) => void;
@@ -37,6 +38,7 @@ type TabViewProps = {
   indicatorColor?: string;
   tabsBackgroundColor?: string;
   iconSize?: number;
+  iconPosition?: IconPosition;
   style?: StyleProp<ViewStyle | TextStyle>;
   theme: Theme;
 } & IconSlot;
@@ -56,6 +58,7 @@ const TabViewComponent: React.FC<React.PropsWithChildren<TabViewProps>> = ({
   indicatorColor,
   tabsBackgroundColor,
   iconSize = 16,
+  iconPosition = "top",
   style,
   theme,
   children: childrenProp,
@@ -101,6 +104,21 @@ const TabViewComponent: React.FC<React.PropsWithChildren<TabViewProps>> = ({
   };
 
   const renderTabBar: React.FC<TabBarProps> = (props) => {
+    let tabFlexDirection: "row" | "column" | "row-reverse" | "column-reverse";
+    switch (iconPosition) {
+      case "top":
+        tabFlexDirection = "column";
+        break;
+      case "bottom":
+        tabFlexDirection = "column-reverse";
+        break;
+      case "left":
+        tabFlexDirection = "row";
+        break;
+      case "right":
+        tabFlexDirection = "row-reverse";
+        break;
+    }
     return (
       <TabBar
         {...props}
@@ -112,6 +130,7 @@ const TabViewComponent: React.FC<React.PropsWithChildren<TabViewProps>> = ({
           backgroundColor: indicatorColor || theme.colors.primary,
         }}
         labelStyle={[{ textTransform: "none" }, textStyles]}
+        tabStyle={{ flexDirection: tabFlexDirection }}
         renderIcon={({ route, color }) =>
           route?.icon ? (
             <Icon name={route.icon} color={color} size={iconSize} />