@sendbird/uikit-react-native-foundation 1.1.1 → 2.0.0-rc.0

package/lib/commonjs/index.js

@@ -306,8 +306,22 @@ Object.defineProperty(exports, "useUIKitTheme", {
 
 var _icon = _interopRequireDefault(require("./assets/icon"));
 
+var _Divider = _interopRequireDefault(require("./components/Divider"));
+
+var _Icon = _interopRequireDefault(require("./components/Icon"));
+
 var _Image = _interopRequireDefault(require("./components/Image"));
 
+var _Modal = _interopRequireDefault(require("./components/Modal"));
+
+var _Switch = _interopRequireDefault(require("./components/Switch"));
+
+var _Text = _interopRequireDefault(require("./components/Text"));
+
+var _TextInput = _interopRequireDefault(require("./components/TextInput"));
+
+var _URLParsedText = _interopRequireDefault(require("./components/URLParsedText"));
+
 var _ActionMenu = _interopRequireWildcard(require("./ui/ActionMenu"));
 
 var _Alert = _interopRequireDefault(require("./ui/Alert"));
@@ -324,34 +338,20 @@ var _ChannelFrozenBanner = _interopRequireDefault(require("./ui/ChannelFrozenBan
 
 var _Dialog = require("./ui/Dialog");
 
-var _Divider = _interopRequireDefault(require("./ui/Divider"));
-
 var _GroupChannelPreview = _interopRequireDefault(require("./ui/GroupChannelPreview"));
 
 var _Header = _interopRequireDefault(require("./ui/Header"));
 
-var _Icon = _interopRequireDefault(require("./ui/Icon"));
-
 var _LoadingSpinner = _interopRequireDefault(require("./ui/LoadingSpinner"));
 
 var _MenuBar = _interopRequireWildcard(require("./ui/MenuBar"));
 
-var _Modal = _interopRequireDefault(require("./ui/Modal"));
-
 var _Placeholder = _interopRequireDefault(require("./ui/Placeholder"));
 
 var _Prompt = _interopRequireDefault(require("./ui/Prompt"));
 
-var _Switch = _interopRequireDefault(require("./ui/Switch"));
-
-var _Text = _interopRequireDefault(require("./ui/Text"));
-
-var _TextInput = _interopRequireDefault(require("./ui/TextInput"));
-
 var _Toast = _interopRequireWildcard(require("./ui/Toast"));
 
-var _URLParsedText = _interopRequireDefault(require("./ui/URLParsedText"));
-
 var _createSelectByColorScheme = _interopRequireDefault(require("./styles/createSelectByColorScheme"));
 
 var _createScaleFactor = _interopRequireDefault(require("./styles/createScaleFactor"));

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n/** Component **/\nexport { default as Image } from './components/Image';\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 Divider } from './ui/Divider';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as Icon } from './ui/Icon';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar, MenuBarProps } from './ui/MenuBar';\nexport { default as Modal } from './ui/Modal';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Switch } from './ui/Switch';\nexport { default as Text } from './ui/Text';\nexport { default as TextInput } from './ui/TextInput';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\nexport { default as URLParsedText } from './ui/URLParsedText';\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;;AAEA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;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, 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 Placeholder } from './ui/Placeholder';\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;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA"}

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

@@ -11,6 +11,10 @@ var _reactNative = require("react-native");
 
 var _uikitUtils = require("@sendbird/uikit-utils");
 
