@sendbird/uikit-react-native-foundation 2.0.2 → 2.1.0

package/lib/commonjs/assets/icon/index.js

@@ -39,7 +39,7 @@ const IconAssets = {
   'leave': require('./icon-leave.png'),
   'members': require('./icon-members.png'),
   'message': require('./icon-message.png'),
-  'moderations': require('./icon-moderations.png'),
+  'moderation': require('./icon-moderation.png'),
   'more': require('./icon-more.png'),
   'mute': require('./icon-mute.png'),
   'notifications-filled': require('./icon-notifications-filled.png'),

package/lib/commonjs/assets/icon/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["IconAssets","require"],"sources":["index.ts"],"sourcesContent":["const IconAssets = {\n  'chat-hide': require('./ic-chat-hide.png'),\n  'chat-show': require('./ic-chat-show.png'),\n  'add': require('./icon-add.png'),\n  'archive': require('./icon-archive.png'),\n  'arrow-left': require('./icon-arrow-left.png'),\n  'ban': require('./icon-ban.png'),\n  'broadcast': require('./icon-broadcast.png'),\n  'camera': require('./icon-camera.png'),\n  'channels': require('./icon-channels.png'),\n  'chat-filled': require('./icon-chat-filled.png'),\n  'chat': require('./icon-chat.png'),\n  'checkbox-off': require('./icon-checkbox-off.png'),\n  'checkbox-on': require('./icon-checkbox-on.png'),\n  'chevron-down': require('./icon-chevron-down.png'),\n  'chevron-right': require('./icon-chevron-right.png'),\n  'close': require('./icon-close.png'),\n  'copy': require('./icon-copy.png'),\n  'create': require('./icon-create.png'),\n  'delete': require('./icon-delete.png'),\n  'document': require('./icon-document.png'),\n  'done-all': require('./icon-done-all.png'),\n  'done': require('./icon-done.png'),\n  'download': require('./icon-download.png'),\n  'edit': require('./icon-edit.png'),\n  'emoji-more': require('./icon-emoji-more.png'),\n  'error': require('./icon-error.png'),\n  'file-audio': require('./icon-file-audio.png'),\n  'file-document': require('./icon-file-document.png'),\n  'freeze': require('./icon-freeze.png'),\n  'gif': require('./icon-gif.png'),\n  'info': require('./icon-info.png'),\n  'leave': require('./icon-leave.png'),\n  'members': require('./icon-members.png'),\n  'message': require('./icon-message.png'),\n  'moderations': require('./icon-moderations.png'),\n  'more': require('./icon-more.png'),\n  'mute': require('./icon-mute.png'),\n  'notifications-filled': require('./icon-notifications-filled.png'),\n  'notifications-off-filled': require('./icon-notifications-off-filled.png'),\n  'notifications': require('./icon-notifications.png'),\n  'operator': require('./icon-operator.png'),\n  'photo': require('./icon-photo.png'),\n  'play': require('./icon-play.png'),\n  'plus': require('./icon-plus.png'),\n  'question': require('./icon-question.png'),\n  'refresh': require('./icon-refresh.png'),\n  'remove': require('./icon-remove.png'),\n  'reply-filled': require('./icon-reply-filled.png'),\n  'reply': require('./icon-reply.png'),\n  'search': require('./icon-search.png'),\n  'send': require('./icon-send.png'),\n  'settings-filled': require('./icon-settings-filled.png'),\n  'spinner': require('./icon-spinner.png'),\n  'streaming': require('./icon-streaming.png'),\n  'supergroup': require('./icon-supergroup.png'),\n  'theme': require('./icon-theme.png'),\n  'thumbnail-none': require('./icon-thumbnail-none.png'),\n  'unarchive': require('./icon-unarchive.png'),\n  'user': require('./icon-user.png'),\n};\nexport default IconAssets;\n"],"mappings":"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"}
+{"version":3,"names":["IconAssets","require"],"sources":["index.ts"],"sourcesContent":["const IconAssets = {\n  'chat-hide': require('./ic-chat-hide.png'),\n  'chat-show': require('./ic-chat-show.png'),\n  'add': require('./icon-add.png'),\n  'archive': require('./icon-archive.png'),\n  'arrow-left': require('./icon-arrow-left.png'),\n  'ban': require('./icon-ban.png'),\n  'broadcast': require('./icon-broadcast.png'),\n  'camera': require('./icon-camera.png'),\n  'channels': require('./icon-channels.png'),\n  'chat-filled': require('./icon-chat-filled.png'),\n  'chat': require('./icon-chat.png'),\n  'checkbox-off': require('./icon-checkbox-off.png'),\n  'checkbox-on': require('./icon-checkbox-on.png'),\n  'chevron-down': require('./icon-chevron-down.png'),\n  'chevron-right': require('./icon-chevron-right.png'),\n  'close': require('./icon-close.png'),\n  'copy': require('./icon-copy.png'),\n  'create': require('./icon-create.png'),\n  'delete': require('./icon-delete.png'),\n  'document': require('./icon-document.png'),\n  'done-all': require('./icon-done-all.png'),\n  'done': require('./icon-done.png'),\n  'download': require('./icon-download.png'),\n  'edit': require('./icon-edit.png'),\n  'emoji-more': require('./icon-emoji-more.png'),\n  'error': require('./icon-error.png'),\n  'file-audio': require('./icon-file-audio.png'),\n  'file-document': require('./icon-file-document.png'),\n  'freeze': require('./icon-freeze.png'),\n  'gif': require('./icon-gif.png'),\n  'info': require('./icon-info.png'),\n  'leave': require('./icon-leave.png'),\n  'members': require('./icon-members.png'),\n  'message': require('./icon-message.png'),\n  'moderation': require('./icon-moderation.png'),\n  'more': require('./icon-more.png'),\n  'mute': require('./icon-mute.png'),\n  'notifications-filled': require('./icon-notifications-filled.png'),\n  'notifications-off-filled': require('./icon-notifications-off-filled.png'),\n  'notifications': require('./icon-notifications.png'),\n  'operator': require('./icon-operator.png'),\n  'photo': require('./icon-photo.png'),\n  'play': require('./icon-play.png'),\n  'plus': require('./icon-plus.png'),\n  'question': require('./icon-question.png'),\n  'refresh': require('./icon-refresh.png'),\n  'remove': require('./icon-remove.png'),\n  'reply-filled': require('./icon-reply-filled.png'),\n  'reply': require('./icon-reply.png'),\n  'search': require('./icon-search.png'),\n  'send': require('./icon-send.png'),\n  'settings-filled': require('./icon-settings-filled.png'),\n  'spinner': require('./icon-spinner.png'),\n  'streaming': require('./icon-streaming.png'),\n  'supergroup': require('./icon-supergroup.png'),\n  'theme': require('./icon-theme.png'),\n  'thumbnail-none': require('./icon-thumbnail-none.png'),\n  'unarchive': require('./icon-unarchive.png'),\n  'user': require('./icon-user.png'),\n};\nexport default IconAssets;\n"],"mappings":"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"}

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

