@sendbird/uikit-react-native-foundation 3.9.4 → 3.9.6

package/lib/commonjs/components/Modal/index.js

@@ -56,7 +56,7 @@ const Modal = ({
     if (visible) showAction();else hideAction();
   }, [visible]);
   useOnDismiss(modalVisible, onDismiss);
-  return /*#__PURE__*/_react.default.createElement(_reactNative.Modal, _extends({
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Modal, _extends({
     statusBarTranslucent: statusBarTranslucent,
     transparent: true,
     hardwareAccelerated: true,
@@ -97,7 +97,7 @@ const Modal = ({
   }, panResponder.panHandlers), /*#__PURE__*/_react.default.createElement(_reactNative.Pressable
   // NOTE: https://github.com/facebook/react-native/issues/14295
   //  Due to 'Pressable', the width of the children must be explicitly specified as a number.
-  , null, children))));
+  , null, children)))));
 };
 const isHideGesture = (distanceY, velocityY) => {
   return distanceY > 125 || distanceY > 0 && velocityY > 0.1;

package/lib/commonjs/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_createStyleSheet","_interopRequireDefault","_useHeaderStyle","_useUIKitTheme","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","Modal","children","onClose","backgroundStyle","onDismiss","type","visible","disableBackgroundClose","enableKeyboardAvoid","statusBarTranslucent","props","palette","useUIKitTheme","content","backdrop","showTransition","hideTransition","useModalAnimation","panResponder","useModalPanResponder","translateY","topInset","useHeaderStyle","modalVisible","setModalVisible","useState","showAction","hideAction","width","height","useWindowDimensions","useEffect","useOnDismiss","createElement","transparent","hardwareAccelerated","onRequestClose","onShow","supportedOrientations","animationType","TouchableWithoutFeedback","onPress","undefined","Animated","View","style","StyleSheet","absoluteFill","opacity","backgroundColor","onBackgroundLight03","KeyboardAvoidingView","key","Platform","OS","enabled","styles","background","behavior","select","ios","pointerEvents","keyboardVerticalOffset","transform","panHandlers","Pressable","isHideGesture","distanceY","velocityY","show","hide","React","useRef","PanResponder","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","Dimensions","baseAnimBackground","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","prop","prev","curr","createStyleSheet","flex","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport {\n  Animated,\n  Dimensions,\n  KeyboardAvoidingView,\n  ModalProps,\n  PanResponder,\n  Platform,\n  Pressable,\n  Modal as RNModal,\n  StyleProp,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  ViewStyle,\n  useWindowDimensions,\n} from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ModalAnimationType = 'slide' | 'slide-no-gesture' | 'fade';\ntype Props = {\n  type?: ModalAnimationType;\n  onClose: () => void;\n  backgroundStyle?: StyleProp<ViewStyle>;\n  disableBackgroundClose?: boolean;\n  enableKeyboardAvoid?: boolean;\n} & Omit<ModalProps, 'animationType' | 'onRequestClose'>;\n\n/**\n * Modal Open: Triggered by Modal.props.visible state changed to true\n * - visible true -> modalVisible true -> animation start\n *\n * Modal Close: Triggered by Modal.props.onClose() call\n * - Modal.props.onClose() -> visible false -> animation start -> modalVisible false\n * */\nconst Modal = ({\n  children,\n  onClose,\n  backgroundStyle,\n  onDismiss,\n  type = 'fade',\n  visible = false,\n  disableBackgroundClose = false,\n  enableKeyboardAvoid = false,\n  statusBarTranslucent,\n  ...props\n}: Props) => {\n  const { palette } = useUIKitTheme();\n  const { content, backdrop, showTransition, hideTransition } = useModalAnimation(type);\n  const panResponder = useModalPanResponder(type, content.translateY, showTransition, onClose);\n  const { topInset } = useHeaderStyle();\n\n  const [modalVisible, setModalVisible] = useState(false);\n  const showAction = () => setModalVisible(true);\n  const hideAction = () => hideTransition(() => setModalVisible(false));\n\n  const { width, height } = useWindowDimensions();\n\n  useEffect(() => {\n    if (visible) showAction();\n    else hideAction();\n  }, [visible]);\n\n  useOnDismiss(modalVisible, onDismiss);\n\n  return (\n    <RNModal\n      statusBarTranslucent={statusBarTranslucent}\n      transparent\n      hardwareAccelerated\n      visible={modalVisible}\n      onRequestClose={onClose}\n      onShow={() => showTransition()}\n      onDismiss={onDismiss}\n      supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}\n      animationType={'none'}\n      {...props}\n    >\n      <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>\n        <Animated.View\n          style={[StyleSheet.absoluteFill, { opacity: backdrop.opacity, backgroundColor: palette.onBackgroundLight03 }]}\n        />\n      </TouchableWithoutFeedback>\n      <KeyboardAvoidingView\n        // NOTE: This is trick for Android.\n        //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.\n        key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}\n        enabled={enableKeyboardAvoid}\n        style={styles.background}\n        behavior={Platform.select({ ios: 'padding', default: 'height' })}\n        pointerEvents={'box-none'}\n        keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}\n      >\n        <Animated.View\n          style={[\n            styles.background,\n            backgroundStyle,\n            { opacity: content.opacity, transform: [{ translateY: content.translateY }] },\n          ]}\n          pointerEvents={'box-none'}\n          {...panResponder.panHandlers}\n        >\n          <Pressable\n          // NOTE: https://github.com/facebook/react-native/issues/14295\n          //  Due to 'Pressable', the width of the children must be explicitly specified as a number.\n          >\n            {children}\n          </Pressable>\n        </Animated.View>\n      </KeyboardAvoidingView>\n    </RNModal>\n  );\n};\n\nconst isHideGesture = (distanceY: number, velocityY: number) => {\n  return distanceY > 125 || (distanceY > 0 && velocityY > 0.1);\n};\nconst useModalPanResponder = (\n  type: ModalAnimationType,\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade' || type === 'slide-no-gesture') return { panHandlers: {} };\n  return React.useRef(\n    PanResponder.create({\n      onMoveShouldSetPanResponderCapture: (_, { dy }) => dy > 8,\n      // @ts-ignore\n      onPanResponderGrant: () => translateY.setOffset(translateY.__getValue()),\n      onPanResponderMove: (_, { dy }) => dy >= 0 && translateY.setValue(dy), // Animated.event([null, { dy: translateY }], { useNativeDriver: false }),\n      onPanResponderRelease: (_, { dy, vy }) => {\n        if (isHideGesture(dy, vy)) hide();\n        else show();\n      },\n    }),\n  ).current;\n};\n\nconst useModalAnimation = (type: ModalAnimationType) => {\n  const initialY = type === 'fade' ? 0 : Dimensions.get('window').height;\n  const baseAnimBackground = useRef(new Animated.Value(0)).current;\n  const baseAnimContent = useRef(new Animated.Value(initialY)).current;\n\n  const content = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [type === 'fade' ? 0 : 1, 1],\n    }),\n    translateY: baseAnimContent,\n  };\n  const backdrop = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [0, 1],\n    }),\n  };\n  const createTransition = (toValue: 0 | 1) => {\n    const config = { duration: 250, useNativeDriver: false };\n    return Animated.parallel([\n      Animated.timing(baseAnimBackground, { toValue, ...config }),\n      Animated.timing(baseAnimContent, { toValue: toValue === 0 ? initialY : 0, ...config }),\n    ]).start;\n  };\n  return {\n    content,\n    backdrop,\n    showTransition: createTransition(1),\n    hideTransition: createTransition(0),\n  };\n};\n\n// NOTE: onDismiss is supports iOS only\nconst useOnDismiss = (visible: boolean, onDismiss?: () => void) => {\n  const prevVisible = usePrevProp(visible);\n  useEffect(() => {\n    if (Platform.OS === 'ios') return;\n    if (prevVisible && !visible) onDismiss?.();\n  }, [prevVisible, visible]);\n};\n\nconst usePrevProp = <T,>(prop: T) => {\n  const prev = useRef(prop);\n  const curr = useRef(prop);\n  useEffect(() => {\n    prev.current = curr.current;\n    curr.current = prop;\n  });\n  return prev.current;\n};\n\nconst styles = createStyleSheet({\n  background: { flex: 1 },\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_createStyleSheet","_interopRequireDefault","_useHeaderStyle","_useUIKitTheme","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","Modal","children","onClose","backgroundStyle","onDismiss","type","visible","disableBackgroundClose","enableKeyboardAvoid","statusBarTranslucent","props","palette","useUIKitTheme","content","backdrop","showTransition","hideTransition","useModalAnimation","panResponder","useModalPanResponder","translateY","topInset","useHeaderStyle","modalVisible","setModalVisible","useState","showAction","hideAction","width","height","useWindowDimensions","useEffect","useOnDismiss","createElement","View","transparent","hardwareAccelerated","onRequestClose","onShow","supportedOrientations","animationType","TouchableWithoutFeedback","onPress","undefined","Animated","style","StyleSheet","absoluteFill","opacity","backgroundColor","onBackgroundLight03","KeyboardAvoidingView","key","Platform","OS","enabled","styles","background","behavior","select","ios","pointerEvents","keyboardVerticalOffset","transform","panHandlers","Pressable","isHideGesture","distanceY","velocityY","show","hide","React","useRef","PanResponder","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","Dimensions","baseAnimBackground","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","prop","prev","curr","createStyleSheet","flex","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport {\n  Animated,\n  Dimensions,\n  KeyboardAvoidingView,\n  ModalProps,\n  PanResponder,\n  Platform,\n  Pressable,\n  Modal as RNModal,\n  StyleProp,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  View,\n  ViewStyle,\n  useWindowDimensions,\n} from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ModalAnimationType = 'slide' | 'slide-no-gesture' | 'fade';\ntype Props = {\n  type?: ModalAnimationType;\n  onClose: () => void;\n  backgroundStyle?: StyleProp<ViewStyle>;\n  disableBackgroundClose?: boolean;\n  enableKeyboardAvoid?: boolean;\n} & Omit<ModalProps, 'animationType' | 'onRequestClose'>;\n\n/**\n * Modal Open: Triggered by Modal.props.visible state changed to true\n * - visible true -> modalVisible true -> animation start\n *\n * Modal Close: Triggered by Modal.props.onClose() call\n * - Modal.props.onClose() -> visible false -> animation start -> modalVisible false\n * */\nconst Modal = ({\n  children,\n  onClose,\n  backgroundStyle,\n  onDismiss,\n  type = 'fade',\n  visible = false,\n  disableBackgroundClose = false,\n  enableKeyboardAvoid = false,\n  statusBarTranslucent,\n  ...props\n}: Props) => {\n  const { palette } = useUIKitTheme();\n  const { content, backdrop, showTransition, hideTransition } = useModalAnimation(type);\n  const panResponder = useModalPanResponder(type, content.translateY, showTransition, onClose);\n  const { topInset } = useHeaderStyle();\n\n  const [modalVisible, setModalVisible] = useState(false);\n  const showAction = () => setModalVisible(true);\n  const hideAction = () => hideTransition(() => setModalVisible(false));\n\n  const { width, height } = useWindowDimensions();\n\n  useEffect(() => {\n    if (visible) showAction();\n    else hideAction();\n  }, [visible]);\n\n  useOnDismiss(modalVisible, onDismiss);\n\n  return (\n    <View>\n      <RNModal\n        statusBarTranslucent={statusBarTranslucent}\n        transparent\n        hardwareAccelerated\n        visible={modalVisible}\n        onRequestClose={onClose}\n        onShow={() => showTransition()}\n        onDismiss={onDismiss}\n        supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}\n        animationType={'none'}\n        {...props}\n      >\n        <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>\n          <Animated.View\n            style={[\n              StyleSheet.absoluteFill,\n              {\n                opacity: backdrop.opacity,\n                backgroundColor: palette.onBackgroundLight03,\n              },\n            ]}\n          />\n        </TouchableWithoutFeedback>\n        <KeyboardAvoidingView\n          // NOTE: This is trick for Android.\n          //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.\n          key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}\n          enabled={enableKeyboardAvoid}\n          style={styles.background}\n          behavior={Platform.select({ ios: 'padding', default: 'height' })}\n          pointerEvents={'box-none'}\n          keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}\n        >\n          <Animated.View\n            style={[\n              styles.background,\n              backgroundStyle,\n              { opacity: content.opacity, transform: [{ translateY: content.translateY }] },\n            ]}\n            pointerEvents={'box-none'}\n            {...panResponder.panHandlers}\n          >\n            <Pressable\n            // NOTE: https://github.com/facebook/react-native/issues/14295\n            //  Due to 'Pressable', the width of the children must be explicitly specified as a number.\n            >\n              {children}\n            </Pressable>\n          </Animated.View>\n        </KeyboardAvoidingView>\n      </RNModal>\n    </View>\n  );\n};\n\nconst isHideGesture = (distanceY: number, velocityY: number) => {\n  return distanceY > 125 || (distanceY > 0 && velocityY > 0.1);\n};\nconst useModalPanResponder = (\n  type: ModalAnimationType,\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade' || type === 'slide-no-gesture') return { panHandlers: {} };\n  return React.useRef(\n    PanResponder.create({\n      onMoveShouldSetPanResponderCapture: (_, { dy }) => dy > 8,\n      // @ts-ignore\n      onPanResponderGrant: () => translateY.setOffset(translateY.__getValue()),\n      onPanResponderMove: (_, { dy }) => dy >= 0 && translateY.setValue(dy), // Animated.event([null, { dy: translateY }], { useNativeDriver: false }),\n      onPanResponderRelease: (_, { dy, vy }) => {\n        if (isHideGesture(dy, vy)) hide();\n        else show();\n      },\n    }),\n  ).current;\n};\n\nconst useModalAnimation = (type: ModalAnimationType) => {\n  const initialY = type === 'fade' ? 0 : Dimensions.get('window').height;\n  const baseAnimBackground = useRef(new Animated.Value(0)).current;\n  const baseAnimContent = useRef(new Animated.Value(initialY)).current;\n\n  const content = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [type === 'fade' ? 0 : 1, 1],\n    }),\n    translateY: baseAnimContent,\n  };\n  const backdrop = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [0, 1],\n    }),\n  };\n  const createTransition = (toValue: 0 | 1) => {\n    const config = { duration: 250, useNativeDriver: false };\n    return Animated.parallel([\n      Animated.timing(baseAnimBackground, { toValue, ...config }),\n      Animated.timing(baseAnimContent, { toValue: toValue === 0 ? initialY : 0, ...config }),\n    ]).start;\n  };\n  return {\n    content,\n    backdrop,\n    showTransition: createTransition(1),\n    hideTransition: createTransition(0),\n  };\n};\n\n// NOTE: onDismiss is supports iOS only\nconst useOnDismiss = (visible: boolean, onDismiss?: () => void) => {\n  const prevVisible = usePrevProp(visible);\n  useEffect(() => {\n    if (Platform.OS === 'ios') return;\n    if (prevVisible && !visible) onDismiss?.();\n  }, [prevVisible, visible]);\n};\n\nconst usePrevProp = <T,>(prop: T) => {\n  const prev = useRef(prop);\n  const curr = useRef(prop);\n  useEffect(() => {\n    prev.current = curr.current;\n    curr.current = prop;\n  });\n  return prev.current;\n};\n\nconst styles = createStyleSheet({\n  background: { flex: 1 },\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Modal/index.js

@@ -1,6 +1,6 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { useEffect, useRef, useState } from 'react';
-import { Animated, Dimensions, KeyboardAvoidingView, PanResponder, Platform, Pressable, Modal as RNModal, StyleSheet, TouchableWithoutFeedback, useWindowDimensions } from 'react-native';
+import { Animated, Dimensions, KeyboardAvoidingView, PanResponder, Platform, Pressable, Modal as RNModal, StyleSheet, TouchableWithoutFeedback, View, useWindowDimensions } from 'react-native';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useHeaderStyle from '../../styles/useHeaderStyle';
 import useUIKitTheme from '../../theme/useUIKitTheme';
@@ -47,7 +47,7 @@ const Modal = ({
     if (visible) showAction();else hideAction();
   }, [visible]);
   useOnDismiss(modalVisible, onDismiss);
-  return /*#__PURE__*/React.createElement(RNModal, _extends({
+  return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(RNModal, _extends({
     statusBarTranslucent: statusBarTranslucent,
     transparent: true,
     hardwareAccelerated: true,
@@ -88,7 +88,7 @@ const Modal = ({
   }, panResponder.panHandlers), /*#__PURE__*/React.createElement(Pressable
   // NOTE: https://github.com/facebook/react-native/issues/14295
   //  Due to 'Pressable', the width of the children must be explicitly specified as a number.
-  , null, children))));
+  , null, children)))));
 };
 const isHideGesture = (distanceY, velocityY) => {
   return distanceY > 125 || distanceY > 0 && velocityY > 0.1;

package/lib/module/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","Animated","Dimensions","KeyboardAvoidingView","PanResponder","Platform","Pressable","Modal","RNModal","StyleSheet","TouchableWithoutFeedback","useWindowDimensions","createStyleSheet","useHeaderStyle","useUIKitTheme","children","onClose","backgroundStyle","onDismiss","type","visible","disableBackgroundClose","enableKeyboardAvoid","statusBarTranslucent","props","palette","content","backdrop","showTransition","hideTransition","useModalAnimation","panResponder","useModalPanResponder","translateY","topInset","modalVisible","setModalVisible","showAction","hideAction","width","height","useOnDismiss","createElement","_extends","transparent","hardwareAccelerated","onRequestClose","onShow","supportedOrientations","animationType","onPress","undefined","View","style","absoluteFill","opacity","backgroundColor","onBackgroundLight03","key","OS","enabled","styles","background","behavior","select","ios","default","pointerEvents","keyboardVerticalOffset","transform","panHandlers","isHideGesture","distanceY","velocityY","show","hide","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","get","baseAnimBackground","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","prop","prev","curr","flex"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport {\n  Animated,\n  Dimensions,\n  KeyboardAvoidingView,\n  ModalProps,\n  PanResponder,\n  Platform,\n  Pressable,\n  Modal as RNModal,\n  StyleProp,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  ViewStyle,\n  useWindowDimensions,\n} from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ModalAnimationType = 'slide' | 'slide-no-gesture' | 'fade';\ntype Props = {\n  type?: ModalAnimationType;\n  onClose: () => void;\n  backgroundStyle?: StyleProp<ViewStyle>;\n  disableBackgroundClose?: boolean;\n  enableKeyboardAvoid?: boolean;\n} & Omit<ModalProps, 'animationType' | 'onRequestClose'>;\n\n/**\n * Modal Open: Triggered by Modal.props.visible state changed to true\n * - visible true -> modalVisible true -> animation start\n *\n * Modal Close: Triggered by Modal.props.onClose() call\n * - Modal.props.onClose() -> visible false -> animation start -> modalVisible false\n * */\nconst Modal = ({\n  children,\n  onClose,\n  backgroundStyle,\n  onDismiss,\n  type = 'fade',\n  visible = false,\n  disableBackgroundClose = false,\n  enableKeyboardAvoid = false,\n  statusBarTranslucent,\n  ...props\n}: Props) => {\n  const { palette } = useUIKitTheme();\n  const { content, backdrop, showTransition, hideTransition } = useModalAnimation(type);\n  const panResponder = useModalPanResponder(type, content.translateY, showTransition, onClose);\n  const { topInset } = useHeaderStyle();\n\n  const [modalVisible, setModalVisible] = useState(false);\n  const showAction = () => setModalVisible(true);\n  const hideAction = () => hideTransition(() => setModalVisible(false));\n\n  const { width, height } = useWindowDimensions();\n\n  useEffect(() => {\n    if (visible) showAction();\n    else hideAction();\n  }, [visible]);\n\n  useOnDismiss(modalVisible, onDismiss);\n\n  return (\n    <RNModal\n      statusBarTranslucent={statusBarTranslucent}\n      transparent\n      hardwareAccelerated\n      visible={modalVisible}\n      onRequestClose={onClose}\n      onShow={() => showTransition()}\n      onDismiss={onDismiss}\n      supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}\n      animationType={'none'}\n      {...props}\n    >\n      <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>\n        <Animated.View\n          style={[StyleSheet.absoluteFill, { opacity: backdrop.opacity, backgroundColor: palette.onBackgroundLight03 }]}\n        />\n      </TouchableWithoutFeedback>\n      <KeyboardAvoidingView\n        // NOTE: This is trick for Android.\n        //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.\n        key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}\n        enabled={enableKeyboardAvoid}\n        style={styles.background}\n        behavior={Platform.select({ ios: 'padding', default: 'height' })}\n        pointerEvents={'box-none'}\n        keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}\n      >\n        <Animated.View\n          style={[\n            styles.background,\n            backgroundStyle,\n            { opacity: content.opacity, transform: [{ translateY: content.translateY }] },\n          ]}\n          pointerEvents={'box-none'}\n          {...panResponder.panHandlers}\n        >\n          <Pressable\n          // NOTE: https://github.com/facebook/react-native/issues/14295\n          //  Due to 'Pressable', the width of the children must be explicitly specified as a number.\n          >\n            {children}\n          </Pressable>\n        </Animated.View>\n      </KeyboardAvoidingView>\n    </RNModal>\n  );\n};\n\nconst isHideGesture = (distanceY: number, velocityY: number) => {\n  return distanceY > 125 || (distanceY > 0 && velocityY > 0.1);\n};\nconst useModalPanResponder = (\n  type: ModalAnimationType,\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade' || type === 'slide-no-gesture') return { panHandlers: {} };\n  return React.useRef(\n    PanResponder.create({\n      onMoveShouldSetPanResponderCapture: (_, { dy }) => dy > 8,\n      // @ts-ignore\n      onPanResponderGrant: () => translateY.setOffset(translateY.__getValue()),\n      onPanResponderMove: (_, { dy }) => dy >= 0 && translateY.setValue(dy), // Animated.event([null, { dy: translateY }], { useNativeDriver: false }),\n      onPanResponderRelease: (_, { dy, vy }) => {\n        if (isHideGesture(dy, vy)) hide();\n        else show();\n      },\n    }),\n  ).current;\n};\n\nconst useModalAnimation = (type: ModalAnimationType) => {\n  const initialY = type === 'fade' ? 0 : Dimensions.get('window').height;\n  const baseAnimBackground = useRef(new Animated.Value(0)).current;\n  const baseAnimContent = useRef(new Animated.Value(initialY)).current;\n\n  const content = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [type === 'fade' ? 0 : 1, 1],\n    }),\n    translateY: baseAnimContent,\n  };\n  const backdrop = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [0, 1],\n    }),\n  };\n  const createTransition = (toValue: 0 | 1) => {\n    const config = { duration: 250, useNativeDriver: false };\n    return Animated.parallel([\n      Animated.timing(baseAnimBackground, { toValue, ...config }),\n      Animated.timing(baseAnimContent, { toValue: toValue === 0 ? initialY : 0, ...config }),\n    ]).start;\n  };\n  return {\n    content,\n    backdrop,\n    showTransition: createTransition(1),\n    hideTransition: createTransition(0),\n  };\n};\n\n// NOTE: onDismiss is supports iOS only\nconst useOnDismiss = (visible: boolean, onDismiss?: () => void) => {\n  const prevVisible = usePrevProp(visible);\n  useEffect(() => {\n    if (Platform.OS === 'ios') return;\n    if (prevVisible && !visible) onDismiss?.();\n  }, [prevVisible, visible]);\n};\n\nconst usePrevProp = <T,>(prop: T) => {\n  const prev = useRef(prop);\n  const curr = useRef(prop);\n  useEffect(() => {\n    prev.current = curr.current;\n    curr.current = prop;\n  });\n  return prev.current;\n};\n\nconst styles = createStyleSheet({\n  background: { flex: 1 },\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useRef","useState","Animated","Dimensions","KeyboardAvoidingView","PanResponder","Platform","Pressable","Modal","RNModal","StyleSheet","TouchableWithoutFeedback","View","useWindowDimensions","createStyleSheet","useHeaderStyle","useUIKitTheme","children","onClose","backgroundStyle","onDismiss","type","visible","disableBackgroundClose","enableKeyboardAvoid","statusBarTranslucent","props","palette","content","backdrop","showTransition","hideTransition","useModalAnimation","panResponder","useModalPanResponder","translateY","topInset","modalVisible","setModalVisible","showAction","hideAction","width","height","useOnDismiss","createElement","_extends","transparent","hardwareAccelerated","onRequestClose","onShow","supportedOrientations","animationType","onPress","undefined","style","absoluteFill","opacity","backgroundColor","onBackgroundLight03","key","OS","enabled","styles","background","behavior","select","ios","default","pointerEvents","keyboardVerticalOffset","transform","panHandlers","isHideGesture","distanceY","velocityY","show","hide","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","get","baseAnimBackground","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","prop","prev","curr","flex"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport {\n  Animated,\n  Dimensions,\n  KeyboardAvoidingView,\n  ModalProps,\n  PanResponder,\n  Platform,\n  Pressable,\n  Modal as RNModal,\n  StyleProp,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  View,\n  ViewStyle,\n  useWindowDimensions,\n} from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ModalAnimationType = 'slide' | 'slide-no-gesture' | 'fade';\ntype Props = {\n  type?: ModalAnimationType;\n  onClose: () => void;\n  backgroundStyle?: StyleProp<ViewStyle>;\n  disableBackgroundClose?: boolean;\n  enableKeyboardAvoid?: boolean;\n} & Omit<ModalProps, 'animationType' | 'onRequestClose'>;\n\n/**\n * Modal Open: Triggered by Modal.props.visible state changed to true\n * - visible true -> modalVisible true -> animation start\n *\n * Modal Close: Triggered by Modal.props.onClose() call\n * - Modal.props.onClose() -> visible false -> animation start -> modalVisible false\n * */\nconst Modal = ({\n  children,\n  onClose,\n  backgroundStyle,\n  onDismiss,\n  type = 'fade',\n  visible = false,\n  disableBackgroundClose = false,\n  enableKeyboardAvoid = false,\n  statusBarTranslucent,\n  ...props\n}: Props) => {\n  const { palette } = useUIKitTheme();\n  const { content, backdrop, showTransition, hideTransition } = useModalAnimation(type);\n  const panResponder = useModalPanResponder(type, content.translateY, showTransition, onClose);\n  const { topInset } = useHeaderStyle();\n\n  const [modalVisible, setModalVisible] = useState(false);\n  const showAction = () => setModalVisible(true);\n  const hideAction = () => hideTransition(() => setModalVisible(false));\n\n  const { width, height } = useWindowDimensions();\n\n  useEffect(() => {\n    if (visible) showAction();\n    else hideAction();\n  }, [visible]);\n\n  useOnDismiss(modalVisible, onDismiss);\n\n  return (\n    <View>\n      <RNModal\n        statusBarTranslucent={statusBarTranslucent}\n        transparent\n        hardwareAccelerated\n        visible={modalVisible}\n        onRequestClose={onClose}\n        onShow={() => showTransition()}\n        onDismiss={onDismiss}\n        supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}\n        animationType={'none'}\n        {...props}\n      >\n        <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>\n          <Animated.View\n            style={[\n              StyleSheet.absoluteFill,\n              {\n                opacity: backdrop.opacity,\n                backgroundColor: palette.onBackgroundLight03,\n              },\n            ]}\n          />\n        </TouchableWithoutFeedback>\n        <KeyboardAvoidingView\n          // NOTE: This is trick for Android.\n          //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.\n          key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}\n          enabled={enableKeyboardAvoid}\n          style={styles.background}\n          behavior={Platform.select({ ios: 'padding', default: 'height' })}\n          pointerEvents={'box-none'}\n          keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}\n        >\n          <Animated.View\n            style={[\n              styles.background,\n              backgroundStyle,\n              { opacity: content.opacity, transform: [{ translateY: content.translateY }] },\n            ]}\n            pointerEvents={'box-none'}\n            {...panResponder.panHandlers}\n          >\n            <Pressable\n            // NOTE: https://github.com/facebook/react-native/issues/14295\n            //  Due to 'Pressable', the width of the children must be explicitly specified as a number.\n            >\n              {children}\n            </Pressable>\n          </Animated.View>\n        </KeyboardAvoidingView>\n      </RNModal>\n    </View>\n  );\n};\n\nconst isHideGesture = (distanceY: number, velocityY: number) => {\n  return distanceY > 125 || (distanceY > 0 && velocityY > 0.1);\n};\nconst useModalPanResponder = (\n  type: ModalAnimationType,\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade' || type === 'slide-no-gesture') return { panHandlers: {} };\n  return React.useRef(\n    PanResponder.create({\n      onMoveShouldSetPanResponderCapture: (_, { dy }) => dy > 8,\n      // @ts-ignore\n      onPanResponderGrant: () => translateY.setOffset(translateY.__getValue()),\n      onPanResponderMove: (_, { dy }) => dy >= 0 && translateY.setValue(dy), // Animated.event([null, { dy: translateY }], { useNativeDriver: false }),\n      onPanResponderRelease: (_, { dy, vy }) => {\n        if (isHideGesture(dy, vy)) hide();\n        else show();\n      },\n    }),\n  ).current;\n};\n\nconst useModalAnimation = (type: ModalAnimationType) => {\n  const initialY = type === 'fade' ? 0 : Dimensions.get('window').height;\n  const baseAnimBackground = useRef(new Animated.Value(0)).current;\n  const baseAnimContent = useRef(new Animated.Value(initialY)).current;\n\n  const content = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [type === 'fade' ? 0 : 1, 1],\n    }),\n    translateY: baseAnimContent,\n  };\n  const backdrop = {\n    opacity: baseAnimBackground.interpolate({\n      inputRange: [0, 1],\n      outputRange: [0, 1],\n    }),\n  };\n  const createTransition = (toValue: 0 | 1) => {\n    const config = { duration: 250, useNativeDriver: false };\n    return Animated.parallel([\n      Animated.timing(baseAnimBackground, { toValue, ...config }),\n      Animated.timing(baseAnimContent, { toValue: toValue === 0 ? initialY : 0, ...config }),\n    ]).start;\n  };\n  return {\n    content,\n    backdrop,\n    showTransition: createTransition(1),\n    hideTransition: createTransition(0),\n  };\n};\n\n// NOTE: onDismiss is supports iOS only\nconst useOnDismiss = (visible: boolean, onDismiss?: () => void) => {\n  const prevVisible = usePrevProp(visible);\n  useEffect(() => {\n    if (Platform.OS === 'ios') return;\n    if (prevVisible && !visible) onDismiss?.();\n  }, [prevVisible, visible]);\n};\n\nconst usePrevProp = <T,>(prop: T) => {\n  const prev = useRef(prop);\n  const curr = useRef(prop);\n  useEffect(() => {\n    prev.current = curr.current;\n    curr.current = prop;\n  });\n  return prev.current;\n};\n\nconst styles = createStyleSheet({\n  background: { flex: 1 },\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendbird/uikit-react-native-foundation",
-  "version": "3.9.4",
+  "version": "3.9.6",
   "description": "A foundational UI kit for building chat-enabled React Native apps.",
   "keywords": [
     "sendbird",
@@ -48,7 +48,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sendbird/uikit-utils": "3.9.4"
+    "@sendbird/uikit-utils": "3.9.6"
   },
   "devDependencies": {
     "@types/react": "*",
@@ -85,5 +85,5 @@
       ]
     ]
   },