+var _Modal = _interopRequireDefault(require("../../components/Modal"));
+
+var _Text = _interopRequireDefault(require("../../components/Text"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useHeaderStyle = _interopRequireDefault(require("../../styles/useHeaderStyle"));
@@ -21,10 +25,6 @@ var _DialogBox = _interopRequireDefault(require("../Dialog/DialogBox"));
 
 var _LoadingSpinner = _interopRequireDefault(require("../LoadingSpinner"));
 
-var _Modal = _interopRequireDefault(require("../Modal"));
-
-var _Text = _interopRequireDefault(require("../Text"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

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 createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport DialogBox from '../Dialog/DialogBox';\nimport LoadingSpinner from '../LoadingSpinner';\nimport Modal from '../Modal';\nimport Text from '../Text';\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;;AACA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAiBA,MAAMA,UAAU,GAAG,QAAsE;EAAA,IAArE;IAAEC,OAAF;IAAWC,MAAX;IAAmBC,OAAnB;IAA4BC,SAA5B;IAAuCC,KAAvC;IAA8CC;EAA9C,CAAqE;EACvF,MAAM;IAAEC;EAAF,IAA2B,IAAAC,uBAAA,GAAjC;EACA,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;;EACA,MAAMC,OAAO,GAAG,MAAM;IACpB,IAAI,CAACH,OAAL,EAAcT,MAAM;EACrB,CAFD;;EAIA,oBACE,6BAAC,cAAD;IACE,OAAO,EAAEY,OADX;IAEE,SAAS,EAAEV,SAFb;IAGE,oBAAoB,EAAEG,oBAHxB;IAIE,OAAO,EAAEN,OAJX;IAKE,eAAe,EAAE;MAAEc,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EALnB,gBAOE,6BAAC,kBAAD,qBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEC,MAAM,CAACZ;EAApB,gBACE,6BAAC,aAAD;IACE,EAAE,MADJ;IAEE,KAAK,EAAEI,MAAM,CAACS,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC,IAFvC;IAGE,aAAa,EAAE,CAHjB,CAIE;IAJF;IAKE,KAAK,EAAE;MAAEC,QAAQ,EAAEZ,OAAO,GAAG,KAAH,GAAW;IAA9B;EALT,GAOGN,KAPH,CADF,EAUGM,OAAO,iBACN,6BAAC,uBAAD;IACE,IAAI,EAAE,EADR;IAEE,KAAK,EAAEF,MAAM,CAACS,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BG,SAFvC;IAGE,KAAK,EAAE;MAAEC,KAAK,EAAE,KAAT;MAAgBC,UAAU,EAAE;IAA5B;EAHT,EAXJ,CADF,eAmBE,6BAAC,iBAAD;IAAM,KAAK,EAAET,MAAM,CAACU;EAApB,GACGrB,SAAS,CAACsB,GAAV,CAAc,CAACC,IAAD,EAAOC,KAAP,KAAiB;IAC9B,oBACE,6BAAC,6BAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAED,IAAI,CAACxB,KAAL,GAAayB,KAFpB;MAGE,KAAK,EAAEb,MAAM,CAACc,MAHhB;MAIE,QAAQ,EAAEpB,OAJZ;MAKE,OAAO,EAAE,YAAY;QACnBC,UAAU,CAAC,IAAD,CAAV;;QACA,IAAI;UAAA;;UACF,wBAAMiB,IAAI,CAACG,OAAX,kDAAM,mBAAAH,IAAI,CAAV;QACD,CAFD,CAEE,OAAOI,CAAP,EAAmB;UACnB,MAAMC,YAAY,GAAG/B,OAAO,IAAI0B,IAAI,CAAC1B,OAArC;UACA+B,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAGD,CAAH,CAAZ;UACA,IAAI,CAACC,YAAL,EAAmBC,kBAAA,CAAOC,KAAP,CAAa,0BAAb,EAAyCH,CAAzC;QACpB,CAND,SAMU;UACR/B,MAAM;UACNU,UAAU,CAAC,KAAD,CAAV;QACD;MACF;IAjBH,gBAmBE,6BAAC,aAAD;MAAM,SAAS,MAAf;MAAgB,KAAK,EAAEH,MAAM,CAACS,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC,IAArD;MAA2D,aAAa,EAAE;IAA1E,GACGO,IAAI,CAACxB,KADR,CAnBF,CADF;EAyBD,CA1BA,CADH,CAnBF,CAPF,CADF;AA2DD,CAnED;;AAqEA,MAAMY,MAAM,GAAG,IAAAoB,yBAAA,EAAiB;EAC9BhC,KAAK,EAAE;IACLiC,aAAa,EAAE,KADV;IAELC,iBAAiB,EAAE,EAFd;IAGLC,eAAe,EAAE,EAHZ;IAILzB,UAAU,EAAE;EAJP,CADuB;EAO9BY,eAAe,EAAE;IACfc,SAAS,EAAE,CADI;IAEfC,YAAY,EAAE;EAFC,CAPa;EAW9BX,MAAM,EAAE;IACNQ,iBAAiB,EAAE,EADb;IAENC,eAAe,EAAE;EAFX;AAXsB,CAAjB,CAAf;eAiBexC,U"}
+{"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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"}

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

@@ -9,6 +9,10 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
+var _Modal = _interopRequireDefault(require("../../components/Modal"));
+
+var _Text = _interopRequireDefault(require("../../components/Text"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useHeaderStyle = _interopRequireDefault(require("../../styles/useHeaderStyle"));
@@ -19,10 +23,6 @@ var _Button = _interopRequireDefault(require("../Button"));
 
 var _DialogBox = _interopRequireDefault(require("../Dialog/DialogBox"));
 
-var _Modal = _interopRequireDefault(require("../Modal"));
-
-var _Text = _interopRequireDefault(require("../Text"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const Alert = _ref => {

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

@@ -1 +1 @@
-{"version":3,"names":["Alert","onDismiss","visible","onHide","title","message","buttons","text","statusBarTranslucent","useHeaderStyle","colors","useUIKitTheme","alignItems","justifyContent","styles","container","Boolean","titleContainer","ui","dialog","default","none","flex","messageContainer","buttonContainer","map","index","style","onPress","button","destructive","highlight","createStyleSheet","paddingTop","paddingBottom","paddingHorizontal","flexDirection","marginBottom","marginLeft","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertButton, View } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Button from '../Button';\nimport DialogBox from '../Dialog/DialogBox';\nimport Modal from '../Modal';\nimport Text from '../Text';\n\nexport type AlertItem = {\n  title?: string;\n  message?: string;\n  buttons?: AlertButton[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n} & AlertItem;\nconst Alert = ({ onDismiss, visible, onHide, title = '', message = '', buttons = [{ text: 'OK' }] }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\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 style={styles.container}>\n        {Boolean(title) && (\n          <View style={styles.titleContainer}>\n            <Text h1 color={colors.ui.dialog.default.none.text} numberOfLines={1} style={{ flex: 1 }}>\n              {title}\n            </Text>\n          </View>\n        )}\n\n        <View style={styles.messageContainer}>\n          {Boolean(message) && (\n            <Text\n              subtitle2={!title}\n              body3={Boolean(title)}\n              color={!title ? colors.ui.dialog.default.none.text : colors.ui.dialog.default.none.message}\n              numberOfLines={3}\n            >\n              {message}\n            </Text>\n          )}\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text = 'OK', style = 'default', onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                onPress={async () => {\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n                contentColor={\n                  style === 'destructive'\n                    ? colors.ui.dialog.default.none.destructive\n                    : colors.ui.dialog.default.none.highlight\n                }\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 20,\n  },\n  titleContainer: {\n    paddingBottom: 16,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  messageContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n});\n\nexport default Alert;\n"],"mappings":"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"}
+{"version":3,"names":["Alert","onDismiss","visible","onHide","title","message","buttons","text","statusBarTranslucent","useHeaderStyle","colors","useUIKitTheme","alignItems","justifyContent","styles","container","Boolean","titleContainer","ui","dialog","default","none","flex","messageContainer","buttonContainer","map","index","style","onPress","button","destructive","highlight","createStyleSheet","paddingTop","paddingBottom","paddingHorizontal","flexDirection","marginBottom","marginLeft","padding"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { AlertButton, View } from 'react-native';\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 Button from '../Button';\nimport DialogBox from '../Dialog/DialogBox';\n\nexport type AlertItem = {\n  title?: string;\n  message?: string;\n  buttons?: AlertButton[];\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n} & AlertItem;\nconst Alert = ({ onDismiss, visible, onHide, title = '', message = '', buttons = [{ text: 'OK' }] }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\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 style={styles.container}>\n        {Boolean(title) && (\n          <View style={styles.titleContainer}>\n            <Text h1 color={colors.ui.dialog.default.none.text} numberOfLines={1} style={{ flex: 1 }}>\n              {title}\n            </Text>\n          </View>\n        )}\n\n        <View style={styles.messageContainer}>\n          {Boolean(message) && (\n            <Text\n              subtitle2={!title}\n              body3={Boolean(title)}\n              color={!title ? colors.ui.dialog.default.none.text : colors.ui.dialog.default.none.message}\n              numberOfLines={3}\n            >\n              {message}\n            </Text>\n          )}\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text = 'OK', style = 'default', onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                onPress={async () => {\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n                contentColor={\n                  style === 'destructive'\n                    ? colors.ui.dialog.default.none.destructive\n                    : colors.ui.dialog.default.none.highlight\n                }\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 20,\n  },\n  titleContainer: {\n    paddingBottom: 16,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  messageContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n});\n\nexport default Alert;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAaA,MAAMA,KAAK,GAAG,QAAiG;EAAA,IAAhG;IAAEC,SAAF;IAAaC,OAAb;IAAsBC,MAAtB;IAA8BC,KAAK,GAAG,EAAtC;IAA0CC,OAAO,GAAG,EAApD;IAAwDC,OAAO,GAAG,CAAC;MAAEC,IAAI,EAAE;IAAR,CAAD;EAAlE,CAAgG;EAC7G,MAAM;IAAEC;EAAF,IAA2B,IAAAC,uBAAA,GAAjC;EACA,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EAEA,oBACE,6BAAC,cAAD;IACE,OAAO,EAAER,MADX;IAEE,SAAS,EAAEF,SAFb;IAGE,oBAAoB,EAAEO,oBAHxB;IAIE,OAAO,EAAEN,OAJX;IAKE,eAAe,EAAE;MAAEU,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EALnB,gBAOE,6BAAC,kBAAD;IAAW,KAAK,EAAEC,MAAM,CAACC;EAAzB,GACGC,OAAO,CAACZ,KAAD,CAAP,iBACC,6BAAC,iBAAD;IAAM,KAAK,EAAEU,MAAM,CAACG;EAApB,gBACE,6BAAC,aAAD;IAAM,EAAE,MAAR;IAAS,KAAK,EAAEP,MAAM,CAACQ,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8Bd,IAA9C;IAAoD,aAAa,EAAE,CAAnE;IAAsE,KAAK,EAAE;MAAEe,IAAI,EAAE;IAAR;EAA7E,GACGlB,KADH,CADF,CAFJ,eASE,6BAAC,iBAAD;IAAM,KAAK,EAAEU,MAAM,CAACS;EAApB,GACGP,OAAO,CAACX,OAAD,CAAP,iBACC,6BAAC,aAAD;IACE,SAAS,EAAE,CAACD,KADd;IAEE,KAAK,EAAEY,OAAO,CAACZ,KAAD,CAFhB;IAGE,KAAK,EAAE,CAACA,KAAD,GAASM,MAAM,CAACQ,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8Bd,IAAvC,GAA8CG,MAAM,CAACQ,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BhB,OAHrF;IAIE,aAAa,EAAE;EAJjB,GAMGA,OANH,CAFJ,CATF,eAsBE,6BAAC,iBAAD;IAAM,KAAK,EAAES,MAAM,CAACU;EAApB,GACGlB,OAAO,CAACmB,GAAR,CAAY,QAA8CC,KAA9C,KAAwD;IAAA,IAAvD;MAAEnB,IAAI,GAAG,IAAT;MAAeoB,KAAK,GAAG,SAAvB;MAAkCC;IAAlC,CAAuD;IACnE,oBACE,6BAAC,eAAD;MACE,GAAG,EAAErB,IAAI,GAAGmB,KADd;MAEE,OAAO,EAAE,MAFX;MAGE,KAAK,EAAEZ,MAAM,CAACe,MAHhB;MAIE,OAAO,EAAE,YAAY;QACnB,IAAI;UACFD,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO;QACR,CAFD,SAEU;UACRzB,MAAM;QACP;MACF,CAVH;MAWE,YAAY,EACVwB,KAAK,KAAK,aAAV,GACIjB,MAAM,CAACQ,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BS,WADlC,GAEIpB,MAAM,CAACQ,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BU;IAdtC,GAiBGxB,IAjBH,CADF;EAqBD,CAtBA,CADH,CAtBF,CAPF,CADF;AA0DD,CA9DD;;AAgEA,MAAMO,MAAM,GAAG,IAAAkB,yBAAA,EAAiB;EAC9BjB,SAAS,EAAE;IACTkB,UAAU,EAAE;EADH,CADmB;EAI9BhB,cAAc,EAAE;IACdiB,aAAa,EAAE,EADD;IAEdC,iBAAiB,EAAE,EAFL;IAGdC,aAAa,EAAE,KAHD;IAIdxB,UAAU,EAAE;EAJE,CAJc;EAU9BW,gBAAgB,EAAE;IAChBY,iBAAiB,EAAE,EADH;IAEhBE,YAAY,EAAE;EAFE,CAVY;EAc9BR,MAAM,EAAE;IACNS,UAAU,EAAE;EADN,CAdsB;EAiB9Bd,eAAe,EAAE;IACfY,aAAa,EAAE,KADA;IAEfxB,UAAU,EAAE,QAFG;IAGfC,cAAc,EAAE,UAHD;IAIf0B,OAAO,EAAE;EAJM;AAjBa,CAAjB,CAAf;eAyBevC,K"}

package/lib/commonjs/ui/Avatar/AvatarIcon.js

@@ -9,12 +9,12 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
+var _Icon = _interopRequireDefault(require("../../components/Icon"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
-var _Icon = _interopRequireDefault(require("../Icon"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const AvatarIcon = _ref => {

package/lib/commonjs/ui/Avatar/AvatarIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["AvatarIcon","size","icon","containerStyle","backgroundColor","colors","palette","useUIKitTheme","styles","container","width","height","borderRadius","background300","onBackgroundReverse01","createStyleSheet","overflow","alignItems","justifyContent"],"sources":["AvatarIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Icon from '../Icon';\n\ntype Props = {\n  icon: keyof typeof Icon.Assets;\n  size?: number;\n  backgroundColor?: string;\n  containerStyle?: StyleProp<ViewStyle>;\n};\nconst AvatarIcon = ({ size = 56, icon, containerStyle, backgroundColor }: Props) => {\n  const { colors, palette } = useUIKitTheme();\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          width: size,\n          height: size,\n          borderRadius: size / 2,\n          backgroundColor: backgroundColor ?? palette.background300,\n        },\n        containerStyle,\n      ]}\n    >\n      <Icon icon={icon} size={size / 2} color={colors.onBackgroundReverse01} />\n    </View>\n  );\n};\nconst styles = createStyleSheet({\n  container: {\n    overflow: 'hidden',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\nexport default AvatarIcon;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;AAQA,MAAMA,UAAU,GAAG,QAAiE;EAAA,IAAhE;IAAEC,IAAI,GAAG,EAAT;IAAaC,IAAb;IAAmBC,cAAnB;IAAmCC;EAAnC,CAAgE;EAClF,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsB,IAAAC,sBAAA,GAA5B;EACA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLC,MAAM,CAACC,SADF,EAEL;MACEC,KAAK,EAAET,IADT;MAEEU,MAAM,EAAEV,IAFV;MAGEW,YAAY,EAAEX,IAAI,GAAG,CAHvB;MAIEG,eAAe,EAAEA,eAAe,IAAIE,OAAO,CAACO;IAJ9C,CAFK,EAQLV,cARK;EADT,gBAYE,6BAAC,aAAD;IAAM,IAAI,EAAED,IAAZ;IAAkB,IAAI,EAAED,IAAI,GAAG,CAA/B;IAAkC,KAAK,EAAEI,MAAM,CAACS;EAAhD,EAZF,CADF;AAgBD,CAlBD;;AAmBA,MAAMN,MAAM,GAAG,IAAAO,yBAAA,EAAiB;EAC9BN,SAAS,EAAE;IACTO,QAAQ,EAAE,QADD;IAETC,UAAU,EAAE,QAFH;IAGTC,cAAc,EAAE;EAHP;AADmB,CAAjB,CAAf;eAOelB,U"}
+{"version":3,"names":["AvatarIcon","size","icon","containerStyle","backgroundColor","colors","palette","useUIKitTheme","styles","container","width","height","borderRadius","background300","onBackgroundReverse01","createStyleSheet","overflow","alignItems","justifyContent"],"sources":["AvatarIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Icon from '../../components/Icon';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = {\n  icon: keyof typeof Icon.Assets;\n  size?: number;\n  backgroundColor?: string;\n  containerStyle?: StyleProp<ViewStyle>;\n};\nconst AvatarIcon = ({ size = 56, icon, containerStyle, backgroundColor }: Props) => {\n  const { colors, palette } = useUIKitTheme();\n  return (\n    <View\n      style={[\n        styles.container,\n        {\n          width: size,\n          height: size,\n          borderRadius: size / 2,\n          backgroundColor: backgroundColor ?? palette.background300,\n        },\n        containerStyle,\n      ]}\n    >\n      <Icon icon={icon} size={size / 2} color={colors.onBackgroundReverse01} />\n    </View>\n  );\n};\nconst styles = createStyleSheet({\n  container: {\n    overflow: 'hidden',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\nexport default AvatarIcon;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;AAQA,MAAMA,UAAU,GAAG,QAAiE;EAAA,IAAhE;IAAEC,IAAI,GAAG,EAAT;IAAaC,IAAb;IAAmBC,cAAnB;IAAmCC;EAAnC,CAAgE;EAClF,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsB,IAAAC,sBAAA,GAA5B;EACA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLC,MAAM,CAACC,SADF,EAEL;MACEC,KAAK,EAAET,IADT;MAEEU,MAAM,EAAEV,IAFV;MAGEW,YAAY,EAAEX,IAAI,GAAG,CAHvB;MAIEG,eAAe,EAAEA,eAAe,IAAIE,OAAO,CAACO;IAJ9C,CAFK,EAQLV,cARK;EADT,gBAYE,6BAAC,aAAD;IAAM,IAAI,EAAED,IAAZ;IAAkB,IAAI,EAAED,IAAI,GAAG,CAA/B;IAAkC,KAAK,EAAEI,MAAM,CAACS;EAAhD,EAZF,CADF;AAgBD,CAlBD;;AAmBA,MAAMN,MAAM,GAAG,IAAAO,yBAAA,EAAiB;EAC9BN,SAAS,EAAE;IACTO,QAAQ,EAAE,QADD;IAETC,UAAU,EAAE,QAFH;IAGTC,cAAc,EAAE;EAHP;AADmB,CAAjB,CAAf;eAOelB,U"}

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

@@ -11,14 +11,14 @@ var _reactNative = require("react-native");
 
 var _uikitUtils = require("@sendbird/uikit-utils");
 
+var _Icon = _interopRequireDefault(require("../../components/Icon"));
+
 var _Image = _interopRequireDefault(require("../../components/Image"));
 
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
-var _Icon = _interopRequireDefault(require("../Icon"));
-
 var _AvatarGroup = _interopRequireDefault(require("./AvatarGroup"));
 
 var _AvatarIcon = _interopRequireDefault(require("./AvatarIcon"));

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

@@ -1 +1 @@
-{"version":3,"names":["Avatar","uri","square","muted","size","containerStyle","colors","palette","useUIKitTheme","loadFailure","setLoadFailure","useState","styles","container","width","height","borderRadius","backgroundColor","background300","conditionChaining","Boolean","StyleSheet","absoluteFill","onBackgroundReverse01","MutedOverlay","primary300","opacity","onBackgroundDark01","createStyleSheet","alignItems","justifyContent","overflow","Group","AvatarGroup","Icon","AvatarIcon"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Image from '../../components/Image';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Icon from '../Icon';\nimport AvatarGroup from './AvatarGroup';\nimport AvatarIcon from './AvatarIcon';\n\ntype SubComponents = {\n  Group: typeof AvatarGroup;\n  Icon: typeof AvatarIcon;\n};\ntype Props = {\n  uri?: string;\n  size?: number;\n  square?: boolean;\n  muted?: boolean;\n  containerStyle?: StyleProp<ViewStyle>;\n};\nconst Avatar: ((props: Props) => JSX.Element) & SubComponents = ({\n  uri,\n  square,\n  muted = false,\n  size = 56,\n  containerStyle,\n}) => {\n  const { colors, palette } = useUIKitTheme();\n  const [loadFailure, setLoadFailure] = useState(false);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        { width: size, height: size, borderRadius: square ? 0 : size / 2, backgroundColor: palette.background300 },\n        containerStyle,\n      ]}\n    >\n      {conditionChaining(\n        [Boolean(uri) && !loadFailure],\n        [\n          <Image\n            onError={() => setLoadFailure(true)}\n            source={{ uri }}\n            resizeMode={'cover'}\n            style={StyleSheet.absoluteFill}\n          />,\n          <Icon icon={'user'} size={size / 2} color={colors.onBackgroundReverse01} />,\n        ],\n      )}\n      {muted && <MutedOverlay size={size} />}\n    </View>\n  );\n};\n\nconst MutedOverlay = ({ size }: { size: number }) => {\n  const { palette } = useUIKitTheme();\n  return (\n    <View style={[styles.container, StyleSheet.absoluteFill]}>\n      <View style={[StyleSheet.absoluteFill, { backgroundColor: palette.primary300, opacity: 0.5 }]} />\n      <Icon color={palette.onBackgroundDark01} icon={'mute'} size={size * 0.72} />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    overflow: 'hidden',\n  },\n});\n\nAvatar.Group = AvatarGroup;\nAvatar.Icon = AvatarIcon;\nexport default Avatar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAaA,MAAMA,MAAuD,GAAG,QAM1D;EAAA,IAN2D;IAC/DC,GAD+D;IAE/DC,MAF+D;IAG/DC,KAAK,GAAG,KAHuD;IAI/DC,IAAI,GAAG,EAJwD;IAK/DC;EAL+D,CAM3D;EACJ,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsB,IAAAC,sBAAA,GAA5B;EACA,MAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,IAAAC,eAAA,EAAS,KAAT,CAAtC;EAEA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLC,MAAM,CAACC,SADF,EAEL;MAAEC,KAAK,EAAEV,IAAT;MAAeW,MAAM,EAAEX,IAAvB;MAA6BY,YAAY,EAAEd,MAAM,GAAG,CAAH,GAAOE,IAAI,GAAG,CAA/D;MAAkEa,eAAe,EAAEV,OAAO,CAACW;IAA3F,CAFK,EAGLb,cAHK;EADT,GAOG,IAAAc,6BAAA,EACC,CAACC,OAAO,CAACnB,GAAD,CAAP,IAAgB,CAACQ,WAAlB,CADD,EAEC,cACE,6BAAC,cAAD;IACE,OAAO,EAAE,MAAMC,cAAc,CAAC,IAAD,CAD/B;IAEE,MAAM,EAAE;MAAET;IAAF,CAFV;IAGE,UAAU,EAAE,OAHd;IAIE,KAAK,EAAEoB,uBAAA,CAAWC;EAJpB,EADF,eAOE,6BAAC,aAAD;IAAM,IAAI,EAAE,MAAZ;IAAoB,IAAI,EAAElB,IAAI,GAAG,CAAjC;IAAoC,KAAK,EAAEE,MAAM,CAACiB;EAAlD,EAPF,CAFD,CAPH,EAmBGpB,KAAK,iBAAI,6BAAC,YAAD;IAAc,IAAI,EAAEC;EAApB,EAnBZ,CADF;AAuBD,CAjCD;;AAmCA,MAAMoB,YAAY,GAAG,SAAgC;EAAA,IAA/B;IAAEpB;EAAF,CAA+B;EACnD,MAAM;IAAEG;EAAF,IAAc,IAAAC,sBAAA,GAApB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBQ,uBAAA,CAAWC,YAA9B;EAAb,gBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACD,uBAAA,CAAWC,YAAZ,EAA0B;MAAEL,eAAe,EAAEV,OAAO,CAACkB,UAA3B;MAAuCC,OAAO,EAAE;IAAhD,CAA1B;EAAb,EADF,eAEE,6BAAC,aAAD;IAAM,KAAK,EAAEnB,OAAO,CAACoB,kBAArB;IAAyC,IAAI,EAAE,MAA/C;IAAuD,IAAI,EAAEvB,IAAI,GAAG;EAApE,EAFF,CADF;AAMD,CARD;;AAUA,MAAMQ,MAAM,GAAG,IAAAgB,yBAAA,EAAiB;EAC9Bf,SAAS,EAAE;IACTgB,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,QAAQ,EAAE;EAHD;AADmB,CAAjB,CAAf;AAQA/B,MAAM,CAACgC,KAAP,GAAeC,oBAAf;AACAjC,MAAM,CAACkC,IAAP,GAAcC,mBAAd;eACenC,M"}
+{"version":3,"names":["Avatar","uri","square","muted","size","containerStyle","colors","palette","useUIKitTheme","loadFailure","setLoadFailure","useState","styles","container","width","height","borderRadius","backgroundColor","background300","conditionChaining","Boolean","StyleSheet","absoluteFill","onBackgroundReverse01","MutedOverlay","primary300","opacity","onBackgroundDark01","createStyleSheet","alignItems","justifyContent","overflow","Group","AvatarGroup","Icon","AvatarIcon"],"sources":["index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Icon from '../../components/Icon';\nimport Image from '../../components/Image';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport AvatarGroup from './AvatarGroup';\nimport AvatarIcon from './AvatarIcon';\n\ntype SubComponents = {\n  Group: typeof AvatarGroup;\n  Icon: typeof AvatarIcon;\n};\ntype Props = {\n  uri?: string;\n  size?: number;\n  square?: boolean;\n  muted?: boolean;\n  containerStyle?: StyleProp<ViewStyle>;\n};\nconst Avatar: ((props: Props) => JSX.Element) & SubComponents = ({\n  uri,\n  square,\n  muted = false,\n  size = 56,\n  containerStyle,\n}) => {\n  const { colors, palette } = useUIKitTheme();\n  const [loadFailure, setLoadFailure] = useState(false);\n\n  return (\n    <View\n      style={[\n        styles.container,\n        { width: size, height: size, borderRadius: square ? 0 : size / 2, backgroundColor: palette.background300 },\n        containerStyle,\n      ]}\n    >\n      {conditionChaining(\n        [Boolean(uri) && !loadFailure],\n        [\n          <Image\n            onError={() => setLoadFailure(true)}\n            source={{ uri }}\n            resizeMode={'cover'}\n            style={StyleSheet.absoluteFill}\n          />,\n          <Icon icon={'user'} size={size / 2} color={colors.onBackgroundReverse01} />,\n        ],\n      )}\n      {muted && <MutedOverlay size={size} />}\n    </View>\n  );\n};\n\nconst MutedOverlay = ({ size }: { size: number }) => {\n  const { palette } = useUIKitTheme();\n  return (\n    <View style={[styles.container, StyleSheet.absoluteFill]}>\n      <View style={[StyleSheet.absoluteFill, { backgroundColor: palette.primary300, opacity: 0.5 }]} />\n      <Icon color={palette.onBackgroundDark01} icon={'mute'} size={size * 0.72} />\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    overflow: 'hidden',\n  },\n});\n\nAvatar.Group = AvatarGroup;\nAvatar.Icon = AvatarIcon;\nexport default Avatar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAaA,MAAMA,MAAuD,GAAG,QAM1D;EAAA,IAN2D;IAC/DC,GAD+D;IAE/DC,MAF+D;IAG/DC,KAAK,GAAG,KAHuD;IAI/DC,IAAI,GAAG,EAJwD;IAK/DC;EAL+D,CAM3D;EACJ,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsB,IAAAC,sBAAA,GAA5B;EACA,MAAM,CAACC,WAAD,EAAcC,cAAd,IAAgC,IAAAC,eAAA,EAAS,KAAT,CAAtC;EAEA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLC,MAAM,CAACC,SADF,EAEL;MAAEC,KAAK,EAAEV,IAAT;MAAeW,MAAM,EAAEX,IAAvB;MAA6BY,YAAY,EAAEd,MAAM,GAAG,CAAH,GAAOE,IAAI,GAAG,CAA/D;MAAkEa,eAAe,EAAEV,OAAO,CAACW;IAA3F,CAFK,EAGLb,cAHK;EADT,GAOG,IAAAc,6BAAA,EACC,CAACC,OAAO,CAACnB,GAAD,CAAP,IAAgB,CAACQ,WAAlB,CADD,EAEC,cACE,6BAAC,cAAD;IACE,OAAO,EAAE,MAAMC,cAAc,CAAC,IAAD,CAD/B;IAEE,MAAM,EAAE;MAAET;IAAF,CAFV;IAGE,UAAU,EAAE,OAHd;IAIE,KAAK,EAAEoB,uBAAA,CAAWC;EAJpB,EADF,eAOE,6BAAC,aAAD;IAAM,IAAI,EAAE,MAAZ;IAAoB,IAAI,EAAElB,IAAI,GAAG,CAAjC;IAAoC,KAAK,EAAEE,MAAM,CAACiB;EAAlD,EAPF,CAFD,CAPH,EAmBGpB,KAAK,iBAAI,6BAAC,YAAD;IAAc,IAAI,EAAEC;EAApB,EAnBZ,CADF;AAuBD,CAjCD;;AAmCA,MAAMoB,YAAY,GAAG,SAAgC;EAAA,IAA/B;IAAEpB;EAAF,CAA+B;EACnD,MAAM;IAAEG;EAAF,IAAc,IAAAC,sBAAA,GAApB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACI,MAAM,CAACC,SAAR,EAAmBQ,uBAAA,CAAWC,YAA9B;EAAb,gBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACD,uBAAA,CAAWC,YAAZ,EAA0B;MAAEL,eAAe,EAAEV,OAAO,CAACkB,UAA3B;MAAuCC,OAAO,EAAE;IAAhD,CAA1B;EAAb,EADF,eAEE,6BAAC,aAAD;IAAM,KAAK,EAAEnB,OAAO,CAACoB,kBAArB;IAAyC,IAAI,EAAE,MAA/C;IAAuD,IAAI,EAAEvB,IAAI,GAAG;EAApE,EAFF,CADF;AAMD,CARD;;AAUA,MAAMQ,MAAM,GAAG,IAAAgB,yBAAA,EAAiB;EAC9Bf,SAAS,EAAE;IACTgB,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,QAAQ,EAAE;EAHD;AADmB,CAAjB,CAAf;AAQA/B,MAAM,CAACgC,KAAP,GAAeC,oBAAf;AACAjC,MAAM,CAACkC,IAAP,GAAcC,mBAAd;eACenC,M"}

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

@@ -11,12 +11,12 @@ var _reactNative = require("react-native");
 
 var _uikitUtils = require("@sendbird/uikit-utils");
 
+var _Text = _interopRequireDefault(require("../../components/Text"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
-var _Text = _interopRequireDefault(require("../Text"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const Badge = _ref => {

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

@@ -1 +1 @@
-{"version":3,"names":["Badge","count","maxCount","badgeColor","textColor","style","size","colors","useUIKitTheme","isSmall","styles","badgeSmall","badgeDefault","backgroundColor","ui","badge","default","none","background","badgeSmallPadding","badgeDefaultPadding","text","truncatedBadgeCount","createStyleSheet","paddingTop","Platform","select","ios","android","minWidth","minHeight","borderRadius","alignItems","justifyContent","paddingHorizontal"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, StyleProp, View, ViewStyle } from 'react-native';\n\nimport { truncatedBadgeCount } from '@sendbird/uikit-utils';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Text from '../Text';\n\ntype Props = {\n  count: number;\n  maxCount?: number;\n  badgeColor?: string;\n  textColor?: string;\n  style?: StyleProp<ViewStyle>;\n  size?: 'small' | 'default';\n};\n\nconst Badge = ({ count, maxCount, badgeColor, textColor, style, size = 'default' }: Props) => {\n  const { colors } = useUIKitTheme();\n  const isSmall = size === 'small';\n  return (\n    <View\n      style={[\n        isSmall ? styles.badgeSmall : styles.badgeDefault,\n        { backgroundColor: badgeColor ?? colors.ui.badge.default.none.background },\n        count >= 10 && (isSmall ? styles.badgeSmallPadding : styles.badgeDefaultPadding),\n        style,\n      ]}\n    >\n      <Text caption1 color={textColor ?? colors.ui.badge.default.none.text}>\n        {truncatedBadgeCount(count, maxCount)}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  badgeDefault: {\n    paddingTop: Platform.select({ ios: 2, android: 2 }),\n    minWidth: 20,\n    minHeight: 20,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  badgeDefaultPadding: {\n    paddingHorizontal: 8,\n  },\n  badgeSmall: {\n    paddingTop: Platform.select({ ios: 3, android: 2 }),\n    minWidth: 16,\n    minHeight: 16,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  badgeSmallPadding: {\n    paddingHorizontal: 4,\n  },\n});\n\nexport default Badge;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;;;AAWA,MAAMA,KAAK,GAAG,QAAgF;EAAA,IAA/E;IAAEC,KAAF;IAASC,QAAT;IAAmBC,UAAnB;IAA+BC,SAA/B;IAA0CC,KAA1C;IAAiDC,IAAI,GAAG;EAAxD,CAA+E;EAC5F,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,MAAMC,OAAO,GAAGH,IAAI,KAAK,OAAzB;EACA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLG,OAAO,GAAGC,MAAM,CAACC,UAAV,GAAuBD,MAAM,CAACE,YADhC,EAEL;MAAEC,eAAe,EAAEV,UAAU,IAAII,MAAM,CAACO,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BC;IAA9D,CAFK,EAGLjB,KAAK,IAAI,EAAT,KAAgBQ,OAAO,GAAGC,MAAM,CAACS,iBAAV,GAA8BT,MAAM,CAACU,mBAA5D,CAHK,EAILf,KAJK;EADT,gBAQE,6BAAC,aAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIG,MAAM,CAACO,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BI;EAAhE,GACG,IAAAC,+BAAA,EAAoBrB,KAApB,EAA2BC,QAA3B,CADH,CARF,CADF;AAcD,CAjBD;;AAmBA,MAAMQ,MAAM,GAAG,IAAAa,yBAAA,EAAiB;EAC9BX,YAAY,EAAE;IACZY,UAAU,EAAEC,qBAAA,CAASC,MAAT,CAAgB;MAAEC,GAAG,EAAE,CAAP;MAAUC,OAAO,EAAE;IAAnB,CAAhB,CADA;IAEZC,QAAQ,EAAE,EAFE;IAGZC,SAAS,EAAE,EAHC;IAIZC,YAAY,EAAE,EAJF;IAKZC,UAAU,EAAE,QALA;IAMZC,cAAc,EAAE;EANJ,CADgB;EAS9Bb,mBAAmB,EAAE;IACnBc,iBAAiB,EAAE;EADA,CATS;EAY9BvB,UAAU,EAAE;IACVa,UAAU,EAAEC,qBAAA,CAASC,MAAT,CAAgB;MAAEC,GAAG,EAAE,CAAP;MAAUC,OAAO,EAAE;IAAnB,CAAhB,CADF;IAEVC,QAAQ,EAAE,EAFA;IAGVC,SAAS,EAAE,EAHD;IAIVC,YAAY,EAAE,EAJJ;IAKVC,UAAU,EAAE,QALF;IAMVC,cAAc,EAAE;EANN,CAZkB;EAoB9Bd,iBAAiB,EAAE;IACjBe,iBAAiB,EAAE;EADF;AApBW,CAAjB,CAAf;eAyBelC,K"}
+{"version":3,"names":["Badge","count","maxCount","badgeColor","textColor","style","size","colors","useUIKitTheme","isSmall","styles","badgeSmall","badgeDefault","backgroundColor","ui","badge","default","none","background","badgeSmallPadding","badgeDefaultPadding","text","truncatedBadgeCount","createStyleSheet","paddingTop","Platform","select","ios","android","minWidth","minHeight","borderRadius","alignItems","justifyContent","paddingHorizontal"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, StyleProp, View, ViewStyle } from 'react-native';\n\nimport { truncatedBadgeCount } from '@sendbird/uikit-utils';\n\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = {\n  count: number;\n  maxCount?: number;\n  badgeColor?: string;\n  textColor?: string;\n  style?: StyleProp<ViewStyle>;\n  size?: 'small' | 'default';\n};\n\nconst Badge = ({ count, maxCount, badgeColor, textColor, style, size = 'default' }: Props) => {\n  const { colors } = useUIKitTheme();\n  const isSmall = size === 'small';\n  return (\n    <View\n      style={[\n        isSmall ? styles.badgeSmall : styles.badgeDefault,\n        { backgroundColor: badgeColor ?? colors.ui.badge.default.none.background },\n        count >= 10 && (isSmall ? styles.badgeSmallPadding : styles.badgeDefaultPadding),\n        style,\n      ]}\n    >\n      <Text caption1 color={textColor ?? colors.ui.badge.default.none.text}>\n        {truncatedBadgeCount(count, maxCount)}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  badgeDefault: {\n    paddingTop: Platform.select({ ios: 2, android: 2 }),\n    minWidth: 20,\n    minHeight: 20,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  badgeDefaultPadding: {\n    paddingHorizontal: 8,\n  },\n  badgeSmall: {\n    paddingTop: Platform.select({ ios: 3, android: 2 }),\n    minWidth: 16,\n    minHeight: 16,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  badgeSmallPadding: {\n    paddingHorizontal: 4,\n  },\n});\n\nexport default Badge;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;;;AAWA,MAAMA,KAAK,GAAG,QAAgF;EAAA,IAA/E;IAAEC,KAAF;IAASC,QAAT;IAAmBC,UAAnB;IAA+BC,SAA/B;IAA0CC,KAA1C;IAAiDC,IAAI,GAAG;EAAxD,CAA+E;EAC5F,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,MAAMC,OAAO,GAAGH,IAAI,KAAK,OAAzB;EACA,oBACE,6BAAC,iBAAD;IACE,KAAK,EAAE,CACLG,OAAO,GAAGC,MAAM,CAACC,UAAV,GAAuBD,MAAM,CAACE,YADhC,EAEL;MAAEC,eAAe,EAAEV,UAAU,IAAII,MAAM,CAACO,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BC;IAA9D,CAFK,EAGLjB,KAAK,IAAI,EAAT,KAAgBQ,OAAO,GAAGC,MAAM,CAACS,iBAAV,GAA8BT,MAAM,CAACU,mBAA5D,CAHK,EAILf,KAJK;EADT,gBAQE,6BAAC,aAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIG,MAAM,CAACO,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BI;EAAhE,GACG,IAAAC,+BAAA,EAAoBrB,KAApB,EAA2BC,QAA3B,CADH,CARF,CADF;AAcD,CAjBD;;AAmBA,MAAMQ,MAAM,GAAG,IAAAa,yBAAA,EAAiB;EAC9BX,YAAY,EAAE;IACZY,UAAU,EAAEC,qBAAA,CAASC,MAAT,CAAgB;MAAEC,GAAG,EAAE,CAAP;MAAUC,OAAO,EAAE;IAAnB,CAAhB,CADA;IAEZC,QAAQ,EAAE,EAFE;IAGZC,SAAS,EAAE,EAHC;IAIZC,YAAY,EAAE,EAJF;IAKZC,UAAU,EAAE,QALA;IAMZC,cAAc,EAAE;EANJ,CADgB;EAS9Bb,mBAAmB,EAAE;IACnBc,iBAAiB,EAAE;EADA,CATS;EAY9BvB,UAAU,EAAE;IACVa,UAAU,EAAEC,qBAAA,CAASC,MAAT,CAAgB;MAAEC,GAAG,EAAE,CAAP;MAAUC,OAAO,EAAE;IAAnB,CAAhB,CADF;IAEVC,QAAQ,EAAE,EAFA;IAGVC,SAAS,EAAE,EAHD;IAIVC,YAAY,EAAE,EAJJ;IAKVC,UAAU,EAAE,QALF;IAMVC,cAAc,EAAE;EANN,CAZkB;EAoB9Bd,iBAAiB,EAAE;IACjBe,iBAAiB,EAAE;EADF;AApBW,CAAjB,CAAf;eAyBelC,K"}

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

@@ -11,12 +11,12 @@ var _reactNative = require("react-native");
 
 var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
 
+var _Modal = _interopRequireDefault(require("../../components/Modal"));
+
 var _useHeaderStyle = _interopRequireDefault(require("../../styles/useHeaderStyle"));
 
 var _DialogSheet = _interopRequireDefault(require("../Dialog/DialogSheet"));
 
-var _Modal = _interopRequireDefault(require("../Modal"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const BottomSheet = _ref => {

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

@@ -1 +1 @@
-{"version":3,"names":["BottomSheet","onDismiss","onHide","visible","sheetItems","statusBarTranslucent","useHeaderStyle","width","useWindowDimensions","bottom","left","right","useSafeAreaInsets","alignItems","justifyContent","paddingBottom","map","idx","onPress","props","title","paddingLeft","paddingRight"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport DialogSheet from '../Dialog/DialogSheet';\nimport type Icon from '../Icon';\nimport Modal from '../Modal';\n\nexport type BottomSheetItem = {\n  sheetItems: {\n    icon?: keyof typeof Icon.Assets;\n    iconColor?: string;\n    title: string;\n    titleColor?: string;\n    onPress: () => void;\n  }[];\n};\ntype Props = {\n  visible: boolean;\n  onHide: () => Promise<void>;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & BottomSheetItem;\nconst BottomSheet = ({ onDismiss, onHide, visible, sheetItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { width } = useWindowDimensions();\n  const { bottom, left, right } = useSafeAreaInsets();\n  return (\n    <Modal\n      type={'slide'}\n      onClose={onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'flex-end' }}\n    >\n      <DialogSheet style={{ width, paddingBottom: bottom }}>\n        {sheetItems.map(({ onPress, ...props }, idx) => (\n          <TouchableOpacity\n            activeOpacity={0.75}\n            key={props.title + idx}\n            style={{ paddingLeft: left, paddingRight: right }}\n            onPress={async () => {\n              await onHide();\n              try {\n                onPress();\n              } catch {}\n            }}\n          >\n            <DialogSheet.Item {...props} />\n          </TouchableOpacity>\n        ))}\n      </DialogSheet>\n    </Modal>\n  );\n};\n\nexport default BottomSheet;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AAEA;;;;AAiBA,MAAMA,WAAW,GAAG,QAAuD;EAAA,IAAtD;IAAEC,SAAF;IAAaC,MAAb;IAAqBC,OAArB;IAA8BC;EAA9B,CAAsD;EACzE,MAAM;IAAEC;EAAF,IAA2B,IAAAC,uBAAA,GAAjC;EACA,MAAM;IAAEC;EAAF,IAAY,IAAAC,gCAAA,GAAlB;EACA,MAAM;IAAEC,MAAF;IAAUC,IAAV;IAAgBC;EAAhB,IAA0B,IAAAC,6CAAA,GAAhC;EACA,oBACE,6BAAC,cAAD;IACE,IAAI,EAAE,OADR;IAEE,OAAO,EAAEV,MAFX;IAGE,SAAS,EAAED,SAHb;IAIE,oBAAoB,EAAEI,oBAJxB;IAKE,OAAO,EAAEF,OALX;IAME,eAAe,EAAE;MAAEU,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EANnB,gBAQE,6BAAC,oBAAD;IAAa,KAAK,EAAE;MAAEP,KAAF;MAASQ,aAAa,EAAEN;IAAxB;EAApB,GACGL,UAAU,CAACY,GAAX,CAAe,QAAwBC,GAAxB;IAAA,IAAC;MAAEC,OAAF;MAAW,GAAGC;IAAd,CAAD;IAAA,oBACd,6BAAC,6BAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAEA,KAAK,CAACC,KAAN,GAAcH,GAFrB;MAGE,KAAK,EAAE;QAAEI,WAAW,EAAEX,IAAf;QAAqBY,YAAY,EAAEX;MAAnC,CAHT;MAIE,OAAO,EAAE,YAAY;QACnB,MAAMT,MAAM,EAAZ;;QACA,IAAI;UACFgB,OAAO;QACR,CAFD,CAEE,MAAM,CAAE;MACX;IATH,gBAWE,6BAAC,oBAAD,CAAa,IAAb,EAAsBC,KAAtB,CAXF,CADc;EAAA,CAAf,CADH,CARF,CADF;AA4BD,CAhCD;;eAkCenB,W"}
+{"version":3,"names":["BottomSheet","onDismiss","onHide","visible","sheetItems","statusBarTranslucent","useHeaderStyle","width","useWindowDimensions","bottom","left","right","useSafeAreaInsets","alignItems","justifyContent","paddingBottom","map","idx","onPress","props","title","paddingLeft","paddingRight"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TouchableOpacity, useWindowDimensions } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport type Icon from '../../components/Icon';\nimport Modal from '../../components/Modal';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport DialogSheet from '../Dialog/DialogSheet';\n\nexport type BottomSheetItem = {\n  sheetItems: {\n    icon?: keyof typeof Icon.Assets;\n    iconColor?: string;\n    title: string;\n    titleColor?: string;\n    onPress: () => void;\n  }[];\n};\ntype Props = {\n  visible: boolean;\n  onHide: () => Promise<void>;\n  onError?: (error: unknown) => void;\n  onDismiss?: () => void;\n} & BottomSheetItem;\nconst BottomSheet = ({ onDismiss, onHide, visible, sheetItems }: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { width } = useWindowDimensions();\n  const { bottom, left, right } = useSafeAreaInsets();\n  return (\n    <Modal\n      type={'slide'}\n      onClose={onHide}\n      onDismiss={onDismiss}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'flex-end' }}\n    >\n      <DialogSheet style={{ width, paddingBottom: bottom }}>\n        {sheetItems.map(({ onPress, ...props }, idx) => (\n          <TouchableOpacity\n            activeOpacity={0.75}\n            key={props.title + idx}\n            style={{ paddingLeft: left, paddingRight: right }}\n            onPress={async () => {\n              await onHide();\n              try {\n                onPress();\n              } catch {}\n            }}\n          >\n            <DialogSheet.Item {...props} />\n          </TouchableOpacity>\n        ))}\n      </DialogSheet>\n    </Modal>\n  );\n};\n\nexport default BottomSheet;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA;;AACA;;AACA;;;;AAiBA,MAAMA,WAAW,GAAG,QAAuD;EAAA,IAAtD;IAAEC,SAAF;IAAaC,MAAb;IAAqBC,OAArB;IAA8BC;EAA9B,CAAsD;EACzE,MAAM;IAAEC;EAAF,IAA2B,IAAAC,uBAAA,GAAjC;EACA,MAAM;IAAEC;EAAF,IAAY,IAAAC,gCAAA,GAAlB;EACA,MAAM;IAAEC,MAAF;IAAUC,IAAV;IAAgBC;EAAhB,IAA0B,IAAAC,6CAAA,GAAhC;EACA,oBACE,6BAAC,cAAD;IACE,IAAI,EAAE,OADR;IAEE,OAAO,EAAEV,MAFX;IAGE,SAAS,EAAED,SAHb;IAIE,oBAAoB,EAAEI,oBAJxB;IAKE,OAAO,EAAEF,OALX;IAME,eAAe,EAAE;MAAEU,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EANnB,gBAQE,6BAAC,oBAAD;IAAa,KAAK,EAAE;MAAEP,KAAF;MAASQ,aAAa,EAAEN;IAAxB;EAApB,GACGL,UAAU,CAACY,GAAX,CAAe,QAAwBC,GAAxB;IAAA,IAAC;MAAEC,OAAF;MAAW,GAAGC;IAAd,CAAD;IAAA,oBACd,6BAAC,6BAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAEA,KAAK,CAACC,KAAN,GAAcH,GAFrB;MAGE,KAAK,EAAE;QAAEI,WAAW,EAAEX,IAAf;QAAqBY,YAAY,EAAEX;MAAnC,CAHT;MAIE,OAAO,EAAE,YAAY;QACnB,MAAMT,MAAM,EAAZ;;QACA,IAAI;UACFgB,OAAO;QACR,CAFD,CAEE,MAAM,CAAE;MACX;IATH,gBAWE,6BAAC,oBAAD,CAAa,IAAb,EAAsBC,KAAtB,CAXF,CADc;EAAA,CAAf,CADH,CARF,CADF;AA4BD,CAhCD;;eAkCenB,W"}

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

@@ -9,13 +9,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
-var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _Icon = _interopRequireDefault(require("../../components/Icon"));
 
-var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
 
-var _Icon = _interopRequireDefault(require("../Icon"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
-var _Text = _interopRequireDefault(require("../Text"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 

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

@@ -1 +1 @@
-{"version":3,"names":["Button","icon","variant","buttonColor","contentColor","disabled","onPress","style","children","colors","useUIKitTheme","getStateColor","pressed","stateColors","ui","button","enabled","stateColor","backgroundColor","background","styles","container","content","text","createStyleSheet","flexDirection","padding","borderRadius","alignItems","justifyContent","marginVertical","marginRight"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, StyleProp, ViewStyle } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Icon from '../Icon';\nimport Text from '../Text';\n\ntype Props = React.PropsWithChildren<{\n  style?: StyleProp<ViewStyle>;\n  icon?: keyof typeof Icon.Assets;\n  variant?: 'contained' | 'text';\n  disabled?: boolean;\n  onPress?: () => void;\n  buttonColor?: string;\n  contentColor?: string;\n}>;\nconst Button = ({\n  icon,\n  variant = 'contained',\n  buttonColor,\n  contentColor,\n  disabled,\n  onPress,\n  style,\n  children,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n\n  const getStateColor = (pressed: boolean, disabled?: boolean) => {\n    const stateColors = colors.ui.button[variant];\n    if (disabled) return stateColors.disabled;\n    if (pressed) return stateColors.pressed;\n    return stateColors.enabled;\n  };\n\n  return (\n    <Pressable\n      disabled={disabled}\n      onPress={onPress}\n      style={({ pressed }) => {\n        const stateColor = getStateColor(pressed, disabled);\n        return [{ backgroundColor: buttonColor ?? stateColor.background }, styles.container, style];\n      }}\n    >\n      {({ pressed }) => {\n        const stateColor = getStateColor(pressed, disabled);\n\n        return (\n          <>\n            {icon && (\n              <Icon size={24} icon={icon} color={contentColor ?? stateColor.content} containerStyle={styles.icon} />\n            )}\n            <Text button color={contentColor ?? stateColor.content} style={styles.text}>\n              {children}\n            </Text>\n          </>\n        );\n      }}\n    </Pressable>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    flexDirection: 'row',\n    padding: 8,\n    borderRadius: 4,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  icon: { marginVertical: -4, marginRight: 8 },\n  text: {},\n});\n\nexport default Button;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAWA,MAAMA,MAAM,GAAG,QASF;EAAA,IATG;IACdC,IADc;IAEdC,OAAO,GAAG,WAFI;IAGdC,WAHc;IAIdC,YAJc;IAKdC,QALc;IAMdC,OANc;IAOdC,KAPc;IAQdC;EARc,CASH;EACX,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;;EAEA,MAAMC,aAAa,GAAG,CAACC,OAAD,EAAmBP,QAAnB,KAA0C;IAC9D,MAAMQ,WAAW,GAAGJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBb,OAAjB,CAApB;IACA,IAAIG,QAAJ,EAAc,OAAOQ,WAAW,CAACR,QAAnB;IACd,IAAIO,OAAJ,EAAa,OAAOC,WAAW,CAACD,OAAnB;IACb,OAAOC,WAAW,CAACG,OAAnB;EACD,CALD;;EAOA,oBACE,6BAAC,sBAAD;IACE,QAAQ,EAAEX,QADZ;IAEE,OAAO,EAAEC,OAFX;IAGE,KAAK,EAAE,SAAiB;MAAA,IAAhB;QAAEM;MAAF,CAAgB;MACtB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUP,QAAV,CAAhC;MACA,OAAO,CAAC;QAAEa,eAAe,EAAEf,WAAW,IAAIc,UAAU,CAACE;MAA7C,CAAD,EAA4DC,MAAM,CAACC,SAAnE,EAA8Ed,KAA9E,CAAP;IACD;EANH,GAQG,SAAiB;IAAA,IAAhB;MAAEK;IAAF,CAAgB;IAChB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUP,QAAV,CAAhC;IAEA,oBACE,4DACGJ,IAAI,iBACH,6BAAC,aAAD;MAAM,IAAI,EAAE,EAAZ;MAAgB,IAAI,EAAEA,IAAtB;MAA4B,KAAK,EAAEG,YAAY,IAAIa,UAAU,CAACK,OAA9D;MAAuE,cAAc,EAAEF,MAAM,CAACnB;IAA9F,EAFJ,eAIE,6BAAC,aAAD;MAAM,MAAM,MAAZ;MAAa,KAAK,EAAEG,YAAY,IAAIa,UAAU,CAACK,OAA/C;MAAwD,KAAK,EAAEF,MAAM,CAACG;IAAtE,GACGf,QADH,CAJF,CADF;EAUD,CArBH,CADF;AAyBD,CA5CD;;AA8CA,MAAMY,MAAM,GAAG,IAAAI,yBAAA,EAAiB;EAC9BH,SAAS,EAAE;IACTI,aAAa,EAAE,KADN;IAETC,OAAO,EAAE,CAFA;IAGTC,YAAY,EAAE,CAHL;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE;EALP,CADmB;EAQ9B5B,IAAI,EAAE;IAAE6B,cAAc,EAAE,CAAC,CAAnB;IAAsBC,WAAW,EAAE;EAAnC,CARwB;EAS9BR,IAAI,EAAE;AATwB,CAAjB,CAAf;eAYevB,M"}
+{"version":3,"names":["Button","icon","variant","buttonColor","contentColor","disabled","onPress","style","children","colors","useUIKitTheme","getStateColor","pressed","stateColors","ui","button","enabled","stateColor","backgroundColor","background","styles","container","content","text","createStyleSheet","flexDirection","padding","borderRadius","alignItems","justifyContent","marginVertical","marginRight"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, StyleProp, ViewStyle } from 'react-native';\n\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = React.PropsWithChildren<{\n  style?: StyleProp<ViewStyle>;\n  icon?: keyof typeof Icon.Assets;\n  variant?: 'contained' | 'text';\n  disabled?: boolean;\n  onPress?: () => void;\n  buttonColor?: string;\n  contentColor?: string;\n}>;\nconst Button = ({\n  icon,\n  variant = 'contained',\n  buttonColor,\n  contentColor,\n  disabled,\n  onPress,\n  style,\n  children,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n\n  const getStateColor = (pressed: boolean, disabled?: boolean) => {\n    const stateColors = colors.ui.button[variant];\n    if (disabled) return stateColors.disabled;\n    if (pressed) return stateColors.pressed;\n    return stateColors.enabled;\n  };\n\n  return (\n    <Pressable\n      disabled={disabled}\n      onPress={onPress}\n      style={({ pressed }) => {\n        const stateColor = getStateColor(pressed, disabled);\n        return [{ backgroundColor: buttonColor ?? stateColor.background }, styles.container, style];\n      }}\n    >\n      {({ pressed }) => {\n        const stateColor = getStateColor(pressed, disabled);\n\n        return (\n          <>\n            {icon && (\n              <Icon size={24} icon={icon} color={contentColor ?? stateColor.content} containerStyle={styles.icon} />\n            )}\n            <Text button color={contentColor ?? stateColor.content} style={styles.text}>\n              {children}\n            </Text>\n          </>\n        );\n      }}\n    </Pressable>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    flexDirection: 'row',\n    padding: 8,\n    borderRadius: 4,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  icon: { marginVertical: -4, marginRight: 8 },\n  text: {},\n});\n\nexport default Button;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAWA,MAAMA,MAAM,GAAG,QASF;EAAA,IATG;IACdC,IADc;IAEdC,OAAO,GAAG,WAFI;IAGdC,WAHc;IAIdC,YAJc;IAKdC,QALc;IAMdC,OANc;IAOdC,KAPc;IAQdC;EARc,CASH;EACX,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;;EAEA,MAAMC,aAAa,GAAG,CAACC,OAAD,EAAmBP,QAAnB,KAA0C;IAC9D,MAAMQ,WAAW,GAAGJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBb,OAAjB,CAApB;IACA,IAAIG,QAAJ,EAAc,OAAOQ,WAAW,CAACR,QAAnB;IACd,IAAIO,OAAJ,EAAa,OAAOC,WAAW,CAACD,OAAnB;IACb,OAAOC,WAAW,CAACG,OAAnB;EACD,CALD;;EAOA,oBACE,6BAAC,sBAAD;IACE,QAAQ,EAAEX,QADZ;IAEE,OAAO,EAAEC,OAFX;IAGE,KAAK,EAAE,SAAiB;MAAA,IAAhB;QAAEM;MAAF,CAAgB;MACtB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUP,QAAV,CAAhC;MACA,OAAO,CAAC;QAAEa,eAAe,EAAEf,WAAW,IAAIc,UAAU,CAACE;MAA7C,CAAD,EAA4DC,MAAM,CAACC,SAAnE,EAA8Ed,KAA9E,CAAP;IACD;EANH,GAQG,SAAiB;IAAA,IAAhB;MAAEK;IAAF,CAAgB;IAChB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUP,QAAV,CAAhC;IAEA,oBACE,4DACGJ,IAAI,iBACH,6BAAC,aAAD;MAAM,IAAI,EAAE,EAAZ;MAAgB,IAAI,EAAEA,IAAtB;MAA4B,KAAK,EAAEG,YAAY,IAAIa,UAAU,CAACK,OAA9D;MAAuE,cAAc,EAAEF,MAAM,CAACnB;IAA9F,EAFJ,eAIE,6BAAC,aAAD;MAAM,MAAM,MAAZ;MAAa,KAAK,EAAEG,YAAY,IAAIa,UAAU,CAACK,OAA/C;MAAwD,KAAK,EAAEF,MAAM,CAACG;IAAtE,GACGf,QADH,CAJF,CADF;EAUD,CArBH,CADF;AAyBD,CA5CD;;AA8CA,MAAMY,MAAM,GAAG,IAAAI,yBAAA,EAAiB;EAC9BH,SAAS,EAAE;IACTI,aAAa,EAAE,KADN;IAETC,OAAO,EAAE,CAFA;IAGTC,YAAY,EAAE,CAHL;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE;EALP,CADmB;EAQ9B5B,IAAI,EAAE;IAAE6B,cAAc,EAAE,CAAC,CAAnB;IAAsBC,WAAW,EAAE;EAAnC,CARwB;EAS9BR,IAAI,EAAE;AATwB,CAAjB,CAAf;eAYevB,M"}

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

@@ -9,12 +9,12 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
+var _Text = _interopRequireDefault(require("../../components/Text"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
-var _Text = _interopRequireDefault(require("../Text"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const ChannelFrozenBanner = _ref => {

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

@@ -1 +1 @@
-{"version":3,"names":["ChannelFrozenBanner","text","backgroundColor","textColor","style","palette","useUIKitTheme","styles","container","information","onBackgroundLight01","createStyleSheet","alignItems","justifyContent","paddingVertical","borderRadius"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Text from '../Text';\n\ntype Props = {\n  style?: StyleProp<ViewStyle>;\n  text?: string;\n  textColor?: string;\n  backgroundColor?: string;\n};\n\nconst ChannelFrozenBanner = ({ text = 'Channel is frozen', backgroundColor, textColor, style }: Props) => {\n  const { palette } = useUIKitTheme();\n\n  return (\n    <View\n      pointerEvents={'none'}\n      style={[styles.container, { backgroundColor: backgroundColor ?? palette.information }, style]}\n    >\n      <Text caption2 color={textColor ?? palette.onBackgroundLight01}>\n        {text}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingVertical: 6,\n    borderRadius: 4,\n  },\n});\n\nexport default ChannelFrozenBanner;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;AASA,MAAMA,mBAAmB,GAAG,QAA8E;EAAA,IAA7E;IAAEC,IAAI,GAAG,mBAAT;IAA8BC,eAA9B;IAA+CC,SAA/C;IAA0DC;EAA1D,CAA6E;EACxG,MAAM;IAAEC;EAAF,IAAc,IAAAC,sBAAA,GAApB;EAEA,oBACE,6BAAC,iBAAD;IACE,aAAa,EAAE,MADjB;IAEE,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmB;MAAEN,eAAe,EAAEA,eAAe,IAAIG,OAAO,CAACI;IAA9C,CAAnB,EAAgFL,KAAhF;EAFT,gBAIE,6BAAC,aAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIE,OAAO,CAACK;EAA3C,GACGT,IADH,CAJF,CADF;AAUD,CAbD;;AAeA,MAAMM,MAAM,GAAG,IAAAI,yBAAA,EAAiB;EAC9BH,SAAS,EAAE;IACTI,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,eAAe,EAAE,CAHR;IAITC,YAAY,EAAE;EAJL;AADmB,CAAjB,CAAf;eASef,mB"}
+{"version":3,"names":["ChannelFrozenBanner","text","backgroundColor","textColor","style","palette","useUIKitTheme","styles","container","information","onBackgroundLight01","createStyleSheet","alignItems","justifyContent","paddingVertical","borderRadius"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = {\n  style?: StyleProp<ViewStyle>;\n  text?: string;\n  textColor?: string;\n  backgroundColor?: string;\n};\n\nconst ChannelFrozenBanner = ({ text = 'Channel is frozen', backgroundColor, textColor, style }: Props) => {\n  const { palette } = useUIKitTheme();\n\n  return (\n    <View\n      pointerEvents={'none'}\n      style={[styles.container, { backgroundColor: backgroundColor ?? palette.information }, style]}\n    >\n      <Text caption2 color={textColor ?? palette.onBackgroundLight01}>\n        {text}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingVertical: 6,\n    borderRadius: 4,\n  },\n});\n\nexport default ChannelFrozenBanner;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;AASA,MAAMA,mBAAmB,GAAG,QAA8E;EAAA,IAA7E;IAAEC,IAAI,GAAG,mBAAT;IAA8BC,eAA9B;IAA+CC,SAA/C;IAA0DC;EAA1D,CAA6E;EACxG,MAAM;IAAEC;EAAF,IAAc,IAAAC,sBAAA,GAApB;EAEA,oBACE,6BAAC,iBAAD;IACE,aAAa,EAAE,MADjB;IAEE,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmB;MAAEN,eAAe,EAAEA,eAAe,IAAIG,OAAO,CAACI;IAA9C,CAAnB,EAAgFL,KAAhF;EAFT,gBAIE,6BAAC,aAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIE,OAAO,CAACK;EAA3C,GACGT,IADH,CAJF,CADF;AAUD,CAbD;;AAeA,MAAMM,MAAM,GAAG,IAAAI,yBAAA,EAAiB;EAC9BH,SAAS,EAAE;IACTI,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,eAAe,EAAE,CAHR;IAITC,YAAY,EAAE;EAJL;AADmB,CAAjB,CAAf;eASef,mB"}

package/lib/commonjs/ui/Dialog/DialogSheet.js

@@ -9,13 +9,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
-var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _Icon = _interopRequireDefault(require("../../components/Icon"));
 
-var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
 
-var _Icon = _interopRequireDefault(require("../Icon"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
-var _Text = _interopRequireDefault(require("../Text"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -77,6 +77,7 @@ const styles = (0, _createStyleSheet.default)({
     marginLeft: 16
   },
   sheetItemText: {
+    flex: 1,
     marginHorizontal: 24
   }
 });

package/lib/commonjs/ui/Dialog/DialogSheet.js.map

@@ -1 +1 @@
-{"version":3,"names":["DialogSheet","style","children","colors","useUIKitTheme","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","icon","title","iconColor","titleColor","sheetItemContainer","highlight","sheetItemIcon","text","sheetItemText","createStyleSheet","overflow","flexDirection","width","borderTopLeftRadius","borderTopRightRadius","alignItems","height","marginLeft","marginHorizontal","Item"],"sources":["DialogSheet.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Icon from '../Icon';\nimport Text from '../Text';\n\ntype Props = React.PropsWithChildren<{\n  style?: StyleProp<ViewStyle>;\n}>;\nconst DialogSheet: ((props: Props) => JSX.Element) & { Item: typeof SheetItem } = ({ style, children }) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <View style={[styles.container, { backgroundColor: colors.ui.dialog.default.none.background }, style]}>\n      {children}\n    </View>\n  );\n};\n\nexport type SheetItemProps = {\n  icon?: keyof typeof Icon.Assets;\n  iconColor?: string;\n  title: string;\n  titleColor?: string;\n};\nconst SheetItem = ({ icon, title, iconColor, titleColor }: SheetItemProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <View style={[styles.sheetItemContainer, { backgroundColor: colors.ui.dialog.default.none.background }]}>\n      {icon && (\n        <Icon\n          icon={icon}\n          color={iconColor ?? colors.ui.dialog.default.none.highlight}\n          containerStyle={styles.sheetItemIcon}\n        />\n      )}\n      <Text\n        subtitle1\n        numberOfLines={1}\n        color={titleColor ?? colors.ui.dialog.default.none.text}\n        style={styles.sheetItemText}\n      >\n        {title}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    overflow: 'hidden',\n    flexDirection: 'column',\n    width: '100%',\n    borderTopLeftRadius: 8,\n    borderTopRightRadius: 8,\n  },\n  sheetItemContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    height: 48,\n  },\n  sheetItemIcon: {\n    marginLeft: 16,\n  },\n  sheetItemText: {\n    marginHorizontal: 24,\n  },\n});\n\nDialogSheet.Item = SheetItem;\nexport default DialogSheet;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,WAAyE,GAAG,QAAyB;EAAA,IAAxB;IAAEC,KAAF;IAASC;EAAT,CAAwB;EACzG,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAAnB,EAAkFX,KAAlF;EAAb,GACGC,QADH,CADF;AAKD,CAPD;;AAeA,MAAMW,SAAS,GAAG,SAA4D;EAAA,IAA3D;IAAEC,IAAF;IAAQC,KAAR;IAAeC,SAAf;IAA0BC;EAA1B,CAA2D;EAC5E,MAAM;IAAEd;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACC,MAAM,CAACa,kBAAR,EAA4B;MAAEX,eAAe,EAAEJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAA5B;EAAb,GACGE,IAAI,iBACH,6BAAC,aAAD;IACE,IAAI,EAAEA,IADR;IAEE,KAAK,EAAEE,SAAS,IAAIb,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BQ,SAFpD;IAGE,cAAc,EAAEd,MAAM,CAACe;EAHzB,EAFJ,eAQE,6BAAC,aAAD;IACE,SAAS,MADX;IAEE,aAAa,EAAE,CAFjB;IAGE,KAAK,EAAEH,UAAU,IAAId,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BU,IAHrD;IAIE,KAAK,EAAEhB,MAAM,CAACiB;EAJhB,GAMGP,KANH,CARF,CADF;AAmBD,CArBD;;AAuBA,MAAMV,MAAM,GAAG,IAAAkB,yBAAA,EAAiB;EAC9BjB,SAAS,EAAE;IACTkB,QAAQ,EAAE,QADD;IAETC,aAAa,EAAE,QAFN;IAGTC,KAAK,EAAE,MAHE;IAITC,mBAAmB,EAAE,CAJZ;IAKTC,oBAAoB,EAAE;EALb,CADmB;EAQ9BV,kBAAkB,EAAE;IAClBO,aAAa,EAAE,KADG;IAElBI,UAAU,EAAE,QAFM;IAGlBC,MAAM,EAAE;EAHU,CARU;EAa9BV,aAAa,EAAE;IACbW,UAAU,EAAE;EADC,CAbe;EAgB9BT,aAAa,EAAE;IACbU,gBAAgB,EAAE;EADL;AAhBe,CAAjB,CAAf;AAqBAhC,WAAW,CAACiC,IAAZ,GAAmBpB,SAAnB;eACeb,W"}
+{"version":3,"names":["DialogSheet","style","children","colors","useUIKitTheme","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","icon","title","iconColor","titleColor","sheetItemContainer","highlight","sheetItemIcon","text","sheetItemText","createStyleSheet","overflow","flexDirection","width","borderTopLeftRadius","borderTopRightRadius","alignItems","height","marginLeft","flex","marginHorizontal","Item"],"sources":["DialogSheet.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = React.PropsWithChildren<{\n  style?: StyleProp<ViewStyle>;\n}>;\nconst DialogSheet: ((props: Props) => JSX.Element) & { Item: typeof SheetItem } = ({ style, children }) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <View style={[styles.container, { backgroundColor: colors.ui.dialog.default.none.background }, style]}>\n      {children}\n    </View>\n  );\n};\n\nexport type SheetItemProps = {\n  icon?: keyof typeof Icon.Assets;\n  iconColor?: string;\n  title: string;\n  titleColor?: string;\n};\nconst SheetItem = ({ icon, title, iconColor, titleColor }: SheetItemProps) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <View style={[styles.sheetItemContainer, { backgroundColor: colors.ui.dialog.default.none.background }]}>\n      {icon && (\n        <Icon\n          icon={icon}\n          color={iconColor ?? colors.ui.dialog.default.none.highlight}\n          containerStyle={styles.sheetItemIcon}\n        />\n      )}\n      <Text\n        subtitle1\n        numberOfLines={1}\n        color={titleColor ?? colors.ui.dialog.default.none.text}\n        style={styles.sheetItemText}\n      >\n        {title}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    overflow: 'hidden',\n    flexDirection: 'column',\n    width: '100%',\n    borderTopLeftRadius: 8,\n    borderTopRightRadius: 8,\n  },\n  sheetItemContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    height: 48,\n  },\n  sheetItemIcon: {\n    marginLeft: 16,\n  },\n  sheetItemText: {\n    flex: 1,\n    marginHorizontal: 24,\n  },\n});\n\nDialogSheet.Item = SheetItem;\nexport default DialogSheet;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,WAAyE,GAAG,QAAyB;EAAA,IAAxB;IAAEC,KAAF;IAASC;EAAT,CAAwB;EACzG,MAAM;IAAEC;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAAnB,EAAkFX,KAAlF;EAAb,GACGC,QADH,CADF;AAKD,CAPD;;AAeA,MAAMW,SAAS,GAAG,SAA4D;EAAA,IAA3D;IAAEC,IAAF;IAAQC,KAAR;IAAeC,SAAf;IAA0BC;EAA1B,CAA2D;EAC5E,MAAM;IAAEd;EAAF,IAAa,IAAAC,sBAAA,GAAnB;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACC,MAAM,CAACa,kBAAR,EAA4B;MAAEX,eAAe,EAAEJ,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAA5B;EAAb,GACGE,IAAI,iBACH,6BAAC,aAAD;IACE,IAAI,EAAEA,IADR;IAEE,KAAK,EAAEE,SAAS,IAAIb,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BQ,SAFpD;IAGE,cAAc,EAAEd,MAAM,CAACe;EAHzB,EAFJ,eAQE,6BAAC,aAAD;IACE,SAAS,MADX;IAEE,aAAa,EAAE,CAFjB;IAGE,KAAK,EAAEH,UAAU,IAAId,MAAM,CAACK,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BU,IAHrD;IAIE,KAAK,EAAEhB,MAAM,CAACiB;EAJhB,GAMGP,KANH,CARF,CADF;AAmBD,CArBD;;AAuBA,MAAMV,MAAM,GAAG,IAAAkB,yBAAA,EAAiB;EAC9BjB,SAAS,EAAE;IACTkB,QAAQ,EAAE,QADD;IAETC,aAAa,EAAE,QAFN;IAGTC,KAAK,EAAE,MAHE;IAITC,mBAAmB,EAAE,CAJZ;IAKTC,oBAAoB,EAAE;EALb,CADmB;EAQ9BV,kBAAkB,EAAE;IAClBO,aAAa,EAAE,KADG;IAElBI,UAAU,EAAE,QAFM;IAGlBC,MAAM,EAAE;EAHU,CARU;EAa9BV,aAAa,EAAE;IACbW,UAAU,EAAE;EADC,CAbe;EAgB9BT,aAAa,EAAE;IACbU,IAAI,EAAE,CADO;IAEbC,gBAAgB,EAAE;EAFL;AAhBe,CAAjB,CAAf;AAsBAjC,WAAW,CAACkC,IAAZ,GAAmBrB,SAAnB;eACeb,W"}

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

@@ -11,18 +11,18 @@ var _reactNative = require("react-native");
 
 var _uikitUtils = require("@sendbird/uikit-utils");
 
+var _Icon = _interopRequireDefault(require("../../components/Icon"));
+
 var _Image = _interopRequireDefault(require("../../components/Image"));
 
+var _Text = _interopRequireDefault(require("../../components/Text"));
+
 var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
 
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 
 var _Badge = _interopRequireDefault(require("../Badge"));
 
-var _Icon = _interopRequireDefault(require("../Icon"));
-
-var _Text = _interopRequireDefault(require("../Text"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const GroupChannelPreview = _ref => {
@@ -109,9 +109,9 @@ const GroupChannelPreview = _ref => {
   }, body))), /*#__PURE__*/_react.default.createElement(_reactNative.View, null, badgeCount > 0 && /*#__PURE__*/_react.default.createElement(_Badge.default, {
     count: badgeCount,
     maxCount: maxBadgeCount
-  })))), /*#__PURE__*/_react.default.createElement(Separator, {
+  }))), /*#__PURE__*/_react.default.createElement(Separator, {
     color: color.default.none.separator
-  }));
+  })));
 };
 
 const Separator = _ref2 => {
@@ -130,11 +130,11 @@ const styles = (0, _createStyleSheet.default)({
     height: 76,
     width: '100%',
     flexDirection: 'row',
-    paddingHorizontal: 16,
-    paddingTop: 10,
-    alignItems: 'center'
+    alignItems: 'center',
+    justifyContent: 'center'
   },
   coverContainer: {
+    marginLeft: 16,
     marginRight: 16
   },
   channelCover: {
@@ -143,7 +143,9 @@ const styles = (0, _createStyleSheet.default)({
     borderRadius: 28
   },
   rightSection: {
-    flex: 1
+    flex: 1,
+    paddingTop: 10,
+    paddingRight: 16
   },
   rightTopSection: {
     flexDirection: 'row',
@@ -207,10 +209,10 @@ const styles = (0, _createStyleSheet.default)({
   },
   separator: {
     position: 'absolute',
-    right: 0,
+    left: 0,
+    right: -16,
     bottom: 0,
-    height: 1,
-    width: '84.5%'
+    height: 1
   }
 });
 var _default = GroupChannelPreview;