@draftbit/core 49.4.11-900ba8.2 → 49.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/lib/commonjs/components/ScreenContainer.js +1 -1
  2. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleFlashList.js +1 -1
  3. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleFlatList.js +1 -1
  4. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +1 -1
  5. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +1 -1
  6. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleScrollView.js +1 -1
  7. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleSectionList.js +1 -1
  8. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +1 -1
  9. package/lib/commonjs/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +1 -1
  10. package/lib/typescript/src/components/ScreenContainer.d.ts +3 -1
  11. package/lib/typescript/src/components/ScreenContainer.js +8 -2
  12. package/lib/typescript/src/components/ScreenContainer.js.map +1 -1
  13. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js +2 -7
  14. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js.map +1 -1
  15. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js +2 -7
  16. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js.map +1 -1
  17. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +2 -7
  18. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js.map +1 -1
  19. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +2 -7
  20. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js.map +1 -1
  21. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js +2 -7
  22. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js.map +1 -1
  23. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js +2 -7
  24. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js.map +1 -1
  25. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +2 -7
  26. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js.map +1 -1
  27. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.d.ts +1 -2
  28. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +5 -36
  29. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js.map +1 -1
  30. package/lib/typescript/tsconfig.tsbuildinfo +1 -1
  31. package/package.json +3 -3
  32. package/src/components/ScreenContainer.js +8 -2
  33. package/src/components/ScreenContainer.js.map +1 -1
  34. package/src/components/ScreenContainer.tsx +13 -1
  35. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js +2 -7
  36. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js.map +1 -1
  37. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.tsx +2 -13
  38. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js +2 -7
  39. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js.map +1 -1
  40. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.tsx +2 -13
  41. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +2 -7
  42. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js.map +1 -1
  43. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.tsx +2 -12
  44. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +2 -7
  45. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js.map +1 -1
  46. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.tsx +2 -13
  47. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js +2 -7
  48. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js.map +1 -1
  49. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.tsx +2 -12
  50. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js +2 -7
  51. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js.map +1 -1
  52. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.tsx +2 -13
  53. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +2 -7
  54. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js.map +1 -1
  55. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.tsx +2 -13
  56. package/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +5 -36
  57. package/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js.map +1 -1
  58. package/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.ts +5 -47
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "49.4.11-900ba8.2+900ba80",
3
+ "version": "49.5.0",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "types": "lib/typescript/src/index.d.ts",
@@ -41,7 +41,7 @@
41
41
  "dependencies": {
42
42
  "@date-io/date-fns": "^1.3.13",
43
43
  "@draftbit/react-theme-provider": "^2.1.1",
44
- "@draftbit/types": "^49.4.11-900ba8.2+900ba80",
44
+ "@draftbit/types": "49.2.6",
45
45
  "@expo/vector-icons": "^13.0.0",
46
46
  "@gorhom/bottom-sheet": "5.0.0-alpha.7",
47
47
  "@material-ui/core": "^4.11.0",
@@ -113,5 +113,5 @@
113
113
  ],
114
114
  "testEnvironment": "node"
115
115
  },
116
- "gitHead": "900ba80c8bc4ad797e19472e70bbef960cad63c1"
116
+ "gitHead": "b21fd2f49c9d788c999644c1e841fb3475a6bf11"
117
117
  }
@@ -2,16 +2,22 @@ import * as React from "react";
2
2
  import { StyleSheet, ScrollView, View, } from "react-native";
3
3
  import { SafeAreaView } from "react-native-safe-area-context";
4
4
  import { withTheme } from "../theming";