@@ -71,6 +71,7 @@ const Modal = _ref => {
   }, [visible]);
   useOnDismiss(modalVisible, onDismiss);
   return /*#__PURE__*/_react.default.createElement(_reactNative.Modal, _extends({
+    statusBarTranslucent: statusBarTranslucent,
     transparent: true,
     hardwareAccelerated: true,
     visible: modalVisible,

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

@@ -1 +1 @@
-{"version":3,"names":["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","undefined","StyleSheet","absoluteFill","opacity","backgroundColor","onBackgroundLight03","styles","background","Platform","select","ios","default","transform","panHandlers","isHideGesture","distanceY","velocityY","show","hide","React","useRef","PanResponder","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","Dimensions","get","baseAnimBackground","Animated","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","OS","prop","prev","curr","createStyleSheet","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 Props = {\n  type?: 'slide' | 'fade';\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      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={`${width}-${height}`}\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: 'slide' | 'fade',\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade') 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: 'slide' | 'fade') => {\n  const initialY = type === 'slide' ? Dimensions.get('window').height : 0;\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 === 'slide' ? 1 : 0, 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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"}
+{"version":3,"names":["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","undefined","StyleSheet","absoluteFill","opacity","backgroundColor","onBackgroundLight03","styles","background","Platform","select","ios","default","transform","panHandlers","isHideGesture","distanceY","velocityY","show","hide","React","useRef","PanResponder","create","onMoveShouldSetPanResponderCapture","_","dy","onPanResponderGrant","setOffset","__getValue","onPanResponderMove","setValue","onPanResponderRelease","vy","current","initialY","Dimensions","get","baseAnimBackground","Animated","Value","baseAnimContent","interpolate","inputRange","outputRange","createTransition","toValue","config","duration","useNativeDriver","parallel","timing","start","prevVisible","usePrevProp","OS","prop","prev","curr","createStyleSheet","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 Props = {\n  type?: 'slide' | 'fade';\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={`${width}-${height}`}\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: 'slide' | 'fade',\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade') 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: 'slide' | 'fade') => {\n  const initialY = type === 'slide' ? Dimensions.get('window').height : 0;\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 === 'slide' ? 1 : 0, 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":";;;;;;;AAAA;;AACA;;AAgBA;;AACA;;AACA;;;;;;;;;;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,KAAK,GAAG,QAWD;EAAA,IAXE;IACbC,QADa;IAEbC,OAFa;IAGbC,eAHa;IAIbC,SAJa;IAKbC,IAAI,GAAG,MALM;IAMbC,OAAO,GAAG,KANG;IAObC,sBAAsB,GAAG,KAPZ;IAQbC,mBAAmB,GAAG,KART;IASbC,oBATa;IAUb,GAAGC;EAVU,CAWF;EACX,MAAM;IAAEC;EAAF,IAAc,IAAAC,sBAAA,GAApB;EACA,MAAM;IAAEC,OAAF;IAAWC,QAAX;IAAqBC,cAArB;IAAqCC;EAArC,IAAwDC,iBAAiB,CAACZ,IAAD,CAA/E;EACA,MAAMa,YAAY,GAAGC,oBAAoB,CAACd,IAAD,EAAOQ,OAAO,CAACO,UAAf,EAA2BL,cAA3B,EAA2Cb,OAA3C,CAAzC;EACA,MAAM;IAAEmB;EAAF,IAAe,IAAAC,uBAAA,GAArB;EAEA,MAAM,CAACC,YAAD,EAAeC,eAAf,IAAkC,IAAAC,eAAA,EAAS,KAAT,CAAxC;;EACA,MAAMC,UAAU,GAAG,MAAMF,eAAe,CAAC,IAAD,CAAxC;;EACA,MAAMG,UAAU,GAAG,MAAMX,cAAc,CAAC,MAAMQ,eAAe,CAAC,KAAD,CAAtB,CAAvC;;EAEA,MAAM;IAAEI,KAAF;IAASC;EAAT,IAAoB,IAAAC,gCAAA,GAA1B;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,IAAIzB,OAAJ,EAAaoB,UAAU,GAAvB,KACKC,UAAU;EAChB,CAHD,EAGG,CAACrB,OAAD,CAHH;EAKA0B,YAAY,CAACT,YAAD,EAAenB,SAAf,CAAZ;EAEA,oBACE,6BAAC,kBAAD;IACE,oBAAoB,EAAEK,oBADxB;IAEE,WAAW,MAFb;IAGE,mBAAmB,MAHrB;IAIE,OAAO,EAAEc,YAJX;IAKE,cAAc,EAAErB,OALlB;IAME,MAAM,EAAE,MAAMa,cAAc,EAN9B;IAOE,SAAS,EAAEX,SAPb;IAQE,qBAAqB,EAAE,CAAC,UAAD,EAAa,sBAAb,EAAqC,WAArC,EAAkD,gBAAlD,EAAoE,iBAApE,CARzB;IASE,aAAa,EAAE;EATjB,GAUMM,KAVN,gBAYE,6BAAC,qCAAD;IAA0B,OAAO,EAAEH,sBAAsB,GAAG0B,SAAH,GAAe/B;EAAxE,gBACE,6BAAC,qBAAD,CAAU,IAAV;IACE,KAAK,EAAE,CAACgC,uBAAA,CAAWC,YAAZ,EAA0B;MAAEC,OAAO,EAAEtB,QAAQ,CAACsB,OAApB;MAA6BC,eAAe,EAAE1B,OAAO,CAAC2B;IAAtD,CAA1B;EADT,EADF,CAZF,eAiBE,6BAAC,iCAAD,CACE;EACA;EAFF;IAGE,GAAG,EAAG,GAAEV,KAAM,IAAGC,MAAO,EAH1B;IAIE,OAAO,EAAErB,mBAJX;IAKE,KAAK,EAAE+B,MAAM,CAACC,UALhB;IAME,QAAQ,EAAEC,qBAAA,CAASC,MAAT,CAAgB;MAAEC,GAAG,EAAE,SAAP;MAAkBC,OAAO,EAAE;IAA3B,CAAhB,CANZ;IAOE,aAAa,EAAE,UAPjB;IAQE,sBAAsB,EAAEpC,mBAAmB,IAAIC,oBAAvB,GAA8C,CAACY,QAA/C,GAA0D;EARpF,gBAUE,6BAAC,qBAAD,CAAU,IAAV;IACE,KAAK,EAAE,CACLkB,MAAM,CAACC,UADF,EAELrC,eAFK,EAGL;MAAEiC,OAAO,EAAEvB,OAAO,CAACuB,OAAnB;MAA4BS,SAAS,EAAE,CAAC;QAAEzB,UAAU,EAAEP,OAAO,CAACO;MAAtB,CAAD;IAAvC,CAHK,CADT;IAME,aAAa,EAAE;EANjB,GAOMF,YAAY,CAAC4B,WAPnB,gBASE,6BAAC,sBAAD,CACA;EACA;EAFA,QAIG7C,QAJH,CATF,CAVF,CAjBF,CADF;AA+CD,CA7ED;;AA+EA,MAAM8C,aAAa,GAAG,CAACC,SAAD,EAAoBC,SAApB,KAA0C;EAC9D,OAAOD,SAAS,GAAG,GAAZ,IAAoBA,SAAS,GAAG,CAAZ,IAAiBC,SAAS,GAAG,GAAxD;AACD,CAFD;;AAGA,MAAM9B,oBAAoB,GAAG,CAC3Bd,IAD2B,EAE3Be,UAF2B,EAG3B8B,IAH2B,EAI3BC,IAJ2B,KAKxB;EACH,IAAI9C,IAAI,KAAK,MAAb,EAAqB,OAAO;IAAEyC,WAAW,EAAE;EAAf,CAAP;EACrB,OAAOM,cAAA,CAAMC,MAAN,CACLC,yBAAA,CAAaC,MAAb,CAAoB;IAClBC,kCAAkC,EAAE,CAACC,CAAD;MAAA,IAAI;QAAEC;MAAF,CAAJ;MAAA,OAAeA,EAAE,GAAG,CAApB;IAAA,CADlB;IAElB;IACAC,mBAAmB,EAAE,MAAMvC,UAAU,CAACwC,SAAX,CAAqBxC,UAAU,CAACyC,UAAX,EAArB,CAHT;IAIlBC,kBAAkB,EAAE,CAACL,CAAD;MAAA,IAAI;QAAEC;MAAF,CAAJ;MAAA,OAAeA,EAAE,IAAI,CAAN,IAAWtC,UAAU,CAAC2C,QAAX,CAAoBL,EAApB,CAA1B;IAAA,CAJF;IAIqD;IACvEM,qBAAqB,EAAE,CAACP,CAAD,YAAmB;MAAA,IAAf;QAAEC,EAAF;QAAMO;MAAN,CAAe;MACxC,IAAIlB,aAAa,CAACW,EAAD,EAAKO,EAAL,CAAjB,EAA2Bd,IAAI,GAA/B,KACKD,IAAI;IACV;EARiB,CAApB,CADK,EAWLgB,OAXF;AAYD,CAnBD;;AAqBA,MAAMjD,iBAAiB,GAAIZ,IAAD,IAA4B;EACpD,MAAM8D,QAAQ,GAAG9D,IAAI,KAAK,OAAT,GAAmB+D,uBAAA,CAAWC,GAAX,CAAe,QAAf,EAAyBxC,MAA5C,GAAqD,CAAtE;EACA,MAAMyC,kBAAkB,GAAG,IAAAjB,aAAA,EAAO,IAAIkB,qBAAA,CAASC,KAAb,CAAmB,CAAnB,CAAP,EAA8BN,OAAzD;EACA,MAAMO,eAAe,GAAG,IAAApB,aAAA,EAAO,IAAIkB,qBAAA,CAASC,KAAb,CAAmBL,QAAnB,CAAP,EAAqCD,OAA7D;EAEA,MAAMrD,OAAO,GAAG;IACduB,OAAO,EAAEkC,kBAAkB,CAACI,WAAnB,CAA+B;MACtCC,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CAD0B;MAEtCC,WAAW,EAAE,CAACvE,IAAI,KAAK,OAAT,GAAmB,CAAnB,GAAuB,CAAxB,EAA2B,CAA3B;IAFyB,CAA/B,CADK;IAKde,UAAU,EAAEqD;EALE,CAAhB;EAOA,MAAM3D,QAAQ,GAAG;IACfsB,OAAO,EAAEkC,kBAAkB,CAACI,WAAnB,CAA+B;MACtCC,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CAD0B;MAEtCC,WAAW,EAAE,CAAC,CAAD,EAAI,CAAJ;IAFyB,CAA/B;EADM,CAAjB;;EAMA,MAAMC,gBAAgB,GAAIC,OAAD,IAAoB;IAC3C,MAAMC,MAAM,GAAG;MAAEC,QAAQ,EAAE,GAAZ;MAAiBC,eAAe,EAAE;IAAlC,CAAf;IACA,OAAOV,qBAAA,CAASW,QAAT,CAAkB,CACvBX,qBAAA,CAASY,MAAT,CAAgBb,kBAAhB,EAAoC;MAAEQ,OAAF;MAAW,GAAGC;IAAd,CAApC,CADuB,EAEvBR,qBAAA,CAASY,MAAT,CAAgBV,eAAhB,EAAiC;MAAEK,OAAO,EAAEA,OAAO,KAAK,CAAZ,GAAgBX,QAAhB,GAA2B,CAAtC;MAAyC,GAAGY;IAA5C,CAAjC,CAFuB,CAAlB,EAGJK,KAHH;EAID,CAND;;EAOA,OAAO;IACLvE,OADK;IAELC,QAFK;IAGLC,cAAc,EAAE8D,gBAAgB,CAAC,CAAD,CAH3B;IAIL7D,cAAc,EAAE6D,gBAAgB,CAAC,CAAD;EAJ3B,CAAP;AAMD,CA/BD,C,CAiCA;;;AACA,MAAM7C,YAAY,GAAG,CAAC1B,OAAD,EAAmBF,SAAnB,KAA8C;EACjE,MAAMiF,WAAW,GAAGC,WAAW,CAAChF,OAAD,CAA/B;EACA,IAAAyB,gBAAA,EAAU,MAAM;IACd,IAAIU,qBAAA,CAAS8C,EAAT,KAAgB,KAApB,EAA2B;IAC3B,IAAIF,WAAW,IAAI,CAAC/E,OAApB,EAA6BF,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS;EACvC,CAHD,EAGG,CAACiF,WAAD,EAAc/E,OAAd,CAHH;AAID,CAND;;AAQA,MAAMgF,WAAW,GAAQE,IAAL,IAAiB;EACnC,MAAMC,IAAI,GAAG,IAAApC,aAAA,EAAOmC,IAAP,CAAb;EACA,MAAME,IAAI,GAAG,IAAArC,aAAA,EAAOmC,IAAP,CAAb;EACA,IAAAzD,gBAAA,EAAU,MAAM;IACd0D,IAAI,CAACvB,OAAL,GAAewB,IAAI,CAACxB,OAApB;IACAwB,IAAI,CAACxB,OAAL,GAAesB,IAAf;EACD,CAHD;EAIA,OAAOC,IAAI,CAACvB,OAAZ;AACD,CARD;;AAUA,MAAM3B,MAAM,GAAG,IAAAoD,yBAAA,EAAiB;EAC9BnD,UAAU,EAAE;IAAEoD,IAAI,EAAE;EAAR;AADkB,CAAjB,CAAf;eAIe5F,K"}

package/lib/commonjs/index.js

@@ -9,12 +9,6 @@ Object.defineProperty(exports, "ActionMenu", {
     return _ActionMenu.default;
   }
 });
-Object.defineProperty(exports, "ActionMenuItem", {
-  enumerable: true,
-  get: function () {
-    return _ActionMenu.ActionMenuItem;
-  }
-});
 Object.defineProperty(exports, "Alert", {
   enumerable: true,
   get: function () {
@@ -39,12 +33,6 @@ Object.defineProperty(exports, "BottomSheet", {
     return _BottomSheet.default;
   }
 });
-Object.defineProperty(exports, "BottomSheetItem", {
-  enumerable: true,
-  get: function () {
-    return _BottomSheet.BottomSheetItem;
-  }
-});
 Object.defineProperty(exports, "Button", {
   enumerable: true,
   get: function () {
@@ -93,12 +81,6 @@ Object.defineProperty(exports, "HeaderStyleContext", {
     return _HeaderStyleContext.HeaderStyleContext;
   }
 });
-Object.defineProperty(exports, "HeaderStyleContextType", {
-  enumerable: true,
-  get: function () {
-    return _HeaderStyleContext.HeaderStyleContextType;
-  }
-});
 Object.defineProperty(exports, "HeaderStyleProvider", {
   enumerable: true,
   get: function () {
@@ -225,12 +207,6 @@ Object.defineProperty(exports, "UIKitThemeProvider", {
     return _UIKitThemeProvider.default;
   }
 });
-Object.defineProperty(exports, "UIKitTypographyOverrides", {
-  enumerable: true,
-  get: function () {
-    return _createTypography.UIKitTypographyOverrides;
-  }
-});
 Object.defineProperty(exports, "URLParsedText", {
   enumerable: true,
   get: function () {
@@ -334,7 +310,7 @@ var _TextInput = _interopRequireDefault(require("./components/TextInput"));
 
 var _URLParsedText = _interopRequireDefault(require("./components/URLParsedText"));
 
-var _ActionMenu = _interopRequireWildcard(require("./ui/ActionMenu"));
+var _ActionMenu = _interopRequireDefault(require("./ui/ActionMenu"));
 
 var _Alert = _interopRequireDefault(require("./ui/Alert"));
 
@@ -342,7 +318,7 @@ var _Avatar = _interopRequireDefault(require("./ui/Avatar"));
 
 var _Badge = _interopRequireDefault(require("./ui/Badge"));
 
-var _BottomSheet = _interopRequireWildcard(require("./ui/BottomSheet"));
+var _BottomSheet = _interopRequireDefault(require("./ui/BottomSheet"));
 
 var _Button = _interopRequireDefault(require("./ui/Button"));
 
@@ -374,7 +350,7 @@ var _createScaleFactor = _interopRequireDefault(require("./styles/createScaleFac
 
 var _createStyleSheet = _interopRequireDefault(require("./styles/createStyleSheet"));
 
-var _createTypography = _interopRequireWildcard(require("./styles/createTypography"));
+var _createTypography = _interopRequireDefault(require("./styles/createTypography"));
 
 var _getDefaultHeaderHeight = _interopRequireDefault(require("./styles/getDefaultHeaderHeight"));
 

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as Modal } from './components/Modal';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { default as URLParsedText } from './components/URLParsedText';\n\n/** UI **/\nexport { default as ActionMenu, ActionMenuItem } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet, BottomSheetItem } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar, MenuBarProps } from './ui/MenuBar';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography, UIKitTypographyOverrides } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider, HeaderStyleContextType } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as Modal } from './components/Modal';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { default as URLParsedText } from './components/URLParsedText';\n\n/** UI **/\nexport { default as ActionMenu } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar, MenuBarProps } from './ui/MenuBar';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\nexport type { ActionMenuItem } from './ui/ActionMenu';\nexport type { BottomSheetItem } from './ui/BottomSheet';\nexport type { UIKitTypographyOverrides } from './styles/createTypography';\nexport type { HeaderStyleContextType } from './styles/HeaderStyleContext';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA"}

package/lib/commonjs/styles/HeaderStyleContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["HeaderStyleContext","React","createContext","HeaderComponent","defaultTitleAlign","statusBarTranslucent","topInset","StatusBar","currentHeight","defaultHeight","getDefaultHeaderHeight","HeaderStyleProvider","children","top","useSafeAreaInsets","width","height","useWindowDimensions"],"sources":["HeaderStyleContext.tsx"],"sourcesContent":["import React from 'react';\nimport { StatusBar, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport type { BaseHeaderProps, HeaderElement } from '../types';\nimport getDefaultHeaderHeight from './getDefaultHeaderHeight';\n\nexport type HeaderStyleContextType = {\n  HeaderComponent: (\n    props: BaseHeaderProps<\n      {\n        title?: HeaderElement;\n        left?: HeaderElement;\n        right?: HeaderElement;\n        onPressLeft?: () => void;\n        onPressRight?: () => void;\n      },\n      { clearTitleMargin?: boolean }\n    >,\n  ) => React.ReactElement | null;\n  defaultTitleAlign: 'left' | 'center';\n  statusBarTranslucent: boolean;\n  topInset: number;\n  defaultHeight: number;\n};\nexport const HeaderStyleContext = React.createContext<HeaderStyleContextType>({\n  HeaderComponent: () => null,\n  defaultTitleAlign: 'left',\n  statusBarTranslucent: true,\n  topInset: StatusBar.currentHeight ?? 0,\n  defaultHeight: getDefaultHeaderHeight(false),\n});\n\ntype Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;\nexport const HeaderStyleProvider = ({\n  children,\n  HeaderComponent = () => null,\n  defaultTitleAlign,\n  statusBarTranslucent,\n}: React.PropsWithChildren<Props>) => {\n  const { top } = useSafeAreaInsets();\n  const { width, height } = useWindowDimensions();\n\n  return (\n    <HeaderStyleContext.Provider\n      value={{\n        HeaderComponent,\n        defaultTitleAlign,\n        statusBarTranslucent,\n        topInset: statusBarTranslucent ? top : 0,\n        defaultHeight: getDefaultHeaderHeight(width > height),\n      }}\n    >\n      {children}\n    </HeaderStyleContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA;;;;AAoBO,MAAMA,kBAAkB,gBAAGC,cAAA,CAAMC,aAAN,CAA4C;EAC5EC,eAAe,EAAE,MAAM,IADqD;EAE5EC,iBAAiB,EAAE,MAFyD;EAG5EC,oBAAoB,EAAE,IAHsD;EAI5EC,QAAQ,EAAEC,sBAAA,CAAUC,aAAV,IAA2B,CAJuC;EAK5EC,aAAa,EAAE,IAAAC,+BAAA,EAAuB,KAAvB;AAL6D,CAA5C,CAA3B;;;;AASA,MAAMC,mBAAmB,GAAG,QAKG;EAAA,IALF;IAClCC,QADkC;IAElCT,eAAe,GAAG,MAAM,IAFU;IAGlCC,iBAHkC;IAIlCC;EAJkC,CAKE;EACpC,MAAM;IAAEQ;EAAF,IAAU,IAAAC,6CAAA,GAAhB;EACA,MAAM;IAAEC,KAAF;IAASC;EAAT,IAAoB,IAAAC,gCAAA,GAA1B;EAEA,oBACE,6BAAC,kBAAD,CAAoB,QAApB;IACE,KAAK,EAAE;MACLd,eADK;MAELC,iBAFK;MAGLC,oBAHK;MAILC,QAAQ,EAAED,oBAAoB,GAAGQ,GAAH,GAAS,CAJlC;MAKLJ,aAAa,EAAE,IAAAC,+BAAA,EAAuBK,KAAK,GAAGC,MAA/B;IALV;EADT,GASGJ,QATH,CADF;AAaD,CAtBM"}
+{"version":3,"names":["HeaderStyleContext","React","createContext","HeaderComponent","defaultTitleAlign","statusBarTranslucent","topInset","StatusBar","currentHeight","defaultHeight","getDefaultHeaderHeight","HeaderStyleProvider","children","top","useSafeAreaInsets","width","height","useWindowDimensions"],"sources":["HeaderStyleContext.tsx"],"sourcesContent":["import React from 'react';\nimport { StatusBar, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport type { HeaderProps } from '../ui/Header';\nimport getDefaultHeaderHeight from './getDefaultHeaderHeight';\n\nexport type HeaderStyleContextType = {\n  HeaderComponent: (props: HeaderProps) => React.ReactElement | null;\n  defaultTitleAlign: 'left' | 'center';\n  statusBarTranslucent: boolean;\n  topInset: number;\n  defaultHeight: number;\n};\nexport const HeaderStyleContext = React.createContext<HeaderStyleContextType>({\n  HeaderComponent: () => null,\n  defaultTitleAlign: 'left',\n  statusBarTranslucent: true,\n  topInset: StatusBar.currentHeight ?? 0,\n  defaultHeight: getDefaultHeaderHeight(false),\n});\n\ntype Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;\nexport const HeaderStyleProvider = ({\n  children,\n  HeaderComponent = () => null,\n  defaultTitleAlign,\n  statusBarTranslucent,\n}: React.PropsWithChildren<Props>) => {\n  const { top } = useSafeAreaInsets();\n  const { width, height } = useWindowDimensions();\n\n  return (\n    <HeaderStyleContext.Provider\n      value={{\n        HeaderComponent,\n        defaultTitleAlign,\n        statusBarTranslucent,\n        topInset: statusBarTranslucent ? top : 0,\n        defaultHeight: getDefaultHeaderHeight(width > height),\n      }}\n    >\n      {children}\n    </HeaderStyleContext.Provider>\n  );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA;;;;AASO,MAAMA,kBAAkB,gBAAGC,cAAA,CAAMC,aAAN,CAA4C;EAC5EC,eAAe,EAAE,MAAM,IADqD;EAE5EC,iBAAiB,EAAE,MAFyD;EAG5EC,oBAAoB,EAAE,IAHsD;EAI5EC,QAAQ,EAAEC,sBAAA,CAAUC,aAAV,IAA2B,CAJuC;EAK5EC,aAAa,EAAE,IAAAC,+BAAA,EAAuB,KAAvB;AAL6D,CAA5C,CAA3B;;;;AASA,MAAMC,mBAAmB,GAAG,QAKG;EAAA,IALF;IAClCC,QADkC;IAElCT,eAAe,GAAG,MAAM,IAFU;IAGlCC,iBAHkC;IAIlCC;EAJkC,CAKE;EACpC,MAAM;IAAEQ;EAAF,IAAU,IAAAC,6CAAA,GAAhB;EACA,MAAM;IAAEC,KAAF;IAASC;EAAT,IAAoB,IAAAC,gCAAA,GAA1B;EAEA,oBACE,6BAAC,kBAAD,CAAoB,QAApB;IACE,KAAK,EAAE;MACLd,eADK;MAELC,iBAFK;MAGLC,oBAHK;MAILC,QAAQ,EAAED,oBAAoB,GAAGQ,GAAH,GAAS,CAJlC;MAKLJ,aAAa,EAAE,IAAAC,+BAAA,EAAuBK,KAAK,GAAGC,MAA/B;IALV;EADT,GASGJ,QATH,CADF;AAaD,CAtBM"}

package/lib/commonjs/ui/ActionMenu/index.js

@@ -104,7 +104,7 @@ const ActionMenu = _ref => {
       }
     }, /*#__PURE__*/_react.default.createElement(_Text.default, {
       subtitle2: true,
-      color: colors.ui.dialog.default.none.text,
+      color: item.style === 'destructive' ? colors.ui.dialog.default.none.destructive : colors.ui.dialog.default.none.text,
       numberOfLines: 1
     }, item.title));
   }))));

package/lib/commonjs/ui/ActionMenu/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["ActionMenu","visible","onHide","onError","onDismiss","title","menuItems","statusBarTranslucent","useHeaderStyle","colors","useUIKitTheme","pending","setPending","useState","_onHide","alignItems","justifyContent","styles","ui","dialog","default","none","text","maxWidth","highlight","width","marginLeft","buttonContainer","map","item","index","button","onPress","e","errorHandler","Logger","error","createStyleSheet","flexDirection","paddingHorizontal","paddingVertical","marginTop","marginBottom"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TouchableOpacity, View } from 'react-native';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport DialogBox from '../Dialog/DialogBox';\nimport LoadingSpinner from '../LoadingSpinner';\n\nexport type ActionMenuItem = {\n  title?: string;\n  menuItems: {\n    title: string;\n    onPress?: (() => Promise<void>) | (() => void);\n    onError?: () => void;\n  }[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & ActionMenuItem;\nconst ActionMenu = ({ visible, onHide, onError, onDismiss, title, menuItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const [pending, setPending] = useState(false);\n  const _onHide = () => {\n    if (!pending) onHide();\n  };\n\n  return (\n    <Modal\n      onClose={_onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox>\n        <View style={styles.title}>\n          <Text\n            h1\n            color={colors.ui.dialog.default.none.text}\n            numberOfLines={1}\n            // style={{ flex: 1 }}\n            style={{ maxWidth: pending ? '86%' : '100%' }}\n          >\n            {title}\n          </Text>\n          {pending && (\n            <LoadingSpinner\n              size={20}\n              color={colors.ui.dialog.default.none.highlight}\n              style={{ width: '10%', marginLeft: '4%' }}\n            />\n          )}\n        </View>\n        <View style={styles.buttonContainer}>\n          {menuItems.map((item, index) => {\n            return (\n              <TouchableOpacity\n                activeOpacity={0.75}\n                key={item.title + index}\n                style={styles.button}\n                disabled={pending}\n                onPress={async () => {\n                  setPending(true);\n                  try {\n                    await item.onPress?.();\n                  } catch (e: unknown) {\n                    const errorHandler = onError ?? item.onError;\n                    errorHandler?.(e);\n                    if (!errorHandler) Logger.error('ActionMenu onPress error', e);\n                  } finally {\n                    onHide();\n                    setPending(false);\n                  }\n                }}\n              >\n                <Text subtitle2 color={colors.ui.dialog.default.none.text} numberOfLines={1}>\n                  {item.title}\n                </Text>\n              </TouchableOpacity>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  title: {\n    flexDirection: 'row',\n    paddingHorizontal: 24,\n    paddingVertical: 20,\n    alignItems: 'center',\n  },\n  buttonContainer: {\n    marginTop: 4,\n    marginBottom: 8,\n  },\n  button: {\n    paddingHorizontal: 24,\n    paddingVertical: 12,\n  },\n});\n\nexport default ActionMenu;\n"],"mappings":"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"}
+{"version":3,"names":["ActionMenu","visible","onHide","onError","onDismiss","title","menuItems","statusBarTranslucent","useHeaderStyle","colors","useUIKitTheme","pending","setPending","useState","_onHide","alignItems","justifyContent","styles","ui","dialog","default","none","text","maxWidth","highlight","width","marginLeft","buttonContainer","map","item","index","button","onPress","e","errorHandler","Logger","error","style","destructive","createStyleSheet","flexDirection","paddingHorizontal","paddingVertical","marginTop","marginBottom"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TouchableOpacity, View } from 'react-native';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport DialogBox from '../Dialog/DialogBox';\nimport LoadingSpinner from '../LoadingSpinner';\n\nexport type ActionMenuItem = {\n  title?: string;\n  menuItems: {\n    title: string;\n    style?: 'destructive';\n    onPress?: (() => Promise<void>) | (() => void);\n    onError?: () => void;\n  }[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & ActionMenuItem;\nconst ActionMenu = ({ visible, onHide, onError, onDismiss, title, menuItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const [pending, setPending] = useState(false);\n  const _onHide = () => {\n    if (!pending) onHide();\n  };\n\n  return (\n    <Modal\n      onClose={_onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox>\n        <View style={styles.title}>\n          <Text\n            h1\n            color={colors.ui.dialog.default.none.text}\n            numberOfLines={1}\n            // style={{ flex: 1 }}\n            style={{ maxWidth: pending ? '86%' : '100%' }}\n          >\n            {title}\n          </Text>\n          {pending && (\n            <LoadingSpinner\n              size={20}\n              color={colors.ui.dialog.default.none.highlight}\n              style={{ width: '10%', marginLeft: '4%' }}\n            />\n          )}\n        </View>\n        <View style={styles.buttonContainer}>\n          {menuItems.map((item, index) => {\n            return (\n              <TouchableOpacity\n                activeOpacity={0.75}\n                key={item.title + index}\n                style={styles.button}\n                disabled={pending}\n                onPress={async () => {\n                  setPending(true);\n                  try {\n                    await item.onPress?.();\n                  } catch (e: unknown) {\n                    const errorHandler = onError ?? item.onError;\n                    errorHandler?.(e);\n                    if (!errorHandler) Logger.error('ActionMenu onPress error', e);\n                  } finally {\n                    onHide();\n                    setPending(false);\n                  }\n                }}\n              >\n                <Text\n                  subtitle2\n                  color={\n                    item.style === 'destructive'\n                      ? colors.ui.dialog.default.none.destructive\n                      : colors.ui.dialog.default.none.text\n                  }\n                  numberOfLines={1}\n                >\n                  {item.title}\n                </Text>\n              </TouchableOpacity>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  title: {\n    flexDirection: 'row',\n    paddingHorizontal: 24,\n    paddingVertical: 20,\n    alignItems: 'center',\n  },\n  buttonContainer: {\n    marginTop: 4,\n    marginBottom: 8,\n  },\n  button: {\n    paddingHorizontal: 24,\n    paddingVertical: 12,\n  },\n});\n\nexport default ActionMenu;\n"],"mappings":"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"}

package/lib/commonjs/ui/Header/index.js

@@ -40,7 +40,8 @@ const Header = _ref => {
     right = null,
     onPressLeft,
     onPressRight,
-    clearTitleMargin = false
+    clearTitleMargin = false,
+    statusBarTopInsetAs = 'padding'
   } = _ref;
   const {
     topInset,
@@ -67,9 +68,9 @@ const Header = _ref => {
 
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: [styles.container, {
+      [statusBarTopInsetAs === 'padding' ? 'paddingTop' : 'marginTop']: topInset,
       paddingLeft: paddingLeft + styles.container.paddingHorizontal,
       paddingRight: paddingRight + styles.container.paddingHorizontal,
-      paddingTop: topInset,
       backgroundColor: colors.ui.header.nav.none.background,
       borderBottomColor: colors.ui.header.nav.none.borderBottom
     }]

package/lib/commonjs/ui/Header/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["AlignMapper","left","center","right","Header","children","titleAlign","title","onPressLeft","onPressRight","clearTitleMargin","topInset","defaultTitleAlign","defaultHeight","useHeaderStyle","colors","useUIKitTheme","paddingLeft","paddingRight","useSafeAreaInsets","actualTitleAlign","paddingTop","backgroundColor","ui","header","nav","none","background","styles","container","paddingHorizontal","borderBottomColor","borderBottom","height","marginHorizontal","justifyContent","LeftSide","RightSide","HeaderTitle","style","props","HeaderSubtitle","onBackground03","HeaderButton","disabled","onPress","color","button","e","conditionChaining","createStyleSheet","borderBottomWidth","flexDirection","flex","alignItems","minWidth","marginRight","marginLeft","padding","Button","Title","Subtitle"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, TouchableOpacityProps, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../../components/Text';\nimport type { BaseHeaderProps } from '../../index';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype HeaderElement = string | React.ReactElement | null;\ntype HeaderProps = BaseHeaderProps<\n  {\n    title?: HeaderElement;\n    left?: HeaderElement;\n    right?: HeaderElement;\n    onPressLeft?: () => void;\n    onPressRight?: () => void;\n  },\n  { clearTitleMargin?: boolean }\n>;\n\nconst AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;\nconst Header: ((props: HeaderProps) => JSX.Element) & {\n  Button: typeof HeaderButton;\n  Title: typeof HeaderTitle;\n  Subtitle: typeof HeaderSubtitle;\n} = ({\n  children,\n  titleAlign,\n  title = null,\n  left = null,\n  right = null,\n  onPressLeft,\n  onPressRight,\n  clearTitleMargin = false,\n}) => {\n  const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const { left: paddingLeft, right: paddingRight } = useSafeAreaInsets();\n\n  const actualTitleAlign = titleAlign ?? defaultTitleAlign;\n\n  if (!title && !left && !right) {\n    return (\n      <View style={{ paddingTop: topInset, backgroundColor: colors.ui.header.nav.none.background }}>{children}</View>\n    );\n  }\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          paddingLeft: paddingLeft + styles.container.paddingHorizontal,\n          paddingRight: paddingRight + styles.container.paddingHorizontal,\n          paddingTop: topInset,\n          backgroundColor: colors.ui.header.nav.none.background,\n          borderBottomColor: colors.ui.header.nav.none.borderBottom,\n        },\n      ]}\n    >\n      <View style={[styles.header, { height: defaultHeight }]}>\n        <LeftSide titleAlign={actualTitleAlign} left={left} onPressLeft={onPressLeft} />\n        <View\n          style={[\n            styles.title,\n            clearTitleMargin && { marginHorizontal: 0 },\n            { justifyContent: AlignMapper[actualTitleAlign] },\n          ]}\n        >\n          {typeof title === 'string' ? <HeaderTitle>{title}</HeaderTitle> : title}\n        </View>\n        <RightSide titleAlign={actualTitleAlign} right={right} onPressRight={onPressRight} />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst LeftSide = ({ titleAlign, onPressLeft, left }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.left}>{left && <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>}</View>;\n  }\n  if (!left) return null;\n  return (\n    <View style={styles.left}>\n      <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>\n    </View>\n  );\n};\n\nconst RightSide = ({ titleAlign, onPressRight, right }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.right}>{right && <HeaderButton onPress={onPressRight}>{right}</HeaderButton>}</View>;\n  }\n  if (!right) return null;\n  return (\n    <View style={styles.right}>\n      <HeaderButton onPress={onPressRight}>{right}</HeaderButton>\n    </View>\n  );\n};\n\nconst HeaderTitle = ({ children, style, ...props }: TextProps) => {\n  return (\n    <Text {...props} h1 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderSubtitle = ({ children, style, ...props }: TextProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Text color={colors.onBackground03} {...props} caption2 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderButton = ({ children, disabled, onPress, color, ...props }: TouchableOpacityProps & { color?: string }) => {\n  return (\n    <TouchableOpacity\n      style={styles.button}\n      {...props}\n      disabled={!onPress || disabled}\n      onPress={(e) => onPress?.(e)}\n      activeOpacity={0.7}\n    >\n      {conditionChaining(\n        [typeof children === 'string' || typeof children === 'number'],\n        [\n          <Text button numberOfLines={1} color={color}>\n            {children}\n          </Text>,\n          children,\n        ],\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingHorizontal: 12,\n    borderBottomWidth: 1,\n  },\n  header: {\n    flexDirection: 'row',\n  },\n  title: {\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginHorizontal: 12,\n  },\n  left: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginRight: 12,\n  },\n  right: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginLeft: 12,\n  },\n  button: {\n    padding: 4,\n  },\n});\n\nHeader.Button = HeaderButton;\nHeader.Title = HeaderTitle;\nHeader.Subtitle = HeaderSubtitle;\nexport default Header;\n"],"mappings":"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"}
+{"version":3,"names":["AlignMapper","left","center","right","Header","children","titleAlign","title","onPressLeft","onPressRight","clearTitleMargin","statusBarTopInsetAs","topInset","defaultTitleAlign","defaultHeight","useHeaderStyle","colors","useUIKitTheme","paddingLeft","paddingRight","useSafeAreaInsets","actualTitleAlign","paddingTop","backgroundColor","ui","header","nav","none","background","styles","container","paddingHorizontal","borderBottomColor","borderBottom","height","marginHorizontal","justifyContent","LeftSide","RightSide","HeaderTitle","style","props","HeaderSubtitle","onBackground03","HeaderButton","disabled","onPress","color","button","e","conditionChaining","createStyleSheet","borderBottomWidth","flexDirection","flex","alignItems","minWidth","marginRight","marginLeft","padding","Button","Title","Subtitle"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, TouchableOpacityProps, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../../components/Text';\nimport type { BaseHeaderProps } from '../../index';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype HeaderElement = string | React.ReactElement | null;\nexport type HeaderProps = BaseHeaderProps<\n  {\n    title?: HeaderElement;\n    left?: HeaderElement;\n    right?: HeaderElement;\n    onPressLeft?: () => void;\n    onPressRight?: () => void;\n  },\n  {\n    clearTitleMargin?: boolean;\n    statusBarTopInsetAs?: 'padding' | 'margin';\n  }\n>;\n\nconst AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;\nconst Header: ((props: HeaderProps) => JSX.Element) & {\n  Button: typeof HeaderButton;\n  Title: typeof HeaderTitle;\n  Subtitle: typeof HeaderSubtitle;\n} = ({\n  children,\n  titleAlign,\n  title = null,\n  left = null,\n  right = null,\n  onPressLeft,\n  onPressRight,\n  clearTitleMargin = false,\n  statusBarTopInsetAs = 'padding',\n}) => {\n  const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();\n\n  const { colors } = useUIKitTheme();\n  const { left: paddingLeft, right: paddingRight } = useSafeAreaInsets();\n\n  const actualTitleAlign = titleAlign ?? defaultTitleAlign;\n\n  if (!title && !left && !right) {\n    return (\n      <View style={{ paddingTop: topInset, backgroundColor: colors.ui.header.nav.none.background }}>{children}</View>\n    );\n  }\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          [statusBarTopInsetAs === 'padding' ? 'paddingTop' : 'marginTop']: topInset,\n          paddingLeft: paddingLeft + styles.container.paddingHorizontal,\n          paddingRight: paddingRight + styles.container.paddingHorizontal,\n          backgroundColor: colors.ui.header.nav.none.background,\n          borderBottomColor: colors.ui.header.nav.none.borderBottom,\n        },\n      ]}\n    >\n      <View style={[styles.header, { height: defaultHeight }]}>\n        <LeftSide titleAlign={actualTitleAlign} left={left} onPressLeft={onPressLeft} />\n        <View\n          style={[\n            styles.title,\n            clearTitleMargin && { marginHorizontal: 0 },\n            { justifyContent: AlignMapper[actualTitleAlign] },\n          ]}\n        >\n          {typeof title === 'string' ? <HeaderTitle>{title}</HeaderTitle> : title}\n        </View>\n        <RightSide titleAlign={actualTitleAlign} right={right} onPressRight={onPressRight} />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst LeftSide = ({ titleAlign, onPressLeft, left }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.left}>{left && <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>}</View>;\n  }\n  if (!left) return null;\n  return (\n    <View style={styles.left}>\n      <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>\n    </View>\n  );\n};\n\nconst RightSide = ({ titleAlign, onPressRight, right }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.right}>{right && <HeaderButton onPress={onPressRight}>{right}</HeaderButton>}</View>;\n  }\n  if (!right) return null;\n  return (\n    <View style={styles.right}>\n      <HeaderButton onPress={onPressRight}>{right}</HeaderButton>\n    </View>\n  );\n};\n\nconst HeaderTitle = ({ children, style, ...props }: TextProps) => {\n  return (\n    <Text {...props} h1 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderSubtitle = ({ children, style, ...props }: TextProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Text color={colors.onBackground03} {...props} caption2 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderButton = ({ children, disabled, onPress, color, ...props }: TouchableOpacityProps & { color?: string }) => {\n  return (\n    <TouchableOpacity\n      style={styles.button}\n      {...props}\n      disabled={!onPress || disabled}\n      onPress={(e) => onPress?.(e)}\n      activeOpacity={0.7}\n    >\n      {conditionChaining(\n        [typeof children === 'string' || typeof children === 'number'],\n        [\n          <Text button numberOfLines={1} color={color}>\n            {children}\n          </Text>,\n          children,\n        ],\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingHorizontal: 12,\n    borderBottomWidth: 1,\n  },\n  header: {\n    flexDirection: 'row',\n  },\n  title: {\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginHorizontal: 12,\n  },\n  left: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginRight: 12,\n  },\n  right: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginLeft: 12,\n  },\n  button: {\n    padding: 4,\n  },\n});\n\nHeader.Button = HeaderButton;\nHeader.Title = HeaderTitle;\nHeader.Subtitle = HeaderSubtitle;\nexport default Header;\n"],"mappings":"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"}

package/lib/commonjs/ui/MenuBar/index.js

@@ -27,6 +27,7 @@ const MenuBar = _ref => {
   let {
     variant = 'default',
     disabled,
+    visible = true,
     onPress,
     name,
     icon,
@@ -39,6 +40,7 @@ const MenuBar = _ref => {
     palette,
     colors
   } = (0, _useUIKitTheme.default)();
+  if (!visible) return null;
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
     disabled: disabled,
     onPress: onPress,

package/lib/commonjs/ui/MenuBar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["MenuBar","variant","disabled","onPress","name","icon","iconColor","iconBackgroundColor","actionLabel","actionItem","palette","colors","useUIKitTheme","styles","container","conditionChaining","background50","primary","containedIcon","backgroundColor","background400","Boolean","onBackground02","createStyleSheet","paddingVertical","flexDirection","alignItems","flex","marginRight","borderRadius","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Divider from '../../components/Divider';\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nexport type MenuBarProps = {\n  variant?: 'default' | 'contained';\n\n  onPress: () => void;\n  disabled?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  iconColor?: string;\n  iconBackgroundColor?: string;\n  name: string;\n\n  actionLabel?: string;\n  actionItem?: React.ReactNode;\n};\nconst MenuBar = ({\n  variant = 'default',\n  disabled,\n  onPress,\n  name,\n  icon,\n  iconColor,\n  iconBackgroundColor,\n  actionLabel,\n  actionItem = null,\n}: MenuBarProps) => {\n  const { palette, colors } = useUIKitTheme();\n\n  return (\n    <View>\n      <Pressable disabled={disabled} onPress={onPress} style={styles.container}>\n        {icon && (\n          <Icon\n            icon={icon}\n            size={variant === 'contained' ? 16 : 24}\n            color={conditionChaining(\n              [variant === 'contained', iconColor],\n              [palette.background50, iconColor, colors.primary],\n            )}\n            containerStyle={[\n              styles.icon,\n              variant === 'contained' && styles.containedIcon,\n              variant === 'contained' && { backgroundColor: iconBackgroundColor ?? palette.background400 },\n            ]}\n          />\n        )}\n        <Text subtitle2 numberOfLines={1} style={styles.name}>\n          {name}\n        </Text>\n        {Boolean(actionLabel) && (\n          <Text subtitle2 numberOfLines={1} color={colors.onBackground02} style={styles.actionLabel}>\n            {actionLabel}\n          </Text>\n        )}\n        {actionItem}\n      </Pressable>\n      <Divider />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingVertical: 16,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flex: 1,\n    marginRight: 8,\n  },\n  icon: {\n    marginRight: 16,\n  },\n  containedIcon: {\n    borderRadius: 24,\n    padding: 4,\n  },\n  actionLabel: {\n    marginRight: 4,\n  },\n});\n\nexport default MenuBar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAgBA,MAAMA,OAAO,GAAG,QAUI;EAAA,IAVH;IACfC,OAAO,GAAG,SADK;IAEfC,QAFe;IAGfC,OAHe;IAIfC,IAJe;IAKfC,IALe;IAMfC,SANe;IAOfC,mBAPe;IAQfC,WARe;IASfC,UAAU,GAAG;EATE,CAUG;EAClB,MAAM;IAAEC,OAAF;IAAWC;EAAX,IAAsB,IAAAC,sBAAA,GAA5B;EAEA,oBACE,6BAAC,iBAAD,qBACE,6BAAC,sBAAD;IAAW,QAAQ,EAAEV,QAArB;IAA+B,OAAO,EAAEC,OAAxC;IAAiD,KAAK,EAAEU,MAAM,CAACC;EAA/D,GACGT,IAAI,iBACH,6BAAC,aAAD;IACE,IAAI,EAAEA,IADR;IAEE,IAAI,EAAEJ,OAAO,KAAK,WAAZ,GAA0B,EAA1B,GAA+B,EAFvC;IAGE,KAAK,EAAE,IAAAc,6BAAA,EACL,CAACd,OAAO,KAAK,WAAb,EAA0BK,SAA1B,CADK,EAEL,CAACI,OAAO,CAACM,YAAT,EAAuBV,SAAvB,EAAkCK,MAAM,CAACM,OAAzC,CAFK,CAHT;IAOE,cAAc,EAAE,CACdJ,MAAM,CAACR,IADO,EAEdJ,OAAO,KAAK,WAAZ,IAA2BY,MAAM,CAACK,aAFpB,EAGdjB,OAAO,KAAK,WAAZ,IAA2B;MAAEkB,eAAe,EAAEZ,mBAAmB,IAAIG,OAAO,CAACU;IAAlD,CAHb;EAPlB,EAFJ,eAgBE,6BAAC,aAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEP,MAAM,CAACT;EAAhD,GACGA,IADH,CAhBF,EAmBGiB,OAAO,CAACb,WAAD,CAAP,iBACC,6BAAC,aAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEG,MAAM,CAACW,cAAhD;IAAgE,KAAK,EAAET,MAAM,CAACL;EAA9E,GACGA,WADH,CApBJ,EAwBGC,UAxBH,CADF,eA2BE,6BAAC,gBAAD,OA3BF,CADF;AA+BD,CA5CD;;AA8CA,MAAMI,MAAM,GAAG,IAAAU,yBAAA,EAAiB;EAC9BT,SAAS,EAAE;IACTU,eAAe,EAAE,EADR;IAETC,aAAa,EAAE,KAFN;IAGTC,UAAU,EAAE;EAHH,CADmB;EAM9BtB,IAAI,EAAE;IACJuB,IAAI,EAAE,CADF;IAEJC,WAAW,EAAE;EAFT,CANwB;EAU9BvB,IAAI,EAAE;IACJuB,WAAW,EAAE;EADT,CAVwB;EAa9BV,aAAa,EAAE;IACbW,YAAY,EAAE,EADD;IAEbC,OAAO,EAAE;EAFI,CAbe;EAiB9BtB,WAAW,EAAE;IACXoB,WAAW,EAAE;EADF;AAjBiB,CAAjB,CAAf;eAsBe5B,O"}
+{"version":3,"names":["MenuBar","variant","disabled","visible","onPress","name","icon","iconColor","iconBackgroundColor","actionLabel","actionItem","palette","colors","useUIKitTheme","styles","container","conditionChaining","background50","primary","containedIcon","backgroundColor","background400","Boolean","onBackground02","createStyleSheet","paddingVertical","flexDirection","alignItems","flex","marginRight","borderRadius","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Divider from '../../components/Divider';\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nexport type MenuBarProps = {\n  variant?: 'default' | 'contained';\n\n  onPress: () => void;\n  disabled?: boolean;\n  visible?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  iconColor?: string;\n  iconBackgroundColor?: string;\n  name: string;\n\n  actionLabel?: string;\n  actionItem?: React.ReactNode;\n};\nconst MenuBar = ({\n  variant = 'default',\n  disabled,\n  visible = true,\n  onPress,\n  name,\n  icon,\n  iconColor,\n  iconBackgroundColor,\n  actionLabel,\n  actionItem = null,\n}: MenuBarProps) => {\n  const { palette, colors } = useUIKitTheme();\n\n  if (!visible) return null;\n\n  return (\n    <View>\n      <Pressable disabled={disabled} onPress={onPress} style={styles.container}>\n        {icon && (\n          <Icon\n            icon={icon}\n            size={variant === 'contained' ? 16 : 24}\n            color={conditionChaining(\n              [variant === 'contained', iconColor],\n              [palette.background50, iconColor, colors.primary],\n            )}\n            containerStyle={[\n              styles.icon,\n              variant === 'contained' && styles.containedIcon,\n              variant === 'contained' && { backgroundColor: iconBackgroundColor ?? palette.background400 },\n            ]}\n          />\n        )}\n        <Text subtitle2 numberOfLines={1} style={styles.name}>\n          {name}\n        </Text>\n        {Boolean(actionLabel) && (\n          <Text subtitle2 numberOfLines={1} color={colors.onBackground02} style={styles.actionLabel}>\n            {actionLabel}\n          </Text>\n        )}\n        {actionItem}\n      </Pressable>\n      <Divider />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingVertical: 16,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flex: 1,\n    marginRight: 8,\n  },\n  icon: {\n    marginRight: 16,\n  },\n  containedIcon: {\n    borderRadius: 24,\n    padding: 4,\n  },\n  actionLabel: {\n    marginRight: 4,\n  },\n});\n\nexport default MenuBar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAiBA,MAAMA,OAAO,GAAG,QAWI;EAAA,IAXH;IACfC,OAAO,GAAG,SADK;IAEfC,QAFe;IAGfC,OAAO,GAAG,IAHK;IAIfC,OAJe;IAKfC,IALe;IAMfC,IANe;IAOfC,SAPe;IAQfC,mBARe;IASfC,WATe;IAUfC,UAAU,GAAG;EAVE,CAWG;EAClB,MAAM;IAAEC,OAAF;IAAWC;EAAX,IAAsB,IAAAC,sBAAA,GAA5B;EAEA,IAAI,CAACV,OAAL,EAAc,OAAO,IAAP;EAEd,oBACE,6BAAC,iBAAD,qBACE,6BAAC,sBAAD;IAAW,QAAQ,EAAED,QAArB;IAA+B,OAAO,EAAEE,OAAxC;IAAiD,KAAK,EAAEU,MAAM,CAACC;EAA/D,GACGT,IAAI,iBACH,6BAAC,aAAD;IACE,IAAI,EAAEA,IADR;IAEE,IAAI,EAAEL,OAAO,KAAK,WAAZ,GAA0B,EAA1B,GAA+B,EAFvC;IAGE,KAAK,EAAE,IAAAe,6BAAA,EACL,CAACf,OAAO,KAAK,WAAb,EAA0BM,SAA1B,CADK,EAEL,CAACI,OAAO,CAACM,YAAT,EAAuBV,SAAvB,EAAkCK,MAAM,CAACM,OAAzC,CAFK,CAHT;IAOE,cAAc,EAAE,CACdJ,MAAM,CAACR,IADO,EAEdL,OAAO,KAAK,WAAZ,IAA2Ba,MAAM,CAACK,aAFpB,EAGdlB,OAAO,KAAK,WAAZ,IAA2B;MAAEmB,eAAe,EAAEZ,mBAAmB,IAAIG,OAAO,CAACU;IAAlD,CAHb;EAPlB,EAFJ,eAgBE,6BAAC,aAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEP,MAAM,CAACT;EAAhD,GACGA,IADH,CAhBF,EAmBGiB,OAAO,CAACb,WAAD,CAAP,iBACC,6BAAC,aAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEG,MAAM,CAACW,cAAhD;IAAgE,KAAK,EAAET,MAAM,CAACL;EAA9E,GACGA,WADH,CApBJ,EAwBGC,UAxBH,CADF,eA2BE,6BAAC,gBAAD,OA3BF,CADF;AA+BD,CA/CD;;AAiDA,MAAMI,MAAM,GAAG,IAAAU,yBAAA,EAAiB;EAC9BT,SAAS,EAAE;IACTU,eAAe,EAAE,EADR;IAETC,aAAa,EAAE,KAFN;IAGTC,UAAU,EAAE;EAHH,CADmB;EAM9BtB,IAAI,EAAE;IACJuB,IAAI,EAAE,CADF;IAEJC,WAAW,EAAE;EAFT,CANwB;EAU9BvB,IAAI,EAAE;IACJuB,WAAW,EAAE;EADT,CAVwB;EAa9BV,aAAa,EAAE;IACbW,YAAY,EAAE,EADD;IAEbC,OAAO,EAAE;EAFI,CAbe;EAiB9BtB,WAAW,EAAE;IACXoB,WAAW,EAAE;EADF;AAjBiB,CAAjB,CAAf;eAsBe7B,O"}

package/lib/module/assets/icon/index.js

@@ -33,7 +33,7 @@ const IconAssets = {
   'leave': require('./icon-leave.png'),
   'members': require('./icon-members.png'),
   'message': require('./icon-message.png'),
-  'moderations': require('./icon-moderations.png'),
+  'moderation': require('./icon-moderation.png'),
   'more': require('./icon-more.png'),
   'mute': require('./icon-mute.png'),
   'notifications-filled': require('./icon-notifications-filled.png'),

package/lib/module/assets/icon/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["IconAssets","require"],"sources":["index.ts"],"sourcesContent":["const IconAssets = {\n  'chat-hide': require('./ic-chat-hide.png'),\n  'chat-show': require('./ic-chat-show.png'),\n  'add': require('./icon-add.png'),\n  'archive': require('./icon-archive.png'),\n  'arrow-left': require('./icon-arrow-left.png'),\n  'ban': require('./icon-ban.png'),\n  'broadcast': require('./icon-broadcast.png'),\n  'camera': require('./icon-camera.png'),\n  'channels': require('./icon-channels.png'),\n  'chat-filled': require('./icon-chat-filled.png'),\n  'chat': require('./icon-chat.png'),\n  'checkbox-off': require('./icon-checkbox-off.png'),\n  'checkbox-on': require('./icon-checkbox-on.png'),\n  'chevron-down': require('./icon-chevron-down.png'),\n  'chevron-right': require('./icon-chevron-right.png'),\n  'close': require('./icon-close.png'),\n  'copy': require('./icon-copy.png'),\n  'create': require('./icon-create.png'),\n  'delete': require('./icon-delete.png'),\n  'document': require('./icon-document.png'),\n  'done-all': require('./icon-done-all.png'),\n  'done': require('./icon-done.png'),\n  'download': require('./icon-download.png'),\n  'edit': require('./icon-edit.png'),\n  'emoji-more': require('./icon-emoji-more.png'),\n  'error': require('./icon-error.png'),\n  'file-audio': require('./icon-file-audio.png'),\n  'file-document': require('./icon-file-document.png'),\n  'freeze': require('./icon-freeze.png'),\n  'gif': require('./icon-gif.png'),\n  'info': require('./icon-info.png'),\n  'leave': require('./icon-leave.png'),\n  'members': require('./icon-members.png'),\n  'message': require('./icon-message.png'),\n  'moderations': require('./icon-moderations.png'),\n  'more': require('./icon-more.png'),\n  'mute': require('./icon-mute.png'),\n  'notifications-filled': require('./icon-notifications-filled.png'),\n  'notifications-off-filled': require('./icon-notifications-off-filled.png'),\n  'notifications': require('./icon-notifications.png'),\n  'operator': require('./icon-operator.png'),\n  'photo': require('./icon-photo.png'),\n  'play': require('./icon-play.png'),\n  'plus': require('./icon-plus.png'),\n  'question': require('./icon-question.png'),\n  'refresh': require('./icon-refresh.png'),\n  'remove': require('./icon-remove.png'),\n  'reply-filled': require('./icon-reply-filled.png'),\n  'reply': require('./icon-reply.png'),\n  'search': require('./icon-search.png'),\n  'send': require('./icon-send.png'),\n  'settings-filled': require('./icon-settings-filled.png'),\n  'spinner': require('./icon-spinner.png'),\n  'streaming': require('./icon-streaming.png'),\n  'supergroup': require('./icon-supergroup.png'),\n  'theme': require('./icon-theme.png'),\n  'thumbnail-none': require('./icon-thumbnail-none.png'),\n  'unarchive': require('./icon-unarchive.png'),\n  'user': require('./icon-user.png'),\n};\nexport default IconAssets;\n"],"mappings":"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"}
+{"version":3,"names":["IconAssets","require"],"sources":["index.ts"],"sourcesContent":["const IconAssets = {\n  'chat-hide': require('./ic-chat-hide.png'),\n  'chat-show': require('./ic-chat-show.png'),\n  'add': require('./icon-add.png'),\n  'archive': require('./icon-archive.png'),\n  'arrow-left': require('./icon-arrow-left.png'),\n  'ban': require('./icon-ban.png'),\n  'broadcast': require('./icon-broadcast.png'),\n  'camera': require('./icon-camera.png'),\n  'channels': require('./icon-channels.png'),\n  'chat-filled': require('./icon-chat-filled.png'),\n  'chat': require('./icon-chat.png'),\n  'checkbox-off': require('./icon-checkbox-off.png'),\n  'checkbox-on': require('./icon-checkbox-on.png'),\n  'chevron-down': require('./icon-chevron-down.png'),\n  'chevron-right': require('./icon-chevron-right.png'),\n  'close': require('./icon-close.png'),\n  'copy': require('./icon-copy.png'),\n  'create': require('./icon-create.png'),\n  'delete': require('./icon-delete.png'),\n  'document': require('./icon-document.png'),\n  'done-all': require('./icon-done-all.png'),\n  'done': require('./icon-done.png'),\n  'download': require('./icon-download.png'),\n  'edit': require('./icon-edit.png'),\n  'emoji-more': require('./icon-emoji-more.png'),\n  'error': require('./icon-error.png'),\n  'file-audio': require('./icon-file-audio.png'),\n  'file-document': require('./icon-file-document.png'),\n  'freeze': require('./icon-freeze.png'),\n  'gif': require('./icon-gif.png'),\n  'info': require('./icon-info.png'),\n  'leave': require('./icon-leave.png'),\n  'members': require('./icon-members.png'),\n  'message': require('./icon-message.png'),\n  'moderation': require('./icon-moderation.png'),\n  'more': require('./icon-more.png'),\n  'mute': require('./icon-mute.png'),\n  'notifications-filled': require('./icon-notifications-filled.png'),\n  'notifications-off-filled': require('./icon-notifications-off-filled.png'),\n  'notifications': require('./icon-notifications.png'),\n  'operator': require('./icon-operator.png'),\n  'photo': require('./icon-photo.png'),\n  'play': require('./icon-play.png'),\n  'plus': require('./icon-plus.png'),\n  'question': require('./icon-question.png'),\n  'refresh': require('./icon-refresh.png'),\n  'remove': require('./icon-remove.png'),\n  'reply-filled': require('./icon-reply-filled.png'),\n  'reply': require('./icon-reply.png'),\n  'search': require('./icon-search.png'),\n  'send': require('./icon-send.png'),\n  'settings-filled': require('./icon-settings-filled.png'),\n  'spinner': require('./icon-spinner.png'),\n  'streaming': require('./icon-streaming.png'),\n  'supergroup': require('./icon-supergroup.png'),\n  'theme': require('./icon-theme.png'),\n  'thumbnail-none': require('./icon-thumbnail-none.png'),\n  'unarchive': require('./icon-unarchive.png'),\n  'user': require('./icon-user.png'),\n};\nexport default IconAssets;\n"],"mappings":"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"}

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

@@ -54,6 +54,7 @@ const Modal = _ref => {
   }, [visible]);
   useOnDismiss(modalVisible, onDismiss);
   return /*#__PURE__*/React.createElement(RNModal, _extends({
+    statusBarTranslucent: statusBarTranslucent,
     transparent: true,
     hardwareAccelerated: true,
     visible: modalVisible,

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","undefined","absoluteFill","opacity","backgroundColor","onBackgroundLight03","styles","background","select","ios","default","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","OS","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 Props = {\n  type?: 'slide' | 'fade';\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      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={`${width}-${height}`}\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: 'slide' | 'fade',\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade') 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: 'slide' | 'fade') => {\n  const initialY = type === 'slide' ? Dimensions.get('window').height : 0;\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 === 'slide' ? 1 : 0, 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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"}
+{"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","undefined","absoluteFill","opacity","backgroundColor","onBackgroundLight03","styles","background","select","ios","default","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","OS","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 Props = {\n  type?: 'slide' | 'fade';\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={`${width}-${height}`}\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: 'slide' | 'fade',\n  translateY: Animated.Value,\n  show: () => void,\n  hide: () => void,\n) => {\n  if (type === 'fade') 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: 'slide' | 'fade') => {\n  const initialY = type === 'slide' ? Dimensions.get('window').height : 0;\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 === 'slide' ? 1 : 0, 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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"}

package/lib/module/index.js

@@ -12,11 +12,11 @@ export { default as TextInput } from './components/TextInput';
 export { default as URLParsedText } from './components/URLParsedText';
 /** UI **/
 
-export { default as ActionMenu, ActionMenuItem } from './ui/ActionMenu';
+export { default as ActionMenu } from './ui/ActionMenu';
 export { default as Alert } from './ui/Alert';
 export { default as Avatar } from './ui/Avatar';
 export { default as Badge } from './ui/Badge';
-export { default as BottomSheet, BottomSheetItem } from './ui/BottomSheet';
+export { default as BottomSheet } from './ui/BottomSheet';
 export { default as Button } from './ui/Button';
 export { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';
 export { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';
@@ -34,9 +34,9 @@ export { default as Toast, useToast, ToastProvider } from './ui/Toast';
 export { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';
 export { default as createScaleFactor } from './styles/createScaleFactor';
 export { default as createStyleSheet } from './styles/createStyleSheet';
-export { default as createTypography, UIKitTypographyOverrides } from './styles/createTypography';
+export { default as createTypography } from './styles/createTypography';
 export { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';
-export { HeaderStyleContext, HeaderStyleProvider, HeaderStyleContextType } from './styles/HeaderStyleContext';
+export { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';
 export { default as useHeaderStyle } from './styles/useHeaderStyle';
 /** Theme **/
 

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default","IconAssets","Divider","Icon","Image","Modal","Switch","Text","TextInput","URLParsedText","ActionMenu","ActionMenuItem","Alert","Avatar","Badge","BottomSheet","BottomSheetItem","Button","ChannelFrozenBanner","DialogProvider","useActionMenu","useAlert","usePrompt","useBottomSheet","GroupChannelPreview","Header","LoadingSpinner","MenuBar","MenuBarProps","OutlinedButton","Placeholder","ProfileCard","Prompt","Toast","useToast","ToastProvider","createSelectByColorScheme","createScaleFactor","createStyleSheet","createTypography","UIKitTypographyOverrides","getDefaultHeaderHeight","HeaderStyleContext","HeaderStyleProvider","HeaderStyleContextType","useHeaderStyle","createTheme","DarkUIKitTheme","LightUIKitTheme","Palette","UIKitThemeContext","UIKitThemeProvider","useUIKitTheme"],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as Modal } from './components/Modal';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { default as URLParsedText } from './components/URLParsedText';\n\n/** UI **/\nexport { default as ActionMenu, ActionMenuItem } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet, BottomSheetItem } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar, MenuBarProps } from './ui/MenuBar';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography, UIKitTypographyOverrides } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider, HeaderStyleContextType } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\n"],"mappings":"AAAA;AACA,SAASA,OAAO,IAAIC,UAApB,QAAsC,eAAtC;AAEA;;AACA,SAASD,OAAO,IAAIE,OAApB,QAAmC,sBAAnC;AACA,SAASF,OAAO,IAAIG,IAApB,QAAgC,mBAAhC;AACA,SAASH,OAAO,IAAII,KAApB,QAAiC,oBAAjC;AACA,SAASJ,OAAO,IAAIK,KAApB,QAAiC,oBAAjC;AACA,SAASL,OAAO,IAAIM,MAApB,QAAkC,qBAAlC;AACA,SAASN,OAAO,IAAIO,IAApB,QAAgC,mBAAhC;AACA,SAASP,OAAO,IAAIQ,SAApB,QAAqC,wBAArC;AACA,SAASR,OAAO,IAAIS,aAApB,QAAyC,4BAAzC;AAEA;;AACA,SAAST,OAAO,IAAIU,UAApB,EAAgCC,cAAhC,QAAsD,iBAAtD;AACA,SAASX,OAAO,IAAIY,KAApB,QAAiC,YAAjC;AACA,SAASZ,OAAO,IAAIa,MAApB,QAAkC,aAAlC;AACA,SAASb,OAAO,IAAIc,KAApB,QAAiC,YAAjC;AACA,SAASd,OAAO,IAAIe,WAApB,EAAiCC,eAAjC,QAAwD,kBAAxD;AACA,SAAShB,OAAO,IAAIiB,MAApB,QAAkC,aAAlC;AACA,SAASjB,OAAO,IAAIkB,mBAApB,QAA+C,0BAA/C;AACA,SAASC,cAAT,EAAyBC,aAAzB,EAAwCC,QAAxC,EAAkDC,SAAlD,EAA6DC,cAA7D,QAAmF,aAAnF;AACA,SAASvB,OAAO,IAAIwB,mBAApB,QAA+C,0BAA/C;AACA,SAASxB,OAAO,IAAIyB,MAApB,QAAkC,aAAlC;AACA,SAASzB,OAAO,IAAI0B,cAApB,QAA0C,qBAA1C;AACA,SAAS1B,OAAO,IAAI2B,OAApB,EAA6BC,YAA7B,QAAiD,cAAjD;AACA,SAAS5B,OAAO,IAAI6B,cAApB,QAA0C,qBAA1C;AACA,SAAS7B,OAAO,IAAI8B,WAApB,QAAuC,kBAAvC;AACA,SAAS9B,OAAO,IAAI+B,WAApB,QAAuC,kBAAvC;AACA,SAAS/B,OAAO,IAAIgC,MAApB,QAAkC,aAAlC;AACA,SAAShC,OAAO,IAAIiC,KAApB,EAA2BC,QAA3B,EAAqCC,aAArC,QAA0D,YAA1D;AAEA;;AACA,SAASnC,OAAO,IAAIoC,yBAApB,QAAqD,oCAArD;AACA,SAASpC,OAAO,IAAIqC,iBAApB,QAA6C,4BAA7C;AACA,SAASrC,OAAO,IAAIsC,gBAApB,QAA4C,2BAA5C;AACA,SAAStC,OAAO,IAAIuC,gBAApB,EAAsCC,wBAAtC,QAAsE,2BAAtE;AACA,SAASxC,OAAO,IAAIyC,sBAApB,QAAkD,iCAAlD;AACA,SAASC,kBAAT,EAA6BC,mBAA7B,EAAkDC,sBAAlD,QAAgF,6BAAhF;AACA,SAAS5C,OAAO,IAAI6C,cAApB,QAA0C,yBAA1C;AAEA;;AACA,SAAS7C,OAAO,IAAI8C,WAApB,QAAuC,qBAAvC;AACA,SAAS9C,OAAO,IAAI+C,cAApB,QAA0C,wBAA1C;AACA,SAAS/C,OAAO,IAAIgD,eAApB,QAA2C,yBAA3C;AACA,SAAShD,OAAO,IAAIiD,OAApB,QAAmC,iBAAnC;AACA,SAASjD,OAAO,IAAIkD,iBAApB,QAA6C,2BAA7C;AACA,SAASlD,OAAO,IAAImD,kBAApB,QAA8C,4BAA9C;AACA,SAASnD,OAAO,IAAIoD,aAApB,QAAyC,uBAAzC;AAEA"}
+{"version":3,"names":["default","IconAssets","Divider","Icon","Image","Modal","Switch","Text","TextInput","URLParsedText","ActionMenu","Alert","Avatar","Badge","BottomSheet","Button","ChannelFrozenBanner","DialogProvider","useActionMenu","useAlert","usePrompt","useBottomSheet","GroupChannelPreview","Header","LoadingSpinner","MenuBar","MenuBarProps","OutlinedButton","Placeholder","ProfileCard","Prompt","Toast","useToast","ToastProvider","createSelectByColorScheme","createScaleFactor","createStyleSheet","createTypography","getDefaultHeaderHeight","HeaderStyleContext","HeaderStyleProvider","useHeaderStyle","createTheme","DarkUIKitTheme","LightUIKitTheme","Palette","UIKitThemeContext","UIKitThemeProvider","useUIKitTheme"],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as Modal } from './components/Modal';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { default as URLParsedText } from './components/URLParsedText';\n\n/** UI **/\nexport { default as ActionMenu } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar, MenuBarProps } from './ui/MenuBar';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\nexport type { ActionMenuItem } from './ui/ActionMenu';\nexport type { BottomSheetItem } from './ui/BottomSheet';\nexport type { UIKitTypographyOverrides } from './styles/createTypography';\nexport type { HeaderStyleContextType } from './styles/HeaderStyleContext';\n"],"mappings":"AAAA;AACA,SAASA,OAAO,IAAIC,UAApB,QAAsC,eAAtC;AAEA;;AACA,SAASD,OAAO,IAAIE,OAApB,QAAmC,sBAAnC;AACA,SAASF,OAAO,IAAIG,IAApB,QAAgC,mBAAhC;AACA,SAASH,OAAO,IAAII,KAApB,QAAiC,oBAAjC;AACA,SAASJ,OAAO,IAAIK,KAApB,QAAiC,oBAAjC;AACA,SAASL,OAAO,IAAIM,MAApB,QAAkC,qBAAlC;AACA,SAASN,OAAO,IAAIO,IAApB,QAAgC,mBAAhC;AACA,SAASP,OAAO,IAAIQ,SAApB,QAAqC,wBAArC;AACA,SAASR,OAAO,IAAIS,aAApB,QAAyC,4BAAzC;AAEA;;AACA,SAAST,OAAO,IAAIU,UAApB,QAAsC,iBAAtC;AACA,SAASV,OAAO,IAAIW,KAApB,QAAiC,YAAjC;AACA,SAASX,OAAO,IAAIY,MAApB,QAAkC,aAAlC;AACA,SAASZ,OAAO,IAAIa,KAApB,QAAiC,YAAjC;AACA,SAASb,OAAO,IAAIc,WAApB,QAAuC,kBAAvC;AACA,SAASd,OAAO,IAAIe,MAApB,QAAkC,aAAlC;AACA,SAASf,OAAO,IAAIgB,mBAApB,QAA+C,0BAA/C;AACA,SAASC,cAAT,EAAyBC,aAAzB,EAAwCC,QAAxC,EAAkDC,SAAlD,EAA6DC,cAA7D,QAAmF,aAAnF;AACA,SAASrB,OAAO,IAAIsB,mBAApB,QAA+C,0BAA/C;AACA,SAAStB,OAAO,IAAIuB,MAApB,QAAkC,aAAlC;AACA,SAASvB,OAAO,IAAIwB,cAApB,QAA0C,qBAA1C;AACA,SAASxB,OAAO,IAAIyB,OAApB,EAA6BC,YAA7B,QAAiD,cAAjD;AACA,SAAS1B,OAAO,IAAI2B,cAApB,QAA0C,qBAA1C;AACA,SAAS3B,OAAO,IAAI4B,WAApB,QAAuC,kBAAvC;AACA,SAAS5B,OAAO,IAAI6B,WAApB,QAAuC,kBAAvC;AACA,SAAS7B,OAAO,IAAI8B,MAApB,QAAkC,aAAlC;AACA,SAAS9B,OAAO,IAAI+B,KAApB,EAA2BC,QAA3B,EAAqCC,aAArC,QAA0D,YAA1D;AAEA;;AACA,SAASjC,OAAO,IAAIkC,yBAApB,QAAqD,oCAArD;AACA,SAASlC,OAAO,IAAImC,iBAApB,QAA6C,4BAA7C;AACA,SAASnC,OAAO,IAAIoC,gBAApB,QAA4C,2BAA5C;AACA,SAASpC,OAAO,IAAIqC,gBAApB,QAA4C,2BAA5C;AACA,SAASrC,OAAO,IAAIsC,sBAApB,QAAkD,iCAAlD;AACA,SAASC,kBAAT,EAA6BC,mBAA7B,QAAwD,6BAAxD;AACA,SAASxC,OAAO,IAAIyC,cAApB,QAA0C,yBAA1C;AAEA;;AACA,SAASzC,OAAO,IAAI0C,WAApB,QAAuC,qBAAvC;AACA,SAAS1C,OAAO,IAAI2C,cAApB,QAA0C,wBAA1C;AACA,SAAS3C,OAAO,IAAI4C,eAApB,QAA2C,yBAA3C;AACA,SAAS5C,OAAO,IAAI6C,OAApB,QAAmC,iBAAnC;AACA,SAAS7C,OAAO,IAAI8C,iBAApB,QAA6C,2BAA7C;AACA,SAAS9C,OAAO,IAAI+C,kBAApB,QAA8C,4BAA9C;AACA,SAAS/C,OAAO,IAAIgD,aAApB,QAAyC,uBAAzC;AAEA"}

package/lib/module/styles/HeaderStyleContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StatusBar","useWindowDimensions","useSafeAreaInsets","getDefaultHeaderHeight","HeaderStyleContext","createContext","HeaderComponent","defaultTitleAlign","statusBarTranslucent","topInset","currentHeight","defaultHeight","HeaderStyleProvider","children","top","width","height"],"sources":["HeaderStyleContext.tsx"],"sourcesContent":["import React from 'react';\nimport { StatusBar, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport type { BaseHeaderProps, HeaderElement } from '../types';\nimport getDefaultHeaderHeight from './getDefaultHeaderHeight';\n\nexport type HeaderStyleContextType = {\n  HeaderComponent: (\n    props: BaseHeaderProps<\n      {\n        title?: HeaderElement;\n        left?: HeaderElement;\n        right?: HeaderElement;\n        onPressLeft?: () => void;\n        onPressRight?: () => void;\n      },\n      { clearTitleMargin?: boolean }\n    >,\n  ) => React.ReactElement | null;\n  defaultTitleAlign: 'left' | 'center';\n  statusBarTranslucent: boolean;\n  topInset: number;\n  defaultHeight: number;\n};\nexport const HeaderStyleContext = React.createContext<HeaderStyleContextType>({\n  HeaderComponent: () => null,\n  defaultTitleAlign: 'left',\n  statusBarTranslucent: true,\n  topInset: StatusBar.currentHeight ?? 0,\n  defaultHeight: getDefaultHeaderHeight(false),\n});\n\ntype Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;\nexport const HeaderStyleProvider = ({\n  children,\n  HeaderComponent = () => null,\n  defaultTitleAlign,\n  statusBarTranslucent,\n}: React.PropsWithChildren<Props>) => {\n  const { top } = useSafeAreaInsets();\n  const { width, height } = useWindowDimensions();\n\n  return (\n    <HeaderStyleContext.Provider\n      value={{\n        HeaderComponent,\n        defaultTitleAlign,\n        statusBarTranslucent,\n        topInset: statusBarTranslucent ? top : 0,\n        defaultHeight: getDefaultHeaderHeight(width > height),\n      }}\n    >\n      {children}\n    </HeaderStyleContext.Provider>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,mBAApB,QAA+C,cAA/C;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAGA,OAAOC,sBAAP,MAAmC,0BAAnC;AAoBA,OAAO,MAAMC,kBAAkB,gBAAGL,KAAK,CAACM,aAAN,CAA4C;EAC5EC,eAAe,EAAE,MAAM,IADqD;EAE5EC,iBAAiB,EAAE,MAFyD;EAG5EC,oBAAoB,EAAE,IAHsD;EAI5EC,QAAQ,EAAET,SAAS,CAACU,aAAV,IAA2B,CAJuC;EAK5EC,aAAa,EAAER,sBAAsB,CAAC,KAAD;AALuC,CAA5C,CAA3B;AASP,OAAO,MAAMS,mBAAmB,GAAG,QAKG;EAAA,IALF;IAClCC,QADkC;IAElCP,eAAe,GAAG,MAAM,IAFU;IAGlCC,iBAHkC;IAIlCC;EAJkC,CAKE;EACpC,MAAM;IAAEM;EAAF,IAAUZ,iBAAiB,EAAjC;EACA,MAAM;IAAEa,KAAF;IAASC;EAAT,IAAoBf,mBAAmB,EAA7C;EAEA,oBACE,oBAAC,kBAAD,CAAoB,QAApB;IACE,KAAK,EAAE;MACLK,eADK;MAELC,iBAFK;MAGLC,oBAHK;MAILC,QAAQ,EAAED,oBAAoB,GAAGM,GAAH,GAAS,CAJlC;MAKLH,aAAa,EAAER,sBAAsB,CAACY,KAAK,GAAGC,MAAT;IALhC;EADT,GASGH,QATH,CADF;AAaD,CAtBM"}
+{"version":3,"names":["React","StatusBar","useWindowDimensions","useSafeAreaInsets","getDefaultHeaderHeight","HeaderStyleContext","createContext","HeaderComponent","defaultTitleAlign","statusBarTranslucent","topInset","currentHeight","defaultHeight","HeaderStyleProvider","children","top","width","height"],"sources":["HeaderStyleContext.tsx"],"sourcesContent":["import React from 'react';\nimport { StatusBar, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport type { HeaderProps } from '../ui/Header';\nimport getDefaultHeaderHeight from './getDefaultHeaderHeight';\n\nexport type HeaderStyleContextType = {\n  HeaderComponent: (props: HeaderProps) => React.ReactElement | null;\n  defaultTitleAlign: 'left' | 'center';\n  statusBarTranslucent: boolean;\n  topInset: number;\n  defaultHeight: number;\n};\nexport const HeaderStyleContext = React.createContext<HeaderStyleContextType>({\n  HeaderComponent: () => null,\n  defaultTitleAlign: 'left',\n  statusBarTranslucent: true,\n  topInset: StatusBar.currentHeight ?? 0,\n  defaultHeight: getDefaultHeaderHeight(false),\n});\n\ntype Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;\nexport const HeaderStyleProvider = ({\n  children,\n  HeaderComponent = () => null,\n  defaultTitleAlign,\n  statusBarTranslucent,\n}: React.PropsWithChildren<Props>) => {\n  const { top } = useSafeAreaInsets();\n  const { width, height } = useWindowDimensions();\n\n  return (\n    <HeaderStyleContext.Provider\n      value={{\n        HeaderComponent,\n        defaultTitleAlign,\n        statusBarTranslucent,\n        topInset: statusBarTranslucent ? top : 0,\n        defaultHeight: getDefaultHeaderHeight(width > height),\n      }}\n    >\n      {children}\n    </HeaderStyleContext.Provider>\n  );\n};\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,mBAApB,QAA+C,cAA/C;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAGA,OAAOC,sBAAP,MAAmC,0BAAnC;AASA,OAAO,MAAMC,kBAAkB,gBAAGL,KAAK,CAACM,aAAN,CAA4C;EAC5EC,eAAe,EAAE,MAAM,IADqD;EAE5EC,iBAAiB,EAAE,MAFyD;EAG5EC,oBAAoB,EAAE,IAHsD;EAI5EC,QAAQ,EAAET,SAAS,CAACU,aAAV,IAA2B,CAJuC;EAK5EC,aAAa,EAAER,sBAAsB,CAAC,KAAD;AALuC,CAA5C,CAA3B;AASP,OAAO,MAAMS,mBAAmB,GAAG,QAKG;EAAA,IALF;IAClCC,QADkC;IAElCP,eAAe,GAAG,MAAM,IAFU;IAGlCC,iBAHkC;IAIlCC;EAJkC,CAKE;EACpC,MAAM;IAAEM;EAAF,IAAUZ,iBAAiB,EAAjC;EACA,MAAM;IAAEa,KAAF;IAASC;EAAT,IAAoBf,mBAAmB,EAA7C;EAEA,oBACE,oBAAC,kBAAD,CAAoB,QAApB;IACE,KAAK,EAAE;MACLK,eADK;MAELC,iBAFK;MAGLC,oBAHK;MAILC,QAAQ,EAAED,oBAAoB,GAAGM,GAAH,GAAS,CAJlC;MAKLH,aAAa,EAAER,sBAAsB,CAACY,KAAK,GAAGC,MAAT;IALhC;EADT,GASGH,QATH,CADF;AAaD,CAtBM"}

package/lib/module/ui/ActionMenu/index.js

@@ -82,7 +82,7 @@ const ActionMenu = _ref => {
       }
     }, /*#__PURE__*/React.createElement(Text, {
       subtitle2: true,
-      color: colors.ui.dialog.default.none.text,
+      color: item.style === 'destructive' ? colors.ui.dialog.default.none.destructive : colors.ui.dialog.default.none.text,
       numberOfLines: 1
     }, item.title));
   }))));

package/lib/module/ui/ActionMenu/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","TouchableOpacity","View","Logger","Modal","Text","createStyleSheet","useHeaderStyle","useUIKitTheme","DialogBox","LoadingSpinner","ActionMenu","visible","onHide","onError","onDismiss","title","menuItems","statusBarTranslucent","colors","pending","setPending","_onHide","alignItems","justifyContent","styles","ui","dialog","default","none","text","maxWidth","highlight","width","marginLeft","buttonContainer","map","item","index","button","onPress","e","errorHandler","error","flexDirection","paddingHorizontal","paddingVertical","marginTop","marginBottom"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TouchableOpacity, View } from 'react-native';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport DialogBox from '../Dialog/DialogBox';\nimport LoadingSpinner from '../LoadingSpinner';\n\nexport type ActionMenuItem = {\n  title?: string;\n  menuItems: {\n    title: string;\n    onPress?: (() => Promise<void>) | (() => void);\n    onError?: () => void;\n  }[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & ActionMenuItem;\nconst ActionMenu = ({ visible, onHide, onError, onDismiss, title, menuItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const [pending, setPending] = useState(false);\n  const _onHide = () => {\n    if (!pending) onHide();\n  };\n\n  return (\n    <Modal\n      onClose={_onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox>\n        <View style={styles.title}>\n          <Text\n            h1\n            color={colors.ui.dialog.default.none.text}\n            numberOfLines={1}\n            // style={{ flex: 1 }}\n            style={{ maxWidth: pending ? '86%' : '100%' }}\n          >\n            {title}\n          </Text>\n          {pending && (\n            <LoadingSpinner\n              size={20}\n              color={colors.ui.dialog.default.none.highlight}\n              style={{ width: '10%', marginLeft: '4%' }}\n            />\n          )}\n        </View>\n        <View style={styles.buttonContainer}>\n          {menuItems.map((item, index) => {\n            return (\n              <TouchableOpacity\n                activeOpacity={0.75}\n                key={item.title + index}\n                style={styles.button}\n                disabled={pending}\n                onPress={async () => {\n                  setPending(true);\n                  try {\n                    await item.onPress?.();\n                  } catch (e: unknown) {\n                    const errorHandler = onError ?? item.onError;\n                    errorHandler?.(e);\n                    if (!errorHandler) Logger.error('ActionMenu onPress error', e);\n                  } finally {\n                    onHide();\n                    setPending(false);\n                  }\n                }}\n              >\n                <Text subtitle2 color={colors.ui.dialog.default.none.text} numberOfLines={1}>\n                  {item.title}\n                </Text>\n              </TouchableOpacity>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  title: {\n    flexDirection: 'row',\n    paddingHorizontal: 24,\n    paddingVertical: 20,\n    alignItems: 'center',\n  },\n  buttonContainer: {\n    marginTop: 4,\n    marginBottom: 8,\n  },\n  button: {\n    paddingHorizontal: 24,\n    paddingVertical: 12,\n  },\n});\n\nexport default ActionMenu;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SAASC,gBAAT,EAA2BC,IAA3B,QAAuC,cAAvC;AAEA,SAASC,MAAT,QAAuB,uBAAvB;AAEA,OAAOC,KAAP,MAAkB,wBAAlB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,SAAP,MAAsB,qBAAtB;AACA,OAAOC,cAAP,MAA2B,mBAA3B;;AAiBA,MAAMC,UAAU,GAAG,QAAsE;EAAA,IAArE;IAAEC,OAAF;IAAWC,MAAX;IAAmBC,OAAnB;IAA4BC,SAA5B;IAAuCC,KAAvC;IAA8CC;EAA9C,CAAqE;EACvF,MAAM;IAAEC;EAAF,IAA2BX,cAAc,EAA/C;EACA,MAAM;IAAEY;EAAF,IAAaX,aAAa,EAAhC;EACA,MAAM,CAACY,OAAD,EAAUC,UAAV,IAAwBrB,QAAQ,CAAC,KAAD,CAAtC;;EACA,MAAMsB,OAAO,GAAG,MAAM;IACpB,IAAI,CAACF,OAAL,EAAcP,MAAM;EACrB,CAFD;;EAIA,oBACE,oBAAC,KAAD;IACE,OAAO,EAAES,OADX;IAEE,SAAS,EAAEP,SAFb;IAGE,oBAAoB,EAAEG,oBAHxB;IAIE,OAAO,EAAEN,OAJX;IAKE,eAAe,EAAE;MAAEW,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EALnB,gBAOE,oBAAC,SAAD,qBACE,oBAAC,IAAD;IAAM,KAAK,EAAEC,MAAM,CAACT;EAApB,gBACE,oBAAC,IAAD;IACE,EAAE,MADJ;IAEE,KAAK,EAAEG,MAAM,CAACO,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC,IAFvC;IAGE,aAAa,EAAE,CAHjB,CAIE;IAJF;IAKE,KAAK,EAAE;MAAEC,QAAQ,EAAEX,OAAO,GAAG,KAAH,GAAW;IAA9B;EALT,GAOGJ,KAPH,CADF,EAUGI,OAAO,iBACN,oBAAC,cAAD;IACE,IAAI,EAAE,EADR;IAEE,KAAK,EAAED,MAAM,CAACO,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BG,SAFvC;IAGE,KAAK,EAAE;MAAEC,KAAK,EAAE,KAAT;MAAgBC,UAAU,EAAE;IAA5B;EAHT,EAXJ,CADF,eAmBE,oBAAC,IAAD;IAAM,KAAK,EAAET,MAAM,CAACU;EAApB,GACGlB,SAAS,CAACmB,GAAV,CAAc,CAACC,IAAD,EAAOC,KAAP,KAAiB;IAC9B,oBACE,oBAAC,gBAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAED,IAAI,CAACrB,KAAL,GAAasB,KAFpB;MAGE,KAAK,EAAEb,MAAM,CAACc,MAHhB;MAIE,QAAQ,EAAEnB,OAJZ;MAKE,OAAO,EAAE,YAAY;QACnBC,UAAU,CAAC,IAAD,CAAV;;QACA,IAAI;UAAA;;UACF,wBAAMgB,IAAI,CAACG,OAAX,kDAAM,mBAAAH,IAAI,CAAV;QACD,CAFD,CAEE,OAAOI,CAAP,EAAmB;UACnB,MAAMC,YAAY,GAAG5B,OAAO,IAAIuB,IAAI,CAACvB,OAArC;UACA4B,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAGD,CAAH,CAAZ;UACA,IAAI,CAACC,YAAL,EAAmBvC,MAAM,CAACwC,KAAP,CAAa,0BAAb,EAAyCF,CAAzC;QACpB,CAND,SAMU;UACR5B,MAAM;UACNQ,UAAU,CAAC,KAAD,CAAV;QACD;MACF;IAjBH,gBAmBE,oBAAC,IAAD;MAAM,SAAS,MAAf;MAAgB,KAAK,EAAEF,MAAM,CAACO,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC,IAArD;MAA2D,aAAa,EAAE;IAA1E,GACGO,IAAI,CAACrB,KADR,CAnBF,CADF;EAyBD,CA1BA,CADH,CAnBF,CAPF,CADF;AA2DD,CAnED;;AAqEA,MAAMS,MAAM,GAAGnB,gBAAgB,CAAC;EAC9BU,KAAK,EAAE;IACL4B,aAAa,EAAE,KADV;IAELC,iBAAiB,EAAE,EAFd;IAGLC,eAAe,EAAE,EAHZ;IAILvB,UAAU,EAAE;EAJP,CADuB;EAO9BY,eAAe,EAAE;IACfY,SAAS,EAAE,CADI;IAEfC,YAAY,EAAE;EAFC,CAPa;EAW9BT,MAAM,EAAE;IACNM,iBAAiB,EAAE,EADb;IAENC,eAAe,EAAE;EAFX;AAXsB,CAAD,CAA/B;AAiBA,eAAenC,UAAf"}
+{"version":3,"names":["React","useState","TouchableOpacity","View","Logger","Modal","Text","createStyleSheet","useHeaderStyle","useUIKitTheme","DialogBox","LoadingSpinner","ActionMenu","visible","onHide","onError","onDismiss","title","menuItems","statusBarTranslucent","colors","pending","setPending","_onHide","alignItems","justifyContent","styles","ui","dialog","default","none","text","maxWidth","highlight","width","marginLeft","buttonContainer","map","item","index","button","onPress","e","errorHandler","error","style","destructive","flexDirection","paddingHorizontal","paddingVertical","marginTop","marginBottom"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TouchableOpacity, View } from 'react-native';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport DialogBox from '../Dialog/DialogBox';\nimport LoadingSpinner from '../LoadingSpinner';\n\nexport type ActionMenuItem = {\n  title?: string;\n  menuItems: {\n    title: string;\n    style?: 'destructive';\n    onPress?: (() => Promise<void>) | (() => void);\n    onError?: () => void;\n  }[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & ActionMenuItem;\nconst ActionMenu = ({ visible, onHide, onError, onDismiss, title, menuItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const [pending, setPending] = useState(false);\n  const _onHide = () => {\n    if (!pending) onHide();\n  };\n\n  return (\n    <Modal\n      onClose={_onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox>\n        <View style={styles.title}>\n          <Text\n            h1\n            color={colors.ui.dialog.default.none.text}\n            numberOfLines={1}\n            // style={{ flex: 1 }}\n            style={{ maxWidth: pending ? '86%' : '100%' }}\n          >\n            {title}\n          </Text>\n          {pending && (\n            <LoadingSpinner\n              size={20}\n              color={colors.ui.dialog.default.none.highlight}\n              style={{ width: '10%', marginLeft: '4%' }}\n            />\n          )}\n        </View>\n        <View style={styles.buttonContainer}>\n          {menuItems.map((item, index) => {\n            return (\n              <TouchableOpacity\n                activeOpacity={0.75}\n                key={item.title + index}\n                style={styles.button}\n                disabled={pending}\n                onPress={async () => {\n                  setPending(true);\n                  try {\n                    await item.onPress?.();\n                  } catch (e: unknown) {\n                    const errorHandler = onError ?? item.onError;\n                    errorHandler?.(e);\n                    if (!errorHandler) Logger.error('ActionMenu onPress error', e);\n                  } finally {\n                    onHide();\n                    setPending(false);\n                  }\n                }}\n              >\n                <Text\n                  subtitle2\n                  color={\n                    item.style === 'destructive'\n                      ? colors.ui.dialog.default.none.destructive\n                      : colors.ui.dialog.default.none.text\n                  }\n                  numberOfLines={1}\n                >\n                  {item.title}\n                </Text>\n              </TouchableOpacity>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  title: {\n    flexDirection: 'row',\n    paddingHorizontal: 24,\n    paddingVertical: 20,\n    alignItems: 'center',\n  },\n  buttonContainer: {\n    marginTop: 4,\n    marginBottom: 8,\n  },\n  button: {\n    paddingHorizontal: 24,\n    paddingVertical: 12,\n  },\n});\n\nexport default ActionMenu;\n"],"mappings":"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"}

package/lib/module/ui/Header/index.js

@@ -23,7 +23,8 @@ const Header = _ref => {
     right = null,
     onPressLeft,
     onPressRight,
-    clearTitleMargin = false
+    clearTitleMargin = false,
+    statusBarTopInsetAs = 'padding'
   } = _ref;
   const {
     topInset,
@@ -50,9 +51,9 @@ const Header = _ref => {
 
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.container, {
+      [statusBarTopInsetAs === 'padding' ? 'paddingTop' : 'marginTop']: topInset,
       paddingLeft: paddingLeft + styles.container.paddingHorizontal,
       paddingRight: paddingRight + styles.container.paddingHorizontal,
-      paddingTop: topInset,
       backgroundColor: colors.ui.header.nav.none.background,
       borderBottomColor: colors.ui.header.nav.none.borderBottom
     }]

package/lib/module/ui/Header/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","TouchableOpacity","View","useSafeAreaInsets","conditionChaining","Text","createStyleSheet","useHeaderStyle","useUIKitTheme","AlignMapper","left","center","right","Header","children","titleAlign","title","onPressLeft","onPressRight","clearTitleMargin","topInset","defaultTitleAlign","defaultHeight","colors","paddingLeft","paddingRight","actualTitleAlign","paddingTop","backgroundColor","ui","header","nav","none","background","styles","container","paddingHorizontal","borderBottomColor","borderBottom","height","marginHorizontal","justifyContent","LeftSide","RightSide","HeaderTitle","style","props","HeaderSubtitle","onBackground03","HeaderButton","disabled","onPress","color","button","e","borderBottomWidth","flexDirection","flex","alignItems","minWidth","marginRight","marginLeft","padding","Button","Title","Subtitle"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, TouchableOpacityProps, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../../components/Text';\nimport type { BaseHeaderProps } from '../../index';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype HeaderElement = string | React.ReactElement | null;\ntype HeaderProps = BaseHeaderProps<\n  {\n    title?: HeaderElement;\n    left?: HeaderElement;\n    right?: HeaderElement;\n    onPressLeft?: () => void;\n    onPressRight?: () => void;\n  },\n  { clearTitleMargin?: boolean }\n>;\n\nconst AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;\nconst Header: ((props: HeaderProps) => JSX.Element) & {\n  Button: typeof HeaderButton;\n  Title: typeof HeaderTitle;\n  Subtitle: typeof HeaderSubtitle;\n} = ({\n  children,\n  titleAlign,\n  title = null,\n  left = null,\n  right = null,\n  onPressLeft,\n  onPressRight,\n  clearTitleMargin = false,\n}) => {\n  const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const { left: paddingLeft, right: paddingRight } = useSafeAreaInsets();\n\n  const actualTitleAlign = titleAlign ?? defaultTitleAlign;\n\n  if (!title && !left && !right) {\n    return (\n      <View style={{ paddingTop: topInset, backgroundColor: colors.ui.header.nav.none.background }}>{children}</View>\n    );\n  }\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          paddingLeft: paddingLeft + styles.container.paddingHorizontal,\n          paddingRight: paddingRight + styles.container.paddingHorizontal,\n          paddingTop: topInset,\n          backgroundColor: colors.ui.header.nav.none.background,\n          borderBottomColor: colors.ui.header.nav.none.borderBottom,\n        },\n      ]}\n    >\n      <View style={[styles.header, { height: defaultHeight }]}>\n        <LeftSide titleAlign={actualTitleAlign} left={left} onPressLeft={onPressLeft} />\n        <View\n          style={[\n            styles.title,\n            clearTitleMargin && { marginHorizontal: 0 },\n            { justifyContent: AlignMapper[actualTitleAlign] },\n          ]}\n        >\n          {typeof title === 'string' ? <HeaderTitle>{title}</HeaderTitle> : title}\n        </View>\n        <RightSide titleAlign={actualTitleAlign} right={right} onPressRight={onPressRight} />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst LeftSide = ({ titleAlign, onPressLeft, left }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.left}>{left && <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>}</View>;\n  }\n  if (!left) return null;\n  return (\n    <View style={styles.left}>\n      <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>\n    </View>\n  );\n};\n\nconst RightSide = ({ titleAlign, onPressRight, right }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.right}>{right && <HeaderButton onPress={onPressRight}>{right}</HeaderButton>}</View>;\n  }\n  if (!right) return null;\n  return (\n    <View style={styles.right}>\n      <HeaderButton onPress={onPressRight}>{right}</HeaderButton>\n    </View>\n  );\n};\n\nconst HeaderTitle = ({ children, style, ...props }: TextProps) => {\n  return (\n    <Text {...props} h1 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderSubtitle = ({ children, style, ...props }: TextProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Text color={colors.onBackground03} {...props} caption2 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderButton = ({ children, disabled, onPress, color, ...props }: TouchableOpacityProps & { color?: string }) => {\n  return (\n    <TouchableOpacity\n      style={styles.button}\n      {...props}\n      disabled={!onPress || disabled}\n      onPress={(e) => onPress?.(e)}\n      activeOpacity={0.7}\n    >\n      {conditionChaining(\n        [typeof children === 'string' || typeof children === 'number'],\n        [\n          <Text button numberOfLines={1} color={color}>\n            {children}\n          </Text>,\n          children,\n        ],\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingHorizontal: 12,\n    borderBottomWidth: 1,\n  },\n  header: {\n    flexDirection: 'row',\n  },\n  title: {\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginHorizontal: 12,\n  },\n  left: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginRight: 12,\n  },\n  right: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginLeft: 12,\n  },\n  button: {\n    padding: 4,\n  },\n});\n\nHeader.Button = HeaderButton;\nHeader.Title = HeaderTitle;\nHeader.Subtitle = HeaderSubtitle;\nexport default Header;\n"],"mappings":"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"}
+{"version":3,"names":["React","TouchableOpacity","View","useSafeAreaInsets","conditionChaining","Text","createStyleSheet","useHeaderStyle","useUIKitTheme","AlignMapper","left","center","right","Header","children","titleAlign","title","onPressLeft","onPressRight","clearTitleMargin","statusBarTopInsetAs","topInset","defaultTitleAlign","defaultHeight","colors","paddingLeft","paddingRight","actualTitleAlign","paddingTop","backgroundColor","ui","header","nav","none","background","styles","container","paddingHorizontal","borderBottomColor","borderBottom","height","marginHorizontal","justifyContent","LeftSide","RightSide","HeaderTitle","style","props","HeaderSubtitle","onBackground03","HeaderButton","disabled","onPress","color","button","e","borderBottomWidth","flexDirection","flex","alignItems","minWidth","marginRight","marginLeft","padding","Button","Title","Subtitle"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, TouchableOpacityProps, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../../components/Text';\nimport type { BaseHeaderProps } from '../../index';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype HeaderElement = string | React.ReactElement | null;\nexport type HeaderProps = BaseHeaderProps<\n  {\n    title?: HeaderElement;\n    left?: HeaderElement;\n    right?: HeaderElement;\n    onPressLeft?: () => void;\n    onPressRight?: () => void;\n  },\n  {\n    clearTitleMargin?: boolean;\n    statusBarTopInsetAs?: 'padding' | 'margin';\n  }\n>;\n\nconst AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;\nconst Header: ((props: HeaderProps) => JSX.Element) & {\n  Button: typeof HeaderButton;\n  Title: typeof HeaderTitle;\n  Subtitle: typeof HeaderSubtitle;\n} = ({\n  children,\n  titleAlign,\n  title = null,\n  left = null,\n  right = null,\n  onPressLeft,\n  onPressRight,\n  clearTitleMargin = false,\n  statusBarTopInsetAs = 'padding',\n}) => {\n  const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();\n\n  const { colors } = useUIKitTheme();\n  const { left: paddingLeft, right: paddingRight } = useSafeAreaInsets();\n\n  const actualTitleAlign = titleAlign ?? defaultTitleAlign;\n\n  if (!title && !left && !right) {\n    return (\n      <View style={{ paddingTop: topInset, backgroundColor: colors.ui.header.nav.none.background }}>{children}</View>\n    );\n  }\n\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          [statusBarTopInsetAs === 'padding' ? 'paddingTop' : 'marginTop']: topInset,\n          paddingLeft: paddingLeft + styles.container.paddingHorizontal,\n          paddingRight: paddingRight + styles.container.paddingHorizontal,\n          backgroundColor: colors.ui.header.nav.none.background,\n          borderBottomColor: colors.ui.header.nav.none.borderBottom,\n        },\n      ]}\n    >\n      <View style={[styles.header, { height: defaultHeight }]}>\n        <LeftSide titleAlign={actualTitleAlign} left={left} onPressLeft={onPressLeft} />\n        <View\n          style={[\n            styles.title,\n            clearTitleMargin && { marginHorizontal: 0 },\n            { justifyContent: AlignMapper[actualTitleAlign] },\n          ]}\n        >\n          {typeof title === 'string' ? <HeaderTitle>{title}</HeaderTitle> : title}\n        </View>\n        <RightSide titleAlign={actualTitleAlign} right={right} onPressRight={onPressRight} />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst LeftSide = ({ titleAlign, onPressLeft, left }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.left}>{left && <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>}</View>;\n  }\n  if (!left) return null;\n  return (\n    <View style={styles.left}>\n      <HeaderButton onPress={onPressLeft}>{left}</HeaderButton>\n    </View>\n  );\n};\n\nconst RightSide = ({ titleAlign, onPressRight, right }: HeaderProps) => {\n  if (titleAlign === 'center') {\n    return <View style={styles.right}>{right && <HeaderButton onPress={onPressRight}>{right}</HeaderButton>}</View>;\n  }\n  if (!right) return null;\n  return (\n    <View style={styles.right}>\n      <HeaderButton onPress={onPressRight}>{right}</HeaderButton>\n    </View>\n  );\n};\n\nconst HeaderTitle = ({ children, style, ...props }: TextProps) => {\n  return (\n    <Text {...props} h1 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderSubtitle = ({ children, style, ...props }: TextProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Text color={colors.onBackground03} {...props} caption2 numberOfLines={1} style={style}>\n      {children}\n    </Text>\n  );\n};\nconst HeaderButton = ({ children, disabled, onPress, color, ...props }: TouchableOpacityProps & { color?: string }) => {\n  return (\n    <TouchableOpacity\n      style={styles.button}\n      {...props}\n      disabled={!onPress || disabled}\n      onPress={(e) => onPress?.(e)}\n      activeOpacity={0.7}\n    >\n      {conditionChaining(\n        [typeof children === 'string' || typeof children === 'number'],\n        [\n          <Text button numberOfLines={1} color={color}>\n            {children}\n          </Text>,\n          children,\n        ],\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingHorizontal: 12,\n    borderBottomWidth: 1,\n  },\n  header: {\n    flexDirection: 'row',\n  },\n  title: {\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginHorizontal: 12,\n  },\n  left: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginRight: 12,\n  },\n  right: {\n    height: '100%',\n    minWidth: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n    marginLeft: 12,\n  },\n  button: {\n    padding: 4,\n  },\n});\n\nHeader.Button = HeaderButton;\nHeader.Title = HeaderTitle;\nHeader.Subtitle = HeaderSubtitle;\nexport default Header;\n"],"mappings":"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"}

package/lib/module/ui/MenuBar/index.js

@@ -11,6 +11,7 @@ const MenuBar = _ref => {
   let {
     variant = 'default',
     disabled,
+    visible = true,
     onPress,
     name,
     icon,
@@ -23,6 +24,7 @@ const MenuBar = _ref => {
     palette,
     colors
   } = useUIKitTheme();
+  if (!visible) return null;
   return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Pressable, {
     disabled: disabled,
     onPress: onPress,

package/lib/module/ui/MenuBar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Pressable","View","conditionChaining","Divider","Icon","Text","createStyleSheet","useUIKitTheme","MenuBar","variant","disabled","onPress","name","icon","iconColor","iconBackgroundColor","actionLabel","actionItem","palette","colors","styles","container","background50","primary","containedIcon","backgroundColor","background400","Boolean","onBackground02","paddingVertical","flexDirection","alignItems","flex","marginRight","borderRadius","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Divider from '../../components/Divider';\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nexport type MenuBarProps = {\n  variant?: 'default' | 'contained';\n\n  onPress: () => void;\n  disabled?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  iconColor?: string;\n  iconBackgroundColor?: string;\n  name: string;\n\n  actionLabel?: string;\n  actionItem?: React.ReactNode;\n};\nconst MenuBar = ({\n  variant = 'default',\n  disabled,\n  onPress,\n  name,\n  icon,\n  iconColor,\n  iconBackgroundColor,\n  actionLabel,\n  actionItem = null,\n}: MenuBarProps) => {\n  const { palette, colors } = useUIKitTheme();\n\n  return (\n    <View>\n      <Pressable disabled={disabled} onPress={onPress} style={styles.container}>\n        {icon && (\n          <Icon\n            icon={icon}\n            size={variant === 'contained' ? 16 : 24}\n            color={conditionChaining(\n              [variant === 'contained', iconColor],\n              [palette.background50, iconColor, colors.primary],\n            )}\n            containerStyle={[\n              styles.icon,\n              variant === 'contained' && styles.containedIcon,\n              variant === 'contained' && { backgroundColor: iconBackgroundColor ?? palette.background400 },\n            ]}\n          />\n        )}\n        <Text subtitle2 numberOfLines={1} style={styles.name}>\n          {name}\n        </Text>\n        {Boolean(actionLabel) && (\n          <Text subtitle2 numberOfLines={1} color={colors.onBackground02} style={styles.actionLabel}>\n            {actionLabel}\n          </Text>\n        )}\n        {actionItem}\n      </Pressable>\n      <Divider />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingVertical: 16,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flex: 1,\n    marginRight: 8,\n  },\n  icon: {\n    marginRight: 16,\n  },\n  containedIcon: {\n    borderRadius: 24,\n    padding: 4,\n  },\n  actionLabel: {\n    marginRight: 4,\n  },\n});\n\nexport default MenuBar;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,IAApB,QAAgC,cAAhC;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,OAAP,MAAoB,0BAApB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAgBA,MAAMC,OAAO,GAAG,QAUI;EAAA,IAVH;IACfC,OAAO,GAAG,SADK;IAEfC,QAFe;IAGfC,OAHe;IAIfC,IAJe;IAKfC,IALe;IAMfC,SANe;IAOfC,mBAPe;IAQfC,WARe;IASfC,UAAU,GAAG;EATE,CAUG;EAClB,MAAM;IAAEC,OAAF;IAAWC;EAAX,IAAsBZ,aAAa,EAAzC;EAEA,oBACE,oBAAC,IAAD,qBACE,oBAAC,SAAD;IAAW,QAAQ,EAAEG,QAArB;IAA+B,OAAO,EAAEC,OAAxC;IAAiD,KAAK,EAAES,MAAM,CAACC;EAA/D,GACGR,IAAI,iBACH,oBAAC,IAAD;IACE,IAAI,EAAEA,IADR;IAEE,IAAI,EAAEJ,OAAO,KAAK,WAAZ,GAA0B,EAA1B,GAA+B,EAFvC;IAGE,KAAK,EAAEP,iBAAiB,CACtB,CAACO,OAAO,KAAK,WAAb,EAA0BK,SAA1B,CADsB,EAEtB,CAACI,OAAO,CAACI,YAAT,EAAuBR,SAAvB,EAAkCK,MAAM,CAACI,OAAzC,CAFsB,CAH1B;IAOE,cAAc,EAAE,CACdH,MAAM,CAACP,IADO,EAEdJ,OAAO,KAAK,WAAZ,IAA2BW,MAAM,CAACI,aAFpB,EAGdf,OAAO,KAAK,WAAZ,IAA2B;MAAEgB,eAAe,EAAEV,mBAAmB,IAAIG,OAAO,CAACQ;IAAlD,CAHb;EAPlB,EAFJ,eAgBE,oBAAC,IAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEN,MAAM,CAACR;EAAhD,GACGA,IADH,CAhBF,EAmBGe,OAAO,CAACX,WAAD,CAAP,iBACC,oBAAC,IAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEG,MAAM,CAACS,cAAhD;IAAgE,KAAK,EAAER,MAAM,CAACJ;EAA9E,GACGA,WADH,CApBJ,EAwBGC,UAxBH,CADF,eA2BE,oBAAC,OAAD,OA3BF,CADF;AA+BD,CA5CD;;AA8CA,MAAMG,MAAM,GAAGd,gBAAgB,CAAC;EAC9Be,SAAS,EAAE;IACTQ,eAAe,EAAE,EADR;IAETC,aAAa,EAAE,KAFN;IAGTC,UAAU,EAAE;EAHH,CADmB;EAM9BnB,IAAI,EAAE;IACJoB,IAAI,EAAE,CADF;IAEJC,WAAW,EAAE;EAFT,CANwB;EAU9BpB,IAAI,EAAE;IACJoB,WAAW,EAAE;EADT,CAVwB;EAa9BT,aAAa,EAAE;IACbU,YAAY,EAAE,EADD;IAEbC,OAAO,EAAE;EAFI,CAbe;EAiB9BnB,WAAW,EAAE;IACXiB,WAAW,EAAE;EADF;AAjBiB,CAAD,CAA/B;AAsBA,eAAezB,OAAf"}
+{"version":3,"names":["React","Pressable","View","conditionChaining","Divider","Icon","Text","createStyleSheet","useUIKitTheme","MenuBar","variant","disabled","visible","onPress","name","icon","iconColor","iconBackgroundColor","actionLabel","actionItem","palette","colors","styles","container","background50","primary","containedIcon","backgroundColor","background400","Boolean","onBackground02","paddingVertical","flexDirection","alignItems","flex","marginRight","borderRadius","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Divider from '../../components/Divider';\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nexport type MenuBarProps = {\n  variant?: 'default' | 'contained';\n\n  onPress: () => void;\n  disabled?: boolean;\n  visible?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  iconColor?: string;\n  iconBackgroundColor?: string;\n  name: string;\n\n  actionLabel?: string;\n  actionItem?: React.ReactNode;\n};\nconst MenuBar = ({\n  variant = 'default',\n  disabled,\n  visible = true,\n  onPress,\n  name,\n  icon,\n  iconColor,\n  iconBackgroundColor,\n  actionLabel,\n  actionItem = null,\n}: MenuBarProps) => {\n  const { palette, colors } = useUIKitTheme();\n\n  if (!visible) return null;\n\n  return (\n    <View>\n      <Pressable disabled={disabled} onPress={onPress} style={styles.container}>\n        {icon && (\n          <Icon\n            icon={icon}\n            size={variant === 'contained' ? 16 : 24}\n            color={conditionChaining(\n              [variant === 'contained', iconColor],\n              [palette.background50, iconColor, colors.primary],\n            )}\n            containerStyle={[\n              styles.icon,\n              variant === 'contained' && styles.containedIcon,\n              variant === 'contained' && { backgroundColor: iconBackgroundColor ?? palette.background400 },\n            ]}\n          />\n        )}\n        <Text subtitle2 numberOfLines={1} style={styles.name}>\n          {name}\n        </Text>\n        {Boolean(actionLabel) && (\n          <Text subtitle2 numberOfLines={1} color={colors.onBackground02} style={styles.actionLabel}>\n            {actionLabel}\n          </Text>\n        )}\n        {actionItem}\n      </Pressable>\n      <Divider />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingVertical: 16,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flex: 1,\n    marginRight: 8,\n  },\n  icon: {\n    marginRight: 16,\n  },\n  containedIcon: {\n    borderRadius: 24,\n    padding: 4,\n  },\n  actionLabel: {\n    marginRight: 4,\n  },\n});\n\nexport default MenuBar;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,IAApB,QAAgC,cAAhC;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,OAAP,MAAoB,0BAApB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAiBA,MAAMC,OAAO,GAAG,QAWI;EAAA,IAXH;IACfC,OAAO,GAAG,SADK;IAEfC,QAFe;IAGfC,OAAO,GAAG,IAHK;IAIfC,OAJe;IAKfC,IALe;IAMfC,IANe;IAOfC,SAPe;IAQfC,mBARe;IASfC,WATe;IAUfC,UAAU,GAAG;EAVE,CAWG;EAClB,MAAM;IAAEC,OAAF;IAAWC;EAAX,IAAsBb,aAAa,EAAzC;EAEA,IAAI,CAACI,OAAL,EAAc,OAAO,IAAP;EAEd,oBACE,oBAAC,IAAD,qBACE,oBAAC,SAAD;IAAW,QAAQ,EAAED,QAArB;IAA+B,OAAO,EAAEE,OAAxC;IAAiD,KAAK,EAAES,MAAM,CAACC;EAA/D,GACGR,IAAI,iBACH,oBAAC,IAAD;IACE,IAAI,EAAEA,IADR;IAEE,IAAI,EAAEL,OAAO,KAAK,WAAZ,GAA0B,EAA1B,GAA+B,EAFvC;IAGE,KAAK,EAAEP,iBAAiB,CACtB,CAACO,OAAO,KAAK,WAAb,EAA0BM,SAA1B,CADsB,EAEtB,CAACI,OAAO,CAACI,YAAT,EAAuBR,SAAvB,EAAkCK,MAAM,CAACI,OAAzC,CAFsB,CAH1B;IAOE,cAAc,EAAE,CACdH,MAAM,CAACP,IADO,EAEdL,OAAO,KAAK,WAAZ,IAA2BY,MAAM,CAACI,aAFpB,EAGdhB,OAAO,KAAK,WAAZ,IAA2B;MAAEiB,eAAe,EAAEV,mBAAmB,IAAIG,OAAO,CAACQ;IAAlD,CAHb;EAPlB,EAFJ,eAgBE,oBAAC,IAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEN,MAAM,CAACR;EAAhD,GACGA,IADH,CAhBF,EAmBGe,OAAO,CAACX,WAAD,CAAP,iBACC,oBAAC,IAAD;IAAM,SAAS,MAAf;IAAgB,aAAa,EAAE,CAA/B;IAAkC,KAAK,EAAEG,MAAM,CAACS,cAAhD;IAAgE,KAAK,EAAER,MAAM,CAACJ;EAA9E,GACGA,WADH,CApBJ,EAwBGC,UAxBH,CADF,eA2BE,oBAAC,OAAD,OA3BF,CADF;AA+BD,CA/CD;;AAiDA,MAAMG,MAAM,GAAGf,gBAAgB,CAAC;EAC9BgB,SAAS,EAAE;IACTQ,eAAe,EAAE,EADR;IAETC,aAAa,EAAE,KAFN;IAGTC,UAAU,EAAE;EAHH,CADmB;EAM9BnB,IAAI,EAAE;IACJoB,IAAI,EAAE,CADF;IAEJC,WAAW,EAAE;EAFT,CANwB;EAU9BpB,IAAI,EAAE;IACJoB,WAAW,EAAE;EADT,CAVwB;EAa9BT,aAAa,EAAE;IACbU,YAAY,EAAE,EADD;IAEbC,OAAO,EAAE;EAFI,CAbe;EAiB9BnB,WAAW,EAAE;IACXiB,WAAW,EAAE;EADF;AAjBiB,CAAD,CAA/B;AAsBA,eAAe1B,OAAf"}

package/lib/typescript/src/assets/icon/index.d.ts

@@ -33,7 +33,7 @@ declare const IconAssets: {
     leave: any;
     members: any;
     message: any;
-    moderations: any;
+    moderation: any;
     more: any;
     mute: any;
     'notifications-filled': any;

package/lib/typescript/src/index.d.ts

@@ -10,11 +10,11 @@ export { default as Text } from './components/Text';
 export { default as TextInput } from './components/TextInput';
 export { default as URLParsedText } from './components/URLParsedText';
 /** UI **/
-export { default as ActionMenu, ActionMenuItem } from './ui/ActionMenu';
+export { default as ActionMenu } from './ui/ActionMenu';
 export { default as Alert } from './ui/Alert';
 export { default as Avatar } from './ui/Avatar';
 export { default as Badge } from './ui/Badge';
-export { default as BottomSheet, BottomSheetItem } from './ui/BottomSheet';
+export { default as BottomSheet } from './ui/BottomSheet';
 export { default as Button } from './ui/Button';
 export { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';
 export { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';
@@ -31,9 +31,9 @@ export { default as Toast, useToast, ToastProvider } from './ui/Toast';
 export { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';
 export { default as createScaleFactor } from './styles/createScaleFactor';
 export { default as createStyleSheet } from './styles/createStyleSheet';
-export { default as createTypography, UIKitTypographyOverrides } from './styles/createTypography';
+export { default as createTypography } from './styles/createTypography';
 export { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';
-export { HeaderStyleContext, HeaderStyleProvider, HeaderStyleContextType } from './styles/HeaderStyleContext';
+export { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';
 export { default as useHeaderStyle } from './styles/useHeaderStyle';
 /** Theme **/
 export { default as createTheme } from './theme/createTheme';
@@ -45,3 +45,7 @@ export { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';
 export { default as useUIKitTheme } from './theme/useUIKitTheme';
 /** Types **/
 export type { TypoName, UIKitTheme, UIKitTypography, FontAttributes, BaseHeaderProps, UIKitColorScheme, UIKitColors, ComponentColorTree, UIKitPalette, HeaderElement, HeaderPartProps, ComponentColors, Component, GetColorTree, } from './types';
+export type { ActionMenuItem } from './ui/ActionMenu';
+export type { BottomSheetItem } from './ui/BottomSheet';
+export type { UIKitTypographyOverrides } from './styles/createTypography';
+export type { HeaderStyleContextType } from './styles/HeaderStyleContext';

package/lib/typescript/src/styles/HeaderStyleContext.d.ts

@@ -1,15 +1,7 @@
 import React from 'react';
-import type { BaseHeaderProps, HeaderElement } from '../types';
+import type { HeaderProps } from '../ui/Header';
 export declare type HeaderStyleContextType = {
-    HeaderComponent: (props: BaseHeaderProps<{
-        title?: HeaderElement;
-        left?: HeaderElement;
-        right?: HeaderElement;
-        onPressLeft?: () => void;
-        onPressRight?: () => void;
-    }, {
-        clearTitleMargin?: boolean;
-    }>) => React.ReactElement | null;
+    HeaderComponent: (props: HeaderProps) => React.ReactElement | null;
     defaultTitleAlign: 'left' | 'center';
     statusBarTranslucent: boolean;
     topInset: number;

package/lib/typescript/src/ui/ActionMenu/index.d.ts

@@ -2,6 +2,7 @@ export declare type ActionMenuItem = {
     title?: string;
     menuItems: {
         title: string;
+        style?: 'destructive';
         onPress?: (() => Promise<void>) | (() => void);
         onError?: () => void;
     }[];

package/lib/typescript/src/ui/Header/index.d.ts

@@ -3,7 +3,7 @@ import { TouchableOpacityProps } from 'react-native';
 import { TextProps } from '../../components/Text';
 import type { BaseHeaderProps } from '../../index';
 declare type HeaderElement = string | React.ReactElement | null;
-declare type HeaderProps = BaseHeaderProps<{
+export declare type HeaderProps = BaseHeaderProps<{
     title?: HeaderElement;
     left?: HeaderElement;
     right?: HeaderElement;
@@ -11,6 +11,7 @@ declare type HeaderProps = BaseHeaderProps<{
     onPressRight?: () => void;
 }, {
     clearTitleMargin?: boolean;
+    statusBarTopInsetAs?: 'padding' | 'margin';
 }>;
 declare const Header: ((props: HeaderProps) => JSX.Element) & {
     Button: typeof HeaderButton;

package/lib/typescript/src/ui/MenuBar/index.d.ts

@@ -4,6 +4,7 @@ export declare type MenuBarProps = {
     variant?: 'default' | 'contained';
     onPress: () => void;
     disabled?: boolean;
+    visible?: boolean;
     icon: keyof typeof Icon.Assets;
     iconColor?: string;
     iconBackgroundColor?: string;
@@ -11,5 +12,5 @@ export declare type MenuBarProps = {
     actionLabel?: string;
     actionItem?: React.ReactNode;
 };
-declare const MenuBar: ({ variant, disabled, onPress, name, icon, iconColor, iconBackgroundColor, actionLabel, actionItem, }: MenuBarProps) => JSX.Element;
+declare const MenuBar: ({ variant, disabled, visible, onPress, name, icon, iconColor, iconBackgroundColor, actionLabel, actionItem, }: MenuBarProps) => JSX.Element | null;
 export default MenuBar;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendbird/uikit-react-native-foundation",
-  "version": "2.0.2",
+  "version": "2.1.0",
   "description": "react-native-uikit",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -38,7 +38,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sendbird/uikit-utils": "2.0.2"
+    "@sendbird/uikit-utils": "2.1.0"
   },
   "devDependencies": {
     "@types/react": "*",
@@ -80,5 +80,5 @@
     "readmeFile": "./README.md",
     "displayName": "@sendbird/uikit-react-native-foundation"
   },
-  "gitHead": "95323825da753f20b931b4a8b7e187cd8dc6284e"
+  "gitHead": "c778a84a632487047fe532db188b32dfa6e93a7f"
 }

package/src/assets/icon/index.ts

@@ -33,7 +33,7 @@ const IconAssets = {
   'leave': require('./icon-leave.png'),
   'members': require('./icon-members.png'),
   'message': require('./icon-message.png'),
-  'moderations': require('./icon-moderations.png'),
+  'moderation': require('./icon-moderation.png'),
   'more': require('./icon-more.png'),
   'mute': require('./icon-mute.png'),
   'notifications-filled': require('./icon-notifications-filled.png'),

package/src/components/Modal/index.tsx

@@ -66,6 +66,7 @@ const Modal = ({
 
   return (
     <RNModal
+      statusBarTranslucent={statusBarTranslucent}
       transparent
       hardwareAccelerated
       visible={modalVisible}

package/src/index.ts

@@ -12,11 +12,11 @@ export { default as TextInput } from './components/TextInput';
 export { default as URLParsedText } from './components/URLParsedText';
 
 /** UI **/
-export { default as ActionMenu, ActionMenuItem } from './ui/ActionMenu';
+export { default as ActionMenu } from './ui/ActionMenu';
 export { default as Alert } from './ui/Alert';
 export { default as Avatar } from './ui/Avatar';
 export { default as Badge } from './ui/Badge';
-export { default as BottomSheet, BottomSheetItem } from './ui/BottomSheet';
+export { default as BottomSheet } from './ui/BottomSheet';
 export { default as Button } from './ui/Button';
 export { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';
 export { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';
@@ -34,9 +34,9 @@ export { default as Toast, useToast, ToastProvider } from './ui/Toast';
 export { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';
 export { default as createScaleFactor } from './styles/createScaleFactor';
 export { default as createStyleSheet } from './styles/createStyleSheet';
-export { default as createTypography, UIKitTypographyOverrides } from './styles/createTypography';
+export { default as createTypography } from './styles/createTypography';
 export { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';
-export { HeaderStyleContext, HeaderStyleProvider, HeaderStyleContextType } from './styles/HeaderStyleContext';
+export { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';
 export { default as useHeaderStyle } from './styles/useHeaderStyle';
 
 /** Theme **/
@@ -65,3 +65,7 @@ export type {
   Component,
   GetColorTree,
 } from './types';
+export type { ActionMenuItem } from './ui/ActionMenu';
+export type { BottomSheetItem } from './ui/BottomSheet';
+export type { UIKitTypographyOverrides } from './styles/createTypography';
+export type { HeaderStyleContextType } from './styles/HeaderStyleContext';

package/src/styles/HeaderStyleContext.tsx

@@ -2,22 +2,11 @@ import React from 'react';
 import { StatusBar, useWindowDimensions } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
-import type { BaseHeaderProps, HeaderElement } from '../types';
+import type { HeaderProps } from '../ui/Header';
 import getDefaultHeaderHeight from './getDefaultHeaderHeight';
 
 export type HeaderStyleContextType = {
-  HeaderComponent: (
-    props: BaseHeaderProps<
-      {
-        title?: HeaderElement;
-        left?: HeaderElement;
-        right?: HeaderElement;
-        onPressLeft?: () => void;
-        onPressRight?: () => void;
-      },
-      { clearTitleMargin?: boolean }
-    >,
-  ) => React.ReactElement | null;
+  HeaderComponent: (props: HeaderProps) => React.ReactElement | null;
   defaultTitleAlign: 'left' | 'center';
   statusBarTranslucent: boolean;
   topInset: number;

package/src/ui/ActionMenu/index.tsx

@@ -15,6 +15,7 @@ export type ActionMenuItem = {
   title?: string;
   menuItems: {
     title: string;
+    style?: 'destructive';
     onPress?: (() => Promise<void>) | (() => void);
     onError?: () => void;
   }[];
@@ -83,7 +84,15 @@ const ActionMenu = ({ visible, onHide, onError, onDismiss, title, menuItems }: P
                   }
                 }}
               >
-                <Text subtitle2 color={colors.ui.dialog.default.none.text} numberOfLines={1}>
+                <Text
+                  subtitle2
+                  color={
+                    item.style === 'destructive'
+                      ? colors.ui.dialog.default.none.destructive
+                      : colors.ui.dialog.default.none.text
+                  }
+                  numberOfLines={1}
+                >
                   {item.title}
                 </Text>
               </TouchableOpacity>

package/src/ui/Header/index.tsx

@@ -11,7 +11,7 @@ import useHeaderStyle from '../../styles/useHeaderStyle';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 
 type HeaderElement = string | React.ReactElement | null;
-type HeaderProps = BaseHeaderProps<
+export type HeaderProps = BaseHeaderProps<
   {
     title?: HeaderElement;
     left?: HeaderElement;
@@ -19,7 +19,10 @@ type HeaderProps = BaseHeaderProps<
     onPressLeft?: () => void;
     onPressRight?: () => void;
   },
-  { clearTitleMargin?: boolean }
+  {
+    clearTitleMargin?: boolean;
+    statusBarTopInsetAs?: 'padding' | 'margin';
+  }
 >;
 
 const AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;
@@ -36,8 +39,10 @@ const Header: ((props: HeaderProps) => JSX.Element) & {
   onPressLeft,
   onPressRight,
   clearTitleMargin = false,
+  statusBarTopInsetAs = 'padding',
 }) => {
   const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();
+
   const { colors } = useUIKitTheme();
   const { left: paddingLeft, right: paddingRight } = useSafeAreaInsets();
 
@@ -54,9 +59,9 @@ const Header: ((props: HeaderProps) => JSX.Element) & {
       style={[
         styles.container,
         {
+          [statusBarTopInsetAs === 'padding' ? 'paddingTop' : 'marginTop']: topInset,
           paddingLeft: paddingLeft + styles.container.paddingHorizontal,
           paddingRight: paddingRight + styles.container.paddingHorizontal,
-          paddingTop: topInset,
           backgroundColor: colors.ui.header.nav.none.background,
           borderBottomColor: colors.ui.header.nav.none.borderBottom,
         },

package/src/ui/MenuBar/index.tsx

@@ -14,6 +14,7 @@ export type MenuBarProps = {
 
   onPress: () => void;
   disabled?: boolean;
+  visible?: boolean;
 
   icon: keyof typeof Icon.Assets;
   iconColor?: string;
@@ -26,6 +27,7 @@ export type MenuBarProps = {
 const MenuBar = ({
   variant = 'default',
   disabled,
+  visible = true,
   onPress,
   name,
   icon,
@@ -36,6 +38,8 @@ const MenuBar = ({
 }: MenuBarProps) => {
   const { palette, colors } = useUIKitTheme();
 
+  if (!visible) return null;
+
   return (
     <View>
       <Pressable disabled={disabled} onPress={onPress} style={styles.container}>