@sendbird/uikit-react-native-foundation 3.2.0 → 3.3.0

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

@@ -28,12 +28,16 @@ const TextInput = /*#__PURE__*/_react.default.forwardRef(function TextInput(_ref
     borderBottomWidth: 2,
     borderBottomColor: inputStyle.highlight
   };
+  const fontStyle = {
+    ...typography.body3,
+    lineHeight: typography.body3.fontSize ? typography.body3.fontSize * 1.2 : undefined
+  };
   return /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, _extends({
     ref: ref,
     editable: editable,
     selectionColor: inputStyle.highlight,
     placeholderTextColor: inputStyle.placeholder,
-    style: [typography.body3, styles.input, {
+    style: [fontStyle, styles.input, {
       color: inputStyle.text,
       backgroundColor: inputStyle.background
     }, underlineStyle, style]
@@ -41,8 +45,11 @@ const TextInput = /*#__PURE__*/_react.default.forwardRef(function TextInput(_ref
 });
 const styles = (0, _createStyleSheet.default)({
   input: {
-    paddingVertical: 8,
-    paddingHorizontal: 16
+    includeFontPadding: false,
+    paddingTop: 8,
+    paddingBottom: 8,
+    paddingLeft: 16,
+    paddingRight: 16
   }
 });
 var _default = TextInput;

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_createStyleSheet","_useUIKitTheme","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","TextInput","React","forwardRef","_ref","ref","children","style","variant","editable","props","typography","colors","useUIKitTheme","variantStyle","inputStyle","active","disabled","underlineStyle","borderBottomWidth","borderBottomColor","highlight","createElement","selectionColor","placeholderTextColor","placeholder","body3","styles","input","color","text","backgroundColor","background","createStyleSheet","paddingVertical","paddingHorizontal","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TextInput as RNTextInput, TextInputProps } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport type { UIKitTheme } from '../../types';\n\ntype Props = { variant?: keyof UIKitTheme['colors']['ui']['input'] } & TextInputProps;\nconst TextInput = React.forwardRef<RNTextInput, Props>(function TextInput(\n  { children, style, variant = 'default', editable = true, ...props },\n  ref,\n) {\n  const { typography, colors } = useUIKitTheme();\n\n  const variantStyle = colors['ui']['input'][variant];\n  const inputStyle = editable ? variantStyle.active : variantStyle.disabled;\n  const underlineStyle = variant === 'underline' && { borderBottomWidth: 2, borderBottomColor: inputStyle.highlight };\n\n  return (\n    <RNTextInput\n      ref={ref}\n      editable={editable}\n      selectionColor={inputStyle.highlight}\n      placeholderTextColor={inputStyle.placeholder}\n      style={[\n        typography.body3,\n        styles.input,\n        { color: inputStyle.text, backgroundColor: inputStyle.background },\n        underlineStyle,\n        style,\n      ]}\n      {...props}\n    >\n      {children}\n    </RNTextInput>\n  );\n});\n\nconst styles = createStyleSheet({\n  input: {\n    paddingVertical: 8,\n    paddingHorizontal: 16,\n  },\n});\n\nexport default TextInput;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,iBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,cAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAAsD,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAItD,MAAMQ,SAAS,gBAAGC,cAAK,CAACC,UAAU,CAAqB,SAASF,SAASA,CAAAG,IAAA,EAEvEC,GAAG,EACH;EAAA,IAFA;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,OAAO,GAAG,SAAS;IAAEC,QAAQ,GAAG,IAAI;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAGnE,MAAM;IAAEO,UAAU;IAAEC;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAE9C,MAAMC,YAAY,GAAGF,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAACJ,OAAO,CAAC;EACnD,MAAMO,UAAU,GAAGN,QAAQ,GAAGK,YAAY,CAACE,MAAM,GAAGF,YAAY,CAACG,QAAQ;EACzE,MAAMC,cAAc,GAAGV,OAAO,KAAK,WAAW,IAAI;IAAEW,iBAAiB,EAAE,CAAC;IAAEC,iBAAiB,EAAEL,UAAU,CAACM;EAAU,CAAC;EAEnH,oBACE3C,MAAA,CAAAQ,OAAA,CAAAoC,aAAA,CAACzC,YAAA,CAAAoB,SAAW,EAAAd,QAAA;IACVkB,GAAG,EAAEA,GAAI;IACTI,QAAQ,EAAEA,QAAS;IACnBc,cAAc,EAAER,UAAU,CAACM,SAAU;IACrCG,oBAAoB,EAAET,UAAU,CAACU,WAAY;IAC7ClB,KAAK,EAAE,CACLI,UAAU,CAACe,KAAK,EAChBC,MAAM,CAACC,KAAK,EACZ;MAAEC,KAAK,EAAEd,UAAU,CAACe,IAAI;MAAEC,eAAe,EAAEhB,UAAU,CAACiB;IAAW,CAAC,EAClEd,cAAc,EACdX,KAAK;EACL,GACEG,KAAK,GAERJ,QAAQ,CACG;AAElB,CAAC,CAAC;AAEF,MAAMqB,MAAM,GAAG,IAAAM,yBAAgB,EAAC;EAC9BL,KAAK,EAAE;IACLM,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEYnC,SAAS;AAAAoC,OAAA,CAAAnD,OAAA,GAAAkD,QAAA"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_createStyleSheet","_useUIKitTheme","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","TextInput","React","forwardRef","_ref","ref","children","style","variant","editable","props","typography","colors","useUIKitTheme","variantStyle","inputStyle","active","disabled","underlineStyle","borderBottomWidth","borderBottomColor","highlight","fontStyle","body3","lineHeight","fontSize","undefined","createElement","selectionColor","placeholderTextColor","placeholder","styles","input","color","text","backgroundColor","background","createStyleSheet","includeFontPadding","paddingTop","paddingBottom","paddingLeft","paddingRight","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TextInput as RNTextInput, TextInputProps } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport type { UIKitTheme } from '../../types';\n\ntype Props = { variant?: keyof UIKitTheme['colors']['ui']['input'] } & TextInputProps;\nconst TextInput = React.forwardRef<RNTextInput, Props>(function TextInput(\n  { children, style, variant = 'default', editable = true, ...props },\n  ref,\n) {\n  const { typography, colors } = useUIKitTheme();\n\n  const variantStyle = colors['ui']['input'][variant];\n  const inputStyle = editable ? variantStyle.active : variantStyle.disabled;\n  const underlineStyle = variant === 'underline' && { borderBottomWidth: 2, borderBottomColor: inputStyle.highlight };\n  const fontStyle = {\n    ...typography.body3,\n    lineHeight: typography.body3.fontSize ? typography.body3.fontSize * 1.2 : undefined,\n  };\n\n  return (\n    <RNTextInput\n      ref={ref}\n      editable={editable}\n      selectionColor={inputStyle.highlight}\n      placeholderTextColor={inputStyle.placeholder}\n      style={[\n        fontStyle,\n        styles.input,\n        { color: inputStyle.text, backgroundColor: inputStyle.background },\n        underlineStyle,\n        style,\n      ]}\n      {...props}\n    >\n      {children}\n    </RNTextInput>\n  );\n});\n\nconst styles = createStyleSheet({\n  input: {\n    includeFontPadding: false,\n    paddingTop: 8,\n    paddingBottom: 8,\n    paddingLeft: 16,\n    paddingRight: 16,\n  },\n});\n\nexport default TextInput;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,iBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,cAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAAsD,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAItD,MAAMQ,SAAS,gBAAGC,cAAK,CAACC,UAAU,CAAqB,SAASF,SAASA,CAAAG,IAAA,EAEvEC,GAAG,EACH;EAAA,IAFA;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,OAAO,GAAG,SAAS;IAAEC,QAAQ,GAAG,IAAI;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAGnE,MAAM;IAAEO,UAAU;IAAEC;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAE9C,MAAMC,YAAY,GAAGF,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAACJ,OAAO,CAAC;EACnD,MAAMO,UAAU,GAAGN,QAAQ,GAAGK,YAAY,CAACE,MAAM,GAAGF,YAAY,CAACG,QAAQ;EACzE,MAAMC,cAAc,GAAGV,OAAO,KAAK,WAAW,IAAI;IAAEW,iBAAiB,EAAE,CAAC;IAAEC,iBAAiB,EAAEL,UAAU,CAACM;EAAU,CAAC;EACnH,MAAMC,SAAS,GAAG;IAChB,GAAGX,UAAU,CAACY,KAAK;IACnBC,UAAU,EAAEb,UAAU,CAACY,KAAK,CAACE,QAAQ,GAAGd,UAAU,CAACY,KAAK,CAACE,QAAQ,GAAG,GAAG,GAAGC;EAC5E,CAAC;EAED,oBACEhD,MAAA,CAAAQ,OAAA,CAAAyC,aAAA,CAAC9C,YAAA,CAAAoB,SAAW,EAAAd,QAAA;IACVkB,GAAG,EAAEA,GAAI;IACTI,QAAQ,EAAEA,QAAS;IACnBmB,cAAc,EAAEb,UAAU,CAACM,SAAU;IACrCQ,oBAAoB,EAAEd,UAAU,CAACe,WAAY;IAC7CvB,KAAK,EAAE,CACLe,SAAS,EACTS,MAAM,CAACC,KAAK,EACZ;MAAEC,KAAK,EAAElB,UAAU,CAACmB,IAAI;MAAEC,eAAe,EAAEpB,UAAU,CAACqB;IAAW,CAAC,EAClElB,cAAc,EACdX,KAAK;EACL,GACEG,KAAK,GAERJ,QAAQ,CACG;AAElB,CAAC,CAAC;AAEF,MAAMyB,MAAM,GAAG,IAAAM,yBAAgB,EAAC;EAC9BL,KAAK,EAAE;IACLM,kBAAkB,EAAE,KAAK;IACzBC,UAAU,EAAE,CAAC;IACbC,aAAa,EAAE,CAAC;IAChBC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEY1C,SAAS;AAAA2C,OAAA,CAAA1D,OAAA,GAAAyD,QAAA"}

package/lib/commonjs/index.js

@@ -237,6 +237,12 @@ Object.defineProperty(exports, "ToastProvider", {
     return _Toast.ToastProvider;
   }
 });
+Object.defineProperty(exports, "TypingIndicatorBubble", {
+  enumerable: true,
+  get: function () {
+    return _TypingIndicatorBubble.default;
+  }
+});
 Object.defineProperty(exports, "UIKitThemeContext", {
   enumerable: true,
   get: function () {
@@ -355,11 +361,11 @@ var _BottomSheet = _interopRequireDefault(require("./ui/BottomSheet"));
 var _Button = _interopRequireDefault(require("./ui/Button"));
 var _ChannelFrozenBanner = _interopRequireDefault(require("./ui/ChannelFrozenBanner"));
 var _Dialog = require("./ui/Dialog");
+var _GroupChannelMessage = _interopRequireDefault(require("./ui/GroupChannelMessage"));
+var _GroupChannelPreview = _interopRequireDefault(require("./ui/GroupChannelPreview"));
 var _Header = _interopRequireDefault(require("./ui/Header"));
 var _LoadingSpinner = _interopRequireDefault(require("./ui/LoadingSpinner"));
 var _MenuBar = _interopRequireDefault(require("./ui/MenuBar"));
-var _GroupChannelMessage = _interopRequireDefault(require("./ui/GroupChannelMessage"));
-var _GroupChannelPreview = _interopRequireDefault(require("./ui/GroupChannelPreview"));
 var _OpenChannelMessage = _interopRequireDefault(require("./ui/OpenChannelMessage"));
 var _OpenChannelPreview = _interopRequireDefault(require("./ui/OpenChannelPreview"));
 var _OutlinedButton = _interopRequireDefault(require("./ui/OutlinedButton"));
@@ -367,6 +373,7 @@ var _Placeholder = _interopRequireDefault(require("./ui/Placeholder"));
 var _ProfileCard = _interopRequireDefault(require("./ui/ProfileCard"));
 var _Prompt = _interopRequireDefault(require("./ui/Prompt"));
 var _Toast = _interopRequireWildcard(require("./ui/Toast"));
+var _TypingIndicatorBubble = _interopRequireDefault(require("./ui/TypingIndicatorBubble"));
 var _createSelectByColorScheme = _interopRequireDefault(require("./styles/createSelectByColorScheme"));
 var _createScaleFactor = _interopRequireDefault(require("./styles/createScaleFactor"));
 var _createStyleSheet = _interopRequireDefault(require("./styles/createStyleSheet"));

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_icon","_interopRequireDefault","require","_Box","_Divider","_Icon","_Image","_ImageWithPlaceholder","_Modal","_PressBox","_ProgressBar","_RegexText","_Switch","_Text","_TextInput","_VideoThumbnail","_ActionMenu","_Alert","_Avatar","_Badge","_BottomSheet","_Button","_ChannelFrozenBanner","_Dialog","_Header","_LoadingSpinner","_MenuBar","_GroupChannelMessage","_GroupChannelPreview","_OpenChannelMessage","_OpenChannelPreview","_OutlinedButton","_Placeholder","_ProfileCard","_Prompt","_Toast","_interopRequireWildcard","_createSelectByColorScheme","_createScaleFactor","_createStyleSheet","_createTypography","_getDefaultHeaderHeight","_HeaderStyleContext","_useHeaderStyle","_createTheme","_DarkUIKitTheme","_LightUIKitTheme","_Palette","_UIKitThemeContext","_UIKitThemeProvider","_useUIKitTheme","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set"],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Box } from './components/Box';\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as ImageWithPlaceholder } from './components/ImageWithPlaceholder';\nexport { default as Modal } from './components/Modal';\nexport { default as PressBox } from './components/PressBox';\nexport { default as ProgressBar } from './components/ProgressBar';\nexport { default as RegexText } from './components/RegexText';\nexport type { RegexTextPattern } from './components/RegexText';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { VideoThumbnail } from './components/VideoThumbnail';\n\n/** UI **/\nexport { default as ActionMenu } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar } from './ui/MenuBar';\nexport type { MenuBarProps } from './ui/MenuBar';\nexport { default as GroupChannelMessage } from './ui/GroupChannelMessage';\nexport type { GroupChannelMessageProps } from './ui/GroupChannelMessage';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\n\nexport { default as OpenChannelMessage } from './ui/OpenChannelMessage';\nexport type { OpenChannelMessageProps } from './ui/OpenChannelMessage';\nexport { default as OpenChannelPreview } from './ui/OpenChannelPreview';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\nexport type { ActionMenuItem } from './ui/ActionMenu';\nexport type { BottomSheetItem } from './ui/BottomSheet';\nexport type { UIKitTypographyOverrides } from './styles/createTypography';\nexport type { HeaderStyleContextType } from './styles/HeaderStyleContext';\n"],"mappings":"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"}
+{"version":3,"names":["_icon","_interopRequireDefault","require","_Box","_Divider","_Icon","_Image","_ImageWithPlaceholder","_Modal","_PressBox","_ProgressBar","_RegexText","_Switch","_Text","_TextInput","_VideoThumbnail","_ActionMenu","_Alert","_Avatar","_Badge","_BottomSheet","_Button","_ChannelFrozenBanner","_Dialog","_GroupChannelMessage","_GroupChannelPreview","_Header","_LoadingSpinner","_MenuBar","_OpenChannelMessage","_OpenChannelPreview","_OutlinedButton","_Placeholder","_ProfileCard","_Prompt","_Toast","_interopRequireWildcard","_TypingIndicatorBubble","_createSelectByColorScheme","_createScaleFactor","_createStyleSheet","_createTypography","_getDefaultHeaderHeight","_HeaderStyleContext","_useHeaderStyle","_createTheme","_DarkUIKitTheme","_LightUIKitTheme","_Palette","_UIKitThemeContext","_UIKitThemeProvider","_useUIKitTheme","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set"],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Box } from './components/Box';\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as ImageWithPlaceholder } from './components/ImageWithPlaceholder';\nexport { default as Modal } from './components/Modal';\nexport { default as PressBox } from './components/PressBox';\nexport { default as ProgressBar } from './components/ProgressBar';\nexport { default as RegexText } from './components/RegexText';\nexport type { RegexTextPattern } from './components/RegexText';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\nexport { VideoThumbnail } from './components/VideoThumbnail';\n\n/** UI **/\nexport { default as ActionMenu } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as GroupChannelMessage } from './ui/GroupChannelMessage';\nexport type { GroupChannelMessageProps } from './ui/GroupChannelMessage';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar } from './ui/MenuBar';\nexport type { MenuBarProps } from './ui/MenuBar';\nexport { default as OpenChannelMessage } from './ui/OpenChannelMessage';\nexport type { OpenChannelMessageProps } from './ui/OpenChannelMessage';\nexport { default as OpenChannelPreview } from './ui/OpenChannelPreview';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\nexport { default as TypingIndicatorBubble } from './ui/TypingIndicatorBubble';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n  TypoName,\n  UIKitTheme,\n  UIKitTypography,\n  FontAttributes,\n  BaseHeaderProps,\n  UIKitColorScheme,\n  UIKitColors,\n  ComponentColorTree,\n  UIKitPalette,\n  HeaderElement,\n  HeaderPartProps,\n  ComponentColors,\n  Component,\n  GetColorTree,\n} from './types';\nexport type { ActionMenuItem } from './ui/ActionMenu';\nexport type { BottomSheetItem } from './ui/BottomSheet';\nexport type { UIKitTypographyOverrides } from './styles/createTypography';\nexport type { HeaderStyleContextType } from './styles/HeaderStyleContext';\n"],"mappings":"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"}

