related-ui-components 4.1.0 → 4.1.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/lib/module/contexts/UniversalModalProvider.js +26 -1
- package/lib/module/contexts/UniversalModalProvider.js.map +1 -1
- package/lib/typescript/src/contexts/UniversalModalProvider.d.ts +2 -0
- package/lib/typescript/src/contexts/UniversalModalProvider.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/contexts/UniversalModalProvider.tsx +31 -0
|
@@ -35,7 +35,8 @@ const DefaultModalUI = ({
|
|
|
35
35
|
animateFrom = "center",
|
|
36
36
|
avoidKeyboard = true,
|
|
37
37
|
backdropStyle,
|
|
38
|
-
containerStyle
|
|
38
|
+
containerStyle,
|
|
39
|
+
closeIconComponent
|
|
39
40
|
} = options;
|
|
40
41
|
useEffect(() => {
|
|
41
42
|
if (isVisible) setIsRendered(true);
|
|
@@ -58,6 +59,9 @@ const DefaultModalUI = ({
|
|
|
58
59
|
const backdropAnimatedStyle = useAnimatedStyle(() => ({
|
|
59
60
|
opacity: opacity.value
|
|
60
61
|
}));
|
|
62
|
+
const closeIconAnimatedStyle = useAnimatedStyle(() => ({
|
|
63
|
+
opacity: opacity.value
|
|
64
|
+
}));
|
|
61
65
|
const contentAnimatedStyle = useAnimatedStyle(() => {
|
|
62
66
|
let transform = [];
|
|
63
67
|
if (animateFrom === "bottom") {
|
|
@@ -94,6 +98,22 @@ const DefaultModalUI = ({
|
|
|
94
98
|
activeOpacity: 1,
|
|
95
99
|
onPress: closeOnBackdropPress ? onClose : undefined
|
|
96
100
|
})
|
|
101
|
+
}), closeIconComponent && /*#__PURE__*/_jsx(Animated.View, {
|
|
102
|
+
style: [styles.closeIconContainer, {
|
|
103
|
+
top: insets.top + 16
|
|
104
|
+
}, closeIconAnimatedStyle],
|
|
105
|
+
pointerEvents: "box-none",
|
|
106
|
+
children: /*#__PURE__*/_jsx(TouchableOpacity, {
|
|
107
|
+
onPress: onClose,
|
|
108
|
+
hitSlop: {
|
|
109
|
+
top: 10,
|
|
110
|
+
bottom: 10,
|
|
111
|
+
left: 10,
|
|
112
|
+
right: 10
|
|
113
|
+
},
|
|
114
|
+
activeOpacity: 0.7,
|
|
115
|
+
children: closeIconComponent
|
|
116
|
+
})
|
|
97
117
|
}), /*#__PURE__*/_jsx(ContentWrapper, {
|
|
98
118
|
behavior: "padding",
|
|
99
119
|
keyboardVerticalOffset: 16,
|
|
@@ -193,6 +213,11 @@ const styles = StyleSheet.create({
|
|
|
193
213
|
},
|
|
194
214
|
baseContainer: {
|
|
195
215
|
width: "90%"
|
|
216
|
+
},
|
|
217
|
+
closeIconContainer: {
|
|
218
|
+
position: "absolute",
|
|
219
|
+
right: 16,
|
|
220
|
+
zIndex: 2000
|
|
196
221
|
}
|
|
197
222
|
});
|
|
198
223
|
//# sourceMappingURL=UniversalModalProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Portal","PortalHost","PortalProvider","React","createContext","useCallback","useContext","useEffect","useMemo","useState","BackHandler","StyleSheet","TouchableOpacity","View","KeyboardAvoidingView","Animated","Easing","runOnJS","useAnimatedStyle","useSharedValue","withTiming","useSafeAreaInsets","jsx","_jsx","jsxs","_jsxs","ModalContext","undefined","DEFAULT_MODAL_HOST","DefaultModalUI","isVisible","children","options","onClose","insets","isRendered","setIsRendered","opacity","closeOnBackdropPress","closeOnBackButton","animationConfig","duration","easing","bezier","position","animateFrom","avoidKeyboard","backdropStyle","containerStyle","value","finished","backHandler","addEventListener","remove","backdropAnimatedStyle","contentAnimatedStyle","transform","push","translateY","scale","justifyContent","paddingBottom","bottom","paddingTop","top","ContentWrapper","style","absoluteFill","styles","overlayWrapper","backdrop","activeOpacity","onPress","behavior","keyboardVerticalOffset","keyboardView","
|
|
1
|
+
{"version":3,"names":["Portal","PortalHost","PortalProvider","React","createContext","useCallback","useContext","useEffect","useMemo","useState","BackHandler","StyleSheet","TouchableOpacity","View","KeyboardAvoidingView","Animated","Easing","runOnJS","useAnimatedStyle","useSharedValue","withTiming","useSafeAreaInsets","jsx","_jsx","jsxs","_jsxs","ModalContext","undefined","DEFAULT_MODAL_HOST","DefaultModalUI","isVisible","children","options","onClose","insets","isRendered","setIsRendered","opacity","closeOnBackdropPress","closeOnBackButton","animationConfig","duration","easing","bezier","position","animateFrom","avoidKeyboard","backdropStyle","containerStyle","closeIconComponent","value","finished","backHandler","addEventListener","remove","backdropAnimatedStyle","closeIconAnimatedStyle","contentAnimatedStyle","transform","push","translateY","scale","justifyContent","paddingBottom","bottom","paddingTop","top","ContentWrapper","style","absoluteFill","styles","overlayWrapper","backdrop","activeOpacity","onPress","closeIconContainer","pointerEvents","hitSlop","left","right","behavior","keyboardVerticalOffset","keyboardView","baseContainer","UniversalModalProvider","defaultOptions","portalHostName","CustomModalComponent","state","setState","content","showModal","hideModal","prev","setTimeout","ModalUI","Provider","name","hostName","useModal","context","Error","create","zIndex","elevation","backgroundColor","alignItems","width"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/UniversalModalProvider.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -17,6 +17,8 @@ export interface ModalOptions {
|
|
|
17
17
|
animateFrom?: "center" | "bottom" | "top";
|
|
18
18
|
/** If true, avoids keyboard view. Default: true */
|
|
19
19
|
avoidKeyboard?: boolean;
|
|
20
|
+
/** Optional component to render as a close icon at the top right or left of the screen */
|
|
21
|
+
closeIconComponent?: ReactNode;
|
|
20
22
|
}
|
|
21
23
|
interface ModalContextType {
|
|
22
24
|
showModal: (content: ReactNode, options?: ModalOptions) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UniversalModalProvider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/UniversalModalProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAEZ,SAAS,EAMV,MAAM,OAAO,CAAC;AACf,OAAO,EAEL,SAAS,EAIT,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,OAAiB,EAMf,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAIjC,MAAM,WAAW,YAAY;IAC3B,sEAAsE;IACtE,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,qEAAqE;IACrE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,6CAA6C;IAC7C,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACrC,4DAA4D;IAC5D,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC1C,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"UniversalModalProvider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/UniversalModalProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAEZ,SAAS,EAMV,MAAM,OAAO,CAAC;AACf,OAAO,EAEL,SAAS,EAIT,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,OAAiB,EAMf,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAIjC,MAAM,WAAW,YAAY;IAC3B,sEAAsE;IACtE,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,qEAAqE;IACrE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,6CAA6C;IAC7C,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,qCAAqC;IACrC,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACrC,4DAA4D;IAC5D,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC1C,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,0FAA0F;IAC1F,kBAAkB,CAAC,EAAE,SAAS,CAAC;CAChC;AAED,UAAU,gBAAgB;IACxB,SAAS,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;IAChE,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,4CAA4C;IAC5C,cAAc,CAAC,EAAE,YAAY,CAAC;IAC9B,yEAAyE;IACzE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAC9B,SAAS,EAAE,OAAO,CAAC;QACnB,QAAQ,EAAE,SAAS,CAAC;QACpB,OAAO,EAAE,YAAY,CAAC;QACtB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,CAAC,CAAC;CACJ;AAMD,eAAO,MAAM,kBAAkB,uBAAuB,CAAC;AA8JvD,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8D/D,CAAC;AAEF,eAAO,MAAM,QAAQ,wBAMpB,CAAC"}
|
package/package.json
CHANGED
|
@@ -44,6 +44,8 @@ export interface ModalOptions {
|
|
|
44
44
|
animateFrom?: "center" | "bottom" | "top";
|
|
45
45
|
/** If true, avoids keyboard view. Default: true */
|
|
46
46
|
avoidKeyboard?: boolean;
|
|
47
|
+
/** Optional component to render as a close icon at the top right or left of the screen */
|
|
48
|
+
closeIconComponent?: ReactNode;
|
|
47
49
|
}
|
|
48
50
|
|
|
49
51
|
interface ModalContextType {
|
|
@@ -96,6 +98,7 @@ const DefaultModalUI: React.FC<{
|
|
|
96
98
|
avoidKeyboard = true,
|
|
97
99
|
backdropStyle,
|
|
98
100
|
containerStyle,
|
|
101
|
+
closeIconComponent
|
|
99
102
|
} = options;
|
|
100
103
|
|
|
101
104
|
useEffect(() => {
|
|
@@ -130,6 +133,10 @@ const DefaultModalUI: React.FC<{
|
|
|
130
133
|
opacity: opacity.value,
|
|
131
134
|
}));
|
|
132
135
|
|
|
136
|
+
const closeIconAnimatedStyle = useAnimatedStyle(() => ({
|
|
137
|
+
opacity: opacity.value,
|
|
138
|
+
}));
|
|
139
|
+
|
|
133
140
|
const contentAnimatedStyle = useAnimatedStyle(() => {
|
|
134
141
|
let transform = [];
|
|
135
142
|
if (animateFrom === "bottom") {
|
|
@@ -184,6 +191,25 @@ const DefaultModalUI: React.FC<{
|
|
|
184
191
|
/>
|
|
185
192
|
</Animated.View>
|
|
186
193
|
|
|
194
|
+
{closeIconComponent && (
|
|
195
|
+
<Animated.View
|
|
196
|
+
style={[
|
|
197
|
+
styles.closeIconContainer,
|
|
198
|
+
{ top: insets.top + 16 },
|
|
199
|
+
closeIconAnimatedStyle,
|
|
200
|
+
]}
|
|
201
|
+
pointerEvents="box-none"
|
|
202
|
+
>
|
|
203
|
+
<TouchableOpacity
|
|
204
|
+
onPress={onClose}
|
|
205
|
+
hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
|
|
206
|
+
activeOpacity={0.7}
|
|
207
|
+
>
|
|
208
|
+
{closeIconComponent}
|
|
209
|
+
</TouchableOpacity>
|
|
210
|
+
</Animated.View>
|
|
211
|
+
)}
|
|
212
|
+
|
|
187
213
|
{/* Content */}
|
|
188
214
|
<ContentWrapper
|
|
189
215
|
behavior={"padding"}
|
|
@@ -292,4 +318,9 @@ const styles = StyleSheet.create({
|
|
|
292
318
|
baseContainer: {
|
|
293
319
|
width: "90%",
|
|
294
320
|
},
|
|
321
|
+
closeIconContainer: {
|
|
322
|
+
position: "absolute",
|
|
323
|
+
right: 16,
|
|
324
|
+
zIndex: 2000,
|
|
325
|
+
},
|
|
295
326
|
});
|