5
- function ScreenContainer({ scrollable = false, hasSafeArea = false, hasBottomSafeArea = false, hasTopSafeArea = false, theme, style, children, ...rest }) {
5
+ function ScreenContainer({ scrollable = false, hasSafeArea = false, hasBottomSafeArea = false, hasTopSafeArea = false, hasLeftSafeArea = true, hasRightSafeArea = true, theme, style, children, ...rest }) {
6
6
  var _a;
7
7
  const backgroundColor = ((_a = StyleSheet.flatten(style)) === null || _a === void 0 ? void 0 : _a.backgroundColor) || theme.colors.background;
8
- const edges = ["left", "right"];
8
+ const edges = [];
9
9
  if (hasSafeArea || hasTopSafeArea) {
10
10
  edges.push("top");
11
11
  }
12
12
  if (hasSafeArea || hasBottomSafeArea) {
13
13
  edges.push("bottom");
14
14
  }
15
+ if (hasSafeArea || hasLeftSafeArea) {
16
+ edges.push("left");
17
+ }
18
+ if (hasSafeArea || hasRightSafeArea) {
19
+ edges.push("right");
20
+ }
15
21
  return (React.createElement(SafeAreaView, { edges: edges, style: [
16
22
  styles.container,
17
23
  {
@@ -1 +1 @@
1
- {"version":3,"file":"ScreenContainer.js","sourceRoot":"","sources":["ScreenContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,UAAU,EACV,UAAU,EAGV,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAavC,SAAS,eAAe,CAAC,EACvB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,KAAK,EACnB,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,KAAK,EACtB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACc;;IACrB,MAAM,eAAe,GACnB,CAAA,MAAA,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,0CAAE,eAAe,KAAI,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC;IAExE,MAAM,KAAK,GAAW,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACxC,IAAI,WAAW,IAAI,cAAc,EAAE;QACjC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACnB;IAED,IAAI,WAAW,IAAI,iBAAiB,EAAE;QACpC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KACtB;IAED,OAAO,CACL,oBAAC,YAAY,IACX,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,MAAM,CAAC,SAAS;YAChB;gBACE,eAAe;aAChB;SACF,KACG,IAAI,IAEP,UAAU,CAAC,CAAC,CAAC,CACZ,oBAAC,UAAU,IACT,qBAAqB,EAAE;YACrB,MAAM,CAAC,mBAAmB;YAC1B,EAAE,eAAe,EAAE;YACnB,KAAK;SACN,IAEA,QAAQ,CACE,CACd,CAAC,CAAC,CAAC,CACF,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,eAAe,EAAE,EAAE,KAAK,CAAC,IACxD,QAAQ,CACJ,CACR,CACY,CAChB,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,IAAI,EAAE,CAAC;KACR;IACD,mBAAmB,EAAE;QACnB,QAAQ,EAAE,CAAC;QACX,IAAI,EAAE,SAAS;KAChB;CACF,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC,eAAe,CAAC,CAAC"}
1
+ {"version":3,"file":"ScreenContainer.js","sourceRoot":"","sources":["ScreenContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,UAAU,EACV,UAAU,EAGV,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAevC,SAAS,eAAe,CAAC,EACvB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,KAAK,EACnB,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,KAAK,EACtB,eAAe,GAAG,IAAI,EACtB,gBAAgB,GAAG,IAAI,EACvB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACc;;IACrB,MAAM,eAAe,GACnB,CAAA,MAAA,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,0CAAE,eAAe,KAAI,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC;IAExE,MAAM,KAAK,GAAW,EAAE,CAAC;IACzB,IAAI,WAAW,IAAI,cAAc,EAAE;QACjC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACnB;IAED,IAAI,WAAW,IAAI,iBAAiB,EAAE;QACpC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KACtB;IAED,IAAI,WAAW,IAAI,eAAe,EAAE;QAClC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACpB;IAED,IAAI,WAAW,IAAI,gBAAgB,EAAE;QACnC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACrB;IAED,OAAO,CACL,oBAAC,YAAY,IACX,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,MAAM,CAAC,SAAS;YAChB;gBACE,eAAe;aAChB;SACF,KACG,IAAI,IAEP,UAAU,CAAC,CAAC,CAAC,CACZ,oBAAC,UAAU,IACT,qBAAqB,EAAE;YACrB,MAAM,CAAC,mBAAmB;YAC1B,EAAE,eAAe,EAAE;YACnB,KAAK;SACN,IAEA,QAAQ,CACE,CACd,CAAC,CAAC,CAAC,CACF,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,eAAe,EAAE,EAAE,KAAK,CAAC,IACxD,QAAQ,CACJ,CACR,CACY,CAChB,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,IAAI,EAAE,CAAC;KACR;IACD,mBAAmB,EAAE;QACnB,QAAQ,EAAE,CAAC;QACX,IAAI,EAAE,SAAS;KAChB;CACF,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC,eAAe,CAAC,CAAC"}
@@ -16,6 +16,8 @@ type ScreenContainerProps = {
16
16
  hasSafeArea?: boolean;
17
17
  hasTopSafeArea?: boolean;
18
18
  hasBottomSafeArea?: boolean;
19
+ hasLeftSafeArea?: boolean;
20
+ hasRightSafeArea?: boolean;
19
21
  theme: Theme;
20
22
  style?: StyleProp<ViewStyle>;
21
23
  children?: React.ReactNode;
@@ -26,6 +28,8 @@ function ScreenContainer({
26
28
  hasSafeArea = false,
27
29
  hasBottomSafeArea = false,
28
30
  hasTopSafeArea = false,
31
+ hasLeftSafeArea = true,
32
+ hasRightSafeArea = true,
29
33
  theme,
30
34
  style,
31
35
  children,
@@ -34,7 +38,7 @@ function ScreenContainer({
34
38
  const backgroundColor =
35
39
  StyleSheet.flatten(style)?.backgroundColor || theme.colors.background;
36
40
 
37
- const edges: Edge[] = ["left", "right"];
41
+ const edges: Edge[] = [];
38
42
  if (hasSafeArea || hasTopSafeArea) {
39
43
  edges.push("top");
40
44
  }
@@ -43,6 +47,14 @@ function ScreenContainer({
43
47
  edges.push("bottom");
44
48
  }
45
49
 
50
+ if (hasSafeArea || hasLeftSafeArea) {
51
+ edges.push("left");
52
+ }
53
+
54
+ if (hasSafeArea || hasRightSafeArea) {
55
+ edges.push("right");
56
+ }
57
+
46
58
  return (
47
59
  <SafeAreaView
48
60
  edges={edges}
@@ -6,13 +6,8 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleFlashList = ({ style: styleProp, data, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight, [data]);
12
- return (React.createElement(FlashList, { onLayout: (event) => {
13
- setMeasuredWidth(event.nativeEvent.layout.width);
14
- setMeasuredHeight(event.nativeEvent.layout.height);
15
- }, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
10
+ return (React.createElement(FlashList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
16
11
  };
17
12
  export default SimpleStyleFlashList;
18
13
  //# sourceMappingURL=SimpleStyleFlashList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SimpleStyleFlashList.js","sourceRoot":"","sources":["SimpleStyleFlashList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,oBAAoB,GAAG,CAAgB,EAC3C,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAC0C,EAAE,EAAE;IACrD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,EACd,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,CACL,oBAAC,SAAS,IACR,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqC,EAC5D,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
1
+ {"version":3,"file":"SimpleStyleFlashList.js","sourceRoot":"","sources":["SimpleStyleFlashList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,oBAAoB,GAAG,CAAgB,EAC3C,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EAC0C,EAAE,EAAE;IACrD,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,SAAS,IACR,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqC,EAC5D,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
@@ -12,22 +12,11 @@ const SimpleStyleFlashList = <T extends any>({
12
12
  data,
13
13
  ...rest
14
14
  }: Omit<FlashListProps<T>, "contentContainerStyle">) => {
15
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
16
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
17
-
18
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
19
- styleProp,
20
- measuredWidth,
21
- measuredHeight,
22
- [data]
23
- );
15
+ const { style, contentContainerStyle } =
16
+ useSplitContentContainerStyles(styleProp);
24
17
 
25
18
  return (
26
19
  <FlashList
27
- onLayout={(event) => {
28
- setMeasuredWidth(event.nativeEvent.layout.width);
29
- setMeasuredHeight(event.nativeEvent.layout.height);
30
- }}
31
20
  style={style}
32
21
  contentContainerStyle={contentContainerStyle as ContentStyle}
33
22
  data={data}
@@ -6,13 +6,8 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleFlatList = ({ style: styleProp, data, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight, [data]);
12
- return (React.createElement(FlatList, { onLayout: (event) => {
13
- setMeasuredWidth(event.nativeEvent.layout.width);
14
- setMeasuredHeight(event.nativeEvent.layout.height);
15
- }, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
10
+ return (React.createElement(FlatList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
16
11
  };
17
12
  export default SimpleStyleFlatList;
18
13
  //# sourceMappingURL=SimpleStyleFlatList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SimpleStyleFlatList.js","sourceRoot":"","sources":["SimpleStyleFlatList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,mBAAmB,GAAG,CAAgB,EAC1C,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EACyC,EAAE,EAAE;IACpD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,EACd,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,IACP,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"SimpleStyleFlatList.js","sourceRoot":"","sources":["SimpleStyleFlatList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,mBAAmB,GAAG,CAAgB,EAC1C,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,GAAG,IAAI,EACyC,EAAE,EAAE;IACpD,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GACpC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,QAAQ,IACP,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
@@ -12,22 +12,11 @@ const SimpleStyleFlatList = <T extends any>({
12
12
  data,
13
13
  ...rest
14
14
  }: Omit<FlatListProps<T>, "contentContainerStyle">) => {
15
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
16
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
17
-
18
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
19
- styleProp,
20
- measuredWidth,
21
- measuredHeight,
22
- [data]
23
- );
15
+ const { style, contentContainerStyle } =
16
+ useSplitContentContainerStyles(styleProp);
24
17
 
25
18
  return (
26
19
  <FlatList
27
- onLayout={(event) => {
28
- setMeasuredWidth(event.nativeEvent.layout.width);
29
- setMeasuredHeight(event.nativeEvent.layout.height);
30
- }}
31
20
  style={style}
32
21
  contentContainerStyle={contentContainerStyle}
33
22
  data={data}
@@ -6,13 +6,8 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleKeyboardAwareScrollView = ({ style: styleProp, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight);
12
- return (React.createElement(KeyboardAwareScrollView, { onLayout: (event) => {
13
- setMeasuredWidth(event.nativeEvent.layout.width);
14
- setMeasuredHeight(event.nativeEvent.layout.height);
15
- }, style: style, contentContainerStyle: contentContainerStyle, ...rest }));
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
10
+ return (React.createElement(KeyboardAwareScrollView, { style: style, contentContainerStyle: contentContainerStyle, ...rest }));
16
11
  };
17
12
  export default SimpleStyleKeyboardAwareScrollView;
18
13
  //# sourceMappingURL=SimpleStyleKeyboardAwareScrollView.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SimpleStyleKeyboardAwareScrollView.js","sourceRoot":"","sources":["SimpleStyleKeyboardAwareScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAC;AAElF,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,kCAAkC,GAEpC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE;IACpC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,CACf,CAAC;IAEF,OAAO,CACL,oBAAC,uBAAuB,IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,KACxC,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kCAAkC,CAAC"}
1
+ {"version":3,"file":"SimpleStyleKeyboardAwareScrollView.js","sourceRoot":"","sources":["SimpleStyleKeyboardAwareScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAC;AAElF,OAAO,8BAA8B,MAAM,kCAAkC,CAAC;AAE9E;;;GAGG;AACH,MAAM,kCAAkC,GAEpC,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,uBAAuB,IACtB,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,KACxC,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kCAAkC,CAAC"}
@@ -10,21 +10,11 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
10
10
  const SimpleStyleKeyboardAwareScrollView: React.FC<
11
11
  Omit<KeyboardAwareScrollViewProps, "contentContainerStyle">
12
12
  > = ({ style: styleProp, ...rest }) => {
13
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
14
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
15
-
16
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
17
- styleProp,
18
- measuredWidth,
19
- measuredHeight
20
- );
13
+ const { style, contentContainerStyle } =
14
+ useSplitContentContainerStyles(styleProp);
21
15
 
22
16
  return (
23
17
  <KeyboardAwareScrollView
24
- onLayout={(event) => {
25
- setMeasuredWidth(event.nativeEvent.layout.width);
26
- setMeasuredHeight(event.nativeEvent.layout.height);
27
- }}
28
18
  style={style}
29
19
  contentContainerStyle={contentContainerStyle}
30
20
  {...rest}
@@ -6,13 +6,8 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleMasonryFlashList = ({ style: styleProp, data, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight, [data]);
12
- return (React.createElement(MasonryFlashList, { onLayout: (event) => {
13
- setMeasuredWidth(event.nativeEvent.layout.width);
14
- setMeasuredHeight(event.nativeEvent.layout.height);
15
- }, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
10
+ return (React.createElement(MasonryFlashList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
16
11
  };
17
12
  export default SimpleStyleMasonryFlashList;
18
13
  //# sourceMappingURL=SimpleStyleMasonryFlashList.js.map
@@ -1 +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,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,EACd,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,CACL,oBAAC,gBAAgB,IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqC,EAC5D,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,2BAA2B,CAAC"}
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"}
@@ -12,22 +12,11 @@ const SimpleStyleMasonryFlashList = <T extends any>({
12
12
  data,
13
13
  ...rest
14
14
  }: Omit<MasonryFlashListProps<T>, "contentContainerStyle">) => {
15
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
16
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
17
-
18
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
19
- styleProp,
20
- measuredWidth,
21
- measuredHeight,
22
- [data]
23
- );
15
+ const { style, contentContainerStyle } =
16
+ useSplitContentContainerStyles(styleProp);
24
17
 
25
18
  return (
26
19
  <MasonryFlashList
27
- onLayout={(event) => {
28
- setMeasuredWidth(event.nativeEvent.layout.width);
29
- setMeasuredHeight(event.nativeEvent.layout.height);
30
- }}
31
20
  style={style}
32
21
  contentContainerStyle={contentContainerStyle as ContentStyle}
33
22
  data={data}
@@ -6,13 +6,8 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleScrollView = ({ style: styleProp, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight);
12
- return (React.createElement(ScrollView, { onLayout: (event) => {
13
- setMeasuredWidth(event.nativeEvent.layout.width);
14
- setMeasuredHeight(event.nativeEvent.layout.height);
15
- }, style: style, contentContainerStyle: contentContainerStyle, ...rest }));
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
10
+ return (React.createElement(ScrollView, { style: style, contentContainerStyle: contentContainerStyle, ...rest }));
16
11
  };
17
12
  export default SimpleStyleScrollView;
18
13
  //# sourceMappingURL=SimpleStyleScrollView.js.map
@@ -1 +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,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,CACf,CAAC;IAEF,OAAO,CACL,oBAAC,UAAU,IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,KACxC,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
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"}
@@ -10,21 +10,11 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
10
10
  const SimpleStyleScrollView: React.FC<
11
11
  Omit<ScrollViewProps, "contentContainerStyle">
12
12
  > = ({ style: styleProp, ...rest }) => {
13
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
14
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
15
-
16
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
17
- styleProp,
18
- measuredWidth,
19
- measuredHeight
20
- );
13
+ const { style, contentContainerStyle } =
14
+ useSplitContentContainerStyles(styleProp);
21
15
 
22
16
  return (
23
17
  <ScrollView
24
- onLayout={(event) => {
25
- setMeasuredWidth(event.nativeEvent.layout.width);
26
- setMeasuredHeight(event.nativeEvent.layout.height);
27
- }}
28
18
  style={style}
29
19
  contentContainerStyle={contentContainerStyle}
30
20
  {...rest}
@@ -6,15 +6,10 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleSectionList = ({ style: styleProp, data, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight, [data]);
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
12
10
  return (
13
11
  //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
14
- React.createElement(SectionList, { onLayout: (event) => {
15
- setMeasuredWidth(event.nativeEvent.layout.width);
16
- setMeasuredHeight(event.nativeEvent.layout.height);
17
- }, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
12
+ React.createElement(SectionList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
18
13
  };
19
14
  export default SimpleStyleSectionList;
20
15
  //# sourceMappingURL=SimpleStyleSectionList.js.map
@@ -1 +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,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,EACd,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO;IACL,gHAAgH;IAChH,oBAAC,WAAW,IACV,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
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"}
@@ -18,23 +18,12 @@ const SimpleStyleSectionList = <T extends { [key: string]: any }>({
18
18
  FlatListSectionListProps<T> | FlashListSectionListProps<T>,
19
19
  "contentContainerStyle"
20
20
  >) => {
21
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
22
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
23
-
24
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
25
- styleProp,
26
- measuredWidth,
27
- measuredHeight,
28
- [data]
29
- );
21
+ const { style, contentContainerStyle } =
22
+ useSplitContentContainerStyles(styleProp);
30
23
 
31
24
  return (
32
25
  //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
33
26
  <SectionList
34
- onLayout={(event) => {
35
- setMeasuredWidth(event.nativeEvent.layout.width);
36
- setMeasuredHeight(event.nativeEvent.layout.height);
37
- }}
38
27
  style={style}
39
28
  contentContainerStyle={contentContainerStyle}
40
29
  data={data}
@@ -6,15 +6,10 @@ import useSplitContentContainerStyles from "./useSplitContentContainerStyles";
6
6
  * the appropriate style keys into the `contentContainerStyle`
7
7
  */
8
8
  const SimpleStyleSwipeableList = ({ style: styleProp, data, ...rest }) => {
9
- const [measuredWidth, setMeasuredWidth] = React.useState();
10
- const [measuredHeight, setMeasuredHeight] = React.useState();
11
- const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp, measuredWidth, measuredHeight, [data]);
9
+ const { style, contentContainerStyle } = useSplitContentContainerStyles(styleProp);
12
10
  return (
13
11
  //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
14
- React.createElement(SwipeableList, { onLayout: (event) => {
15
- setMeasuredWidth(event.nativeEvent.layout.width);
16
- setMeasuredHeight(event.nativeEvent.layout.height);
17
- }, style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
12
+ React.createElement(SwipeableList, { style: style, contentContainerStyle: contentContainerStyle, data: data, ...rest }));
18
13
  };
19
14
  export default SimpleStyleSwipeableList;
20
15
  //# sourceMappingURL=SimpleStyleSwipeableList.js.map
@@ -1 +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,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IACnE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;IAErE,MAAM,EAAE,KAAK,EAAE,qBAAqB,EAAE,GAAG,8BAA8B,CACrE,SAAS,EACT,aAAa,EACb,cAAc,EACd,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO;IACL,gHAAgH;IAChH,oBAAC,aAAa,IACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACjD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,qBAAqB,EAAE,qBAAqB,EAC5C,IAAI,EAAE,IAAI,KACN,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,wBAAwB,CAAC"}
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"}
@@ -18,23 +18,12 @@ const SimpleStyleSwipeableList = <T extends { [key: string]: any }>({
18
18
  FlashListSwipeableListProps<T> | FlatListSwipeableListProps<T>,
19
19
  "contentContainerStyle"
20
20
  >) => {
21
- const [measuredWidth, setMeasuredWidth] = React.useState<number>();
22
- const [measuredHeight, setMeasuredHeight] = React.useState<number>();
23
-
24
- const { style, contentContainerStyle } = useSplitContentContainerStyles(
25
- styleProp,
26
- measuredWidth,
27
- measuredHeight,
28
- [data]
29
- );
21
+ const { style, contentContainerStyle } =
22
+ useSplitContentContainerStyles(styleProp);
30
23
 
31
24
  return (
32
25
  //@ts-ignore contentContainerStyle has different types for FlashList and FlatList implmentations and confuses TS
33
26
  <SwipeableList
34
- onLayout={(event) => {
35
- setMeasuredWidth(event.nativeEvent.layout.width);
36
- setMeasuredHeight(event.nativeEvent.layout.height);
37
- }}
38
27
  style={style}
39
28
  contentContainerStyle={contentContainerStyle}
40
29
  data={data}
@@ -1,4 +1,3 @@
1
- import React from "react";
2
1
  import { StyleSheet } from "react-native";
3
2
  import { pick, omit } from "lodash";
4
3
  import { useDeepCompareMemo } from "../../utilities";
@@ -21,39 +20,12 @@ export const contentContainerStyleNames = [
21
20
  "columnGap",
22
21
  "rowGap",
23
22
  ];
24
- export default function useSplitContentContainerStyles(originalStyle, measuredWidth, measuredHeight, recalculateSizeDeps = []) {
25
- // This temporarily removes contentContainerStyle min sizes whenever some
26
- // given dependencies change to allow the list to properly recalculate it's measured size
27
- const [tempContentContainerStyle, setTempContentContainerStyle] = React.useState(null);
28
- React.useEffect(() => {
29
- if (tempContentContainerStyle) {
30
- setTempContentContainerStyle(null);
31
- }
32
- // We only want this to run when measured size changes
33
- // eslint-disable-next-line react-hooks/exhaustive-deps
34
- }, [measuredHeight, measuredWidth]);
35
- React.useEffect(() => {
36
- setTempContentContainerStyle({ minHeight: 0, minWidth: 0 });
37
- // eslint-disable-next-line react-hooks/exhaustive-deps
38
- }, recalculateSizeDeps);
23
+ export default function useSplitContentContainerStyles(originalStyle) {
39
24
  return useDeepCompareMemo(() => {
40
- var _a, _b, _c, _d, _e, _f, _g, _h;
41
25
  const flattenedStyle = StyleSheet.flatten(originalStyle);
42
- let contentContainerStyle = pick(flattenedStyle, contentContainerStyleNames);
43
- const leftBorderWidth = (_b = (_a = flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderLeftWidth) !== null && _a !== void 0 ? _a : flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderWidth) !== null && _b !== void 0 ? _b : 0;
44
- const rightBorderWidth = (_d = (_c = flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderRightWidth) !== null && _c !== void 0 ? _c : flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderWidth) !== null && _d !== void 0 ? _d : 0;
45
- const topBorderWidth = (_f = (_e = flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderTopWidth) !== null && _e !== void 0 ? _e : flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderWidth) !== null && _f !== void 0 ? _f : 0;
46
- const bottomBorderWidth = (_h = (_g = flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderBottomWidth) !== null && _g !== void 0 ? _g : flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.borderWidth) !== null && _h !== void 0 ? _h : 0;
26
+ const contentContainerStyle = pick(flattenedStyle, contentContainerStyleNames);
47
27
  // contentContainerStyle should always at least fill the parent to ensure sizing changes reflects properly on component and children.
48
- // The measured sizes include borders, so we need to subtract those before applying
49
- if (measuredWidth) {
50
- contentContainerStyle.minWidth =
51
- measuredWidth - leftBorderWidth - rightBorderWidth;
52
- }
53
- if (measuredHeight) {
54
- contentContainerStyle.minHeight =
55
- measuredHeight - topBorderWidth - bottomBorderWidth;
56
- }
28
+ contentContainerStyle.flexGrow = 1;
57
29
  let style = omit(flattenedStyle, contentContainerStyleNames);
58
30
  // ScrollView's implementation defaults flexGrow to 1, which prevents the ability to set a static size or use a flex larger than 1
59
31
  // See: https://github.com/facebook/react-native/issues/3422
@@ -65,11 +37,8 @@ export default function useSplitContentContainerStyles(originalStyle, measuredWi
65
37
  }
66
38
  return {
67
39
  style,
68
- contentContainerStyle: StyleSheet.flatten([
69
- contentContainerStyle,
70
- tempContentContainerStyle,
71
- ]),
40
+ contentContainerStyle,
72
41
  };
73
- }, [originalStyle, measuredWidth, measuredHeight, tempContentContainerStyle]);
42
+ }, [originalStyle]);
74
43
  }
75
44
  //# sourceMappingURL=useSplitContentContainerStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useSplitContentContainerStyles.js","sourceRoot":"","sources":["useSplitContentContainerStyles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAwB,UAAU,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAOrD,MAAM,CAAC,MAAM,0BAA0B,GAAG;IACxC,SAAS;IACT,eAAe;IACf,YAAY;IACZ,mBAAmB;IACnB,aAAa;IACb,cAAc;IACd,cAAc;IACd,YAAY;IACZ,iBAAiB;IACjB,gBAAgB;IAChB,YAAY;IACZ,cAAc;IACd,eAAe;IACf,UAAU;IACV,KAAK;IACL,WAAW;IACX,QAAQ;CACT,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,8BAA8B,CACpD,aAAmC,EACnC,aAAsB,EACtB,cAAuB,EACvB,sBAA4C,EAAE;IAE9C,yEAAyE;IACzE,yFAAyF;IACzF,MAAM,CAAC,yBAAyB,EAAE,4BAA4B,CAAC,GAC7D,KAAK,CAAC,QAAQ,CAAmB,IAAI,CAAC,CAAC;IAEzC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,yBAAyB,EAAE;YAC7B,4BAA4B,CAAC,IAAI,CAAC,CAAC;SACpC;QACD,sDAAsD;QACtD,uDAAuD;IACzD,CAAC,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC,CAAC;IAEpC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,4BAA4B,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAC;QAC5D,uDAAuD;IACzD,CAAC,EAAE,mBAAmB,CAAC,CAAC;IAExB,OAAO,kBAAkB,CAAS,GAAG,EAAE;;QACrC,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAEzD,IAAI,qBAAqB,GAAG,IAAI,CAC9B,cAAc,EACd,0BAA0B,CAC3B,CAAC;QAEF,MAAM,eAAe,GACnB,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,eAAe,mCAAI,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,mCAAI,CAAC,CAAC;QACtE,MAAM,gBAAgB,GACpB,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,gBAAgB,mCAAI,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,mCAAI,CAAC,CAAC;QACvE,MAAM,cAAc,GAClB,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,cAAc,mCAAI,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,mCAAI,CAAC,CAAC;QACrE,MAAM,iBAAiB,GACrB,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,iBAAiB,mCAAI,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,mCAAI,CAAC,CAAC;QAExE,qIAAqI;QACrI,mFAAmF;QACnF,IAAI,aAAa,EAAE;YACjB,qBAAqB,CAAC,QAAQ;gBAC5B,aAAa,GAAG,eAAe,GAAG,gBAAgB,CAAC;SACtD;QACD,IAAI,cAAc,EAAE;YAClB,qBAAqB,CAAC,SAAS;gBAC7B,cAAc,GAAG,cAAc,GAAG,iBAAiB,CAAC;SACvD;QAED,IAAI,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,0BAA0B,CAAC,CAAC;QAE7D,kIAAkI;QAClI,4DAA4D;QAC5D,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE;YAC5B,KAAK,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;SACnC;aAAM,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;YACvC,KAAK,GAAG,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,GAAG,KAAK,EAAE,CAAC;SAC5C;QAED,OAAO;YACL,KAAK;YACL,qBAAqB,EAAE,UAAU,CAAC,OAAO,CAAC;gBACxC,qBAAqB;gBACrB,yBAAyB;aAC1B,CAAC;SACH,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,cAAc,EAAE,yBAAyB,CAAC,CAAC,CAAC;AAChF,CAAC"}
1
+ {"version":3,"file":"useSplitContentContainerStyles.js","sourceRoot":"","sources":["useSplitContentContainerStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,UAAU,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAOrD,MAAM,CAAC,MAAM,0BAA0B,GAAG;IACxC,SAAS;IACT,eAAe;IACf,YAAY;IACZ,mBAAmB;IACnB,aAAa;IACb,cAAc;IACd,cAAc;IACd,YAAY;IACZ,iBAAiB;IACjB,gBAAgB;IAChB,YAAY;IACZ,cAAc;IACd,eAAe;IACf,UAAU;IACV,KAAK;IACL,WAAW;IACX,QAAQ;CACT,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,8BAA8B,CACpD,aAAmC;IAEnC,OAAO,kBAAkB,CAAS,GAAG,EAAE;QACrC,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAEzD,MAAM,qBAAqB,GAAG,IAAI,CAChC,cAAc,EACd,0BAA0B,CAC3B,CAAC;QAEF,qIAAqI;QACrI,qBAAqB,CAAC,QAAQ,GAAG,CAAC,CAAC;QAEnC,IAAI,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,0BAA0B,CAAC,CAAC;QAE7D,kIAAkI;QAClI,4DAA4D;QAC5D,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE;YAC5B,KAAK,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;SACnC;aAAM,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;YACvC,KAAK,GAAG,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,GAAG,KAAK,EAAE,CAAC;SAC5C;QAED,OAAO;YACL,KAAK;YACL,qBAAqB;SACtB,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AACtB,CAAC"}
@@ -1,4 +1,3 @@
1
- import React from "react";
2
1
  import { StyleProp, ViewStyle, StyleSheet } from "react-native";
3
2
  import { pick, omit } from "lodash";
4
3
  import { useDeepCompareMemo } from "../../utilities";
@@ -29,56 +28,18 @@ export const contentContainerStyleNames = [
29
28
  ];
30
29
 
31
30
  export default function useSplitContentContainerStyles(
32
- originalStyle: StyleProp<ViewStyle>,
33
- measuredWidth?: number,
34
- measuredHeight?: number,
35
- recalculateSizeDeps: React.DependencyList = []
31
+ originalStyle: StyleProp<ViewStyle>
36
32
  ) {
37
- // This temporarily removes contentContainerStyle min sizes whenever some
38
- // given dependencies change to allow the list to properly recalculate it's measured size
39
- const [tempContentContainerStyle, setTempContentContainerStyle] =
40
- React.useState<ViewStyle | null>(null);
41
-
42
- React.useEffect(() => {
43
- if (tempContentContainerStyle) {
44
- setTempContentContainerStyle(null);
45
- }
46
- // We only want this to run when measured size changes
47
- // eslint-disable-next-line react-hooks/exhaustive-deps
48
- }, [measuredHeight, measuredWidth]);
49
-
50
- React.useEffect(() => {
51
- setTempContentContainerStyle({ minHeight: 0, minWidth: 0 });
52
- // eslint-disable-next-line react-hooks/exhaustive-deps
53
- }, recalculateSizeDeps);
54
-
55
33
  return useDeepCompareMemo<Styles>(() => {
56
34
  const flattenedStyle = StyleSheet.flatten(originalStyle);
57
35
 
58
- let contentContainerStyle = pick(
36
+ const contentContainerStyle = pick(
59
37
  flattenedStyle,
60
38
  contentContainerStyleNames
61
39
  );
62
40
 
63
- const leftBorderWidth =
64
- flattenedStyle?.borderLeftWidth ?? flattenedStyle?.borderWidth ?? 0;
65
- const rightBorderWidth =
66
- flattenedStyle?.borderRightWidth ?? flattenedStyle?.borderWidth ?? 0;
67
- const topBorderWidth =
68
- flattenedStyle?.borderTopWidth ?? flattenedStyle?.borderWidth ?? 0;
69
- const bottomBorderWidth =
70
- flattenedStyle?.borderBottomWidth ?? flattenedStyle?.borderWidth ?? 0;
71
-
72
41
  // contentContainerStyle should always at least fill the parent to ensure sizing changes reflects properly on component and children.
73
- // The measured sizes include borders, so we need to subtract those before applying
74
- if (measuredWidth) {
75
- contentContainerStyle.minWidth =
76
- measuredWidth - leftBorderWidth - rightBorderWidth;
77
- }
78
- if (measuredHeight) {
79
- contentContainerStyle.minHeight =
80
- measuredHeight - topBorderWidth - bottomBorderWidth;
81
- }
42
+ contentContainerStyle.flexGrow = 1;
82
43
 
83
44
  let style = omit(flattenedStyle, contentContainerStyleNames);
84
45
 
@@ -92,10 +53,7 @@ export default function useSplitContentContainerStyles(
92
53
 
93
54
  return {
94
55
  style,
95
- contentContainerStyle: StyleSheet.flatten([
96
- contentContainerStyle,
97
- tempContentContainerStyle,
98
- ]),
56
+ contentContainerStyle,
99
57
  };
100
- }, [originalStyle, measuredWidth, measuredHeight, tempContentContainerStyle]);
58
+ }, [originalStyle]);
101
59
  }