-  "gitHead": "4b04d425b396f8b0a58a9af4a3a46c7127a060b5"
+  "gitHead": "639b760dc4a6d804be16ed06aec680aefa9a8875"
 }

package/src/components/Modal/index.tsx

@@ -11,6 +11,7 @@ import {
   StyleProp,
   StyleSheet,
   TouchableWithoutFeedback,
+  View,
   ViewStyle,
   useWindowDimensions,
 } from 'react-native';
@@ -66,51 +67,59 @@ const Modal = ({
   useOnDismiss(modalVisible, onDismiss);
 
   return (
-    <RNModal
-      statusBarTranslucent={statusBarTranslucent}
-      transparent
-      hardwareAccelerated
-      visible={modalVisible}
-      onRequestClose={onClose}
-      onShow={() => showTransition()}
-      onDismiss={onDismiss}
-      supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}
-      animationType={'none'}
-      {...props}
-    >
-      <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>
-        <Animated.View
-          style={[StyleSheet.absoluteFill, { opacity: backdrop.opacity, backgroundColor: palette.onBackgroundLight03 }]}
-        />
-      </TouchableWithoutFeedback>
-      <KeyboardAvoidingView
-        // NOTE: This is trick for Android.
-        //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.
-        key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}
-        enabled={enableKeyboardAvoid}
-        style={styles.background}
-        behavior={Platform.select({ ios: 'padding', default: 'height' })}
-        pointerEvents={'box-none'}
-        keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}
+    <View>
+      <RNModal
+        statusBarTranslucent={statusBarTranslucent}
+        transparent
+        hardwareAccelerated
+        visible={modalVisible}
+        onRequestClose={onClose}
+        onShow={() => showTransition()}
+        onDismiss={onDismiss}
+        supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}
+        animationType={'none'}
+        {...props}
       >
