@momo-kits/suggest-action 0.167.1-beta.7 → 0.167.1-duo.12

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.
@@ -5,7 +5,12 @@ import React, {
5
5
  useImperativeHandle,
6
6
  useRef,
7
7
  } from 'react';
8
- import {Animated, Easing, TouchableOpacity} from 'react-native';
8
+ import {
9
+ Animated,
10
+ Easing,
11
+ TouchableOpacity,
12
+ useWindowDimensions,
13
+ } from 'react-native';
9
14
  import {SuggestActionProps, SuggestActionRef} from './types';
10
15
  import {
11
16
  ApplicationContext,
@@ -13,6 +18,7 @@ import {
13
18
  Icon,
14
19
  Image,
15
20
  Shadow,
21
+ Spacing,
16
22
  Text,
17
23
  } from '@momo-kits/foundation';
18
24
  import styles from './styles';
@@ -35,6 +41,8 @@ const SuggestAction: ForwardRefRenderFunction<
35
41
  ref
36
42
  ) => {
37
43
  const {theme} = useContext(ApplicationContext);
44
+ // live window width, so the bar follows fold, unfold and rotation
45
+ const {width: windowWidth} = useWindowDimensions();
38
46
  const opacity = useRef(new Animated.Value(0)).current;
39
47
 
40
48
  useImperativeHandle(ref, () => ({show}));
@@ -101,6 +109,7 @@ const SuggestAction: ForwardRefRenderFunction<
101
109
  backgroundColor: theme.colors.background.surface,
102
110
  opacity,
103
111
  bottom,
112
+ width: windowWidth - Spacing.M * 2,
104
113
  },
105
114
  Shadow.Light,
106
115
  ]}>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/suggest-action",
3
- "version": "0.167.1-beta.7",
3
+ "version": "0.167.1-duo.12",
4
4
  "private": false,
5
5
  "main": "index.tsx",
6
6
  "peerDependencies": {
package/styles.ts CHANGED
@@ -1,8 +1,6 @@
1
- import {Dimensions, StyleSheet} from 'react-native';
1
+ import {StyleSheet} from 'react-native';
2
2
  import {Radius, Spacing} from '@momo-kits/foundation';
3
3
 
4
- const screenWidth = Dimensions.get('window').width;
5
-
6
4
  export default StyleSheet.create({
7
5
  image: {
8
6
  width: 32,
@@ -12,7 +10,6 @@ export default StyleSheet.create({
12
10
  },
13
11
  container: {
14
12
  flexDirection: 'row',
15
- width: screenWidth - Spacing.M * 2,
16
13
  marginHorizontal: Spacing.M,
17
14
  padding: Spacing.M,
18
15
  borderRadius: Radius.S,