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

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","createStyleSheet","useUIKitTheme","Icon","AvatarIcon","size","icon","containerStyle","backgroundColor","colors","palette","styles","container","width","height","borderRadius","background300","onBackgroundReverse01","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAQA,MAAMC,UAAU,GAAG,QAAiE;EAAA,IAAhE;IAAEC,IAAI,GAAG,EAAT;IAAaC,IAAb;IAAmBC,cAAnB;IAAmCC;EAAnC,CAAgE;EAClF,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsBR,aAAa,EAAzC;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLS,MAAM,CAACC,SADF,EAEL;MACEC,KAAK,EAAER,IADT;MAEES,MAAM,EAAET,IAFV;MAGEU,YAAY,EAAEV,IAAI,GAAG,CAHvB;MAIEG,eAAe,EAAEA,eAAe,IAAIE,OAAO,CAACM;IAJ9C,CAFK,EAQLT,cARK;EADT,gBAYE,oBAAC,IAAD;IAAM,IAAI,EAAED,IAAZ;IAAkB,IAAI,EAAED,IAAI,GAAG,CAA/B;IAAkC,KAAK,EAAEI,MAAM,CAACQ;EAAhD,EAZF,CADF;AAgBD,CAlBD;;AAmBA,MAAMN,MAAM,GAAGV,gBAAgB,CAAC;EAC9BW,SAAS,EAAE;IACTM,QAAQ,EAAE,QADD;IAETC,UAAU,EAAE,QAFH;IAGTC,cAAc,EAAE;EAHP;AADmB,CAAD,CAA/B;AAOA,eAAehB,UAAf"}
+{"version":3,"names":["React","View","Icon","createStyleSheet","useUIKitTheme","AvatarIcon","size","icon","containerStyle","backgroundColor","colors","palette","styles","container","width","height","borderRadius","background300","onBackgroundReverse01","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAQA,MAAMC,UAAU,GAAG,QAAiE;EAAA,IAAhE;IAAEC,IAAI,GAAG,EAAT;IAAaC,IAAb;IAAmBC,cAAnB;IAAmCC;EAAnC,CAAgE;EAClF,MAAM;IAAEC,MAAF;IAAUC;EAAV,IAAsBP,aAAa,EAAzC;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLQ,MAAM,CAACC,SADF,EAEL;MACEC,KAAK,EAAER,IADT;MAEES,MAAM,EAAET,IAFV;MAGEU,YAAY,EAAEV,IAAI,GAAG,CAHvB;MAIEG,eAAe,EAAEA,eAAe,IAAIE,OAAO,CAACM;IAJ9C,CAFK,EAQLT,cARK;EADT,gBAYE,oBAAC,IAAD;IAAM,IAAI,EAAED,IAAZ;IAAkB,IAAI,EAAED,IAAI,GAAG,CAA/B;IAAkC,KAAK,EAAEI,MAAM,CAACQ;EAAhD,EAZF,CADF;AAgBD,CAlBD;;AAmBA,MAAMN,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTM,QAAQ,EAAE,QADD;IAETC,UAAU,EAAE,QAFH;IAGTC,cAAc,EAAE;EAHP;AADmB,CAAD,CAA/B;AAOA,eAAehB,UAAf"}

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

@@ -1,10 +1,10 @@
 import React, { useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { conditionChaining } from '@sendbird/uikit-utils';
+import Icon from '../../components/Icon';
 import Image from '../../components/Image';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Icon from '../Icon';
 import AvatarGroup from './AvatarGroup';
 import AvatarIcon from './AvatarIcon';
 

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

@@ -1 +1 @@
-{"version":3,"names":["React","useState","StyleSheet","View","conditionChaining","Image","createStyleSheet","useUIKitTheme","Icon","AvatarGroup","AvatarIcon","Avatar","uri","square","muted","size","containerStyle","colors","palette","loadFailure","setLoadFailure","styles","container","width","height","borderRadius","backgroundColor","background300","Boolean","absoluteFill","onBackgroundReverse01","MutedOverlay","primary300","opacity","onBackgroundDark01","alignItems","justifyContent","overflow","Group"],"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,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SAAoBC,UAApB,EAAgCC,IAAhC,QAAuD,cAAvD;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,KAAP,MAAkB,wBAAlB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,UAAP,MAAuB,cAAvB;;AAaA,MAAMC,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,IAAsBX,aAAa,EAAzC;EACA,MAAM,CAACY,WAAD,EAAcC,cAAd,IAAgCnB,QAAQ,CAAC,KAAD,CAA9C;EAEA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLoB,MAAM,CAACC,SADF,EAEL;MAAEC,KAAK,EAAER,IAAT;MAAeS,MAAM,EAAET,IAAvB;MAA6BU,YAAY,EAAEZ,MAAM,GAAG,CAAH,GAAOE,IAAI,GAAG,CAA/D;MAAkEW,eAAe,EAAER,OAAO,CAACS;IAA3F,CAFK,EAGLX,cAHK;EADT,GAOGZ,iBAAiB,CAChB,CAACwB,OAAO,CAAChB,GAAD,CAAP,IAAgB,CAACO,WAAlB,CADgB,EAEhB,cACE,oBAAC,KAAD;IACE,OAAO,EAAE,MAAMC,cAAc,CAAC,IAAD,CAD/B;IAEE,MAAM,EAAE;MAAER;IAAF,CAFV;IAGE,UAAU,EAAE,OAHd;IAIE,KAAK,EAAEV,UAAU,CAAC2B;EAJpB,EADF,eAOE,oBAAC,IAAD;IAAM,IAAI,EAAE,MAAZ;IAAoB,IAAI,EAAEd,IAAI,GAAG,CAAjC;IAAoC,KAAK,EAAEE,MAAM,CAACa;EAAlD,EAPF,CAFgB,CAPpB,EAmBGhB,KAAK,iBAAI,oBAAC,YAAD;IAAc,IAAI,EAAEC;EAApB,EAnBZ,CADF;AAuBD,CAjCD;;AAmCA,MAAMgB,YAAY,GAAG,SAAgC;EAAA,IAA/B;IAAEhB;EAAF,CAA+B;EACnD,MAAM;IAAEG;EAAF,IAAcX,aAAa,EAAjC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACc,MAAM,CAACC,SAAR,EAAmBpB,UAAU,CAAC2B,YAA9B;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAAC3B,UAAU,CAAC2B,YAAZ,EAA0B;MAAEH,eAAe,EAAER,OAAO,CAACc,UAA3B;MAAuCC,OAAO,EAAE;IAAhD,CAA1B;EAAb,EADF,eAEE,oBAAC,IAAD;IAAM,KAAK,EAAEf,OAAO,CAACgB,kBAArB;IAAyC,IAAI,EAAE,MAA/C;IAAuD,IAAI,EAAEnB,IAAI,GAAG;EAApE,EAFF,CADF;AAMD,CARD;;AAUA,MAAMM,MAAM,GAAGf,gBAAgB,CAAC;EAC9BgB,SAAS,EAAE;IACTa,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,QAAQ,EAAE;EAHD;AADmB,CAAD,CAA/B;AAQA1B,MAAM,CAAC2B,KAAP,GAAe7B,WAAf;AACAE,MAAM,CAACH,IAAP,GAAcE,UAAd;AACA,eAAeC,MAAf"}
+{"version":3,"names":["React","useState","StyleSheet","View","conditionChaining","Icon","Image","createStyleSheet","useUIKitTheme","AvatarGroup","AvatarIcon","Avatar","uri","square","muted","size","containerStyle","colors","palette","loadFailure","setLoadFailure","styles","container","width","height","borderRadius","backgroundColor","background300","Boolean","absoluteFill","onBackgroundReverse01","MutedOverlay","primary300","opacity","onBackgroundDark01","alignItems","justifyContent","overflow","Group"],"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,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SAAoBC,UAApB,EAAgCC,IAAhC,QAAuD,cAAvD;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,KAAP,MAAkB,wBAAlB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,UAAP,MAAuB,cAAvB;;AAaA,MAAMC,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,IAAsBV,aAAa,EAAzC;EACA,MAAM,CAACW,WAAD,EAAcC,cAAd,IAAgCnB,QAAQ,CAAC,KAAD,CAA9C;EAEA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLoB,MAAM,CAACC,SADF,EAEL;MAAEC,KAAK,EAAER,IAAT;MAAeS,MAAM,EAAET,IAAvB;MAA6BU,YAAY,EAAEZ,MAAM,GAAG,CAAH,GAAOE,IAAI,GAAG,CAA/D;MAAkEW,eAAe,EAAER,OAAO,CAACS;IAA3F,CAFK,EAGLX,cAHK;EADT,GAOGZ,iBAAiB,CAChB,CAACwB,OAAO,CAAChB,GAAD,CAAP,IAAgB,CAACO,WAAlB,CADgB,EAEhB,cACE,oBAAC,KAAD;IACE,OAAO,EAAE,MAAMC,cAAc,CAAC,IAAD,CAD/B;IAEE,MAAM,EAAE;MAAER;IAAF,CAFV;IAGE,UAAU,EAAE,OAHd;IAIE,KAAK,EAAEV,UAAU,CAAC2B;EAJpB,EADF,eAOE,oBAAC,IAAD;IAAM,IAAI,EAAE,MAAZ;IAAoB,IAAI,EAAEd,IAAI,GAAG,CAAjC;IAAoC,KAAK,EAAEE,MAAM,CAACa;EAAlD,EAPF,CAFgB,CAPpB,EAmBGhB,KAAK,iBAAI,oBAAC,YAAD;IAAc,IAAI,EAAEC;EAApB,EAnBZ,CADF;AAuBD,CAjCD;;AAmCA,MAAMgB,YAAY,GAAG,SAAgC;EAAA,IAA/B;IAAEhB;EAAF,CAA+B;EACnD,MAAM;IAAEG;EAAF,IAAcV,aAAa,EAAjC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACa,MAAM,CAACC,SAAR,EAAmBpB,UAAU,CAAC2B,YAA9B;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAAC3B,UAAU,CAAC2B,YAAZ,EAA0B;MAAEH,eAAe,EAAER,OAAO,CAACc,UAA3B;MAAuCC,OAAO,EAAE;IAAhD,CAA1B;EAAb,EADF,eAEE,oBAAC,IAAD;IAAM,KAAK,EAAEf,OAAO,CAACgB,kBAArB;IAAyC,IAAI,EAAE,MAA/C;IAAuD,IAAI,EAAEnB,IAAI,GAAG;EAApE,EAFF,CADF;AAMD,CARD;;AAUA,MAAMM,MAAM,GAAGd,gBAAgB,CAAC;EAC9Be,SAAS,EAAE;IACTa,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,QAAQ,EAAE;EAHD;AADmB,CAAD,CAA/B;AAQA1B,MAAM,CAAC2B,KAAP,GAAe7B,WAAf;AACAE,MAAM,CAACN,IAAP,GAAcK,UAAd;AACA,eAAeC,MAAf"}

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import { Platform, View } from 'react-native';
 import { truncatedBadgeCount } from '@sendbird/uikit-utils';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Text from '../Text';
 
 const Badge = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","Platform","View","truncatedBadgeCount","createStyleSheet","useUIKitTheme","Text","Badge","count","maxCount","badgeColor","textColor","style","size","colors","isSmall","styles","badgeSmall","badgeDefault","backgroundColor","ui","badge","default","none","background","badgeSmallPadding","badgeDefaultPadding","text","paddingTop","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAA8BC,IAA9B,QAAqD,cAArD;AAEA,SAASC,mBAAT,QAAoC,uBAApC;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAWA,MAAMC,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,IAAaT,aAAa,EAAhC;EACA,MAAMU,OAAO,GAAGF,IAAI,KAAK,OAAzB;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLE,OAAO,GAAGC,MAAM,CAACC,UAAV,GAAuBD,MAAM,CAACE,YADhC,EAEL;MAAEC,eAAe,EAAET,UAAU,IAAII,MAAM,CAACM,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BC;IAA9D,CAFK,EAGLhB,KAAK,IAAI,EAAT,KAAgBO,OAAO,GAAGC,MAAM,CAACS,iBAAV,GAA8BT,MAAM,CAACU,mBAA5D,CAHK,EAILd,KAJK;EADT,gBAQE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIG,MAAM,CAACM,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BI;EAAhE,GACGxB,mBAAmB,CAACK,KAAD,EAAQC,QAAR,CADtB,CARF,CADF;AAcD,CAjBD;;AAmBA,MAAMO,MAAM,GAAGZ,gBAAgB,CAAC;EAC9Bc,YAAY,EAAE;IACZU,UAAU,EAAE3B,QAAQ,CAAC4B,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;EAS9BV,mBAAmB,EAAE;IACnBW,iBAAiB,EAAE;EADA,CATS;EAY9BpB,UAAU,EAAE;IACVW,UAAU,EAAE3B,QAAQ,CAAC4B,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;EAoB9BX,iBAAiB,EAAE;IACjBY,iBAAiB,EAAE;EADF;AApBW,CAAD,CAA/B;AAyBA,eAAe9B,KAAf"}
+{"version":3,"names":["React","Platform","View","truncatedBadgeCount","Text","createStyleSheet","useUIKitTheme","Badge","count","maxCount","badgeColor","textColor","style","size","colors","isSmall","styles","badgeSmall","badgeDefault","backgroundColor","ui","badge","default","none","background","badgeSmallPadding","badgeDefaultPadding","text","paddingTop","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAA8BC,IAA9B,QAAqD,cAArD;AAEA,SAASC,mBAAT,QAAoC,uBAApC;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAWA,MAAMC,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,IAAaR,aAAa,EAAhC;EACA,MAAMS,OAAO,GAAGF,IAAI,KAAK,OAAzB;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAE,CACLE,OAAO,GAAGC,MAAM,CAACC,UAAV,GAAuBD,MAAM,CAACE,YADhC,EAEL;MAAEC,eAAe,EAAET,UAAU,IAAII,MAAM,CAACM,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BC;IAA9D,CAFK,EAGLhB,KAAK,IAAI,EAAT,KAAgBO,OAAO,GAAGC,MAAM,CAACS,iBAAV,GAA8BT,MAAM,CAACU,mBAA5D,CAHK,EAILd,KAJK;EADT,gBAQE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIG,MAAM,CAACM,EAAP,CAAUC,KAAV,CAAgBC,OAAhB,CAAwBC,IAAxB,CAA6BI;EAAhE,GACGxB,mBAAmB,CAACK,KAAD,EAAQC,QAAR,CADtB,CARF,CADF;AAcD,CAjBD;;AAmBA,MAAMO,MAAM,GAAGX,gBAAgB,CAAC;EAC9Ba,YAAY,EAAE;IACZU,UAAU,EAAE3B,QAAQ,CAAC4B,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;EAS9BV,mBAAmB,EAAE;IACnBW,iBAAiB,EAAE;EADA,CATS;EAY9BpB,UAAU,EAAE;IACVW,UAAU,EAAE3B,QAAQ,CAAC4B,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;EAoB9BX,iBAAiB,EAAE;IACjBY,iBAAiB,EAAE;EADF;AApBW,CAAD,CAA/B;AAyBA,eAAe9B,KAAf"}

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import { TouchableOpacity, useWindowDimensions } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import Modal from '../../components/Modal';
 import useHeaderStyle from '../../styles/useHeaderStyle';
 import DialogSheet from '../Dialog/DialogSheet';
-import Modal from '../Modal';
 
 const BottomSheet = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","TouchableOpacity","useWindowDimensions","useSafeAreaInsets","useHeaderStyle","DialogSheet","Modal","BottomSheet","onDismiss","onHide","visible","sheetItems","statusBarTranslucent","width","bottom","left","right","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,gBAAT,EAA2BC,mBAA3B,QAAsD,cAAtD;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAEA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,WAAP,MAAwB,uBAAxB;AAEA,OAAOC,KAAP,MAAkB,UAAlB;;AAiBA,MAAMC,WAAW,GAAG,QAAuD;EAAA,IAAtD;IAAEC,SAAF;IAAaC,MAAb;IAAqBC,OAArB;IAA8BC;EAA9B,CAAsD;EACzE,MAAM;IAAEC;EAAF,IAA2BR,cAAc,EAA/C;EACA,MAAM;IAAES;EAAF,IAAYX,mBAAmB,EAArC;EACA,MAAM;IAAEY,MAAF;IAAUC,IAAV;IAAgBC;EAAhB,IAA0Bb,iBAAiB,EAAjD;EACA,oBACE,oBAAC,KAAD;IACE,IAAI,EAAE,OADR;IAEE,OAAO,EAAEM,MAFX;IAGE,SAAS,EAAED,SAHb;IAIE,oBAAoB,EAAEI,oBAJxB;IAKE,OAAO,EAAEF,OALX;IAME,eAAe,EAAE;MAAEO,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EANnB,gBAQE,oBAAC,WAAD;IAAa,KAAK,EAAE;MAAEL,KAAF;MAASM,aAAa,EAAEL;IAAxB;EAApB,GACGH,UAAU,CAACS,GAAX,CAAe,QAAwBC,GAAxB;IAAA,IAAC;MAAEC,OAAF;MAAW,GAAGC;IAAd,CAAD;IAAA,oBACd,oBAAC,gBAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAEA,KAAK,CAACC,KAAN,GAAcH,GAFrB;MAGE,KAAK,EAAE;QAAEI,WAAW,EAAEV,IAAf;QAAqBW,YAAY,EAAEV;MAAnC,CAHT;MAIE,OAAO,EAAE,YAAY;QACnB,MAAMP,MAAM,EAAZ;;QACA,IAAI;UACFa,OAAO;QACR,CAFD,CAEE,MAAM,CAAE;MACX;IATH,gBAWE,oBAAC,WAAD,CAAa,IAAb,EAAsBC,KAAtB,CAXF,CADc;EAAA,CAAf,CADH,CARF,CADF;AA4BD,CAhCD;;AAkCA,eAAehB,WAAf"}
+{"version":3,"names":["React","TouchableOpacity","useWindowDimensions","useSafeAreaInsets","Modal","useHeaderStyle","DialogSheet","BottomSheet","onDismiss","onHide","visible","sheetItems","statusBarTranslucent","width","bottom","left","right","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,gBAAT,EAA2BC,mBAA3B,QAAsD,cAAtD;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAGA,OAAOC,KAAP,MAAkB,wBAAlB;AACA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,WAAP,MAAwB,uBAAxB;;AAiBA,MAAMC,WAAW,GAAG,QAAuD;EAAA,IAAtD;IAAEC,SAAF;IAAaC,MAAb;IAAqBC,OAArB;IAA8BC;EAA9B,CAAsD;EACzE,MAAM;IAAEC;EAAF,IAA2BP,cAAc,EAA/C;EACA,MAAM;IAAEQ;EAAF,IAAYX,mBAAmB,EAArC;EACA,MAAM;IAAEY,MAAF;IAAUC,IAAV;IAAgBC;EAAhB,IAA0Bb,iBAAiB,EAAjD;EACA,oBACE,oBAAC,KAAD;IACE,IAAI,EAAE,OADR;IAEE,OAAO,EAAEM,MAFX;IAGE,SAAS,EAAED,SAHb;IAIE,oBAAoB,EAAEI,oBAJxB;IAKE,OAAO,EAAEF,OALX;IAME,eAAe,EAAE;MAAEO,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EANnB,gBAQE,oBAAC,WAAD;IAAa,KAAK,EAAE;MAAEL,KAAF;MAASM,aAAa,EAAEL;IAAxB;EAApB,GACGH,UAAU,CAACS,GAAX,CAAe,QAAwBC,GAAxB;IAAA,IAAC;MAAEC,OAAF;MAAW,GAAGC;IAAd,CAAD;IAAA,oBACd,oBAAC,gBAAD;MACE,aAAa,EAAE,IADjB;MAEE,GAAG,EAAEA,KAAK,CAACC,KAAN,GAAcH,GAFrB;MAGE,KAAK,EAAE;QAAEI,WAAW,EAAEV,IAAf;QAAqBW,YAAY,EAAEV;MAAnC,CAHT;MAIE,OAAO,EAAE,YAAY;QACnB,MAAMP,MAAM,EAAZ;;QACA,IAAI;UACFa,OAAO;QACR,CAFD,CAEE,MAAM,CAAE;MACX;IATH,gBAWE,oBAAC,WAAD,CAAa,IAAb,EAAsBC,KAAtB,CAXF,CADc;EAAA,CAAf,CADH,CARF,CADF;AA4BD,CAhCD;;AAkCA,eAAehB,WAAf"}

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import { Pressable } from 'react-native';
+import Icon from '../../components/Icon';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Icon from '../Icon';
-import Text from '../Text';
 
 const Button = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","Pressable","createStyleSheet","useUIKitTheme","Icon","Text","Button","icon","variant","buttonColor","contentColor","disabled","onPress","style","children","colors","getStateColor","pressed","stateColors","ui","button","enabled","stateColor","backgroundColor","background","styles","container","content","text","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAAgD,cAAhD;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAWA,MAAMC,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,IAAaZ,aAAa,EAAhC;;EAEA,MAAMa,aAAa,GAAG,CAACC,OAAD,EAAmBN,QAAnB,KAA0C;IAC9D,MAAMO,WAAW,GAAGH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBZ,OAAjB,CAApB;IACA,IAAIG,QAAJ,EAAc,OAAOO,WAAW,CAACP,QAAnB;IACd,IAAIM,OAAJ,EAAa,OAAOC,WAAW,CAACD,OAAnB;IACb,OAAOC,WAAW,CAACG,OAAnB;EACD,CALD;;EAOA,oBACE,oBAAC,SAAD;IACE,QAAQ,EAAEV,QADZ;IAEE,OAAO,EAAEC,OAFX;IAGE,KAAK,EAAE,SAAiB;MAAA,IAAhB;QAAEK;MAAF,CAAgB;MACtB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUN,QAAV,CAAhC;MACA,OAAO,CAAC;QAAEY,eAAe,EAAEd,WAAW,IAAIa,UAAU,CAACE;MAA7C,CAAD,EAA4DC,MAAM,CAACC,SAAnE,EAA8Eb,KAA9E,CAAP;IACD;EANH,GAQG,SAAiB;IAAA,IAAhB;MAAEI;IAAF,CAAgB;IAChB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUN,QAAV,CAAhC;IAEA,oBACE,0CACGJ,IAAI,iBACH,oBAAC,IAAD;MAAM,IAAI,EAAE,EAAZ;MAAgB,IAAI,EAAEA,IAAtB;MAA4B,KAAK,EAAEG,YAAY,IAAIY,UAAU,CAACK,OAA9D;MAAuE,cAAc,EAAEF,MAAM,CAAClB;IAA9F,EAFJ,eAIE,oBAAC,IAAD;MAAM,MAAM,MAAZ;MAAa,KAAK,EAAEG,YAAY,IAAIY,UAAU,CAACK,OAA/C;MAAwD,KAAK,EAAEF,MAAM,CAACG;IAAtE,GACGd,QADH,CAJF,CADF;EAUD,CArBH,CADF;AAyBD,CA5CD;;AA8CA,MAAMW,MAAM,GAAGvB,gBAAgB,CAAC;EAC9BwB,SAAS,EAAE;IACTG,aAAa,EAAE,KADN;IAETC,OAAO,EAAE,CAFA;IAGTC,YAAY,EAAE,CAHL;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE;EALP,CADmB;EAQ9B1B,IAAI,EAAE;IAAE2B,cAAc,EAAE,CAAC,CAAnB;IAAsBC,WAAW,EAAE;EAAnC,CARwB;EAS9BP,IAAI,EAAE;AATwB,CAAD,CAA/B;AAYA,eAAetB,MAAf"}
+{"version":3,"names":["React","Pressable","Icon","Text","createStyleSheet","useUIKitTheme","Button","icon","variant","buttonColor","contentColor","disabled","onPress","style","children","colors","getStateColor","pressed","stateColors","ui","button","enabled","stateColor","backgroundColor","background","styles","container","content","text","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAAgD,cAAhD;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAWA,MAAMC,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,IAAaV,aAAa,EAAhC;;EAEA,MAAMW,aAAa,GAAG,CAACC,OAAD,EAAmBN,QAAnB,KAA0C;IAC9D,MAAMO,WAAW,GAAGH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBZ,OAAjB,CAApB;IACA,IAAIG,QAAJ,EAAc,OAAOO,WAAW,CAACP,QAAnB;IACd,IAAIM,OAAJ,EAAa,OAAOC,WAAW,CAACD,OAAnB;IACb,OAAOC,WAAW,CAACG,OAAnB;EACD,CALD;;EAOA,oBACE,oBAAC,SAAD;IACE,QAAQ,EAAEV,QADZ;IAEE,OAAO,EAAEC,OAFX;IAGE,KAAK,EAAE,SAAiB;MAAA,IAAhB;QAAEK;MAAF,CAAgB;MACtB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUN,QAAV,CAAhC;MACA,OAAO,CAAC;QAAEY,eAAe,EAAEd,WAAW,IAAIa,UAAU,CAACE;MAA7C,CAAD,EAA4DC,MAAM,CAACC,SAAnE,EAA8Eb,KAA9E,CAAP;IACD;EANH,GAQG,SAAiB;IAAA,IAAhB;MAAEI;IAAF,CAAgB;IAChB,MAAMK,UAAU,GAAGN,aAAa,CAACC,OAAD,EAAUN,QAAV,CAAhC;IAEA,oBACE,0CACGJ,IAAI,iBACH,oBAAC,IAAD;MAAM,IAAI,EAAE,EAAZ;MAAgB,IAAI,EAAEA,IAAtB;MAA4B,KAAK,EAAEG,YAAY,IAAIY,UAAU,CAACK,OAA9D;MAAuE,cAAc,EAAEF,MAAM,CAAClB;IAA9F,EAFJ,eAIE,oBAAC,IAAD;MAAM,MAAM,MAAZ;MAAa,KAAK,EAAEG,YAAY,IAAIY,UAAU,CAACK,OAA/C;MAAwD,KAAK,EAAEF,MAAM,CAACG;IAAtE,GACGd,QADH,CAJF,CADF;EAUD,CArBH,CADF;AAyBD,CA5CD;;AA8CA,MAAMW,MAAM,GAAGrB,gBAAgB,CAAC;EAC9BsB,SAAS,EAAE;IACTG,aAAa,EAAE,KADN;IAETC,OAAO,EAAE,CAFA;IAGTC,YAAY,EAAE,CAHL;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE;EALP,CADmB;EAQ9B1B,IAAI,EAAE;IAAE2B,cAAc,EAAE,CAAC,CAAnB;IAAsBC,WAAW,EAAE;EAAnC,CARwB;EAS9BP,IAAI,EAAE;AATwB,CAAD,CAA/B;AAYA,eAAetB,MAAf"}

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

@@ -1,8 +1,8 @@
 import React from 'react';
 import { View } from 'react-native';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Text from '../Text';
 
 const ChannelFrozenBanner = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","createStyleSheet","useUIKitTheme","Text","ChannelFrozenBanner","text","backgroundColor","textColor","style","palette","styles","container","information","onBackgroundLight01","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AASA,MAAMC,mBAAmB,GAAG,QAA8E;EAAA,IAA7E;IAAEC,IAAI,GAAG,mBAAT;IAA8BC,eAA9B;IAA+CC,SAA/C;IAA0DC;EAA1D,CAA6E;EACxG,MAAM;IAAEC;EAAF,IAAcP,aAAa,EAAjC;EAEA,oBACE,oBAAC,IAAD;IACE,aAAa,EAAE,MADjB;IAEE,KAAK,EAAE,CAACQ,MAAM,CAACC,SAAR,EAAmB;MAAEL,eAAe,EAAEA,eAAe,IAAIG,OAAO,CAACG;IAA9C,CAAnB,EAAgFJ,KAAhF;EAFT,gBAIE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIE,OAAO,CAACI;EAA3C,GACGR,IADH,CAJF,CADF;AAUD,CAbD;;AAeA,MAAMK,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTG,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,eAAe,EAAE,CAHR;IAITC,YAAY,EAAE;EAJL;AADmB,CAAD,CAA/B;AASA,eAAeb,mBAAf"}
+{"version":3,"names":["React","View","Text","createStyleSheet","useUIKitTheme","ChannelFrozenBanner","text","backgroundColor","textColor","style","palette","styles","container","information","onBackgroundLight01","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AASA,MAAMC,mBAAmB,GAAG,QAA8E;EAAA,IAA7E;IAAEC,IAAI,GAAG,mBAAT;IAA8BC,eAA9B;IAA+CC,SAA/C;IAA0DC;EAA1D,CAA6E;EACxG,MAAM;IAAEC;EAAF,IAAcN,aAAa,EAAjC;EAEA,oBACE,oBAAC,IAAD;IACE,aAAa,EAAE,MADjB;IAEE,KAAK,EAAE,CAACO,MAAM,CAACC,SAAR,EAAmB;MAAEL,eAAe,EAAEA,eAAe,IAAIG,OAAO,CAACG;IAA9C,CAAnB,EAAgFJ,KAAhF;EAFT,gBAIE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAED,SAAS,IAAIE,OAAO,CAACI;EAA3C,GACGR,IADH,CAJF,CADF;AAUD,CAbD;;AAeA,MAAMK,MAAM,GAAGR,gBAAgB,CAAC;EAC9BS,SAAS,EAAE;IACTG,UAAU,EAAE,QADH;IAETC,cAAc,EAAE,QAFP;IAGTC,eAAe,EAAE,CAHR;IAITC,YAAY,EAAE;EAJL;AADmB,CAAD,CAA/B;AASA,eAAeb,mBAAf"}

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

@@ -1,9 +1,9 @@
 import React from 'react';
 import { View } from 'react-native';
+import Icon from '../../components/Icon';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Icon from '../Icon';
-import Text from '../Text';
 
 const DialogSheet = _ref => {
   let {
@@ -63,6 +63,7 @@ const styles = createStyleSheet({
     marginLeft: 16
   },
   sheetItemText: {
+    flex: 1,
     marginHorizontal: 24
   }
 });

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","createStyleSheet","useUIKitTheme","Icon","Text","DialogSheet","style","children","colors","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","icon","title","iconColor","titleColor","sheetItemContainer","highlight","sheetItemIcon","text","sheetItemText","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAKA,MAAMC,WAAyE,GAAG,QAAyB;EAAA,IAAxB;IAAEC,KAAF;IAASC;EAAT,CAAwB;EACzG,MAAM;IAAEC;EAAF,IAAaN,aAAa,EAAhC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACO,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAAnB,EAAkFV,KAAlF;EAAb,GACGC,QADH,CADF;AAKD,CAPD;;AAeA,MAAMU,SAAS,GAAG,SAA4D;EAAA,IAA3D;IAAEC,IAAF;IAAQC,KAAR;IAAeC,SAAf;IAA0BC;EAA1B,CAA2D;EAC5E,MAAM;IAAEb;EAAF,IAAaN,aAAa,EAAhC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACO,MAAM,CAACa,kBAAR,EAA4B;MAAEX,eAAe,EAAEH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAA5B;EAAb,GACGE,IAAI,iBACH,oBAAC,IAAD;IACE,IAAI,EAAEA,IADR;IAEE,KAAK,EAAEE,SAAS,IAAIZ,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BQ,SAFpD;IAGE,cAAc,EAAEd,MAAM,CAACe;EAHzB,EAFJ,eAQE,oBAAC,IAAD;IACE,SAAS,MADX;IAEE,aAAa,EAAE,CAFjB;IAGE,KAAK,EAAEH,UAAU,IAAIb,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BU,IAHrD;IAIE,KAAK,EAAEhB,MAAM,CAACiB;EAJhB,GAMGP,KANH,CARF,CADF;AAmBD,CArBD;;AAuBA,MAAMV,MAAM,GAAGR,gBAAgB,CAAC;EAC9BS,SAAS,EAAE;IACTiB,QAAQ,EAAE,QADD;IAETC,aAAa,EAAE,QAFN;IAGTC,KAAK,EAAE,MAHE;IAITC,mBAAmB,EAAE,CAJZ;IAKTC,oBAAoB,EAAE;EALb,CADmB;EAQ9BT,kBAAkB,EAAE;IAClBM,aAAa,EAAE,KADG;IAElBI,UAAU,EAAE,QAFM;IAGlBC,MAAM,EAAE;EAHU,CARU;EAa9BT,aAAa,EAAE;IACbU,UAAU,EAAE;EADC,CAbe;EAgB9BR,aAAa,EAAE;IACbS,gBAAgB,EAAE;EADL;AAhBe,CAAD,CAA/B;AAqBA9B,WAAW,CAAC+B,IAAZ,GAAmBnB,SAAnB;AACA,eAAeZ,WAAf"}
+{"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","DialogSheet","style","children","colors","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","icon","title","iconColor","titleColor","sheetItemContainer","highlight","sheetItemIcon","text","sheetItemText","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAKA,MAAMC,WAAyE,GAAG,QAAyB;EAAA,IAAxB;IAAEC,KAAF;IAASC;EAAT,CAAwB;EACzG,MAAM;IAAEC;EAAF,IAAaJ,aAAa,EAAhC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACK,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAAnB,EAAkFV,KAAlF;EAAb,GACGC,QADH,CADF;AAKD,CAPD;;AAeA,MAAMU,SAAS,GAAG,SAA4D;EAAA,IAA3D;IAAEC,IAAF;IAAQC,KAAR;IAAeC,SAAf;IAA0BC;EAA1B,CAA2D;EAC5E,MAAM;IAAEb;EAAF,IAAaJ,aAAa,EAAhC;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACK,MAAM,CAACa,kBAAR,EAA4B;MAAEX,eAAe,EAAEH,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BC;IAAjD,CAA5B;EAAb,GACGE,IAAI,iBACH,oBAAC,IAAD;IACE,IAAI,EAAEA,IADR;IAEE,KAAK,EAAEE,SAAS,IAAIZ,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BQ,SAFpD;IAGE,cAAc,EAAEd,MAAM,CAACe;EAHzB,EAFJ,eAQE,oBAAC,IAAD;IACE,SAAS,MADX;IAEE,aAAa,EAAE,CAFjB;IAGE,KAAK,EAAEH,UAAU,IAAIb,MAAM,CAACI,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BU,IAHrD;IAIE,KAAK,EAAEhB,MAAM,CAACiB;EAJhB,GAMGP,KANH,CARF,CADF;AAmBD,CArBD;;AAuBA,MAAMV,MAAM,GAAGN,gBAAgB,CAAC;EAC9BO,SAAS,EAAE;IACTiB,QAAQ,EAAE,QADD;IAETC,aAAa,EAAE,QAFN;IAGTC,KAAK,EAAE,MAHE;IAITC,mBAAmB,EAAE,CAJZ;IAKTC,oBAAoB,EAAE;EALb,CADmB;EAQ9BT,kBAAkB,EAAE;IAClBM,aAAa,EAAE,KADG;IAElBI,UAAU,EAAE,QAFM;IAGlBC,MAAM,EAAE;EAHU,CARU;EAa9BT,aAAa,EAAE;IACbU,UAAU,EAAE;EADC,CAbe;EAgB9BR,aAAa,EAAE;IACbS,IAAI,EAAE,CADO;IAEbC,gBAAgB,EAAE;EAFL;AAhBe,CAAD,CAA/B;AAsBA/B,WAAW,CAACgC,IAAZ,GAAmBpB,SAAnB;AACA,eAAeZ,WAAf"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
 import { View } from 'react-native';
 import { conditionChaining } from '@sendbird/uikit-utils';
+import Icon from '../../components/Icon';
 import Image from '../../components/Image';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import Badge from '../Badge';
-import Icon from '../Icon';
-import Text from '../Text';
 
 const GroupChannelPreview = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","conditionChaining","Image","createStyleSheet","useUIKitTheme","Badge","Icon","Text","GroupChannelPreview","customCover","coverUrl","memberCount","badgeCount","maxBadgeCount","body","bodyIcon","title","titleCaption","titleCaptionLeft","frozen","notificationOff","colors","color","ui","groupChannelPreview","styles","container","backgroundColor","default","none","background","coverContainer","Boolean","channelCover","coverBackground","uri","rightSection","rightTopSection","channelInfoContainer","channelInfoTitle","textTitle","channelInfoMemberCount","primary","channelInfoFrozen","onBackground03","titleCaptionContainer","textTitleCaption","titleCaptionText","rightBottomSection","bodyWrapper","bodyIconBackground","bodyText","textBody","separator","Separator","height","width","flexDirection","alignItems","justifyContent","marginLeft","marginRight","borderRadius","flex","paddingTop","paddingRight","marginBottom","flexShrink","marginTop","unreadBadge","minWidth","minHeight","position","left","right","bottom"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } 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 Badge from '../Badge';\nimport Icon from '../Icon';\nimport Text from '../Text';\n\ntype Props = {\n  customCover?: React.ReactElement;\n  coverUrl: string;\n\n  title: string;\n\n  titleCaption: string;\n  titleCaptionLeft?: React.ReactElement;\n\n  bodyIcon?: keyof typeof Icon.Assets;\n  body: string;\n\n  memberCount?: number;\n  badgeCount: number;\n  maxBadgeCount?: number;\n\n  frozen?: boolean;\n  notificationOff?: boolean;\n};\n\nconst GroupChannelPreview = ({\n  customCover,\n  coverUrl,\n  memberCount,\n  badgeCount,\n  maxBadgeCount,\n  body,\n  bodyIcon,\n  title,\n  titleCaption,\n  titleCaptionLeft,\n  frozen,\n  notificationOff,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelPreview;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.default.none.background }]}>\n      <View style={styles.coverContainer}>\n        {conditionChaining(\n          [Boolean(customCover)],\n          [\n            customCover,\n            <Image\n              resizeMode={'cover'}\n              style={[styles.channelCover, { backgroundColor: color.default.none.coverBackground }]}\n              source={{ uri: coverUrl }}\n            />,\n          ],\n        )}\n      </View>\n      <View style={styles.rightSection}>\n        <View style={styles.rightTopSection}>\n          <View style={styles.channelInfoContainer}>\n            <Text numberOfLines={1} subtitle1 style={styles.channelInfoTitle} color={color.default.none.textTitle}>\n              {title}\n            </Text>\n            {Boolean(memberCount) && (\n              <Text caption1 style={styles.channelInfoMemberCount} color={color.default.none.memberCount}>\n                {memberCount}\n              </Text>\n            )}\n            {frozen && (\n              <Icon size={16} icon={'freeze'} color={colors.primary} containerStyle={styles.channelInfoFrozen} />\n            )}\n            {notificationOff && <Icon size={16} icon={'notifications-off-filled'} color={colors.onBackground03} />}\n          </View>\n          <View style={styles.titleCaptionContainer}>\n            {titleCaptionLeft}\n            <Text caption2 color={color.default.none.textTitleCaption} style={styles.titleCaptionText}>\n              {titleCaption}\n            </Text>\n          </View>\n        </View>\n\n        <View style={styles.rightBottomSection}>\n          <View style={styles.body}>\n            <View style={styles.bodyWrapper}>\n              {bodyIcon && (\n                <Icon\n                  size={18}\n                  icon={bodyIcon}\n                  color={color.default.none.bodyIcon}\n                  containerStyle={[\n                    styles.bodyIcon,\n                    { backgroundColor: colors.ui.groupChannelPreview.default.none.bodyIconBackground },\n                  ]}\n                />\n              )}\n              <Text body3 numberOfLines={1} style={styles.bodyText} color={color.default.none.textBody}>\n                {body}\n              </Text>\n            </View>\n          </View>\n          <View>{badgeCount > 0 && <Badge count={badgeCount} maxCount={maxBadgeCount} />}</View>\n        </View>\n        <Separator color={color.default.none.separator} />\n      </View>\n    </View>\n  );\n};\n\ntype SeparatorProps = { color: string };\nconst Separator = ({ color }: SeparatorProps) => <View style={[styles.separator, { backgroundColor: color }]} />;\n\nconst styles = createStyleSheet({\n  container: {\n    height: 76,\n    width: '100%',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  coverContainer: {\n    marginLeft: 16,\n    marginRight: 16,\n  },\n  channelCover: {\n    width: 56,\n    height: 56,\n    borderRadius: 28,\n  },\n  rightSection: {\n    flex: 1,\n    paddingTop: 10,\n    paddingRight: 16,\n  },\n  rightTopSection: {\n    flexDirection: 'row',\n    marginBottom: 4,\n  },\n  channelInfoContainer: {\n    flex: 1,\n    marginRight: 4,\n    alignItems: 'center',\n    flexDirection: 'row',\n  },\n  channelInfoTitle: {\n    flexShrink: 1,\n    marginRight: 4,\n  },\n  channelInfoMemberCount: {\n    paddingTop: 2,\n    marginRight: 4,\n  },\n  channelInfoFrozen: {\n    marginRight: 4,\n  },\n  titleCaptionContainer: {\n    alignItems: 'flex-start',\n    flexDirection: 'row',\n    marginLeft: 4,\n  },\n  titleCaptionText: {\n    marginTop: 2,\n  },\n  rightBottomSection: {\n    flex: 1,\n    height: '100%',\n    flexDirection: 'row',\n  },\n  body: {\n    marginRight: 4,\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'flex-start',\n  },\n  bodyWrapper: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  bodyText: {\n    flex: 1,\n  },\n  bodyIcon: {\n    borderRadius: 8,\n    width: 26,\n    height: 26,\n    marginRight: 4,\n  },\n  unreadBadge: {\n    minWidth: 20,\n    minHeight: 20,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  separator: {\n    position: 'absolute',\n    left: 0,\n    right: -16,\n    bottom: 0,\n    height: 1,\n  },\n});\n\nexport default GroupChannelPreview;\n"],"mappings":"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"}
+{"version":3,"names":["React","View","conditionChaining","Icon","Image","Text","createStyleSheet","useUIKitTheme","Badge","GroupChannelPreview","customCover","coverUrl","memberCount","badgeCount","maxBadgeCount","body","bodyIcon","title","titleCaption","titleCaptionLeft","frozen","notificationOff","colors","color","ui","groupChannelPreview","styles","container","backgroundColor","default","none","background","coverContainer","Boolean","channelCover","coverBackground","uri","rightSection","rightTopSection","channelInfoContainer","channelInfoTitle","textTitle","channelInfoMemberCount","primary","channelInfoFrozen","onBackground03","titleCaptionContainer","textTitleCaption","titleCaptionText","rightBottomSection","bodyWrapper","bodyIconBackground","bodyText","textBody","separator","Separator","height","width","flexDirection","alignItems","justifyContent","marginLeft","marginRight","borderRadius","flex","paddingTop","paddingRight","marginBottom","flexShrink","marginTop","unreadBadge","minWidth","minHeight","position","left","right","bottom"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Icon from '../../components/Icon';\nimport Image from '../../components/Image';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Badge from '../Badge';\n\ntype Props = {\n  customCover?: React.ReactElement;\n  coverUrl: string;\n\n  title: string;\n\n  titleCaption: string;\n  titleCaptionLeft?: React.ReactElement;\n\n  bodyIcon?: keyof typeof Icon.Assets;\n  body: string;\n\n  memberCount?: number;\n  badgeCount: number;\n  maxBadgeCount?: number;\n\n  frozen?: boolean;\n  notificationOff?: boolean;\n};\n\nconst GroupChannelPreview = ({\n  customCover,\n  coverUrl,\n  memberCount,\n  badgeCount,\n  maxBadgeCount,\n  body,\n  bodyIcon,\n  title,\n  titleCaption,\n  titleCaptionLeft,\n  frozen,\n  notificationOff,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelPreview;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.default.none.background }]}>\n      <View style={styles.coverContainer}>\n        {conditionChaining(\n          [Boolean(customCover)],\n          [\n            customCover,\n            <Image\n              resizeMode={'cover'}\n              style={[styles.channelCover, { backgroundColor: color.default.none.coverBackground }]}\n              source={{ uri: coverUrl }}\n            />,\n          ],\n        )}\n      </View>\n      <View style={styles.rightSection}>\n        <View style={styles.rightTopSection}>\n          <View style={styles.channelInfoContainer}>\n            <Text numberOfLines={1} subtitle1 style={styles.channelInfoTitle} color={color.default.none.textTitle}>\n              {title}\n            </Text>\n            {Boolean(memberCount) && (\n              <Text caption1 style={styles.channelInfoMemberCount} color={color.default.none.memberCount}>\n                {memberCount}\n              </Text>\n            )}\n            {frozen && (\n              <Icon size={16} icon={'freeze'} color={colors.primary} containerStyle={styles.channelInfoFrozen} />\n            )}\n            {notificationOff && <Icon size={16} icon={'notifications-off-filled'} color={colors.onBackground03} />}\n          </View>\n          <View style={styles.titleCaptionContainer}>\n            {titleCaptionLeft}\n            <Text caption2 color={color.default.none.textTitleCaption} style={styles.titleCaptionText}>\n              {titleCaption}\n            </Text>\n          </View>\n        </View>\n\n        <View style={styles.rightBottomSection}>\n          <View style={styles.body}>\n            <View style={styles.bodyWrapper}>\n              {bodyIcon && (\n                <Icon\n                  size={18}\n                  icon={bodyIcon}\n                  color={color.default.none.bodyIcon}\n                  containerStyle={[\n                    styles.bodyIcon,\n                    { backgroundColor: colors.ui.groupChannelPreview.default.none.bodyIconBackground },\n                  ]}\n                />\n              )}\n              <Text body3 numberOfLines={1} style={styles.bodyText} color={color.default.none.textBody}>\n                {body}\n              </Text>\n            </View>\n          </View>\n          <View>{badgeCount > 0 && <Badge count={badgeCount} maxCount={maxBadgeCount} />}</View>\n        </View>\n        <Separator color={color.default.none.separator} />\n      </View>\n    </View>\n  );\n};\n\ntype SeparatorProps = { color: string };\nconst Separator = ({ color }: SeparatorProps) => <View style={[styles.separator, { backgroundColor: color }]} />;\n\nconst styles = createStyleSheet({\n  container: {\n    height: 76,\n    width: '100%',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  coverContainer: {\n    marginLeft: 16,\n    marginRight: 16,\n  },\n  channelCover: {\n    width: 56,\n    height: 56,\n    borderRadius: 28,\n  },\n  rightSection: {\n    flex: 1,\n    paddingTop: 10,\n    paddingRight: 16,\n  },\n  rightTopSection: {\n    flexDirection: 'row',\n    marginBottom: 4,\n  },\n  channelInfoContainer: {\n    flex: 1,\n    marginRight: 4,\n    alignItems: 'center',\n    flexDirection: 'row',\n  },\n  channelInfoTitle: {\n    flexShrink: 1,\n    marginRight: 4,\n  },\n  channelInfoMemberCount: {\n    paddingTop: 2,\n    marginRight: 4,\n  },\n  channelInfoFrozen: {\n    marginRight: 4,\n  },\n  titleCaptionContainer: {\n    alignItems: 'flex-start',\n    flexDirection: 'row',\n    marginLeft: 4,\n  },\n  titleCaptionText: {\n    marginTop: 2,\n  },\n  rightBottomSection: {\n    flex: 1,\n    height: '100%',\n    flexDirection: 'row',\n  },\n  body: {\n    marginRight: 4,\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'flex-start',\n  },\n  bodyWrapper: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  bodyText: {\n    flex: 1,\n  },\n  bodyIcon: {\n    borderRadius: 8,\n    width: 26,\n    height: 26,\n    marginRight: 4,\n  },\n  unreadBadge: {\n    minWidth: 20,\n    minHeight: 20,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  separator: {\n    position: 'absolute',\n    left: 0,\n    right: -16,\n    bottom: 0,\n    height: 1,\n  },\n});\n\nexport default GroupChannelPreview;\n"],"mappings":"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"}

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

@@ -4,10 +4,10 @@ import React from 'react';
 import { TouchableOpacity, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { conditionChaining } from '@sendbird/uikit-utils';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useHeaderStyle from '../../styles/useHeaderStyle';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Text from '../Text';
 const AlignMapper = {
   left: 'flex-start',
   center: 'center',

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

@@ -1 +1 @@
-{"version":3,"names":["React","TouchableOpacity","View","useSafeAreaInsets","conditionChaining","createStyleSheet","useHeaderStyle","useUIKitTheme","Text","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 type { BaseHeaderProps } from '../../index';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Text, { TextProps } from '../Text';\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","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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"}

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

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef } from 'react';
 import { Animated, Easing } from 'react-native';
+import Icon from '../../components/Icon';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Icon from '../Icon';
 
 const LoadingSpinner = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","Animated","Easing","useUIKitTheme","Icon","LoadingSpinner","size","color","style","colors","primary","useLoopAnimated","duration","useNativeDriver","animated","Value","current","loop","timing","toValue","easing","inOut","linear","resetBeforeIteration","start","stopAnimation","setValue","Rotate","children","rotate","interpolate","inputRange","outputRange","transform"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport { Animated, Easing, StyleProp, ViewStyle } from 'react-native';\n\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Icon from '../Icon';\n\ntype Props = {\n  size?: number;\n  color?: string;\n  style?: StyleProp<ViewStyle>;\n};\n\nconst LoadingSpinner = ({ size = 24, color, style }: Props) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Rotate style={style}>\n      <Icon icon={'spinner'} size={size} color={color ?? colors.primary} />\n    </Rotate>\n  );\n};\n\nconst useLoopAnimated = (duration: number, useNativeDriver = true) => {\n  const animated = useRef(new Animated.Value(0)).current;\n\n  useEffect(() => {\n    Animated.loop(\n      Animated.timing(animated, { toValue: 1, duration, useNativeDriver, easing: Easing.inOut(Easing.linear) }),\n      { resetBeforeIteration: true },\n    ).start();\n\n    return () => {\n      animated.stopAnimation();\n      animated.setValue(0);\n    };\n  }, []);\n\n  return animated;\n};\n\nconst Rotate = ({ children, style }: React.PropsWithChildren<{ style: StyleProp<ViewStyle> }>) => {\n  const loop = useLoopAnimated(1000);\n  const rotate = loop.interpolate({ inputRange: [0, 1], outputRange: ['0deg', '360deg'] });\n  return <Animated.View style={[style, { transform: [{ rotate }] }]}>{children}</Animated.View>;\n};\n\nexport default LoadingSpinner;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,MAA3B,QAAyC,OAAzC;AACA,SAASC,QAAT,EAAmBC,MAAnB,QAAuD,cAAvD;AAEA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAQA,MAAMC,cAAc,GAAG,QAAwC;EAAA,IAAvC;IAAEC,IAAI,GAAG,EAAT;IAAaC,KAAb;IAAoBC;EAApB,CAAuC;EAC7D,MAAM;IAAEC;EAAF,IAAaN,aAAa,EAAhC;EACA,oBACE,oBAAC,MAAD;IAAQ,KAAK,EAAEK;EAAf,gBACE,oBAAC,IAAD;IAAM,IAAI,EAAE,SAAZ;IAAuB,IAAI,EAAEF,IAA7B;IAAmC,KAAK,EAAEC,KAAK,IAAIE,MAAM,CAACC;EAA1D,EADF,CADF;AAKD,CAPD;;AASA,MAAMC,eAAe,GAAG,UAACC,QAAD,EAA8C;EAAA,IAA3BC,eAA2B,uEAAT,IAAS;EACpE,MAAMC,QAAQ,GAAGd,MAAM,CAAC,IAAIC,QAAQ,CAACc,KAAb,CAAmB,CAAnB,CAAD,CAAN,CAA8BC,OAA/C;EAEAjB,SAAS,CAAC,MAAM;IACdE,QAAQ,CAACgB,IAAT,CACEhB,QAAQ,CAACiB,MAAT,CAAgBJ,QAAhB,EAA0B;MAAEK,OAAO,EAAE,CAAX;MAAcP,QAAd;MAAwBC,eAAxB;MAAyCO,MAAM,EAAElB,MAAM,CAACmB,KAAP,CAAanB,MAAM,CAACoB,MAApB;IAAjD,CAA1B,CADF,EAEE;MAAEC,oBAAoB,EAAE;IAAxB,CAFF,EAGEC,KAHF;IAKA,OAAO,MAAM;MACXV,QAAQ,CAACW,aAAT;MACAX,QAAQ,CAACY,QAAT,CAAkB,CAAlB;IACD,CAHD;EAID,CAVQ,EAUN,EAVM,CAAT;EAYA,OAAOZ,QAAP;AACD,CAhBD;;AAkBA,MAAMa,MAAM,GAAG,SAAmF;EAAA,IAAlF;IAAEC,QAAF;IAAYpB;EAAZ,CAAkF;EAChG,MAAMS,IAAI,GAAGN,eAAe,CAAC,IAAD,CAA5B;EACA,MAAMkB,MAAM,GAAGZ,IAAI,CAACa,WAAL,CAAiB;IAAEC,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CAAd;IAAsBC,WAAW,EAAE,CAAC,MAAD,EAAS,QAAT;EAAnC,CAAjB,CAAf;EACA,oBAAO,oBAAC,QAAD,CAAU,IAAV;IAAe,KAAK,EAAE,CAACxB,KAAD,EAAQ;MAAEyB,SAAS,EAAE,CAAC;QAAEJ;MAAF,CAAD;IAAb,CAAR;EAAtB,GAA6DD,QAA7D,CAAP;AACD,CAJD;;AAMA,eAAevB,cAAf"}
+{"version":3,"names":["React","useEffect","useRef","Animated","Easing","Icon","useUIKitTheme","LoadingSpinner","size","color","style","colors","primary","useLoopAnimated","duration","useNativeDriver","animated","Value","current","loop","timing","toValue","easing","inOut","linear","resetBeforeIteration","start","stopAnimation","setValue","Rotate","children","rotate","interpolate","inputRange","outputRange","transform"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport { Animated, Easing, StyleProp, ViewStyle } from 'react-native';\n\nimport Icon from '../../components/Icon';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype Props = {\n  size?: number;\n  color?: string;\n  style?: StyleProp<ViewStyle>;\n};\n\nconst LoadingSpinner = ({ size = 24, color, style }: Props) => {\n  const { colors } = useUIKitTheme();\n  return (\n    <Rotate style={style}>\n      <Icon icon={'spinner'} size={size} color={color ?? colors.primary} />\n    </Rotate>\n  );\n};\n\nconst useLoopAnimated = (duration: number, useNativeDriver = true) => {\n  const animated = useRef(new Animated.Value(0)).current;\n\n  useEffect(() => {\n    Animated.loop(\n      Animated.timing(animated, { toValue: 1, duration, useNativeDriver, easing: Easing.inOut(Easing.linear) }),\n      { resetBeforeIteration: true },\n    ).start();\n\n    return () => {\n      animated.stopAnimation();\n      animated.setValue(0);\n    };\n  }, []);\n\n  return animated;\n};\n\nconst Rotate = ({ children, style }: React.PropsWithChildren<{ style: StyleProp<ViewStyle> }>) => {\n  const loop = useLoopAnimated(1000);\n  const rotate = loop.interpolate({ inputRange: [0, 1], outputRange: ['0deg', '360deg'] });\n  return <Animated.View style={[style, { transform: [{ rotate }] }]}>{children}</Animated.View>;\n};\n\nexport default LoadingSpinner;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,MAA3B,QAAyC,OAAzC;AACA,SAASC,QAAT,EAAmBC,MAAnB,QAAuD,cAAvD;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,aAAP,MAA0B,2BAA1B;;AAQA,MAAMC,cAAc,GAAG,QAAwC;EAAA,IAAvC;IAAEC,IAAI,GAAG,EAAT;IAAaC,KAAb;IAAoBC;EAApB,CAAuC;EAC7D,MAAM;IAAEC;EAAF,IAAaL,aAAa,EAAhC;EACA,oBACE,oBAAC,MAAD;IAAQ,KAAK,EAAEI;EAAf,gBACE,oBAAC,IAAD;IAAM,IAAI,EAAE,SAAZ;IAAuB,IAAI,EAAEF,IAA7B;IAAmC,KAAK,EAAEC,KAAK,IAAIE,MAAM,CAACC;EAA1D,EADF,CADF;AAKD,CAPD;;AASA,MAAMC,eAAe,GAAG,UAACC,QAAD,EAA8C;EAAA,IAA3BC,eAA2B,uEAAT,IAAS;EACpE,MAAMC,QAAQ,GAAGd,MAAM,CAAC,IAAIC,QAAQ,CAACc,KAAb,CAAmB,CAAnB,CAAD,CAAN,CAA8BC,OAA/C;EAEAjB,SAAS,CAAC,MAAM;IACdE,QAAQ,CAACgB,IAAT,CACEhB,QAAQ,CAACiB,MAAT,CAAgBJ,QAAhB,EAA0B;MAAEK,OAAO,EAAE,CAAX;MAAcP,QAAd;MAAwBC,eAAxB;MAAyCO,MAAM,EAAElB,MAAM,CAACmB,KAAP,CAAanB,MAAM,CAACoB,MAApB;IAAjD,CAA1B,CADF,EAEE;MAAEC,oBAAoB,EAAE;IAAxB,CAFF,EAGEC,KAHF;IAKA,OAAO,MAAM;MACXV,QAAQ,CAACW,aAAT;MACAX,QAAQ,CAACY,QAAT,CAAkB,CAAlB;IACD,CAHD;EAID,CAVQ,EAUN,EAVM,CAAT;EAYA,OAAOZ,QAAP;AACD,CAhBD;;AAkBA,MAAMa,MAAM,GAAG,SAAmF;EAAA,IAAlF;IAAEC,QAAF;IAAYpB;EAAZ,CAAkF;EAChG,MAAMS,IAAI,GAAGN,eAAe,CAAC,IAAD,CAA5B;EACA,MAAMkB,MAAM,GAAGZ,IAAI,CAACa,WAAL,CAAiB;IAAEC,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CAAd;IAAsBC,WAAW,EAAE,CAAC,MAAD,EAAS,QAAT;EAAnC,CAAjB,CAAf;EACA,oBAAO,oBAAC,QAAD,CAAU,IAAV;IAAe,KAAK,EAAE,CAACxB,KAAD,EAAQ;MAAEyB,SAAS,EAAE,CAAC;QAAEJ;MAAF,CAAD;IAAb,CAAR;EAAtB,GAA6DD,QAA7D,CAAP;AACD,CAJD;;AAMA,eAAevB,cAAf"}

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

@@ -1,11 +1,11 @@
 import React from 'react';
 import { Pressable, View } from 'react-native';
 import { conditionChaining } from '@sendbird/uikit-utils';
+import Divider from '../../components/Divider';
+import Icon from '../../components/Icon';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
-import Divider from '../Divider';
-import Icon from '../Icon';
-import Text from '../Text';
 
 const MenuBar = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","Pressable","View","conditionChaining","createStyleSheet","useUIKitTheme","Divider","Icon","Text","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 createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Divider from '../Divider';\nimport Icon from '../Icon';\nimport Text from '../Text';\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,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,IAAP,MAAiB,SAAjB;;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,IAAsBf,aAAa,EAAzC;EAEA,oBACE,oBAAC,IAAD,qBACE,oBAAC,SAAD;IAAW,QAAQ,EAAEM,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,GAAGjB,gBAAgB,CAAC;EAC9BkB,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","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"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
 import { View } from 'react-native';
 import { conditionChaining } from '@sendbird/uikit-utils';
+import Icon from '../../components/Icon';
+import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import Button from '../Button';
-import Icon from '../Icon';
 import LoadingSpinner from '../LoadingSpinner';
-import Text from '../Text';
 
 const Placeholder = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","conditionChaining","createStyleSheet","useUIKitTheme","Button","Icon","LoadingSpinner","Text","Placeholder","icon","loading","message","errorRetryLabel","onPressRetry","colors","styles","containerLoading","containerError","container","ui","placeholder","default","none","highlight","content","Boolean","width","height","alignItems","justifyContent"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport LoadingSpinner from '../LoadingSpinner';\nimport Text from '../Text';\n\ntype Props = {\n  loading?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  message?: string;\n  errorRetryLabel?: string;\n  onPressRetry?: () => void;\n};\n\nconst Placeholder = ({ icon, loading = false, message = '', errorRetryLabel, onPressRetry }: Props) => {\n  const { colors } = useUIKitTheme();\n\n  // loading ? styles.containerLoading : errorRetryLabel ? styles.containerError : styles.container\n  return (\n    <View\n      style={conditionChaining(\n        [loading, errorRetryLabel],\n        [styles.containerLoading, styles.containerError, styles.container],\n      )}\n    >\n      {conditionChaining(\n        [loading],\n        [\n          <LoadingSpinner size={64} color={colors.ui.placeholder.default.none.highlight} />,\n          <Icon icon={icon} size={64} color={colors.ui.placeholder.default.none.content} />,\n        ],\n      )}\n      {Boolean(message) && !loading && (\n        <Text body3 color={colors.ui.placeholder.default.none.content}>\n          {message}\n        </Text>\n      )}\n      {Boolean(errorRetryLabel) && !loading && (\n        <Button\n          variant={'text'}\n          onPress={onPressRetry}\n          contentColor={colors.ui.placeholder.default.none.highlight}\n          icon={'refresh'}\n        >\n          {errorRetryLabel}\n        </Button>\n      )}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    width: 200,\n    height: 100,\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  containerError: {\n    width: 200,\n    height: 148,\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  containerLoading: {\n    width: 200,\n    height: 100,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n\nexport default Placeholder;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,cAAP,MAA2B,mBAA3B;AACA,OAAOC,IAAP,MAAiB,SAAjB;;AAWA,MAAMC,WAAW,GAAG,QAAmF;EAAA,IAAlF;IAAEC,IAAF;IAAQC,OAAO,GAAG,KAAlB;IAAyBC,OAAO,GAAG,EAAnC;IAAuCC,eAAvC;IAAwDC;EAAxD,CAAkF;EACrG,MAAM;IAAEC;EAAF,IAAaX,aAAa,EAAhC,CADqG,CAGrG;;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAEF,iBAAiB,CACtB,CAACS,OAAD,EAAUE,eAAV,CADsB,EAEtB,CAACG,MAAM,CAACC,gBAAR,EAA0BD,MAAM,CAACE,cAAjC,EAAiDF,MAAM,CAACG,SAAxD,CAFsB;EAD1B,GAMGjB,iBAAiB,CAChB,CAACS,OAAD,CADgB,EAEhB,cACE,oBAAC,cAAD;IAAgB,IAAI,EAAE,EAAtB;IAA0B,KAAK,EAAEI,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCC;EAApE,EADF,eAEE,oBAAC,IAAD;IAAM,IAAI,EAAEd,IAAZ;IAAkB,IAAI,EAAE,EAAxB;IAA4B,KAAK,EAAEK,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCE;EAAtE,EAFF,CAFgB,CANpB,EAaGC,OAAO,CAACd,OAAD,CAAP,IAAoB,CAACD,OAArB,iBACC,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,KAAK,EAAEI,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCE;EAAtD,GACGb,OADH,CAdJ,EAkBGc,OAAO,CAACb,eAAD,CAAP,IAA4B,CAACF,OAA7B,iBACC,oBAAC,MAAD;IACE,OAAO,EAAE,MADX;IAEE,OAAO,EAAEG,YAFX;IAGE,YAAY,EAAEC,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCC,SAHnD;IAIE,IAAI,EAAE;EAJR,GAMGX,eANH,CAnBJ,CADF;AA+BD,CAnCD;;AAqCA,MAAMG,MAAM,GAAGb,gBAAgB,CAAC;EAC9BgB,SAAS,EAAE;IACTQ,KAAK,EAAE,GADE;IAETC,MAAM,EAAE,GAFC;IAGTC,UAAU,EAAE,QAHH;IAITC,cAAc,EAAE;EAJP,CADmB;EAO9BZ,cAAc,EAAE;IACdS,KAAK,EAAE,GADO;IAEdC,MAAM,EAAE,GAFM;IAGdC,UAAU,EAAE,QAHE;IAIdC,cAAc,EAAE;EAJF,CAPc;EAa9Bb,gBAAgB,EAAE;IAChBU,KAAK,EAAE,GADS;IAEhBC,MAAM,EAAE,GAFQ;IAGhBC,UAAU,EAAE,QAHI;IAIhBC,cAAc,EAAE;EAJA;AAbY,CAAD,CAA/B;AAqBA,eAAerB,WAAf"}
+{"version":3,"names":["React","View","conditionChaining","Icon","Text","createStyleSheet","useUIKitTheme","Button","LoadingSpinner","Placeholder","icon","loading","message","errorRetryLabel","onPressRetry","colors","styles","containerLoading","containerError","container","ui","placeholder","default","none","highlight","content","Boolean","width","height","alignItems","justifyContent"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Button from '../Button';\nimport LoadingSpinner from '../LoadingSpinner';\n\ntype Props = {\n  loading?: boolean;\n\n  icon: keyof typeof Icon.Assets;\n  message?: string;\n  errorRetryLabel?: string;\n  onPressRetry?: () => void;\n};\n\nconst Placeholder = ({ icon, loading = false, message = '', errorRetryLabel, onPressRetry }: Props) => {\n  const { colors } = useUIKitTheme();\n\n  // loading ? styles.containerLoading : errorRetryLabel ? styles.containerError : styles.container\n  return (\n    <View\n      style={conditionChaining(\n        [loading, errorRetryLabel],\n        [styles.containerLoading, styles.containerError, styles.container],\n      )}\n    >\n      {conditionChaining(\n        [loading],\n        [\n          <LoadingSpinner size={64} color={colors.ui.placeholder.default.none.highlight} />,\n          <Icon icon={icon} size={64} color={colors.ui.placeholder.default.none.content} />,\n        ],\n      )}\n      {Boolean(message) && !loading && (\n        <Text body3 color={colors.ui.placeholder.default.none.content}>\n          {message}\n        </Text>\n      )}\n      {Boolean(errorRetryLabel) && !loading && (\n        <Button\n          variant={'text'}\n          onPress={onPressRetry}\n          contentColor={colors.ui.placeholder.default.none.highlight}\n          icon={'refresh'}\n        >\n          {errorRetryLabel}\n        </Button>\n      )}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    width: 200,\n    height: 100,\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  containerError: {\n    width: 200,\n    height: 148,\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  containerLoading: {\n    width: 200,\n    height: 100,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n\nexport default Placeholder;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,iBAAT,QAAkC,uBAAlC;AAEA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,cAAP,MAA2B,mBAA3B;;AAWA,MAAMC,WAAW,GAAG,QAAmF;EAAA,IAAlF;IAAEC,IAAF;IAAQC,OAAO,GAAG,KAAlB;IAAyBC,OAAO,GAAG,EAAnC;IAAuCC,eAAvC;IAAwDC;EAAxD,CAAkF;EACrG,MAAM;IAAEC;EAAF,IAAaT,aAAa,EAAhC,CADqG,CAGrG;;EACA,oBACE,oBAAC,IAAD;IACE,KAAK,EAAEJ,iBAAiB,CACtB,CAACS,OAAD,EAAUE,eAAV,CADsB,EAEtB,CAACG,MAAM,CAACC,gBAAR,EAA0BD,MAAM,CAACE,cAAjC,EAAiDF,MAAM,CAACG,SAAxD,CAFsB;EAD1B,GAMGjB,iBAAiB,CAChB,CAACS,OAAD,CADgB,EAEhB,cACE,oBAAC,cAAD;IAAgB,IAAI,EAAE,EAAtB;IAA0B,KAAK,EAAEI,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCC;EAApE,EADF,eAEE,oBAAC,IAAD;IAAM,IAAI,EAAEd,IAAZ;IAAkB,IAAI,EAAE,EAAxB;IAA4B,KAAK,EAAEK,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCE;EAAtE,EAFF,CAFgB,CANpB,EAaGC,OAAO,CAACd,OAAD,CAAP,IAAoB,CAACD,OAArB,iBACC,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,KAAK,EAAEI,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCE;EAAtD,GACGb,OADH,CAdJ,EAkBGc,OAAO,CAACb,eAAD,CAAP,IAA4B,CAACF,OAA7B,iBACC,oBAAC,MAAD;IACE,OAAO,EAAE,MADX;IAEE,OAAO,EAAEG,YAFX;IAGE,YAAY,EAAEC,MAAM,CAACK,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA9B,CAAmCC,SAHnD;IAIE,IAAI,EAAE;EAJR,GAMGX,eANH,CAnBJ,CADF;AA+BD,CAnCD;;AAqCA,MAAMG,MAAM,GAAGX,gBAAgB,CAAC;EAC9Bc,SAAS,EAAE;IACTQ,KAAK,EAAE,GADE;IAETC,MAAM,EAAE,GAFC;IAGTC,UAAU,EAAE,QAHH;IAITC,cAAc,EAAE;EAJP,CADmB;EAO9BZ,cAAc,EAAE;IACdS,KAAK,EAAE,GADO;IAEdC,MAAM,EAAE,GAFM;IAGdC,UAAU,EAAE,QAHE;IAIdC,cAAc,EAAE;EAJF,CAPc;EAa9Bb,gBAAgB,EAAE;IAChBU,KAAK,EAAE,GADS;IAEhBC,MAAM,EAAE,GAFQ;IAGhBC,UAAU,EAAE,QAHI;IAIhBC,cAAc,EAAE;EAJA;AAbY,CAAD,CAA/B;AAqBA,eAAerB,WAAf"}

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

@@ -1,14 +1,14 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { Keyboard, Platform, View, useWindowDimensions } from 'react-native';
 import { NOOP } from '@sendbird/uikit-utils';
+import Modal from '../../components/Modal';
+import Text from '../../components/Text';
+import TextInput from '../../components/TextInput';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useHeaderStyle from '../../styles/useHeaderStyle';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import Button from '../Button';
 import DialogBox from '../Dialog/DialogBox';
-import Modal from '../Modal';
-import Text from '../Text';
-import TextInput from '../TextInput';
 
 const Prompt = _ref => {
   let {

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","Keyboard","Platform","View","useWindowDimensions","NOOP","createStyleSheet","useHeaderStyle","useUIKitTheme","Button","DialogBox","Modal","Text","TextInput","Prompt","onDismiss","visible","onHide","autoFocus","title","defaultValue","placeholder","onSubmit","onCancel","submitLabel","cancelLabel","statusBarTranslucent","colors","inputRef","width","height","buttons","text","onPress","setText","setTimeout","OS","current","blur","focus","alignItems","justifyContent","styles","container","Boolean","titleContainer","ui","dialog","default","none","flex","inputContainer","paddingHorizontal","paddingVertical","buttonContainer","map","index","button","highlight","dismiss","paddingTop","marginBottom","flexDirection","padding","marginLeft"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Keyboard, Platform, TextInput as RNTextInput, View, useWindowDimensions } from 'react-native';\n\nimport { NOOP } from '@sendbird/uikit-utils';\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';\nimport TextInput from '../TextInput';\n\nexport type PromptItem = {\n  title: string;\n  placeholder?: string;\n  defaultValue?: string;\n  onSubmit?: (text: string) => void;\n  submitLabel?: string;\n  onCancel?: () => void;\n  cancelLabel?: string;\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n  autoFocus?: boolean;\n} & PromptItem;\nconst Prompt = ({\n  onDismiss,\n  visible,\n  onHide,\n  autoFocus = true,\n  title,\n  defaultValue = '',\n  placeholder = 'Enter',\n  onSubmit = NOOP,\n  onCancel = NOOP,\n  submitLabel = 'Submit',\n  cancelLabel = 'Cancel',\n}: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const inputRef = useRef<RNTextInput>(null);\n  const { width, height } = useWindowDimensions();\n\n  const buttons = [\n    { text: cancelLabel, onPress: onCancel },\n    { text: submitLabel, onPress: () => onSubmit(text) },\n  ];\n\n  const [text, setText] = useState(defaultValue);\n\n  // FIXME: autoFocus trick with modal\n  // Android\n  // - InputProps.autoFocus is not trigger keyboard appearing.\n  // - InputRef.focus() is trigger keyboard appearing, but position of keyboard selection is always the start of text.\n  // iOS\n  // - InputProps.autoFocus is trigger weird UI behavior on landscape mode.\n  useEffect(() => {\n    if (autoFocus && visible) {\n      setTimeout(() => {\n        if (Platform.OS === 'android') inputRef.current?.blur();\n        inputRef.current?.focus();\n      }, 250);\n    }\n  }, [autoFocus, visible, `${width}-${height}`]);\n\n  return (\n    <Modal\n      enableKeyboardAvoid\n      disableBackgroundClose\n      onClose={onHide}\n      onDismiss={() => {\n        setText('');\n        onDismiss?.();\n      }}\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.inputContainer}>\n          <TextInput\n            autoFocus={autoFocus && Platform.OS === 'android'}\n            ref={inputRef}\n            placeholder={placeholder}\n            variant={'underline'}\n            value={text}\n            onChangeText={setText}\n            style={{ paddingHorizontal: 0, paddingVertical: 10 }}\n          />\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text, onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                contentColor={colors.ui.dialog.default.none.highlight}\n                onPress={() => {\n                  Keyboard.dismiss();\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 8,\n  },\n  titleContainer: {\n    marginBottom: 12,\n    paddingVertical: 12,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  inputContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n});\n\nexport default Prompt;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,MAA3B,EAAmCC,QAAnC,QAAmD,OAAnD;AACA,SAASC,QAAT,EAAmBC,QAAnB,EAAuDC,IAAvD,EAA6DC,mBAA7D,QAAwF,cAAxF;AAEA,SAASC,IAAT,QAAqB,uBAArB;AAEA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,SAAP,MAAsB,qBAAtB;AACA,OAAOC,KAAP,MAAkB,UAAlB;AACA,OAAOC,IAAP,MAAiB,SAAjB;AACA,OAAOC,SAAP,MAAsB,cAAtB;;AAkBA,MAAMC,MAAM,GAAG,QAYF;EAAA,IAZG;IACdC,SADc;IAEdC,OAFc;IAGdC,MAHc;IAIdC,SAAS,GAAG,IAJE;IAKdC,KALc;IAMdC,YAAY,GAAG,EAND;IAOdC,WAAW,GAAG,OAPA;IAQdC,QAAQ,GAAGjB,IARG;IASdkB,QAAQ,GAAGlB,IATG;IAUdmB,WAAW,GAAG,QAVA;IAWdC,WAAW,GAAG;EAXA,CAYH;EACX,MAAM;IAAEC;EAAF,IAA2BnB,cAAc,EAA/C;EACA,MAAM;IAAEoB;EAAF,IAAanB,aAAa,EAAhC;EACA,MAAMoB,QAAQ,GAAG7B,MAAM,CAAc,IAAd,CAAvB;EACA,MAAM;IAAE8B,KAAF;IAASC;EAAT,IAAoB1B,mBAAmB,EAA7C;EAEA,MAAM2B,OAAO,GAAG,CACd;IAAEC,IAAI,EAAEP,WAAR;IAAqBQ,OAAO,EAAEV;EAA9B,CADc,EAEd;IAAES,IAAI,EAAER,WAAR;IAAqBS,OAAO,EAAE,MAAMX,QAAQ,CAACU,IAAD;EAA5C,CAFc,CAAhB;EAKA,MAAM,CAACA,IAAD,EAAOE,OAAP,IAAkBlC,QAAQ,CAACoB,YAAD,CAAhC,CAXW,CAaX;EACA;EACA;EACA;EACA;EACA;;EACAtB,SAAS,CAAC,MAAM;IACd,IAAIoB,SAAS,IAAIF,OAAjB,EAA0B;MACxBmB,UAAU,CAAC,MAAM;QAAA;;QACf,IAAIjC,QAAQ,CAACkC,EAAT,KAAgB,SAApB,EAA+B,qBAAAR,QAAQ,CAACS,OAAT,wEAAkBC,IAAlB;QAC/B,sBAAAV,QAAQ,CAACS,OAAT,0EAAkBE,KAAlB;MACD,CAHS,EAGP,GAHO,CAAV;IAID;EACF,CAPQ,EAON,CAACrB,SAAD,EAAYF,OAAZ,EAAsB,GAAEa,KAAM,IAAGC,MAAO,EAAxC,CAPM,CAAT;EASA,oBACE,oBAAC,KAAD;IACE,mBAAmB,MADrB;IAEE,sBAAsB,MAFxB;IAGE,OAAO,EAAEb,MAHX;IAIE,SAAS,EAAE,MAAM;MACfiB,OAAO,CAAC,EAAD,CAAP;MACAnB,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS;IACV,CAPH;IAQE,oBAAoB,EAAEW,oBARxB;IASE,OAAO,EAAEV,OATX;IAUE,eAAe,EAAE;MAAEwB,UAAU,EAAE,QAAd;MAAwBC,cAAc,EAAE;IAAxC;EAVnB,gBAYE,oBAAC,SAAD;IAAW,KAAK,EAAEC,MAAM,CAACC;EAAzB,GACGC,OAAO,CAACzB,KAAD,CAAP,iBACC,oBAAC,IAAD;IAAM,KAAK,EAAEuB,MAAM,CAACG;EAApB,gBACE,oBAAC,IAAD;IAAM,EAAE,MAAR;IAAS,KAAK,EAAElB,MAAM,CAACmB,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BjB,IAA9C;IAAoD,aAAa,EAAE,CAAnE;IAAsE,KAAK,EAAE;MAAEkB,IAAI,EAAE;IAAR;EAA7E,GACG/B,KADH,CADF,CAFJ,eASE,oBAAC,IAAD;IAAM,KAAK,EAAEuB,MAAM,CAACS;EAApB,gBACE,oBAAC,SAAD;IACE,SAAS,EAAEjC,SAAS,IAAIhB,QAAQ,CAACkC,EAAT,KAAgB,SAD1C;IAEE,GAAG,EAAER,QAFP;IAGE,WAAW,EAAEP,WAHf;IAIE,OAAO,EAAE,WAJX;IAKE,KAAK,EAAEW,IALT;IAME,YAAY,EAAEE,OANhB;IAOE,KAAK,EAAE;MAAEkB,iBAAiB,EAAE,CAArB;MAAwBC,eAAe,EAAE;IAAzC;EAPT,EADF,CATF,eAqBE,oBAAC,IAAD;IAAM,KAAK,EAAEX,MAAM,CAACY;EAApB,GACGvB,OAAO,CAACwB,GAAR,CAAY,QAAoBC,KAApB,KAA8B;IAAA,IAA7B;MAAExB,IAAF;MAAQC;IAAR,CAA6B;IACzC,oBACE,oBAAC,MAAD;MACE,GAAG,EAAED,IAAI,GAAGwB,KADd;MAEE,OAAO,EAAE,MAFX;MAGE,KAAK,EAAEd,MAAM,CAACe,MAHhB;MAIE,YAAY,EAAE9B,MAAM,CAACmB,EAAP,CAAUC,MAAV,CAAiBC,OAAjB,CAAyBC,IAAzB,CAA8BS,SAJ9C;MAKE,OAAO,EAAE,MAAM;QACbzD,QAAQ,CAAC0D,OAAT;;QACA,IAAI;UACF1B,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO;QACR,CAFD,SAEU;UACRhB,MAAM;QACP;MACF;IAZH,GAcGe,IAdH,CADF;EAkBD,CAnBA,CADH,CArBF,CAZF,CADF;AA2DD,CAnGD;;AAqGA,MAAMU,MAAM,GAAGpC,gBAAgB,CAAC;EAC9BqC,SAAS,EAAE;IACTiB,UAAU,EAAE;EADH,CADmB;EAI9Bf,cAAc,EAAE;IACdgB,YAAY,EAAE,EADA;IAEdR,eAAe,EAAE,EAFH;IAGdD,iBAAiB,EAAE,EAHL;IAIdU,aAAa,EAAE,KAJD;IAKdtB,UAAU,EAAE;EALE,CAJc;EAW9BW,cAAc,EAAE;IACdC,iBAAiB,EAAE,EADL;IAEdS,YAAY,EAAE;EAFA,CAXc;EAe9BP,eAAe,EAAE;IACfQ,aAAa,EAAE,KADA;IAEftB,UAAU,EAAE,QAFG;IAGfC,cAAc,EAAE,UAHD;IAIfsB,OAAO,EAAE;EAJM,CAfa;EAqB9BN,MAAM,EAAE;IACNO,UAAU,EAAE;EADN;AArBsB,CAAD,CAA/B;AA0BA,eAAelD,MAAf"}
+{"version":3,"names":["React","useEffect","useRef","useState","Keyboard","Platform","View","useWindowDimensions","NOOP","Modal","Text","TextInput","createStyleSheet","useHeaderStyle","useUIKitTheme","Button","DialogBox","Prompt","onDismiss","visible","onHide","autoFocus","title","defaultValue","placeholder","onSubmit","onCancel","submitLabel","cancelLabel","statusBarTranslucent","colors","inputRef","width","height","buttons","text","onPress","setText","setTimeout","OS","current","blur","focus","alignItems","justifyContent","styles","container","Boolean","titleContainer","ui","dialog","default","none","flex","inputContainer","paddingHorizontal","paddingVertical","buttonContainer","map","index","button","highlight","dismiss","paddingTop","marginBottom","flexDirection","padding","marginLeft"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Keyboard, Platform, TextInput as RNTextInput, View, useWindowDimensions } from 'react-native';\n\nimport { NOOP } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport TextInput from '../../components/TextInput';\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 PromptItem = {\n  title: string;\n  placeholder?: string;\n  defaultValue?: string;\n  onSubmit?: (text: string) => void;\n  submitLabel?: string;\n  onCancel?: () => void;\n  cancelLabel?: string;\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n  autoFocus?: boolean;\n} & PromptItem;\nconst Prompt = ({\n  onDismiss,\n  visible,\n  onHide,\n  autoFocus = true,\n  title,\n  defaultValue = '',\n  placeholder = 'Enter',\n  onSubmit = NOOP,\n  onCancel = NOOP,\n  submitLabel = 'Submit',\n  cancelLabel = 'Cancel',\n}: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const inputRef = useRef<RNTextInput>(null);\n  const { width, height } = useWindowDimensions();\n\n  const buttons = [\n    { text: cancelLabel, onPress: onCancel },\n    { text: submitLabel, onPress: () => onSubmit(text) },\n  ];\n\n  const [text, setText] = useState(defaultValue);\n\n  // FIXME: autoFocus trick with modal\n  // Android\n  // - InputProps.autoFocus is not trigger keyboard appearing.\n  // - InputRef.focus() is trigger keyboard appearing, but position of keyboard selection is always the start of text.\n  // iOS\n  // - InputProps.autoFocus is trigger weird UI behavior on landscape mode.\n  useEffect(() => {\n    if (autoFocus && visible) {\n      setTimeout(() => {\n        if (Platform.OS === 'android') inputRef.current?.blur();\n        inputRef.current?.focus();\n      }, 250);\n    }\n  }, [autoFocus, visible, `${width}-${height}`]);\n\n  return (\n    <Modal\n      enableKeyboardAvoid\n      disableBackgroundClose\n      onClose={onHide}\n      onDismiss={() => {\n        setText('');\n        onDismiss?.();\n      }}\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.inputContainer}>\n          <TextInput\n            autoFocus={autoFocus && Platform.OS === 'android'}\n            ref={inputRef}\n            placeholder={placeholder}\n            variant={'underline'}\n            value={text}\n            onChangeText={setText}\n            style={{ paddingHorizontal: 0, paddingVertical: 10 }}\n          />\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text, onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                contentColor={colors.ui.dialog.default.none.highlight}\n                onPress={() => {\n                  Keyboard.dismiss();\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 8,\n  },\n  titleContainer: {\n    marginBottom: 12,\n    paddingVertical: 12,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  inputContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n});\n\nexport default Prompt;\n"],"mappings":"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"}