@draftbit/core 50.0.2-dfbef1.2 → 50.0.3-c6a8a2.2

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 (51) hide show
  1. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleFlashList.js +1 -1
  2. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleFlatList.js +1 -1
  3. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +1 -1
  4. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +1 -1
  5. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleScrollView.js +1 -1
  6. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleSectionList.js +1 -1
  7. package/lib/commonjs/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +1 -1
  8. package/lib/commonjs/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +1 -1
  9. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js +2 -7
  10. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js.map +1 -1
  11. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js +2 -7
  12. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js.map +1 -1
  13. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +2 -7
  14. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js.map +1 -1
  15. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +2 -7
  16. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js.map +1 -1
  17. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js +2 -7
  18. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js.map +1 -1
  19. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js +2 -7
  20. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js.map +1 -1
  21. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +2 -7
  22. package/lib/typescript/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js.map +1 -1
  23. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.d.ts +1 -2
  24. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +5 -36
  25. package/lib/typescript/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js.map +1 -1
  26. package/lib/typescript/tsconfig.tsbuildinfo +1 -1
  27. package/package.json +3 -3
  28. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js +2 -7
  29. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.js.map +1 -1
  30. package/src/components/SimpleStyleScrollables/SimpleStyleFlashList.tsx +2 -13
  31. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js +2 -7
  32. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.js.map +1 -1
  33. package/src/components/SimpleStyleScrollables/SimpleStyleFlatList.tsx +2 -13
  34. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js +2 -7
  35. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.js.map +1 -1
  36. package/src/components/SimpleStyleScrollables/SimpleStyleKeyboardAwareScrollView.tsx +2 -12
  37. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js +2 -7
  38. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.js.map +1 -1
  39. package/src/components/SimpleStyleScrollables/SimpleStyleMasonryFlashList.tsx +2 -13
  40. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js +2 -7
  41. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.js.map +1 -1
  42. package/src/components/SimpleStyleScrollables/SimpleStyleScrollView.tsx +2 -12
  43. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js +2 -7
  44. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.js.map +1 -1
  45. package/src/components/SimpleStyleScrollables/SimpleStyleSectionList.tsx +2 -13
  46. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js +2 -7
  47. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.js.map +1 -1
  48. package/src/components/SimpleStyleScrollables/SimpleStyleSwipeableList.tsx +2 -13
  49. package/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js +5 -36
  50. package/src/components/SimpleStyleScrollables/useSplitContentContainerStyles.js.map +1 -1
  51. 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": "50.0.2-dfbef1.2+dfbef16",
3
+ "version": "50.0.3-c6a8a2.2+c6a8a2f",
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": "^50.0.2-dfbef1.2+dfbef16",
44
+ "@draftbit/types": "^50.0.3-c6a8a2.2+c6a8a2f",
45
45
  "@expo/vector-icons": "^14.0.0",
46
46
  "@gorhom/bottom-sheet": "5.0.0-alpha.7",
47
47
  "@material-ui/core": "^4.11.0",
@@ -114,5 +114,5 @@
114
114
  ],
115
115
  "testEnvironment": "node"
116
116
  },
117
- "gitHead": "dfbef16f658bd7e3a872f6a6aa65c53f01b75a41"
117
+ "gitHead": "c6a8a2fbd92187cd76b6cd7bc7a91da0e0aa4e93"
118
118
  }
@@ -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":"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"}
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
  }