@widergy/mobile-ui 1.33.1 → 1.33.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [1.33.2](https://github.com/widergy/mobile-ui/compare/v1.33.1...v1.33.2) (2025-01-13)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * [UGC-1101] keyboard avoid for utmodal ([#404](https://github.com/widergy/mobile-ui/issues/404)) ([a0045aa](https://github.com/widergy/mobile-ui/commit/a0045aa7f23f2288c88f9e9c67b0e42a7d5fea5c))
7
+
1
8
  ## [1.33.1](https://github.com/widergy/mobile-ui/compare/v1.33.0...v1.33.1) (2025-01-10)
2
9
 
3
10
 
@@ -1,5 +1,12 @@
1
1
  import React from 'react';
2
- import { View, TouchableWithoutFeedback, Keyboard, Modal, ImageBackground } from 'react-native';
2
+ import {
3
+ View,
4
+ TouchableWithoutFeedback,
5
+ Keyboard,
6
+ Modal,
7
+ ImageBackground,
8
+ KeyboardAvoidingView
9
+ } from 'react-native';
3
10
  import _ from 'lodash';
4
11
 
5
12
  import UTLabel from '../UTLabel';
@@ -7,6 +14,7 @@ import { useTheme } from '../../theming';
7
14
  import UTLoading from '../UTLoading';
8
15
  import SeparatorBar from '../SeparatorBar';
9
16
  import UTButton from '../UTButton';
17
+ import { IS_IOS } from '../../utils/platformUtils/constants';
10
18
 
11
19
  import ModalTypes from './proptypes';
12
20
  import ownStyles from './styles';
@@ -46,89 +54,91 @@ const UTModal = ({
46
54
  visible={visible}
47
55
  onRequestClose={loading ? () => {} : onRequestClose}
48
56
  >
49
- <ParentView onPress={() => Keyboard.dismiss()} style={[disableTouchable && styles.viewContainer]}>
50
- <View style={styles.childView} forceInset={{ top: 'never' }}>
51
- <View
52
- style={[
53
- styles.modalBackground,
54
- modalBackgroundColor && { backgroundColor: modalBackgroundColor }
55
- ]}
56
- >
57
- <UTLoading
58
- loading={loading}
59
- style={[styles.innerContainer, styles.content, styles.loading]}
60
- message={loadingText}
57
+ <KeyboardAvoidingView behavior={IS_IOS ? 'padding' : 'height'} style={styles.keyboardAvoidingView}>
58
+ <ParentView onPress={() => Keyboard.dismiss()} style={[disableTouchable && styles.viewContainer]}>
59
+ <View style={styles.childView} forceInset={{ top: 'never' }}>
60
+ <View
61
+ style={[
62
+ styles.modalBackground,
63
+ modalBackgroundColor && { backgroundColor: modalBackgroundColor }
64
+ ]}
61
65
  >
62
- <View style={[styles.innerContainer, modalStyles?.innerContainer]}>
63
- {!!backgroundImg && (
64
- <ImageBackground source={backgroundImg} resizeMode="stretch" style={backgroundStyles} />
65
- )}
66
- {!!imageComponent && (
67
- <View style={[styles.content, imageStyles]}>
68
- {!hideCloseButton && (
69
- <UTButton
70
- colorTheme={closeButtonColorTheme}
71
- Icon="IconX"
72
- onPress={onRequestClose || cancelButton.onPress}
73
- style={{ root: styles.closeButton }}
74
- variant="text"
75
- />
76
- )}
77
- <View style={styles.imageContainer}>{imageComponent}</View>
78
- </View>
79
- )}
80
- <View style={styles.content}>
81
- <View style={[styles.headerContainer, !!title && styles.closeButtonContainer]}>
82
- {!!title && (
83
- <UTLabel variant="title3" weight="medium">
84
- {title}
66
+ <UTLoading
67
+ loading={loading}
68
+ style={[styles.innerContainer, styles.content, styles.loading]}
69
+ message={loadingText}
70
+ >
71
+ <View style={[styles.innerContainer, modalStyles?.innerContainer]}>
72
+ {!!backgroundImg && (
73
+ <ImageBackground source={backgroundImg} resizeMode="stretch" style={backgroundStyles} />
74
+ )}
75
+ {!!imageComponent && (
76
+ <View style={[styles.content, imageStyles]}>
77
+ {!hideCloseButton && (
78
+ <UTButton
79
+ colorTheme={closeButtonColorTheme}
80
+ Icon="IconX"
81
+ onPress={onRequestClose || cancelButton.onPress}
82
+ style={{ root: styles.closeButton }}
83
+ variant="text"
84
+ />
85
+ )}
86
+ <View style={styles.imageContainer}>{imageComponent}</View>
87
+ </View>
88
+ )}
89
+ <View style={styles.content}>
90
+ <View style={[styles.headerContainer, !!title && styles.closeButtonContainer]}>
91
+ {!!title && (
92
+ <UTLabel variant="title3" weight="medium">
93
+ {title}
94
+ </UTLabel>
95
+ )}
96
+ {!backgroundImg && !imageComponent && !hideCloseButton && (
97
+ <UTButton
98
+ colorTheme={closeButtonColorTheme}
99
+ Icon="IconX"
100
+ onPress={onRequestClose}
101
+ style={{ root: styles.closeButton }}
102
+ variant="text"
103
+ />
104
+ )}
105
+ </View>
106
+ {!!subtitle && (
107
+ <UTLabel colorTheme="gray" {...subtitleProps}>
108
+ {subtitle}
85
109
  </UTLabel>
86
110
  )}
87
- {!backgroundImg && !imageComponent && !hideCloseButton && (
111
+
112
+ {children}
113
+ </View>
114
+ {!hideSeparatorBar && <SeparatorBar />}
115
+ <View style={styles.buttonsContainer}>
116
+ {!!cancelButton && (
88
117
  <UTButton
89
- colorTheme={closeButtonColorTheme}
90
- Icon="IconX"
91
- onPress={onRequestClose}
92
- style={{ root: styles.closeButton }}
118
+ colorTheme={cancelButton.colorTheme || 'secondary'}
119
+ disabled={cancelButton.disabled || loading}
120
+ onPress={cancelButton.onPress}
93
121
  variant="text"
94
- />
122
+ >
123
+ {cancelButton.text || 'Cancelar'}
124
+ </UTButton>
125
+ )}
126
+ {!!acceptButton && (
127
+ <UTButton
128
+ colorTheme={acceptButton.colorTheme || 'primary'}
129
+ disabled={acceptButton.disabled || loading}
130
+ onPress={acceptButton.onPress}
131
+ >
132
+ {acceptButton.text || 'Aceptar'}
133
+ </UTButton>
95
134
  )}
96
135
  </View>
97
- {!!subtitle && (
98
- <UTLabel colorTheme="gray" {...subtitleProps}>
99
- {subtitle}
100
- </UTLabel>
101
- )}
102
-
103
- {children}
104
- </View>
105
- {!hideSeparatorBar && <SeparatorBar />}
106
- <View style={styles.buttonsContainer}>
107
- {!!cancelButton && (
108
- <UTButton
109
- colorTheme={cancelButton.colorTheme || 'secondary'}
110
- disabled={cancelButton.disabled || loading}
111
- onPress={cancelButton.onPress}
112
- variant="text"
113
- >
114
- {cancelButton.text || 'Cancelar'}
115
- </UTButton>
116
- )}
117
- {!!acceptButton && (
118
- <UTButton
119
- colorTheme={acceptButton.colorTheme || 'primary'}
120
- disabled={acceptButton.disabled || loading}
121
- onPress={acceptButton.onPress}
122
- >
123
- {acceptButton.text || 'Aceptar'}
124
- </UTButton>
125
- )}
126
136
  </View>
127
- </View>
128
- </UTLoading>
137
+ </UTLoading>
138
+ </View>
129
139
  </View>
130
- </View>
131
- </ParentView>
140
+ </ParentView>
141
+ </KeyboardAvoidingView>
132
142
  </Modal>
133
143
  );
134
144
  };
@@ -56,5 +56,8 @@ export default StyleSheet.create({
56
56
  height: verticalScale(35),
57
57
  justifyContent: 'center',
58
58
  marginBottom: verticalScale(25)
59
+ },
60
+ keyboardAvoidingView: {
61
+ flex: 1
59
62
  }
60
63
  });
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@widergy/mobile-ui",
3
3
  "description": "Widergy Mobile Components",
4
4
  "author": "widergy",
5
- "version": "1.33.1",
5
+ "version": "1.33.2",
6
6
  "repository": "https://github.com/widergy/mobile-ui.git",
7
7
  "main": "lib/index.js",
8
8
  "files": [