package/lib/commonjs/styles/createStyleSheet.js

@@ -18,11 +18,15 @@ const preProcessor = {
   'height': SCALE_FACTOR_WITH_STR,
   'width': SCALE_FACTOR_WITH_STR,
   'padding': SCALE_FACTOR_WITH_STR,
+  'paddingVertical': SCALE_FACTOR_WITH_STR,
+  'paddingHorizontal': SCALE_FACTOR_WITH_STR,
   'paddingTop': SCALE_FACTOR_WITH_STR,
   'paddingBottom': SCALE_FACTOR_WITH_STR,
   'paddingLeft': SCALE_FACTOR_WITH_STR,
   'paddingRight': SCALE_FACTOR_WITH_STR,
   'margin': SCALE_FACTOR_WITH_STR,
+  'marginVertical': SCALE_FACTOR_WITH_STR,
+  'marginHorizontal': SCALE_FACTOR_WITH_STR,
   'marginTop': SCALE_FACTOR_WITH_STR,
   'marginBottom': SCALE_FACTOR_WITH_STR,
   'marginLeft': SCALE_FACTOR_WITH_STR,

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

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_createScaleFactor","SCALE_FACTOR_WITH_STR","val","DEFAULT_SCALE_FACTOR","preProcessor","preProcessorKeys","Object","keys","preProcessorLen","length","createStyleSheet","styles","values","forEach","style","styleKeys","styleLen","key","StyleSheet","create","_default","exports","default"],"sources":["createStyleSheet.ts"],"sourcesContent":["import { ImageStyle, StyleSheet, TextStyle, ViewStyle } from 'react-native';\n\nimport { DEFAULT_SCALE_FACTOR } from './createScaleFactor';\n\ntype Styles = ViewStyle | TextStyle | ImageStyle;\ntype StylePreprocessor<T extends Styles = Styles> = { [key in keyof T]: (val: NonNullable<T[key]>) => typeof val };\n\nconst SCALE_FACTOR_WITH_STR = (val: string | number) => (typeof val === 'string' ? val : DEFAULT_SCALE_FACTOR(val));\n\nconst preProcessor: Partial<StylePreprocessor> = {\n  'fontSize': DEFAULT_SCALE_FACTOR,\n  'lineHeight': DEFAULT_SCALE_FACTOR,\n  'borderRadius': DEFAULT_SCALE_FACTOR,\n  'minWidth': SCALE_FACTOR_WITH_STR,\n  'maxWidth': SCALE_FACTOR_WITH_STR,\n  'minHeight': SCALE_FACTOR_WITH_STR,\n  'maxHeight': SCALE_FACTOR_WITH_STR,\n  'height': SCALE_FACTOR_WITH_STR,\n  'width': SCALE_FACTOR_WITH_STR,\n  'padding': SCALE_FACTOR_WITH_STR,\n  'paddingTop': SCALE_FACTOR_WITH_STR,\n  'paddingBottom': SCALE_FACTOR_WITH_STR,\n  'paddingLeft': SCALE_FACTOR_WITH_STR,\n  'paddingRight': SCALE_FACTOR_WITH_STR,\n  'margin': SCALE_FACTOR_WITH_STR,\n  'marginTop': SCALE_FACTOR_WITH_STR,\n  'marginBottom': SCALE_FACTOR_WITH_STR,\n  'marginLeft': SCALE_FACTOR_WITH_STR,\n  'marginRight': SCALE_FACTOR_WITH_STR,\n  'left': SCALE_FACTOR_WITH_STR,\n  'right': SCALE_FACTOR_WITH_STR,\n  'top': SCALE_FACTOR_WITH_STR,\n  'bottom': SCALE_FACTOR_WITH_STR,\n};\n\nconst preProcessorKeys = Object.keys(preProcessor);\nconst preProcessorLen = preProcessorKeys.length;\n\n/**\n * Create StyleSheet with customized pre-processor\n * Return a StyleSheet that pre-processed\n * @param styles\n * @returns StyleSheet\n * */\nconst createStyleSheet = <T extends StyleSheet.NamedStyles<T>>(styles: T | StyleSheet.NamedStyles<T>): T => {\n  Object.values(styles).forEach((style) => {\n    // @ts-ignore\n    const styleKeys = Object.keys(style);\n    const styleLen = styleKeys.length;\n\n    const keys = styleLen < preProcessorLen ? styleKeys : preProcessorKeys;\n    keys.forEach((key) => {\n      // @ts-ignore\n      if (preProcessor[key] && typeof style[key] !== 'undefined') style[key] = preProcessor[key](style[key]);\n    });\n  });\n\n  return StyleSheet.create<T>(styles);\n};\n\nexport default createStyleSheet;\n"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AAKA,MAAME,qBAAqB,GAAIC,GAAoB,IAAM,OAAOA,GAAG,KAAK,QAAQ,GAAGA,GAAG,GAAG,IAAAC,uCAAoB,EAACD,GAAG,CAAE;AAEnH,MAAME,YAAwC,GAAG;EAC/C,UAAU,EAAED,uCAAoB;EAChC,YAAY,EAAEA,uCAAoB;EAClC,cAAc,EAAEA,uCAAoB;EACpC,UAAU,EAAEF,qBAAqB;EACjC,UAAU,EAAEA,qBAAqB;EACjC,WAAW,EAAEA,qBAAqB;EAClC,WAAW,EAAEA,qBAAqB;EAClC,QAAQ,EAAEA,qBAAqB;EAC/B,OAAO,EAAEA,qBAAqB;EAC9B,SAAS,EAAEA,qBAAqB;EAChC,YAAY,EAAEA,qBAAqB;EACnC,eAAe,EAAEA,qBAAqB;EACtC,aAAa,EAAEA,qBAAqB;EACpC,cAAc,EAAEA,qBAAqB;EACrC,QAAQ,EAAEA,qBAAqB;EAC/B,WAAW,EAAEA,qBAAqB;EAClC,cAAc,EAAEA,qBAAqB;EACrC,YAAY,EAAEA,qBAAqB;EACnC,aAAa,EAAEA,qBAAqB;EACpC,MAAM,EAAEA,qBAAqB;EAC7B,OAAO,EAAEA,qBAAqB;EAC9B,KAAK,EAAEA,qBAAqB;EAC5B,QAAQ,EAAEA;AACZ,CAAC;AAED,MAAMI,gBAAgB,GAAGC,MAAM,CAACC,IAAI,CAACH,YAAY,CAAC;AAClD,MAAMI,eAAe,GAAGH,gBAAgB,CAACI,MAAM;;AAE/C;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,gBAAgB,GAAyCC,MAAqC,IAAQ;EAC1GL,MAAM,CAACM,MAAM,CAACD,MAAM,CAAC,CAACE,OAAO,CAAEC,KAAK,IAAK;IACvC;IACA,MAAMC,SAAS,GAAGT,MAAM,CAACC,IAAI,CAACO,KAAK,CAAC;IACpC,MAAME,QAAQ,GAAGD,SAAS,CAACN,MAAM;IAEjC,MAAMF,IAAI,GAAGS,QAAQ,GAAGR,eAAe,GAAGO,SAAS,GAAGV,gBAAgB;IACtEE,IAAI,CAACM,OAAO,CAAEI,GAAG,IAAK;MACpB;MACA,IAAIb,YAAY,CAACa,GAAG,CAAC,IAAI,OAAOH,KAAK,CAACG,GAAG,CAAC,KAAK,WAAW,EAAEH,KAAK,CAACG,GAAG,CAAC,GAAGb,YAAY,CAACa,GAAG,CAAC,CAACH,KAAK,CAACG,GAAG,CAAC,CAAC;IACxG,CAAC,CAAC;EACJ,CAAC,CAAC;EAEF,OAAOC,uBAAU,CAACC,MAAM,CAAIR,MAAM,CAAC;AACrC,CAAC;AAAC,IAAAS,QAAA,GAEaV,gBAAgB;AAAAW,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_reactNative","require","_createScaleFactor","SCALE_FACTOR_WITH_STR","val","DEFAULT_SCALE_FACTOR","preProcessor","preProcessorKeys","Object","keys","preProcessorLen","length","createStyleSheet","styles","values","forEach","style","styleKeys","styleLen","key","StyleSheet","create","_default","exports","default"],"sources":["createStyleSheet.ts"],"sourcesContent":["import { ImageStyle, StyleSheet, TextStyle, ViewStyle } from 'react-native';\n\nimport { DEFAULT_SCALE_FACTOR } from './createScaleFactor';\n\ntype Styles = ViewStyle | TextStyle | ImageStyle;\ntype StylePreprocessor<T extends Styles = Styles> = { [key in keyof T]: (val: NonNullable<T[key]>) => typeof val };\n\nconst SCALE_FACTOR_WITH_STR = (val: string | number) => (typeof val === 'string' ? val : DEFAULT_SCALE_FACTOR(val));\n\nconst preProcessor: Partial<StylePreprocessor> = {\n  'fontSize': DEFAULT_SCALE_FACTOR,\n  'lineHeight': DEFAULT_SCALE_FACTOR,\n  'borderRadius': DEFAULT_SCALE_FACTOR,\n  'minWidth': SCALE_FACTOR_WITH_STR,\n  'maxWidth': SCALE_FACTOR_WITH_STR,\n  'minHeight': SCALE_FACTOR_WITH_STR,\n  'maxHeight': SCALE_FACTOR_WITH_STR,\n  'height': SCALE_FACTOR_WITH_STR,\n  'width': SCALE_FACTOR_WITH_STR,\n  'padding': SCALE_FACTOR_WITH_STR,\n  'paddingVertical': SCALE_FACTOR_WITH_STR,\n  'paddingHorizontal': SCALE_FACTOR_WITH_STR,\n  'paddingTop': SCALE_FACTOR_WITH_STR,\n  'paddingBottom': SCALE_FACTOR_WITH_STR,\n  'paddingLeft': SCALE_FACTOR_WITH_STR,\n  'paddingRight': SCALE_FACTOR_WITH_STR,\n  'margin': SCALE_FACTOR_WITH_STR,\n  'marginVertical': SCALE_FACTOR_WITH_STR,\n  'marginHorizontal': SCALE_FACTOR_WITH_STR,\n  'marginTop': SCALE_FACTOR_WITH_STR,\n  'marginBottom': SCALE_FACTOR_WITH_STR,\n  'marginLeft': SCALE_FACTOR_WITH_STR,\n  'marginRight': SCALE_FACTOR_WITH_STR,\n  'left': SCALE_FACTOR_WITH_STR,\n  'right': SCALE_FACTOR_WITH_STR,\n  'top': SCALE_FACTOR_WITH_STR,\n  'bottom': SCALE_FACTOR_WITH_STR,\n};\n\nconst preProcessorKeys = Object.keys(preProcessor);\nconst preProcessorLen = preProcessorKeys.length;\n\n/**\n * Create StyleSheet with customized pre-processor\n * Return a StyleSheet that pre-processed\n * @param styles\n * @returns StyleSheet\n * */\nconst createStyleSheet = <T extends StyleSheet.NamedStyles<T>>(styles: T | StyleSheet.NamedStyles<T>): T => {\n  Object.values(styles).forEach((style) => {\n    // @ts-ignore\n    const styleKeys = Object.keys(style);\n    const styleLen = styleKeys.length;\n\n    const keys = styleLen < preProcessorLen ? styleKeys : preProcessorKeys;\n    keys.forEach((key) => {\n      // @ts-ignore\n      if (preProcessor[key] && typeof style[key] !== 'undefined') style[key] = preProcessor[key](style[key]);\n    });\n  });\n\n  return StyleSheet.create<T>(styles);\n};\n\nexport default createStyleSheet;\n"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AAKA,MAAME,qBAAqB,GAAIC,GAAoB,IAAM,OAAOA,GAAG,KAAK,QAAQ,GAAGA,GAAG,GAAG,IAAAC,uCAAoB,EAACD,GAAG,CAAE;AAEnH,MAAME,YAAwC,GAAG;EAC/C,UAAU,EAAED,uCAAoB;EAChC,YAAY,EAAEA,uCAAoB;EAClC,cAAc,EAAEA,uCAAoB;EACpC,UAAU,EAAEF,qBAAqB;EACjC,UAAU,EAAEA,qBAAqB;EACjC,WAAW,EAAEA,qBAAqB;EAClC,WAAW,EAAEA,qBAAqB;EAClC,QAAQ,EAAEA,qBAAqB;EAC/B,OAAO,EAAEA,qBAAqB;EAC9B,SAAS,EAAEA,qBAAqB;EAChC,iBAAiB,EAAEA,qBAAqB;EACxC,mBAAmB,EAAEA,qBAAqB;EAC1C,YAAY,EAAEA,qBAAqB;EACnC,eAAe,EAAEA,qBAAqB;EACtC,aAAa,EAAEA,qBAAqB;EACpC,cAAc,EAAEA,qBAAqB;EACrC,QAAQ,EAAEA,qBAAqB;EAC/B,gBAAgB,EAAEA,qBAAqB;EACvC,kBAAkB,EAAEA,qBAAqB;EACzC,WAAW,EAAEA,qBAAqB;EAClC,cAAc,EAAEA,qBAAqB;EACrC,YAAY,EAAEA,qBAAqB;EACnC,aAAa,EAAEA,qBAAqB;EACpC,MAAM,EAAEA,qBAAqB;EAC7B,OAAO,EAAEA,qBAAqB;EAC9B,KAAK,EAAEA,qBAAqB;EAC5B,QAAQ,EAAEA;AACZ,CAAC;AAED,MAAMI,gBAAgB,GAAGC,MAAM,CAACC,IAAI,CAACH,YAAY,CAAC;AAClD,MAAMI,eAAe,GAAGH,gBAAgB,CAACI,MAAM;;AAE/C;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,gBAAgB,GAAyCC,MAAqC,IAAQ;EAC1GL,MAAM,CAACM,MAAM,CAACD,MAAM,CAAC,CAACE,OAAO,CAAEC,KAAK,IAAK;IACvC;IACA,MAAMC,SAAS,GAAGT,MAAM,CAACC,IAAI,CAACO,KAAK,CAAC;IACpC,MAAME,QAAQ,GAAGD,SAAS,CAACN,MAAM;IAEjC,MAAMF,IAAI,GAAGS,QAAQ,GAAGR,eAAe,GAAGO,SAAS,GAAGV,gBAAgB;IACtEE,IAAI,CAACM,OAAO,CAAEI,GAAG,IAAK;MACpB;MACA,IAAIb,YAAY,CAACa,GAAG,CAAC,IAAI,OAAOH,KAAK,CAACG,GAAG,CAAC,KAAK,WAAW,EAAEH,KAAK,CAACG,GAAG,CAAC,GAAGb,YAAY,CAACa,GAAG,CAAC,CAACH,KAAK,CAACG,GAAG,CAAC,CAAC;IACxG,CAAC,CAAC;EACJ,CAAC,CAAC;EAEF,OAAOC,uBAAU,CAACC,MAAM,CAAIR,MAAM,CAAC;AACrC,CAAC;AAAC,IAAAS,QAAA,GAEaV,gBAAgB;AAAAW,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

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

@@ -0,0 +1,96 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _Text = _interopRequireDefault(require("../../components/Text"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const DEFAULT_MAX = 3;
+const DEFAULT_BORDER_WIDTH = 2;
+const DEFAULT_AVATAR_GAP = -4;
+const DEFAULT_AVATAR_SIZE = 26;
+const DEFAULT_REMAINS_MAX = 99;
+const AvatarStack = _ref => {
+  let {
+    children,
+    containerStyle,
+    styles,
+    maxAvatar = DEFAULT_MAX,
+    size = DEFAULT_AVATAR_SIZE,
+    avatarGap = DEFAULT_AVATAR_GAP
+  } = _ref;
+  const {
+    colors,
+    palette,
+    select
+  } = (0, _useUIKitTheme.default)();
+  const defaultStyles = {
+    borderWidth: DEFAULT_BORDER_WIDTH,
+    borderColor: colors.background,
+    remainsTextColor: colors.onBackground02,
+    remainsBackgroundColor: select({
+      light: palette.background100,
+      dark: palette.background600
+    })
+  };
+  const avatarStyles = {
+    ...defaultStyles,
+    ...styles
+  };
+  const childrenArray = _react.default.Children.toArray(children).filter(it => /*#__PURE__*/_react.default.isValidElement(it));
+  const remains = childrenArray.length - maxAvatar;
+  const shouldRenderRemains = remains > 0;
+  const actualSize = size + avatarStyles.borderWidth * 2;
+  const actualGap = avatarGap - avatarStyles.borderWidth;
+  const renderAvatars = () => {
+    return childrenArray.slice(0, maxAvatar).map((child, index) => /*#__PURE__*/_react.default.cloneElement(child, {
+      size: actualSize,
+      containerStyle: {
+        left: actualGap * index,
+        borderWidth: avatarStyles.borderWidth,
+        borderColor: avatarStyles.borderColor
+      }
+    }));
+  };
+  const renderRemainsCount = () => {
+    if (!shouldRenderRemains) return null;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+      style: [avatarStyles, {
+        left: actualGap * maxAvatar,
+        width: actualSize,
+        height: actualSize,
+        borderRadius: actualSize / 2,
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: avatarStyles.remainsBackgroundColor
+      }]
+    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+      style: {
+        color: avatarStyles.remainsTextColor,
+        fontSize: 8
+      },
+      caption4: true
+    }, `+${Math.min(remains, DEFAULT_REMAINS_MAX)}`));
+  };
+  const calculateWidth = () => {
+    const widthEach = actualSize + actualGap;
+    const avatarCountOffset = shouldRenderRemains ? 1 : 0;
+    const avatarCount = shouldRenderRemains ? maxAvatar : childrenArray.length;
+    const count = avatarCount + avatarCountOffset;
+    return widthEach * count + avatarStyles.borderWidth;
+  };
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [containerStyle, {
+      left: -avatarStyles.borderWidth,
+      flexDirection: 'row',
+      width: calculateWidth()
+    }]
+  }, renderAvatars(), renderRemainsCount());
+};
+var _default = AvatarStack;
+exports.default = _default;
+//# sourceMappingURL=AvatarStack.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_Text","_useUIKitTheme","obj","__esModule","default","DEFAULT_MAX","DEFAULT_BORDER_WIDTH","DEFAULT_AVATAR_GAP","DEFAULT_AVATAR_SIZE","DEFAULT_REMAINS_MAX","AvatarStack","_ref","children","containerStyle","styles","maxAvatar","size","avatarGap","colors","palette","select","useUIKitTheme","defaultStyles","borderWidth","borderColor","background","remainsTextColor","onBackground02","remainsBackgroundColor","light","background100","dark","background600","avatarStyles","childrenArray","React","Children","toArray","filter","it","isValidElement","remains","length","shouldRenderRemains","actualSize","actualGap","renderAvatars","slice","map","child","index","cloneElement","left","renderRemainsCount","createElement","View","style","width","height","borderRadius","alignItems","justifyContent","backgroundColor","color","fontSize","caption4","Math","min","calculateWidth","widthEach","avatarCountOffset","avatarCount","count","flexDirection","_default","exports"],"sources":["AvatarStack.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Text from '../../components/Text';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nconst DEFAULT_MAX = 3;\nconst DEFAULT_BORDER_WIDTH = 2;\nconst DEFAULT_AVATAR_GAP = -4;\nconst DEFAULT_AVATAR_SIZE = 26;\nconst DEFAULT_REMAINS_MAX = 99;\n\ntype Props = React.PropsWithChildren<{\n  size?: number;\n  containerStyle?: StyleProp<ViewStyle>;\n  maxAvatar?: number;\n  avatarGap?: number;\n  styles?: {\n    borderWidth?: number;\n    borderColor?: string;\n    remainsTextColor?: string;\n    remainsBackgroundColor?: string;\n  };\n}>;\n\nconst AvatarStack = ({\n  children,\n  containerStyle,\n  styles,\n  maxAvatar = DEFAULT_MAX,\n  size = DEFAULT_AVATAR_SIZE,\n  avatarGap = DEFAULT_AVATAR_GAP,\n}: Props) => {\n  const { colors, palette, select } = useUIKitTheme();\n  const defaultStyles = {\n    borderWidth: DEFAULT_BORDER_WIDTH,\n    borderColor: colors.background,\n    remainsTextColor: colors.onBackground02,\n    remainsBackgroundColor: select({ light: palette.background100, dark: palette.background600 }),\n  };\n  const avatarStyles = { ...defaultStyles, ...styles };\n\n  const childrenArray = React.Children.toArray(children).filter((it) => React.isValidElement(it));\n  const remains = childrenArray.length - maxAvatar;\n  const shouldRenderRemains = remains > 0;\n\n  const actualSize = size + avatarStyles.borderWidth * 2;\n  const actualGap = avatarGap - avatarStyles.borderWidth;\n\n  const renderAvatars = () => {\n    return childrenArray.slice(0, maxAvatar).map((child, index) =>\n      React.cloneElement(child as ReactElement, {\n        size: actualSize,\n        containerStyle: {\n          left: actualGap * index,\n          borderWidth: avatarStyles.borderWidth,\n          borderColor: avatarStyles.borderColor,\n        },\n      }),\n    );\n  };\n\n  const renderRemainsCount = () => {\n    if (!shouldRenderRemains) return null;\n    return (\n      <View\n        style={[\n          avatarStyles,\n          {\n            left: actualGap * maxAvatar,\n            width: actualSize,\n            height: actualSize,\n            borderRadius: actualSize / 2,\n            alignItems: 'center',\n            justifyContent: 'center',\n            backgroundColor: avatarStyles.remainsBackgroundColor,\n          },\n        ]}\n      >\n        <Text style={{ color: avatarStyles.remainsTextColor, fontSize: 8 }} caption4>\n          {`+${Math.min(remains, DEFAULT_REMAINS_MAX)}`}\n        </Text>\n      </View>\n    );\n  };\n\n  const calculateWidth = () => {\n    const widthEach = actualSize + actualGap;\n    const avatarCountOffset = shouldRenderRemains ? 1 : 0;\n    const avatarCount = shouldRenderRemains ? maxAvatar : childrenArray.length;\n    const count = avatarCount + avatarCountOffset;\n    return widthEach * count + avatarStyles.borderWidth;\n  };\n\n  return (\n    <View style={[containerStyle, { left: -avatarStyles.borderWidth, flexDirection: 'row', width: calculateWidth() }]}>\n      {renderAvatars()}\n      {renderRemainsCount()}\n    </View>\n  );\n};\n\nexport default AvatarStack;\n"],"mappings":"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"}

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

@@ -13,6 +13,7 @@ var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyle
 var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
 var _AvatarGroup = _interopRequireDefault(require("./AvatarGroup"));
 var _AvatarIcon = _interopRequireDefault(require("./AvatarIcon"));
+var _AvatarStack = _interopRequireDefault(require("./AvatarStack"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -80,7 +81,8 @@ const styles = (0, _createStyleSheet.default)({
 });
 var _default = Object.assign(Avatar, {
   Group: _AvatarGroup.default,
-  Icon: _AvatarIcon.default
+  Icon: _AvatarIcon.default,
+  Stack: _AvatarStack.default
 });
 exports.default = _default;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_uikitUtils","_Icon","_interopRequireDefault","_Image","_createStyleSheet","_useUIKitTheme","_AvatarGroup","_AvatarIcon","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Avatar","_ref","uri","square","muted","size","containerStyle","colors","palette","useUIKitTheme","loadFailure","setLoadFailure","useState","createElement","View","style","styles","container","width","height","borderRadius","backgroundColor","background300","conditionChaining","Boolean","onError","source","resizeMode","StyleSheet","absoluteFill","icon","color","onBackgroundReverse01","MutedOverlay","_ref2","primary300","opacity","onBackgroundDark01","createStyleSheet","alignItems","justifyContent","overflow","_default","assign","Group","AvatarGroup","Icon","AvatarIcon","exports"],"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 Props = {\n  uri?: string;\n  size?: number;\n  square?: boolean;\n  muted?: boolean;\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nconst Avatar = ({ uri, square, muted = false, size = 56, containerStyle }: Props) => {\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\nexport default Object.assign(Avatar, {\n  Group: AvatarGroup,\n  Icon: AvatarIcon,\n});\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_uikitUtils","_Icon","_interopRequireDefault","_Image","_createStyleSheet","_useUIKitTheme","_AvatarGroup","_AvatarIcon","_AvatarStack","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Avatar","_ref","uri","square","muted","size","containerStyle","colors","palette","useUIKitTheme","loadFailure","setLoadFailure","useState","createElement","View","style","styles","container","width","height","borderRadius","backgroundColor","background300","conditionChaining","Boolean","onError","source","resizeMode","StyleSheet","absoluteFill","icon","color","onBackgroundReverse01","MutedOverlay","_ref2","primary300","opacity","onBackgroundDark01","createStyleSheet","alignItems","justifyContent","overflow","_default","assign","Group","AvatarGroup","Icon","AvatarIcon","Stack","AvatarStack","exports"],"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';\nimport AvatarStack from './AvatarStack';\n\ntype Props = {\n  uri?: string;\n  size?: number;\n  square?: boolean;\n  muted?: boolean;\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nconst Avatar = ({ uri, square, muted = false, size = 56, containerStyle }: Props) => {\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\nexport default Object.assign(Avatar, {\n  Group: AvatarGroup,\n  Icon: AvatarIcon,\n  Stack: AvatarStack,\n});\n"],"mappings":"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"}

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

@@ -0,0 +1,118 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _Avatar = _interopRequireDefault(require("../Avatar"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const TypingIndicatorBubble = _ref => {
+  let {
+    typingUsers,
+    containerStyle,
+    maxAvatar
+  } = _ref;
+  const {
+    select,
+    palette,
+    colors
+  } = (0, _useUIKitTheme.default)();
+  if (typingUsers.length === 0) return null;
+  return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    justifyContent: 'flex-start',
+    alignItems: 'center',
+    style: containerStyle
+  }, /*#__PURE__*/_react.default.createElement(_Avatar.default.Stack, {
+    size: 26,
+    maxAvatar: maxAvatar,
+    styles: {
+      remainsTextColor: colors.onBackground02,
+      remainsBackgroundColor: select({
+        light: palette.background100,
+        dark: palette.background400
+      })
+    },
+    containerStyle: {
+      marginRight: 12
+    }
+  }, typingUsers.map((user, index) => /*#__PURE__*/_react.default.createElement(_Avatar.default, {
+    key: index,
+    uri: user.profileUrl
+  }))), /*#__PURE__*/_react.default.createElement(TypingDots, {
+    dotColor: select({
+      light: palette.background100,
+      dark: palette.background400
+    }),
+    backgroundColor: colors.onBackground02
+  }));
+};
+const TypingDots = _ref2 => {
+  let {
+    dotColor,
+    backgroundColor
+  } = _ref2;
+  const animation = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
+  const dots = matrix.map(_ref3 => {
+    let [timeline, scale, opacity] = _ref3;
+    return [animation.interpolate({
+      inputRange: timeline,
+      outputRange: scale,
+      extrapolate: 'clamp'
+    }), animation.interpolate({
+      inputRange: timeline,
+      outputRange: opacity,
+      extrapolate: 'clamp'
+    })];
+  });
+  (0, _react.useEffect)(() => {
+    const animated = _reactNative.Animated.loop(_reactNative.Animated.timing(animation, {
+      toValue: 1.4,
+      duration: 1400,
+      easing: _reactNative.Easing.linear,
+      useNativeDriver: true
+    }));
+    animated.start();
+    return () => animated.reset();
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: 16,
+    paddingHorizontal: 12,
+    height: 34,
+    backgroundColor: dotColor
+  }, dots.map((_ref4, index) => {
+    let [scale, opacity] = _ref4;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
+      key: index,
+      style: [styles.dot, {
+        marginRight: index === dots.length - 1 ? 0 : 6,
+        opacity: opacity,
+        transform: [{
+          scale: scale
+        }],
+        backgroundColor: backgroundColor
+      }]
+    });
+  }));
+};
+const matrix = [[[0.4, 0.7, 1.0], [1.0, 1.2, 1.0], [0.12, 0.38, 0.12]], [[0.6, 0.9, 1.2], [1.0, 1.2, 1.0], [0.12, 0.38, 0.12]], [[0.8, 1.1, 1.4], [1.0, 1.2, 1.0], [0.12, 0.38, 0.12]]];
+const styles = (0, _createStyleSheet.default)({
+  dot: {
+    width: 8,
+    height: 8,
+    borderRadius: 4
+  }
+});
+var _default = TypingIndicatorBubble;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_Box","_interopRequireDefault","_createStyleSheet","_useUIKitTheme","_Avatar","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","TypingIndicatorBubble","_ref","typingUsers","containerStyle","maxAvatar","select","palette","colors","useUIKitTheme","length","createElement","flexDirection","justifyContent","alignItems","style","Stack","size","styles","remainsTextColor","onBackground02","remainsBackgroundColor","light","background100","dark","background400","marginRight","map","user","index","uri","profileUrl","TypingDots","dotColor","backgroundColor","_ref2","animation","useRef","Animated","Value","current","dots","matrix","_ref3","timeline","scale","opacity","interpolate","inputRange","outputRange","extrapolate","useEffect","animated","loop","timing","toValue","duration","easing","Easing","linear","useNativeDriver","start","reset","borderRadius","paddingHorizontal","height","_ref4","View","dot","transform","createStyleSheet","width","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport { Animated, Easing, StyleProp, ViewStyle } from 'react-native';\n\nimport type { SendbirdUser } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\n\ntype Props = {\n  typingUsers: SendbirdUser[];\n  containerStyle?: StyleProp<ViewStyle>;\n  maxAvatar?: number;\n};\n\nconst TypingIndicatorBubble = ({ typingUsers, containerStyle, maxAvatar }: Props) => {\n  const { select, palette, colors } = useUIKitTheme();\n\n  if (typingUsers.length === 0) return null;\n\n  return (\n    <Box flexDirection={'row'} justifyContent={'flex-start'} alignItems={'center'} style={containerStyle}>\n      <Avatar.Stack\n        size={26}\n        maxAvatar={maxAvatar}\n        styles={{\n          remainsTextColor: colors.onBackground02,\n          remainsBackgroundColor: select({ light: palette.background100, dark: palette.background400 }),\n        }}\n        containerStyle={{ marginRight: 12 }}\n      >\n        {typingUsers.map((user, index) => (\n          <Avatar key={index} uri={user.profileUrl} />\n        ))}\n      </Avatar.Stack>\n      <TypingDots\n        dotColor={select({ light: palette.background100, dark: palette.background400 })}\n        backgroundColor={colors.onBackground02}\n      />\n    </Box>\n  );\n};\n\ntype TypingDotsProps = {\n  dotColor: string;\n  backgroundColor: string;\n};\nconst TypingDots = ({ dotColor, backgroundColor }: TypingDotsProps) => {\n  const animation = useRef(new Animated.Value(0)).current;\n  const dots = matrix.map(([timeline, scale, opacity]) => [\n    animation.interpolate({ inputRange: timeline, outputRange: scale, extrapolate: 'clamp' }),\n    animation.interpolate({ inputRange: timeline, outputRange: opacity, extrapolate: 'clamp' }),\n  ]);\n\n  useEffect(() => {\n    const animated = Animated.loop(\n      Animated.timing(animation, { toValue: 1.4, duration: 1400, easing: Easing.linear, useNativeDriver: true }),\n    );\n    animated.start();\n    return () => animated.reset();\n  }, []);\n\n  return (\n    <Box\n      flexDirection={'row'}\n      alignItems={'center'}\n      justifyContent={'center'}\n      borderRadius={16}\n      paddingHorizontal={12}\n      height={34}\n      backgroundColor={dotColor}\n    >\n      {dots.map(([scale, opacity], index) => {\n        return (\n          <Animated.View\n            key={index}\n            style={[\n              styles.dot,\n              {\n                marginRight: index === dots.length - 1 ? 0 : 6,\n                opacity: opacity,\n                transform: [{ scale: scale }],\n                backgroundColor: backgroundColor,\n              },\n            ]}\n          />\n        );\n      })}\n    </Box>\n  );\n};\n\nconst matrix = [\n  [\n    [0.4, 0.7, 1.0],\n    [1.0, 1.2, 1.0],\n    [0.12, 0.38, 0.12],\n  ],\n  [\n    [0.6, 0.9, 1.2],\n    [1.0, 1.2, 1.0],\n    [0.12, 0.38, 0.12],\n  ],\n  [\n    [0.8, 1.1, 1.4],\n    [1.0, 1.2, 1.0],\n    [0.12, 0.38, 0.12],\n  ],\n];\n\nconst styles = createStyleSheet({\n  dot: {\n    width: 8,\n    height: 8,\n    borderRadius: 4,\n  },\n});\n\nexport default TypingIndicatorBubble;\n"],"mappings":"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"}

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

@@ -21,12 +21,16 @@ const TextInput = /*#__PURE__*/React.forwardRef(function TextInput(_ref, ref) {
     borderBottomWidth: 2,
     borderBottomColor: inputStyle.highlight
   };
+  const fontStyle = {
+    ...typography.body3,
+    lineHeight: typography.body3.fontSize ? typography.body3.fontSize * 1.2 : undefined
+  };
   return /*#__PURE__*/React.createElement(RNTextInput, _extends({
     ref: ref,
     editable: editable,
     selectionColor: inputStyle.highlight,
     placeholderTextColor: inputStyle.placeholder,
-    style: [typography.body3, styles.input, {
+    style: [fontStyle, styles.input, {
       color: inputStyle.text,
       backgroundColor: inputStyle.background
     }, underlineStyle, style]
@@ -34,8 +38,11 @@ const TextInput = /*#__PURE__*/React.forwardRef(function TextInput(_ref, ref) {
 });
 const styles = createStyleSheet({
   input: {
-    paddingVertical: 8,
-    paddingHorizontal: 16
+    includeFontPadding: false,
+    paddingTop: 8,
+    paddingBottom: 8,
+    paddingLeft: 16,
+    paddingRight: 16
   }
 });
 export default TextInput;

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

@@ -1 +1 @@
-{"version":3,"names":["React","TextInput","RNTextInput","createStyleSheet","useUIKitTheme","forwardRef","_ref","ref","children","style","variant","editable","props","typography","colors","variantStyle","inputStyle","active","disabled","underlineStyle","borderBottomWidth","borderBottomColor","highlight","createElement","_extends","selectionColor","placeholderTextColor","placeholder","body3","styles","input","color","text","backgroundColor","background","paddingVertical","paddingHorizontal"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TextInput as RNTextInput, TextInputProps } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport type { UIKitTheme } from '../../types';\n\ntype Props = { variant?: keyof UIKitTheme['colors']['ui']['input'] } & TextInputProps;\nconst TextInput = React.forwardRef<RNTextInput, Props>(function TextInput(\n  { children, style, variant = 'default', editable = true, ...props },\n  ref,\n) {\n  const { typography, colors } = useUIKitTheme();\n\n  const variantStyle = colors['ui']['input'][variant];\n  const inputStyle = editable ? variantStyle.active : variantStyle.disabled;\n  const underlineStyle = variant === 'underline' && { borderBottomWidth: 2, borderBottomColor: inputStyle.highlight };\n\n  return (\n    <RNTextInput\n      ref={ref}\n      editable={editable}\n      selectionColor={inputStyle.highlight}\n      placeholderTextColor={inputStyle.placeholder}\n      style={[\n        typography.body3,\n        styles.input,\n        { color: inputStyle.text, backgroundColor: inputStyle.background },\n        underlineStyle,\n        style,\n      ]}\n      {...props}\n    >\n      {children}\n    </RNTextInput>\n  );\n});\n\nconst styles = createStyleSheet({\n  input: {\n    paddingVertical: 8,\n    paddingHorizontal: 16,\n  },\n});\n\nexport default TextInput;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,IAAIC,WAAW,QAAwB,cAAc;AAEvE,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AAIrD,MAAMH,SAAS,gBAAGD,KAAK,CAACK,UAAU,CAAqB,SAASJ,SAASA,CAAAK,IAAA,EAEvEC,GAAG,EACH;EAAA,IAFA;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,OAAO,GAAG,SAAS;IAAEC,QAAQ,GAAG,IAAI;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAGnE,MAAM;IAAEO,UAAU;IAAEC;EAAO,CAAC,GAAGV,aAAa,EAAE;EAE9C,MAAMW,YAAY,GAAGD,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAACJ,OAAO,CAAC;EACnD,MAAMM,UAAU,GAAGL,QAAQ,GAAGI,YAAY,CAACE,MAAM,GAAGF,YAAY,CAACG,QAAQ;EACzE,MAAMC,cAAc,GAAGT,OAAO,KAAK,WAAW,IAAI;IAAEU,iBAAiB,EAAE,CAAC;IAAEC,iBAAiB,EAAEL,UAAU,CAACM;EAAU,CAAC;EAEnH,oBACEtB,KAAA,CAAAuB,aAAA,CAACrB,WAAW,EAAAsB,QAAA;IACVjB,GAAG,EAAEA,GAAI;IACTI,QAAQ,EAAEA,QAAS;IACnBc,cAAc,EAAET,UAAU,CAACM,SAAU;IACrCI,oBAAoB,EAAEV,UAAU,CAACW,WAAY;IAC7ClB,KAAK,EAAE,CACLI,UAAU,CAACe,KAAK,EAChBC,MAAM,CAACC,KAAK,EACZ;MAAEC,KAAK,EAAEf,UAAU,CAACgB,IAAI;MAAEC,eAAe,EAAEjB,UAAU,CAACkB;IAAW,CAAC,EAClEf,cAAc,EACdV,KAAK;EACL,GACEG,KAAK,GAERJ,QAAQ,CACG;AAElB,CAAC,CAAC;AAEF,MAAMqB,MAAM,GAAG1B,gBAAgB,CAAC;EAC9B2B,KAAK,EAAE;IACLK,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AAEF,eAAenC,SAAS"}
+{"version":3,"names":["React","TextInput","RNTextInput","createStyleSheet","useUIKitTheme","forwardRef","_ref","ref","children","style","variant","editable","props","typography","colors","variantStyle","inputStyle","active","disabled","underlineStyle","borderBottomWidth","borderBottomColor","highlight","fontStyle","body3","lineHeight","fontSize","undefined","createElement","_extends","selectionColor","placeholderTextColor","placeholder","styles","input","color","text","backgroundColor","background","includeFontPadding","paddingTop","paddingBottom","paddingLeft","paddingRight"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { TextInput as RNTextInput, TextInputProps } from 'react-native';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport type { UIKitTheme } from '../../types';\n\ntype Props = { variant?: keyof UIKitTheme['colors']['ui']['input'] } & TextInputProps;\nconst TextInput = React.forwardRef<RNTextInput, Props>(function TextInput(\n  { children, style, variant = 'default', editable = true, ...props },\n  ref,\n) {\n  const { typography, colors } = useUIKitTheme();\n\n  const variantStyle = colors['ui']['input'][variant];\n  const inputStyle = editable ? variantStyle.active : variantStyle.disabled;\n  const underlineStyle = variant === 'underline' && { borderBottomWidth: 2, borderBottomColor: inputStyle.highlight };\n  const fontStyle = {\n    ...typography.body3,\n    lineHeight: typography.body3.fontSize ? typography.body3.fontSize * 1.2 : undefined,\n  };\n\n  return (\n    <RNTextInput\n      ref={ref}\n      editable={editable}\n      selectionColor={inputStyle.highlight}\n      placeholderTextColor={inputStyle.placeholder}\n      style={[\n        fontStyle,\n        styles.input,\n        { color: inputStyle.text, backgroundColor: inputStyle.background },\n        underlineStyle,\n        style,\n      ]}\n      {...props}\n    >\n      {children}\n    </RNTextInput>\n  );\n});\n\nconst styles = createStyleSheet({\n  input: {\n    includeFontPadding: false,\n    paddingTop: 8,\n    paddingBottom: 8,\n    paddingLeft: 16,\n    paddingRight: 16,\n  },\n});\n\nexport default TextInput;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,IAAIC,WAAW,QAAwB,cAAc;AAEvE,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AAIrD,MAAMH,SAAS,gBAAGD,KAAK,CAACK,UAAU,CAAqB,SAASJ,SAASA,CAAAK,IAAA,EAEvEC,GAAG,EACH;EAAA,IAFA;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,OAAO,GAAG,SAAS;IAAEC,QAAQ,GAAG,IAAI;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAGnE,MAAM;IAAEO,UAAU;IAAEC;EAAO,CAAC,GAAGV,aAAa,EAAE;EAE9C,MAAMW,YAAY,GAAGD,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAACJ,OAAO,CAAC;EACnD,MAAMM,UAAU,GAAGL,QAAQ,GAAGI,YAAY,CAACE,MAAM,GAAGF,YAAY,CAACG,QAAQ;EACzE,MAAMC,cAAc,GAAGT,OAAO,KAAK,WAAW,IAAI;IAAEU,iBAAiB,EAAE,CAAC;IAAEC,iBAAiB,EAAEL,UAAU,CAACM;EAAU,CAAC;EACnH,MAAMC,SAAS,GAAG;IAChB,GAAGV,UAAU,CAACW,KAAK;IACnBC,UAAU,EAAEZ,UAAU,CAACW,KAAK,CAACE,QAAQ,GAAGb,UAAU,CAACW,KAAK,CAACE,QAAQ,GAAG,GAAG,GAAGC;EAC5E,CAAC;EAED,oBACE3B,KAAA,CAAA4B,aAAA,CAAC1B,WAAW,EAAA2B,QAAA;IACVtB,GAAG,EAAEA,GAAI;IACTI,QAAQ,EAAEA,QAAS;IACnBmB,cAAc,EAAEd,UAAU,CAACM,SAAU;IACrCS,oBAAoB,EAAEf,UAAU,CAACgB,WAAY;IAC7CvB,KAAK,EAAE,CACLc,SAAS,EACTU,MAAM,CAACC,KAAK,EACZ;MAAEC,KAAK,EAAEnB,UAAU,CAACoB,IAAI;MAAEC,eAAe,EAAErB,UAAU,CAACsB;IAAW,CAAC,EAClEnB,cAAc,EACdV,KAAK;EACL,GACEG,KAAK,GAERJ,QAAQ,CACG;AAElB,CAAC,CAAC;AAEF,MAAMyB,MAAM,GAAG9B,gBAAgB,CAAC;EAC9B+B,KAAK,EAAE;IACLK,kBAAkB,EAAE,KAAK;IACzBC,UAAU,EAAE,CAAC;IACbC,aAAa,EAAE,CAAC;IAChBC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAEF,eAAe1C,SAAS"}

package/lib/module/index.js

@@ -25,11 +25,11 @@ export { default as BottomSheet } from './ui/BottomSheet';
 export { default as Button } from './ui/Button';
 export { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';
 export { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';
+export { default as GroupChannelMessage } from './ui/GroupChannelMessage';
+export { default as GroupChannelPreview } from './ui/GroupChannelPreview';
 export { default as Header } from './ui/Header';
 export { default as LoadingSpinner } from './ui/LoadingSpinner';
 export { default as MenuBar } from './ui/MenuBar';
-export { default as GroupChannelMessage } from './ui/GroupChannelMessage';
-export { default as GroupChannelPreview } from './ui/GroupChannelPreview';
 export { default as OpenChannelMessage } from './ui/OpenChannelMessage';
 export { default as OpenChannelPreview } from './ui/OpenChannelPreview';
 export { default as OutlinedButton } from './ui/OutlinedButton';
@@ -37,6 +37,7 @@ export { default as Placeholder } from './ui/Placeholder';
 export { default as ProfileCard } from './ui/ProfileCard';
 export { default as Prompt } from './ui/Prompt';
 export { default as Toast, useToast, ToastProvider } from './ui/Toast';
+export { default as TypingIndicatorBubble } from './ui/TypingIndicatorBubble';
 
 /** Styles **/
 export { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';