-        <Animated.View
-          style={[
-            styles.background,
-            backgroundStyle,
-            { opacity: content.opacity, transform: [{ translateY: content.translateY }] },
-          ]}
+        <TouchableWithoutFeedback onPress={disableBackgroundClose ? undefined : onClose}>
+          <Animated.View
+            style={[
+              StyleSheet.absoluteFill,
+              {
+                opacity: backdrop.opacity,
+                backgroundColor: palette.onBackgroundLight03,
+              },
+            ]}
+          />
+        </TouchableWithoutFeedback>
+        <KeyboardAvoidingView
+          // NOTE: This is trick for Android.
+          //  When orientation is changed on Android, the offset that to avoid soft-keyboard is not updated normally.
+          key={Platform.OS === 'android' && enableKeyboardAvoid ? `${width}-${height}` : undefined}
+          enabled={enableKeyboardAvoid}
+          style={styles.background}
+          behavior={Platform.select({ ios: 'padding', default: 'height' })}
           pointerEvents={'box-none'}
-          {...panResponder.panHandlers}
+          keyboardVerticalOffset={enableKeyboardAvoid && statusBarTranslucent ? -topInset : 0}
         >
-          <Pressable
-          // NOTE: https://github.com/facebook/react-native/issues/14295
-          //  Due to 'Pressable', the width of the children must be explicitly specified as a number.
+          <Animated.View
+            style={[
+              styles.background,
+              backgroundStyle,
+              { opacity: content.opacity, transform: [{ translateY: content.translateY }] },
+            ]}
+            pointerEvents={'box-none'}
+            {...panResponder.panHandlers}
           >
-            {children}
-          </Pressable>
-        </Animated.View>
-      </KeyboardAvoidingView>
-    </RNModal>
+            <Pressable
+            // NOTE: https://github.com/facebook/react-native/issues/14295
+            //  Due to 'Pressable', the width of the children must be explicitly specified as a number.
+            >
+              {children}
+            </Pressable>
+          </Animated.View>
+        </KeyboardAvoidingView>
+      </RNModal>
+    </View>
   );
 };