npm - @sendbird/uikit-react-native-foundation - Versions diffs - 3.0.4 → 3.1.1 - Mend

@sendbird/uikit-react-native-foundation 3.0.4 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (96) hide show

package/lib/module/theme/LightUIKitTheme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["createTheme","LightUIKitTheme","colorScheme","colors","palette","groupChannelMessage","incoming","enabled","textMsg","onBackgroundLight01","textEdited","onBackgroundLight02","textTime","onBackgroundLight03","textSenderName","background","background100","pressed","primary100","outgoing","onBackgroundDark01","onBackgroundDark02","transparent","primary300","primary400","primary","secondary","secondary300","error","error300","background50","text","onBackground01","onBackground02","onBackground03","onBackground04","onBackgroundLight04","onBackgroundReverse01","onBackgroundReverse02","onBackgroundReverse03","onBackgroundDark03","onBackgroundReverse04","onBackgroundDark04","ui","header","nav","none","borderBottom","button","contained","content","disabled","dialog","default","message","highlight","destructive","input","active","placeholder","underline","badge","dateSeparator","overlay02","groupChannelPreview","textTitle","textTitleCaption","textBody","bodyIcon","memberCount","coverBackground","bodyIconBackground","separator","profileCard","textUsername","textBodyLabel","reaction","selected","rounded","openChannelMessage","bubbleBackground","adminBackground","textMsgPostfix","textOperator","background300","openChannelPreview","textParticipants","frozenIcon","participantsIcon"],"sources":["LightUIKitTheme.ts"],"sourcesContent":["import createTheme from './createTheme';\n\nconst LightUIKitTheme = createTheme({\n colorScheme: 'light',\n colors: (palette) => {\n const groupChannelMessage = {\n incoming: {\n enabled: {\n textMsg: palette.onBackgroundLight01,\n textEdited: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.onBackgroundLight02,\n background: palette.background100,\n },\n pressed: {\n textMsg: palette.onBackgroundLight01,\n textEdited: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.onBackgroundLight02,\n background: palette.primary100,\n },\n },\n outgoing: {\n enabled: {\n textMsg: palette.onBackgroundDark01,\n textEdited: palette.onBackgroundDark02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.transparent,\n background: palette.primary300,\n },\n pressed: {\n textMsg: palette.onBackgroundDark01,\n textEdited: palette.onBackgroundDark02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.transparent,\n background: palette.primary400,\n },\n },\n };\n\n return {\n primary: palette.primary300,\n secondary: palette.secondary300,\n error: palette.error300,\n background: palette.background50,\n text: palette.onBackgroundLight01,\n onBackground01: palette.onBackgroundLight01,\n onBackground02: palette.onBackgroundLight02,\n onBackground03: palette.onBackgroundLight03,\n onBackground04: palette.onBackgroundLight04,\n onBackgroundReverse01: palette.onBackgroundDark01,\n onBackgroundReverse02: palette.onBackgroundDark02,\n onBackgroundReverse03: palette.onBackgroundDark03,\n onBackgroundReverse04: palette.onBackgroundDark04,\n ui: {\n header: {\n nav: {\n none: {\n background: palette.background50,\n borderBottom: palette.onBackgroundLight04,\n },\n },\n },\n button: {\n contained: {\n enabled: {\n background: palette.primary300,\n content: palette.onBackgroundDark01,\n },\n pressed: {\n background: palette.primary400,\n content: palette.onBackgroundDark01,\n },\n disabled: {\n background: palette.background100,\n content: palette.onBackgroundLight04,\n },\n },\n text: {\n enabled: {\n background: palette.transparent,\n content: palette.primary300,\n },\n pressed: {\n background: palette.transparent,\n content: palette.primary300,\n },\n disabled: {\n background: palette.transparent,\n content: palette.onBackgroundLight04,\n },\n },\n },\n dialog: {\n default: {\n none: {\n background: palette.background50,\n text: palette.onBackgroundLight01,\n message: palette.onBackgroundLight02,\n highlight: palette.primary300,\n destructive: palette.error300,\n },\n },\n },\n input: {\n default: {\n active: {\n text: palette.onBackgroundLight01,\n placeholder: palette.onBackgroundLight03,\n background: palette.background100,\n highlight: palette.primary300,\n },\n disabled: {\n text: palette.onBackgroundLight04,\n placeholder: palette.onBackgroundLight04,\n background: palette.background100,\n highlight: palette.onBackgroundLight04,\n },\n },\n underline: {\n active: {\n text: palette.onBackgroundLight01,\n placeholder: palette.onBackgroundLight03,\n background: palette.transparent,\n highlight: palette.primary300,\n },\n disabled: {\n text: palette.onBackgroundLight04,\n placeholder: palette.onBackgroundLight04,\n background: palette.transparent,\n highlight: palette.onBackgroundLight04,\n },\n },\n },\n badge: {\n default: {\n none: {\n text: palette.background50,\n background: palette.primary300,\n },\n },\n },\n placeholder: {\n default: {\n none: {\n content: palette.onBackgroundLight03,\n highlight: palette.primary300,\n },\n },\n },\n message: groupChannelMessage,\n dateSeparator: {\n default: {\n none: {\n text: palette.onBackgroundDark01,\n background: palette.overlay02,\n },\n },\n },\n groupChannelMessage,\n groupChannelPreview: {\n default: {\n none: {\n textTitle: palette.onBackgroundLight01,\n textTitleCaption: palette.onBackgroundLight03,\n textBody: palette.onBackgroundLight03,\n bodyIcon: palette.onBackgroundLight02,\n memberCount: palette.onBackgroundLight02,\n background: palette.background50,\n coverBackground: palette.onBackgroundLight04,\n bodyIconBackground: palette.background100,\n separator: palette.onBackgroundLight04,\n },\n },\n },\n profileCard: {\n default: {\n none: {\n textUsername: palette.onBackgroundLight01,\n textBodyLabel: palette.onBackgroundLight02,\n textBody: palette.onBackgroundLight01,\n background: palette.background50,\n },\n },\n },\n reaction: {\n default: {\n enabled: {\n background: palette.transparent,\n highlight: palette.onBackgroundLight03,\n },\n selected: {\n background: palette.primary100,\n highlight: palette.primary300,\n },\n },\n rounded: {\n enabled: {\n background: palette.background100,\n highlight: palette.transparent,\n },\n selected: {\n background: palette.primary100,\n highlight: palette.transparent,\n },\n },\n },\n openChannelMessage: {\n default: {\n enabled: {\n background: palette.transparent,\n bubbleBackground: palette.background100,\n adminBackground: palette.background100,\n textMsg: palette.onBackgroundLight01,\n textMsgPostfix: palette.onBackgroundLight02,\n textSenderName: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textOperator: palette.secondary300,\n },\n pressed: {\n background: palette.background100,\n bubbleBackground: palette.background300,\n adminBackground: palette.background100,\n textMsg: palette.onBackgroundLight01,\n textMsgPostfix: palette.onBackgroundLight02,\n textSenderName: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textOperator: palette.secondary300,\n },\n },\n },\n openChannelPreview: {\n default: {\n none: {\n textTitle: palette.onBackgroundLight01,\n textParticipants: palette.onBackgroundLight02,\n frozenIcon: palette.primary300,\n participantsIcon: palette.onBackgroundLight02,\n background: palette.background50,\n coverBackground: palette.background300,\n separator: palette.onBackgroundLight04,\n },\n },\n },\n },\n };\n },\n});\n\nexport default LightUIKitTheme;\n"],"mappings":"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"}
1	+ {"version":3,"names":["createTheme","LightUIKitTheme","colorScheme","colors","palette","groupChannelMessage","incoming","enabled","textMsg","onBackgroundLight01","textEdited","onBackgroundLight02","textTime","onBackgroundLight03","textSenderName","background","background100","pressed","primary100","outgoing","onBackgroundDark01","onBackgroundDark02","transparent","primary300","primary400","primary","secondary","secondary300","error","error300","background50","text","onBackground01","onBackground02","onBackground03","onBackground04","onBackgroundLight04","onBackgroundReverse01","onBackgroundReverse02","onBackgroundReverse03","onBackgroundDark03","onBackgroundReverse04","onBackgroundDark04","ui","header","nav","none","borderBottom","button","contained","content","disabled","dialog","default","message","highlight","destructive","blurred","input","active","placeholder","underline","badge","dateSeparator","overlay02","groupChannelPreview","textTitle","textTitleCaption","textBody","bodyIcon","memberCount","coverBackground","bodyIconBackground","separator","profileCard","textUsername","textBodyLabel","reaction","selected","rounded","openChannelMessage","bubbleBackground","adminBackground","textMsgPostfix","textOperator","background300","openChannelPreview","textParticipants","frozenIcon","participantsIcon"],"sources":["LightUIKitTheme.ts"],"sourcesContent":["import createTheme from './createTheme';\n\nconst LightUIKitTheme = createTheme({\n colorScheme: 'light',\n colors: (palette) => {\n const groupChannelMessage = {\n incoming: {\n enabled: {\n textMsg: palette.onBackgroundLight01,\n textEdited: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.onBackgroundLight02,\n background: palette.background100,\n },\n pressed: {\n textMsg: palette.onBackgroundLight01,\n textEdited: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.onBackgroundLight02,\n background: palette.primary100,\n },\n },\n outgoing: {\n enabled: {\n textMsg: palette.onBackgroundDark01,\n textEdited: palette.onBackgroundDark02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.transparent,\n background: palette.primary300,\n },\n pressed: {\n textMsg: palette.onBackgroundDark01,\n textEdited: palette.onBackgroundDark02,\n textTime: palette.onBackgroundLight03,\n textSenderName: palette.transparent,\n background: palette.primary400,\n },\n },\n };\n\n return {\n primary: palette.primary300,\n secondary: palette.secondary300,\n error: palette.error300,\n background: palette.background50,\n text: palette.onBackgroundLight01,\n onBackground01: palette.onBackgroundLight01,\n onBackground02: palette.onBackgroundLight02,\n onBackground03: palette.onBackgroundLight03,\n onBackground04: palette.onBackgroundLight04,\n onBackgroundReverse01: palette.onBackgroundDark01,\n onBackgroundReverse02: palette.onBackgroundDark02,\n onBackgroundReverse03: palette.onBackgroundDark03,\n onBackgroundReverse04: palette.onBackgroundDark04,\n ui: {\n header: {\n nav: {\n none: {\n background: palette.background50,\n borderBottom: palette.onBackgroundLight04,\n },\n },\n },\n button: {\n contained: {\n enabled: {\n background: palette.primary300,\n content: palette.onBackgroundDark01,\n },\n pressed: {\n background: palette.primary400,\n content: palette.onBackgroundDark01,\n },\n disabled: {\n background: palette.background100,\n content: palette.onBackgroundLight04,\n },\n },\n text: {\n enabled: {\n background: palette.transparent,\n content: palette.primary300,\n },\n pressed: {\n background: palette.transparent,\n content: palette.primary300,\n },\n disabled: {\n background: palette.transparent,\n content: palette.onBackgroundLight04,\n },\n },\n },\n dialog: {\n default: {\n none: {\n background: palette.background50,\n text: palette.onBackgroundLight01,\n message: palette.onBackgroundLight02,\n highlight: palette.primary300,\n destructive: palette.error300,\n blurred: palette.onBackgroundLight04,\n },\n },\n },\n input: {\n default: {\n active: {\n text: palette.onBackgroundLight01,\n placeholder: palette.onBackgroundLight03,\n background: palette.background100,\n highlight: palette.primary300,\n },\n disabled: {\n text: palette.onBackgroundLight04,\n placeholder: palette.onBackgroundLight04,\n background: palette.background100,\n highlight: palette.onBackgroundLight04,\n },\n },\n underline: {\n active: {\n text: palette.onBackgroundLight01,\n placeholder: palette.onBackgroundLight03,\n background: palette.transparent,\n highlight: palette.primary300,\n },\n disabled: {\n text: palette.onBackgroundLight04,\n placeholder: palette.onBackgroundLight04,\n background: palette.transparent,\n highlight: palette.onBackgroundLight04,\n },\n },\n },\n badge: {\n default: {\n none: {\n text: palette.background50,\n background: palette.primary300,\n },\n },\n },\n placeholder: {\n default: {\n none: {\n content: palette.onBackgroundLight03,\n highlight: palette.primary300,\n },\n },\n },\n message: groupChannelMessage,\n dateSeparator: {\n default: {\n none: {\n text: palette.onBackgroundDark01,\n background: palette.overlay02,\n },\n },\n },\n groupChannelMessage,\n groupChannelPreview: {\n default: {\n none: {\n textTitle: palette.onBackgroundLight01,\n textTitleCaption: palette.onBackgroundLight03,\n textBody: palette.onBackgroundLight03,\n bodyIcon: palette.onBackgroundLight02,\n memberCount: palette.onBackgroundLight02,\n background: palette.background50,\n coverBackground: palette.onBackgroundLight04,\n bodyIconBackground: palette.background100,\n separator: palette.onBackgroundLight04,\n },\n },\n },\n profileCard: {\n default: {\n none: {\n textUsername: palette.onBackgroundLight01,\n textBodyLabel: palette.onBackgroundLight02,\n textBody: palette.onBackgroundLight01,\n background: palette.background50,\n },\n },\n },\n reaction: {\n default: {\n enabled: {\n background: palette.transparent,\n highlight: palette.onBackgroundLight03,\n },\n selected: {\n background: palette.primary100,\n highlight: palette.primary300,\n },\n },\n rounded: {\n enabled: {\n background: palette.background100,\n highlight: palette.transparent,\n },\n selected: {\n background: palette.primary100,\n highlight: palette.transparent,\n },\n },\n },\n openChannelMessage: {\n default: {\n enabled: {\n background: palette.transparent,\n bubbleBackground: palette.background100,\n adminBackground: palette.background100,\n textMsg: palette.onBackgroundLight01,\n textMsgPostfix: palette.onBackgroundLight02,\n textSenderName: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textOperator: palette.secondary300,\n },\n pressed: {\n background: palette.background100,\n bubbleBackground: palette.background300,\n adminBackground: palette.background100,\n textMsg: palette.onBackgroundLight01,\n textMsgPostfix: palette.onBackgroundLight02,\n textSenderName: palette.onBackgroundLight02,\n textTime: palette.onBackgroundLight03,\n textOperator: palette.secondary300,\n },\n },\n },\n openChannelPreview: {\n default: {\n none: {\n textTitle: palette.onBackgroundLight01,\n textParticipants: palette.onBackgroundLight02,\n frozenIcon: palette.primary300,\n participantsIcon: palette.onBackgroundLight02,\n background: palette.background50,\n coverBackground: palette.background300,\n separator: palette.onBackgroundLight04,\n },\n },\n },\n },\n };\n },\n});\n\nexport default LightUIKitTheme;\n"],"mappings":"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"}

package/lib/module/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextStyle } from 'react-native';\n\nexport interface UIKitTypography {\n h1: FontAttributes;\n h2: FontAttributes;\n subtitle1: FontAttributes;\n subtitle2: FontAttributes;\n body1: FontAttributes;\n body2: FontAttributes;\n body3: FontAttributes;\n button: FontAttributes;\n caption1: FontAttributes;\n caption2: FontAttributes;\n caption3: FontAttributes;\n caption4: FontAttributes;\n}\nexport type TypoName = keyof UIKitTypography;\nexport type FontAttributes = Pick<TextStyle, 'fontFamily' \| 'fontSize' \| 'lineHeight' \| 'letterSpacing' \| 'fontWeight'>;\n\nexport type UIKitColorScheme = 'light' \| 'dark';\nexport interface UIKitTheme {\n colorScheme: UIKitColorScheme;\n select<V>(options: { [key in UIKitColorScheme \| 'default']?: V }): V;\n\n palette: UIKitPalette;\n colors: UIKitColors;\n\n typography: UIKitTypography;\n}\n\nexport type Component =\n \| 'Header'\n \| 'Button'\n \| 'Dialog'\n \| 'Input'\n \| 'Badge'\n \| 'Placeholder'\n \| 'DateSeparator'\n \| 'GroupChannelMessage'\n \| 'GroupChannelPreview'\n \| 'ProfileCard'\n \| 'Reaction'\n \| 'OpenChannelMessage'\n \| 'OpenChannelPreview';\n\nexport type GetColorTree<\n Tree extends {\n Variant: {\n [key in Component]: string;\n };\n State: {\n [key in Component]: string;\n };\n ColorPart: {\n [key in Component]: string;\n };\n },\n> = Tree;\n\nexport type ComponentColorTree = GetColorTree<{\n Variant: {\n Header: 'nav';\n Button: 'contained' \| 'text';\n Dialog: 'default';\n Input: 'default' \| 'underline';\n Badge: 'default';\n Placeholder: 'default';\n DateSeparator: 'default';\n GroupChannelMessage: 'incoming' \| 'outgoing';\n GroupChannelPreview: 'default';\n ProfileCard: 'default';\n Reaction: 'default' \| 'rounded';\n OpenChannelMessage: 'default';\n OpenChannelPreview: 'default';\n };\n State: {\n Header: 'none';\n Button: 'enabled' \| 'pressed' \| 'disabled';\n Dialog: 'none';\n Input: 'active' \| 'disabled';\n Badge: 'none';\n Placeholder: 'none';\n DateSeparator: 'none';\n GroupChannelMessage: 'enabled' \| 'pressed';\n GroupChannelPreview: 'none';\n ProfileCard: 'none';\n Reaction: 'enabled' \| 'selected';\n OpenChannelMessage: 'enabled' \| 'pressed';\n OpenChannelPreview: 'none';\n };\n ColorPart: {\n Header: 'background' \| 'borderBottom';\n Button: 'background' \| 'content';\n Dialog: 'background' \| 'text' \| 'message' \| 'highlight' \| 'destructive';\n Input: 'text' \| 'placeholder' \| 'background' \| 'highlight';\n Badge: 'text' \| 'background';\n Placeholder: 'content' \| 'highlight';\n DateSeparator: 'text' \| 'background';\n GroupChannelMessage: 'textMsg' \| 'textEdited' \| 'textSenderName' \| 'textTime' \| 'background';\n GroupChannelPreview:\n \| 'textTitle'\n \| 'textTitleCaption'\n \| 'textBody'\n \| 'memberCount'\n \| 'bodyIcon'\n \| 'background'\n \| 'coverBackground'\n \| 'bodyIconBackground'\n \| 'separator';\n ProfileCard: 'textUsername' \| 'textBodyLabel' \| 'textBody' \| 'background';\n Reaction: 'background' \| 'highlight';\n OpenChannelMessage:\n \| 'textMsg'\n \| 'textMsgPostfix'\n \| 'textSenderName'\n \| 'textTime'\n \| 'textOperator'\n \| 'background'\n \| 'bubbleBackground'\n \| 'adminBackground';\n OpenChannelPreview:\n \| 'textTitle'\n \| 'textParticipants'\n \| 'frozenIcon'\n \| 'participantsIcon'\n \| 'background'\n \| 'coverBackground'\n \| 'separator';\n };\n}>;\nexport type ComponentColors<T extends Component> = {\n [key in ComponentColorTree['Variant'][T]]: {\n [key in ComponentColorTree['State'][T]]: {\n [key in ComponentColorTree['ColorPart'][T]]: string;\n };\n };\n};\n\nexport interface UIKitColors {\n primary: string;\n secondary: string;\n error: string;\n background: string;\n text: string;\n onBackground01: string;\n onBackground02: string;\n onBackground03: string;\n onBackground04: string;\n onBackgroundReverse01: string;\n onBackgroundReverse02: string;\n onBackgroundReverse03: string;\n onBackgroundReverse04: string;\n /\n UI Colors has below structure\n * Component.{Variant}.{State}.{ColorPart}\n * @example\n * ```\n * const { colors } = useUIKitTheme();\n * colors.ui.button.contained.disabled.backgroundColor\n * ```\n * */\n ui: {\n header: ComponentColors<'Header'>;\n button: ComponentColors<'Button'>;\n dialog: ComponentColors<'Dialog'>;\n input: ComponentColors<'Input'>;\n badge: ComponentColors<'Badge'>;\n placeholder: ComponentColors<'Placeholder'>;\n dateSeparator: ComponentColors<'DateSeparator'>;\n groupChannelMessage: ComponentColors<'GroupChannelMessage'>;\n groupChannelPreview: ComponentColors<'GroupChannelPreview'>;\n profileCard: ComponentColors<'ProfileCard'>;\n reaction: ComponentColors<'Reaction'>;\n openChannelMessage: ComponentColors<'OpenChannelMessage'>;\n openChannelPreview: ComponentColors<'OpenChannelPreview'>;\n };\n}\n\nexport type HeaderElement = string \| ReactElement \| null;\nexport type HeaderPartProps = {\n title?: HeaderElement;\n right?: HeaderElement;\n left?: HeaderElement;\n onPressLeft?: (...params: any[]) => any;\n onPressRight?: (...params: any[]) => any;\n};\nexport type BaseHeaderProps<HeaderParts extends HeaderPartProps = {}, AdditionalProps = {}> = {\n titleAlign?: 'left' \| 'center' \| 'right';\n children?: ReactNode;\n} & HeaderParts &\n AdditionalProps;\nexport interface UIKitPalette {\n primary100: string;\n primary200: string;\n primary300: string;\n primary400: string;\n primary500: string;\n\n secondary100: string;\n secondary200: string;\n secondary300: string;\n secondary400: string;\n secondary500: string;\n\n error100: string;\n error200: string;\n error300: string;\n error400: string;\n error500: string;\n\n background50: string;\n background100: string;\n background200: string;\n background300: string;\n background400: string;\n background500: string;\n background600: string;\n background700: string;\n\n overlay01: string;\n overlay02: string;\n\n information: string;\n highlight: string;\n transparent: 'transparent';\n\n onBackgroundLight01: string;\n onBackgroundLight02: string;\n onBackgroundLight03: string;\n onBackgroundLight04: string;\n\n onBackgroundDark01: string;\n onBackgroundDark02: string;\n onBackgroundDark03: string;\n onBackgroundDark04: string;\n}\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextStyle } from 'react-native';\n\nexport interface UIKitTypography {\n h1: FontAttributes;\n h2: FontAttributes;\n subtitle1: FontAttributes;\n subtitle2: FontAttributes;\n body1: FontAttributes;\n body2: FontAttributes;\n body3: FontAttributes;\n button: FontAttributes;\n caption1: FontAttributes;\n caption2: FontAttributes;\n caption3: FontAttributes;\n caption4: FontAttributes;\n}\nexport type TypoName = keyof UIKitTypography;\nexport type FontAttributes = Pick<TextStyle, 'fontFamily' \| 'fontSize' \| 'lineHeight' \| 'letterSpacing' \| 'fontWeight'>;\n\nexport type UIKitColorScheme = 'light' \| 'dark';\nexport interface UIKitTheme {\n colorScheme: UIKitColorScheme;\n select<V>(options: { [key in UIKitColorScheme \| 'default']?: V }): V;\n\n palette: UIKitPalette;\n colors: UIKitColors;\n\n typography: UIKitTypography;\n}\n\nexport type Component =\n \| 'Header'\n \| 'Button'\n \| 'Dialog'\n \| 'Input'\n \| 'Badge'\n \| 'Placeholder'\n \| 'DateSeparator'\n \| 'GroupChannelMessage'\n \| 'GroupChannelPreview'\n \| 'ProfileCard'\n \| 'Reaction'\n \| 'OpenChannelMessage'\n \| 'OpenChannelPreview';\n\nexport type GetColorTree<\n Tree extends {\n Variant: {\n [key in Component]: string;\n };\n State: {\n [key in Component]: string;\n };\n ColorPart: {\n [key in Component]: string;\n };\n },\n> = Tree;\n\nexport type ComponentColorTree = GetColorTree<{\n Variant: {\n Header: 'nav';\n Button: 'contained' \| 'text';\n Dialog: 'default';\n Input: 'default' \| 'underline';\n Badge: 'default';\n Placeholder: 'default';\n DateSeparator: 'default';\n GroupChannelMessage: 'incoming' \| 'outgoing';\n GroupChannelPreview: 'default';\n ProfileCard: 'default';\n Reaction: 'default' \| 'rounded';\n OpenChannelMessage: 'default';\n OpenChannelPreview: 'default';\n };\n State: {\n Header: 'none';\n Button: 'enabled' \| 'pressed' \| 'disabled';\n Dialog: 'none';\n Input: 'active' \| 'disabled';\n Badge: 'none';\n Placeholder: 'none';\n DateSeparator: 'none';\n GroupChannelMessage: 'enabled' \| 'pressed';\n GroupChannelPreview: 'none';\n ProfileCard: 'none';\n Reaction: 'enabled' \| 'selected';\n OpenChannelMessage: 'enabled' \| 'pressed';\n OpenChannelPreview: 'none';\n };\n ColorPart: {\n Header: 'background' \| 'borderBottom';\n Button: 'background' \| 'content';\n Dialog: 'background' \| 'text' \| 'message' \| 'highlight' \| 'destructive' \| 'blurred';\n Input: 'text' \| 'placeholder' \| 'background' \| 'highlight';\n Badge: 'text' \| 'background';\n Placeholder: 'content' \| 'highlight';\n DateSeparator: 'text' \| 'background';\n GroupChannelMessage: 'textMsg' \| 'textEdited' \| 'textSenderName' \| 'textTime' \| 'background';\n GroupChannelPreview:\n \| 'textTitle'\n \| 'textTitleCaption'\n \| 'textBody'\n \| 'memberCount'\n \| 'bodyIcon'\n \| 'background'\n \| 'coverBackground'\n \| 'bodyIconBackground'\n \| 'separator';\n ProfileCard: 'textUsername' \| 'textBodyLabel' \| 'textBody' \| 'background';\n Reaction: 'background' \| 'highlight';\n OpenChannelMessage:\n \| 'textMsg'\n \| 'textMsgPostfix'\n \| 'textSenderName'\n \| 'textTime'\n \| 'textOperator'\n \| 'background'\n \| 'bubbleBackground'\n \| 'adminBackground';\n OpenChannelPreview:\n \| 'textTitle'\n \| 'textParticipants'\n \| 'frozenIcon'\n \| 'participantsIcon'\n \| 'background'\n \| 'coverBackground'\n \| 'separator';\n };\n}>;\nexport type ComponentColors<T extends Component> = {\n [key in ComponentColorTree['Variant'][T]]: {\n [key in ComponentColorTree['State'][T]]: {\n [key in ComponentColorTree['ColorPart'][T]]: string;\n };\n };\n};\n\nexport interface UIKitColors {\n primary: string;\n secondary: string;\n error: string;\n background: string;\n text: string;\n onBackground01: string;\n onBackground02: string;\n onBackground03: string;\n onBackground04: string;\n onBackgroundReverse01: string;\n onBackgroundReverse02: string;\n onBackgroundReverse03: string;\n onBackgroundReverse04: string;\n /\n UI Colors has below structure\n * Component.{Variant}.{State}.{ColorPart}\n * @example\n * ```\n * const { colors } = useUIKitTheme();\n * colors.ui.button.contained.disabled.backgroundColor\n * ```\n * */\n ui: {\n header: ComponentColors<'Header'>;\n button: ComponentColors<'Button'>;\n dialog: ComponentColors<'Dialog'>;\n input: ComponentColors<'Input'>;\n badge: ComponentColors<'Badge'>;\n placeholder: ComponentColors<'Placeholder'>;\n dateSeparator: ComponentColors<'DateSeparator'>;\n groupChannelMessage: ComponentColors<'GroupChannelMessage'>;\n groupChannelPreview: ComponentColors<'GroupChannelPreview'>;\n profileCard: ComponentColors<'ProfileCard'>;\n reaction: ComponentColors<'Reaction'>;\n openChannelMessage: ComponentColors<'OpenChannelMessage'>;\n openChannelPreview: ComponentColors<'OpenChannelPreview'>;\n };\n}\n\nexport type HeaderElement = string \| ReactElement \| null;\nexport type HeaderPartProps = {\n title?: HeaderElement;\n right?: HeaderElement;\n left?: HeaderElement;\n onPressLeft?: (...params: any[]) => any;\n onPressRight?: (...params: any[]) => any;\n};\nexport type BaseHeaderProps<HeaderParts extends HeaderPartProps = {}, AdditionalProps = {}> = {\n titleAlign?: 'left' \| 'center' \| 'right';\n children?: ReactNode;\n} & HeaderParts &\n AdditionalProps;\nexport interface UIKitPalette {\n primary100: string;\n primary200: string;\n primary300: string;\n primary400: string;\n primary500: string;\n\n secondary100: string;\n secondary200: string;\n secondary300: string;\n secondary400: string;\n secondary500: string;\n\n error100: string;\n error200: string;\n error300: string;\n error400: string;\n error500: string;\n\n background50: string;\n background100: string;\n background200: string;\n background300: string;\n background400: string;\n background500: string;\n background600: string;\n background700: string;\n\n overlay01: string;\n overlay02: string;\n\n information: string;\n highlight: string;\n transparent: 'transparent';\n\n onBackgroundLight01: string;\n onBackgroundLight02: string;\n onBackgroundLight03: string;\n onBackgroundLight04: string;\n\n onBackgroundDark01: string;\n onBackgroundDark02: string;\n onBackgroundDark03: string;\n onBackgroundDark04: string;\n}\n"],"mappings":""}

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

@@ -52,6 +52,7 @@ const BottomSheet = _ref => {
         paddingLeft: left,
         paddingRight: right
       },
+      disabled: props.disabled,
       onPress: async () => {
         await onHide();
         try {

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","TouchableOpacity","useWindowDimensions","useSafeAreaInsets","Modal","useHeaderStyle","DialogSheet","BottomSheet","_ref","onDismiss","onHide","visible","sheetItems","HeaderComponent","statusBarTranslucent","width","bottom","left","right","createElement","type","onClose","backgroundStyle","alignItems","justifyContent","style","paddingBottom","map","_ref2","idx","onPress","props","activeOpacity","key","title","paddingLeft","paddingRight","Item"],"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\ntype HeaderProps = { onClose: () => Promise<void> };\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 HeaderComponent?: (props: HeaderProps) => JSX.Element;\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, HeaderComponent }: 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 {HeaderComponent && <HeaderComponent onClose={onHide} />}\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,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,EAAEC,mBAAmB,QAAQ,cAAc;AACpE,SAASC,iBAAiB,QAAQ,gCAAgC;AAGlE,OAAOC,KAAK,MAAM,wBAAwB;AAC1C,OAAOC,cAAc,MAAM,6BAA6B;AACxD,OAAOC,WAAW,MAAM,uBAAuB;~~AAmB~~/C,MAAMC,WAAW,GAAGC,IAAA,IAAwE;EAAA,IAAvE;IAAEC,SAAS;IAAEC,MAAM;IAAEC,OAAO;IAAEC,UAAU;IAAEC;EAAuB,CAAC,GAAAL,IAAA;EACrF,MAAM;IAAEM;EAAqB,CAAC,GAAGT,cAAc,EAAE;EACjD,MAAM;IAAEU;EAAM,CAAC,GAAGb,mBAAmB,EAAE;EACvC,MAAM;IAAEc,MAAM;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGf,iBAAiB,EAAE;EACnD,oBACEH,KAAA,CAAAmB,aAAA,CAACf,KAAK;IACJgB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAEX,MAAO;IAChBD,SAAS,EAAEA,SAAU;IACrBK,oBAAoB,EAAEA,oBAAqB;IAC3CH,OAAO,EAAEA,OAAQ;IACjBW,eAAe,EAAE;MAAEC,UAAU,EAAE,QAAQ;MAAEC,cAAc,EAAE;IAAW;EAAE,gBAEtExB,KAAA,CAAAmB,aAAA,CAACb,WAAW;IAACmB,KAAK,EAAE;MAAEV,KAAK;MAAEW,aAAa,EAAEV;IAAO;EAAE,GAClDH,eAAe,iBAAIb,KAAA,CAAAmB,aAAA,CAACN,eAAe;IAACQ,OAAO,EAAEX;EAAO,EAAG,EACvDE,UAAU,CAACe,GAAG,CAAC,CAAAC,KAAA,EAAwBC,GAAG;IAAA,IAA1B;MAAEC,OAAO;MAAE,GAAGC;IAAM,CAAC,GAAAH,KAAA;IAAA,oBACpC5B,KAAA,CAAAmB,aAAA,CAAClB,gBAAgB;MACf+B,aAAa,EAAE,IAAK;MACpBC,GAAG,EAAEF,KAAK,CAACG,KAAK,GAAGL,GAAI;MACvBJ,KAAK,EAAE;QAAEU,WAAW,EAAElB,IAAI;QAAEmB,YAAY,EAAElB;MAAM,CAAE;~~MAClDY~~,OAAO,EAAE,MAAAA,CAAA,KAAY;QACnB,MAAMpB,MAAM,EAAE;QACd,IAAI;UACFoB,OAAO,EAAE;QACX,CAAC,CAAC,MAAM,CAAC;MACX;IAAE,gBAEF9B,KAAA,CAAAmB,aAAA,CAACb,WAAW,~~CAAC+B~~,IAAI,~~EAAKN~~,KAAK,CAAI,CACd;EAAA,CACpB,CAAC,CACU,CACR;AAEZ,CAAC;AAED,eAAexB,WAAW"}
1	+ {"version":3,"names":["React","TouchableOpacity","useWindowDimensions","useSafeAreaInsets","Modal","useHeaderStyle","DialogSheet","BottomSheet","_ref","onDismiss","onHide","visible","sheetItems","HeaderComponent","statusBarTranslucent","width","bottom","left","right","createElement","type","onClose","backgroundStyle","alignItems","justifyContent","style","paddingBottom","map","_ref2","idx","onPress","props","activeOpacity","key","title","paddingLeft","paddingRight","disabled","Item"],"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\ntype HeaderProps = { onClose: () => Promise<void> };\nexport type BottomSheetItem = {\n sheetItems: {\n icon?: keyof typeof Icon.Assets;\n iconColor?: string;\n title: string;\n titleColor?: string;\n disabled?: boolean;\n onPress: () => void;\n }[];\n HeaderComponent?: (props: HeaderProps) => JSX.Element;\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, HeaderComponent }: 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 {HeaderComponent && <HeaderComponent onClose={onHide} />}\n {sheetItems.map(({ onPress, ...props }, idx) => (\n <TouchableOpacity\n activeOpacity={0.75}\n key={props.title + idx}\n style={{ paddingLeft: left, paddingRight: right }}\n disabled={props.disabled}\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,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,EAAEC,mBAAmB,QAAQ,cAAc;AACpE,SAASC,iBAAiB,QAAQ,gCAAgC;AAGlE,OAAOC,KAAK,MAAM,wBAAwB;AAC1C,OAAOC,cAAc,MAAM,6BAA6B;AACxD,OAAOC,WAAW,MAAM,uBAAuB;AAoB/C,MAAMC,WAAW,GAAGC,IAAA,IAAwE;EAAA,IAAvE;IAAEC,SAAS;IAAEC,MAAM;IAAEC,OAAO;IAAEC,UAAU;IAAEC;EAAuB,CAAC,GAAAL,IAAA;EACrF,MAAM;IAAEM;EAAqB,CAAC,GAAGT,cAAc,EAAE;EACjD,MAAM;IAAEU;EAAM,CAAC,GAAGb,mBAAmB,EAAE;EACvC,MAAM;IAAEc,MAAM;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGf,iBAAiB,EAAE;EACnD,oBACEH,KAAA,CAAAmB,aAAA,CAACf,KAAK;IACJgB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAEX,MAAO;IAChBD,SAAS,EAAEA,SAAU;IACrBK,oBAAoB,EAAEA,oBAAqB;IAC3CH,OAAO,EAAEA,OAAQ;IACjBW,eAAe,EAAE;MAAEC,UAAU,EAAE,QAAQ;MAAEC,cAAc,EAAE;IAAW;EAAE,gBAEtExB,KAAA,CAAAmB,aAAA,CAACb,WAAW;IAACmB,KAAK,EAAE;MAAEV,KAAK;MAAEW,aAAa,EAAEV;IAAO;EAAE,GAClDH,eAAe,iBAAIb,KAAA,CAAAmB,aAAA,CAACN,eAAe;IAACQ,OAAO,EAAEX;EAAO,EAAG,EACvDE,UAAU,CAACe,GAAG,CAAC,CAAAC,KAAA,EAAwBC,GAAG;IAAA,IAA1B;MAAEC,OAAO;MAAE,GAAGC;IAAM,CAAC,GAAAH,KAAA;IAAA,oBACpC5B,KAAA,CAAAmB,aAAA,CAAClB,gBAAgB;MACf+B,aAAa,EAAE,IAAK;MACpBC,GAAG,EAAEF,KAAK,CAACG,KAAK,GAAGL,GAAI;MACvBJ,KAAK,EAAE;QAAEU,WAAW,EAAElB,IAAI;QAAEmB,YAAY,EAAElB;MAAM,CAAE;MAClDmB,QAAQ,EAAEN,KAAK,CAACM,QAAS;MACzBP,OAAO,EAAE,MAAAA,CAAA,KAAY;QACnB,MAAMpB,MAAM,EAAE;QACd,IAAI;UACFoB,OAAO,EAAE;QACX,CAAC,CAAC,MAAM,CAAC;MACX;IAAE,gBAEF9B,KAAA,CAAAmB,aAAA,CAACb,WAAW,CAACgC,IAAI,EAAKP,KAAK,CAAI,CACd;EAAA,CACpB,CAAC,CACU,CACR;AAEZ,CAAC;AAED,eAAexB,WAAW"}

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

@@ -23,7 +23,8 @@ const SheetItem = _ref2 => {
     icon,
     title,
     iconColor,
-    titleColor
+    titleColor,
+    disabled = false
   } = _ref2;
   const {
     colors
@@ -34,12 +35,12 @@ const SheetItem = _ref2 => {
     }]
   }, icon && /*#__PURE__*/React.createElement(Icon, {
     icon: icon,
-    color: iconColor ?? colors.ui.dialog.default.none.highlight,
+    color: iconColor ?? (disabled ? colors.ui.dialog.default.none.blurred : colors.ui.dialog.default.none.highlight),
     containerStyle: styles.sheetItemIcon
   }), /*#__PURE__*/React.createElement(Text, {
     subtitle1: true,
     numberOfLines: 1,
-    color: titleColor ?? colors.ui.dialog.default.none.text,
+    color: titleColor ?? (disabled ? colors.ui.dialog.default.none.blurred : colors.ui.dialog.default.none.text),
     style: styles.sheetItemText
   }, title));
 };

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","DialogSheet","_ref","style","children","colors","createElement","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","_ref2","icon","title","iconColor","titleColor","sheetItemContainer","color","highlight","containerStyle","sheetItemIcon","subtitle1","numberOfLines","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,KAAK,MAAM,OAAO;AACzB,SAAoBC,IAAI,QAAmB,cAAc;AAEzD,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AAKrD,MAAMC,WAAyE,GAAGC,IAAA,IAAyB;EAAA,IAAxB;IAAEC,KAAK;IAAEC;EAAS,CAAC,GAAAF,IAAA;EACpG,MAAM;IAAEG;EAAO,CAAC,GAAGL,aAAa,EAAE;EAClC,oBACEL,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACO,KAAK,EAAE,CAACI,MAAM,CAACC,SAAS,EAAE;MAAEC,eAAe,EAAEJ,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACC;IAAW,CAAC,EAAEX,KAAK;EAAE,GACnGC,QAAQ,CACJ;AAEX,CAAC;~~AAQD~~,MAAMW,SAAS,GAAGC,KAAA,~~IAA4D~~;EAAA,~~IAA3D~~;IAAEC,IAAI;IAAEC,KAAK;IAAEC,SAAS;IAAEC;~~EAA2B~~,CAAC,~~GAAAJ~~,KAAA;~~EACvE~~,MAAM;IAAEX;EAAO,CAAC,GAAGL,aAAa,EAAE;EAClC,oBACEL,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACO,KAAK,EAAE,CAACI,MAAM,~~CAACc~~,kBAAkB,EAAE;~~MAAEZ~~,eAAe,EAAEJ,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACC;IAAW,CAAC;EAAE,GACrGG,IAAI,iBACHtB,KAAA,CAAAW,aAAA,CAACT,IAAI;IACHoB,IAAI,EAAEA,IAAK;~~IACXK~~,KAAK,~~EAAEH~~,SAAS,~~IAAId~~,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,~~CAACU~~,~~SAAU~~;~~IAC5DC~~,cAAc,~~EAAEjB~~,MAAM,~~CAACkB~~;EAAc,EAExC,~~eACD9B~~,KAAA,CAAAW,aAAA,CAACR,IAAI;~~IACH4B~~,SAAS;IACTC,aAAa,EAAE,CAAE;~~IACjBL~~,KAAK,~~EAAEF~~,UAAU,~~IAAIf~~,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,~~CAACe~~,~~IAAK~~;~~IACxDzB~~,KAAK,EAAEI,MAAM,~~CAACsB~~;EAAc,~~GAE3BX~~,KAAK,CACD,CACF;AAEX,CAAC;AAED,MAAMX,MAAM,GAAGR,gBAAgB,CAAC;EAC9BS,SAAS,EAAE;~~IACTsB~~,QAAQ,EAAE,QAAQ;IAClBC,aAAa,EAAE,QAAQ;IACvBC,KAAK,EAAE,MAAM;IACbC,mBAAmB,EAAE,CAAC;IACtBC,oBAAoB,EAAE;EACxB,CAAC;~~EACDb~~,kBAAkB,EAAE;~~IAClBU~~,aAAa,EAAE,KAAK;IACpBI,UAAU,EAAE,QAAQ;IACpBC,MAAM,EAAE;EACV,CAAC;EACDX,aAAa,EAAE;IACbY,UAAU,EAAE;EACd,CAAC;EACDR,aAAa,EAAE;IACbS,IAAI,EAAE,CAAC;IACPC,gBAAgB,EAAE;EACpB;AACF,CAAC,CAAC;~~AAEFtC~~,WAAW,~~CAACuC~~,IAAI,~~GAAGzB~~,SAAS;AAC5B,eAAed,WAAW"}
1	+ {"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","DialogSheet","_ref","style","children","colors","createElement","styles","container","backgroundColor","ui","dialog","default","none","background","SheetItem","_ref2","icon","title","iconColor","titleColor","disabled","sheetItemContainer","color","blurred","highlight","containerStyle","sheetItemIcon","subtitle1","numberOfLines","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 disabled?: boolean;\n};\nconst SheetItem = ({ icon, title, iconColor, titleColor, disabled = false }: 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={\n iconColor ?? (disabled ? colors.ui.dialog.default.none.blurred : colors.ui.dialog.default.none.highlight)\n }\n containerStyle={styles.sheetItemIcon}\n />\n )}\n <Text\n subtitle1\n numberOfLines={1}\n color={titleColor ?? (disabled ? colors.ui.dialog.default.none.blurred : 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,KAAK,MAAM,OAAO;AACzB,SAAoBC,IAAI,QAAmB,cAAc;AAEzD,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AAKrD,MAAMC,WAAyE,GAAGC,IAAA,IAAyB;EAAA,IAAxB;IAAEC,KAAK;IAAEC;EAAS,CAAC,GAAAF,IAAA;EACpG,MAAM;IAAEG;EAAO,CAAC,GAAGL,aAAa,EAAE;EAClC,oBACEL,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACO,KAAK,EAAE,CAACI,MAAM,CAACC,SAAS,EAAE;MAAEC,eAAe,EAAEJ,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACC;IAAW,CAAC,EAAEX,KAAK;EAAE,GACnGC,QAAQ,CACJ;AAEX,CAAC;AASD,MAAMW,SAAS,GAAGC,KAAA,IAA8E;EAAA,IAA7E;IAAEC,IAAI;IAAEC,KAAK;IAAEC,SAAS;IAAEC,UAAU;IAAEC,QAAQ,GAAG;EAAsB,CAAC,GAAAL,KAAA;EACzF,MAAM;IAAEX;EAAO,CAAC,GAAGL,aAAa,EAAE;EAClC,oBACEL,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACO,KAAK,EAAE,CAACI,MAAM,CAACe,kBAAkB,EAAE;MAAEb,eAAe,EAAEJ,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACC;IAAW,CAAC;EAAE,GACrGG,IAAI,iBACHtB,KAAA,CAAAW,aAAA,CAACT,IAAI;IACHoB,IAAI,EAAEA,IAAK;IACXM,KAAK,EACHJ,SAAS,KAAKE,QAAQ,GAAGhB,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACW,OAAO,GAAGnB,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACY,SAAS,CACzG;IACDC,cAAc,EAAEnB,MAAM,CAACoB;EAAc,EAExC,eACDhC,KAAA,CAAAW,aAAA,CAACR,IAAI;IACH8B,SAAS;IACTC,aAAa,EAAE,CAAE;IACjBN,KAAK,EAAEH,UAAU,KAAKC,QAAQ,GAAGhB,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACW,OAAO,GAAGnB,MAAM,CAACK,EAAE,CAACC,MAAM,CAACC,OAAO,CAACC,IAAI,CAACiB,IAAI,CAAE;IAC7G3B,KAAK,EAAEI,MAAM,CAACwB;EAAc,GAE3Bb,KAAK,CACD,CACF;AAEX,CAAC;AAED,MAAMX,MAAM,GAAGR,gBAAgB,CAAC;EAC9BS,SAAS,EAAE;IACTwB,QAAQ,EAAE,QAAQ;IAClBC,aAAa,EAAE,QAAQ;IACvBC,KAAK,EAAE,MAAM;IACbC,mBAAmB,EAAE,CAAC;IACtBC,oBAAoB,EAAE;EACxB,CAAC;EACDd,kBAAkB,EAAE;IAClBW,aAAa,EAAE,KAAK;IACpBI,UAAU,EAAE,QAAQ;IACpBC,MAAM,EAAE;EACV,CAAC;EACDX,aAAa,EAAE;IACbY,UAAU,EAAE;EACd,CAAC;EACDR,aAAa,EAAE;IACbS,IAAI,EAAE,CAAC;IACPC,gBAAgB,EAAE;EACpB;AACF,CAAC,CAAC;AAEFxC,WAAW,CAACyC,IAAI,GAAG3B,SAAS;AAC5B,eAAed,WAAW"}

package/lib/module/ui/GroupChannelMessage/Message.file.image.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import React from 'react';
-import { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';
+import { getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';
 import Box from '../../components/Box';
 import ImageWithPlaceholder from '../../components/ImageWithPlaceholder';
 import PressBox from '../../components/PressBox';
@@ -24,7 +24,7 @@ const ImageFileMessage = props => {
     onLongPress: onLongPress
   }, /*#__PURE__*/React.createElement(ImageWithPlaceholder, {
     source: {
-      uri: getAvailableUriFromFileMessage(props.message)
+      uri: getThumbnailUriFromFileMessage(props.message)
     },
     style: styles.image
   })), props.children));

package/lib/module/ui/GroupChannelMessage/Message.file.image.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","~~getAvailableUriFromFileMessage~~","Box","ImageWithPlaceholder","PressBox","createStyleSheet","useUIKitTheme","MessageContainer","ImageFileMessage","props","onPress","onLongPress","variant","colors","createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","source","uri","message","image","children","borderRadius","overflow","maxWidth","width","height"],"sources":["Message.file.image.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport { ~~getAvailableUriFromFileMessage~~ } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\nconst ImageFileMessage = (props: GroupChannelMessageProps<SendbirdFileMessage>) => {\n const { onPress, onLongPress, variant = 'incoming' } = props;\n\n const { colors } = useUIKitTheme();\n\n return (\n <MessageContainer {...props}>\n <Box style={styles.container} backgroundColor={colors.ui.groupChannelMessage[variant].enabled.background}>\n <PressBox activeOpacity={0.8} onPress={onPress} onLongPress={onLongPress}>\n <ImageWithPlaceholder source={{ uri: ~~getAvailableUriFromFileMessage~~(props.message) }} style={styles.image} />\n </PressBox>\n {props.children}\n </Box>\n </MessageContainer>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n maxWidth: 240,\n width: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,SAASC,8BAA8B,QAAQ,uBAAuB;AAEtE,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,oBAAoB,MAAM,uCAAuC;AACxE,OAAOC,QAAQ,MAAM,2BAA2B;AAChD,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,gBAAgB,MAAM,oBAAoB;AAGjD,MAAMC,gBAAgB,GAAIC,KAAoD,IAAK;EACjF,MAAM;IAAEC,OAAO;IAAEC,WAAW;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGH,KAAK;EAE5D,MAAM;IAAEI;EAAO,CAAC,GAAGP,aAAa,EAAE;EAElC,oBACEN,KAAA,CAAAc,aAAA,CAACP,gBAAgB,EAAKE,KAAK,eACzBT,KAAA,CAAAc,aAAA,CAACZ,GAAG;IAACa,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,EAAEL,MAAM,CAACM,EAAE,CAACC,mBAAmB,CAACR,OAAO,CAAC,CAACS,OAAO,CAACC;EAAW,gBACvGtB,KAAA,CAAAc,aAAA,CAACV,QAAQ;IAACmB,aAAa,EAAE,GAAI;IAACb,OAAO,EAAEA,OAAQ;IAACC,WAAW,EAAEA;EAAY,gBACvEX,KAAA,CAAAc,aAAA,CAACX,oBAAoB;IAACqB,MAAM,EAAE;MAAEC,GAAG,EAAExB,8BAA8B,CAACQ,KAAK,CAACiB,OAAO;IAAE,CAAE;IAACX,KAAK,EAAEC,MAAM,CAACW;EAAM,EAAG,CACpG,EACVlB,KAAK,CAACmB,QAAQ,CACX,CACW;AAEvB,CAAC;AAED,MAAMZ,MAAM,GAAGX,gBAAgB,CAAC;EAC9BY,SAAS,EAAE;IACTY,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDH,KAAK,EAAE;IACLI,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAetB,gBAAgB"}
1	+ {"version":3,"names":["React","getThumbnailUriFromFileMessage","Box","ImageWithPlaceholder","PressBox","createStyleSheet","useUIKitTheme","MessageContainer","ImageFileMessage","props","onPress","onLongPress","variant","colors","createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","source","uri","message","image","children","borderRadius","overflow","maxWidth","width","height"],"sources":["Message.file.image.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport { getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\nconst ImageFileMessage = (props: GroupChannelMessageProps<SendbirdFileMessage>) => {\n const { onPress, onLongPress, variant = 'incoming' } = props;\n\n const { colors } = useUIKitTheme();\n\n return (\n <MessageContainer {...props}>\n <Box style={styles.container} backgroundColor={colors.ui.groupChannelMessage[variant].enabled.background}>\n <PressBox activeOpacity={0.8} onPress={onPress} onLongPress={onLongPress}>\n <ImageWithPlaceholder source={{ uri: getThumbnailUriFromFileMessage(props.message) }} style={styles.image} />\n </PressBox>\n {props.children}\n </Box>\n </MessageContainer>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n maxWidth: 240,\n width: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,SAASC,8BAA8B,QAAQ,uBAAuB;AAEtE,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,oBAAoB,MAAM,uCAAuC;AACxE,OAAOC,QAAQ,MAAM,2BAA2B;AAChD,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,gBAAgB,MAAM,oBAAoB;AAGjD,MAAMC,gBAAgB,GAAIC,KAAoD,IAAK;EACjF,MAAM;IAAEC,OAAO;IAAEC,WAAW;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGH,KAAK;EAE5D,MAAM;IAAEI;EAAO,CAAC,GAAGP,aAAa,EAAE;EAElC,oBACEN,KAAA,CAAAc,aAAA,CAACP,gBAAgB,EAAKE,KAAK,eACzBT,KAAA,CAAAc,aAAA,CAACZ,GAAG;IAACa,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,EAAEL,MAAM,CAACM,EAAE,CAACC,mBAAmB,CAACR,OAAO,CAAC,CAACS,OAAO,CAACC;EAAW,gBACvGtB,KAAA,CAAAc,aAAA,CAACV,QAAQ;IAACmB,aAAa,EAAE,GAAI;IAACb,OAAO,EAAEA,OAAQ;IAACC,WAAW,EAAEA;EAAY,gBACvEX,KAAA,CAAAc,aAAA,CAACX,oBAAoB;IAACqB,MAAM,EAAE;MAAEC,GAAG,EAAExB,8BAA8B,CAACQ,KAAK,CAACiB,OAAO;IAAE,CAAE;IAACX,KAAK,EAAEC,MAAM,CAACW;EAAM,EAAG,CACpG,EACVlB,KAAK,CAACmB,QAAQ,CACX,CACW;AAEvB,CAAC;AAED,MAAMZ,MAAM,GAAGX,gBAAgB,CAAC;EAC9BY,SAAS,EAAE;IACTY,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDH,KAAK,EAAE;IACLI,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAetB,gBAAgB"}

package/lib/module/ui/GroupChannelMessage/Message.file.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import React from 'react';
-import { getFileExtension, getFileType } from '@sendbird/uikit-utils';
+import { getFileExtension, getFileType, truncate } from '@sendbird/uikit-utils';
 import Box from '../../components/Box';
 import Icon from '../../components/Icon';
 import PressBox from '../../components/PressBox';
@@ -7,12 +7,6 @@ import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import MessageContainer from './MessageContainer';
-const iconMapper = {
-  audio: 'file-audio',
-  image: 'photo',
-  video: 'play',
-  file: 'file-document'
-};
 const FileMessage = props => {
   const {
     variant = 'incoming'
@@ -35,8 +29,8 @@ const FileMessage = props => {
       style: styles.container
     }, /*#__PURE__*/React.createElement(Box, {
       style: styles.bubble
-    }, /*#__PURE__*/React.createElement(Icon, {
-      icon: iconMapper[fileType],
+    }, /*#__PURE__*/React.createElement(Icon.File, {
+      fileType: fileType,
       size: 24,
       containerStyle: {
         backgroundColor: colors.background,
@@ -50,7 +44,10 @@ const FileMessage = props => {
       numberOfLines: 1,
       color: pressed ? color.pressed.textMsg : color.enabled.textMsg,
       style: styles.name
-    }, ((_props$strings = props.strings) === null || _props$strings === void 0 ? void 0 : _props$strings.fileName) || props.message.name)), props.children);
+    }, truncate(((_props$strings = props.strings) === null || _props$strings === void 0 ? void 0 : _props$strings.fileName) || props.message.name, {
+      mode: 'mid',
+      maxLen: 20
+    }))), props.children);
   }));
 };
 const styles = createStyleSheet({

package/lib/module/ui/GroupChannelMessage/Message.file.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","getFileExtension","getFileType","Box","Icon","PressBox","Text","createStyleSheet","useUIKitTheme","MessageContainer","~~iconMapper","audio","image","video","file","~~FileMessage","props","variant","colors","fileType","message","type","name","color","ui","groupChannelMessage","createElement","onPress","onLongPress","_ref","_props$strings","pressed","backgroundColor","background","enabled","style","styles","container","bubble","~~icon~~","size","containerStyle","padding","borderRadius","marginRight","body3","ellipsizeMode","numberOfLines","textMsg","strings","fileName","children","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink"],"sources":["Message.file.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SendbirdFileMessage, getFileExtension, getFileType } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Icon from '../../components/Icon';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\~~nconst iconMapper = { audio: 'file-audio', image: 'photo', video: 'play', file: 'file-document' } as const;\n\~~ntype Props = GroupChannelMessageProps<SendbirdFileMessage>;\n\nconst FileMessage = (props: Props) => {\n const { variant = 'incoming' } = props;\n const { colors } = useUIKitTheme();\n\n const fileType = getFileType(props.message.type \|\| getFileExtension(props.message.name));\n const color = colors.ui.groupChannelMessage[variant];\n\n return (\n <MessageContainer {...props}>\n <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n {({ pressed }) => (\n <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background} style={styles.container}>\n <Box style={styles.bubble}>\n <Icon\n ~~icon~~={~~iconMapper[~~fileType]}\n size={24}\n containerStyle={{ backgroundColor: colors.background, padding: 2, borderRadius: 8, marginRight: 8 }}\n />\n <Text\n body3\n ellipsizeMode={'middle'}\n numberOfLines={1}\n color={pressed ? color.pressed.textMsg : color.enabled.textMsg}\n style={styles.name}\n >\n {props.strings?.fileName \|\| props.message.name}\n </Text>\n </Box>\n {props.children}\n </Box>\n )}\n </PressBox>\n </MessageContainer>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n overflow: 'hidden',\n borderRadius: 16,\n },\n bubble: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingHorizontal: 12,\n paddingVertical: 6,\n },\n name: {\n flexShrink: 1,\n },\n});\n\nexport default FileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAA8BC,gBAAgB,EAAEC,WAAW,QAAQ,uBAAuB;~~AAE1F~~,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,QAAQ,MAAM,2BAA2B;AAChD,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,gBAAgB,MAAM,oBAAoB;~~AAGjD~~,MAAMC,~~UAAU,GAAG;EAAEC,KAAK,EAAE,YAAY;EAAEC,KAAK,EAAE,OAAO;EAAEC,KAAK,EAAE,MAAM;EAAEC,IAAI,EAAE;AAAgB,CAAU;AAIzG,MAAMC,~~WAAW,GAAIC,KAAY,IAAK;EACpC,MAAM;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGD,KAAK;EACtC,MAAM;IAAEE;EAAO,CAAC,~~GAAGV~~,aAAa,EAAE;EAElC,~~MAAMW~~,QAAQ,~~GAAGjB~~,WAAW,~~CAACc~~,KAAK,CAACI,OAAO,CAACC,IAAI,~~IAAIpB~~,gBAAgB,~~CAACe~~,KAAK,CAACI,OAAO,CAACE,IAAI,CAAC,CAAC;EACxF,MAAMC,KAAK,GAAGL,MAAM,CAACM,EAAE,CAACC,mBAAmB,CAACR,OAAO,CAAC;EAEpD,~~oBACEjB~~,KAAA,~~CAAA0B~~,aAAA,~~CAACjB~~,gBAAgB,~~EAAKO~~,KAAK,~~eACzBhB~~,KAAA,~~CAAA0B~~,aAAA,~~CAACrB~~,QAAQ;~~IAACsB~~,OAAO,EAAEX,KAAK,CAACW,OAAQ;IAACC,WAAW,EAAEZ,KAAK,CAACY;EAAY,GAC9DC,IAAA;IAAA,IAAAC,cAAA;IAAA,IAAC;MAAEC;IAAQ,CAAC,GAAAF,IAAA;IAAA,~~oBACX7B~~,KAAA,~~CAAA0B~~,aAAA,~~CAACvB~~,GAAG;~~MAAC6B~~,eAAe,EAAED,OAAO,GAAGR,KAAK,CAACQ,OAAO,CAACE,UAAU,GAAGV,KAAK,CAACW,OAAO,CAACD,UAAW;MAACE,KAAK,EAAEC,MAAM,CAACC;IAAU,~~gBAC3GrC~~,KAAA,~~CAAA0B~~,aAAA,~~CAACvB~~,GAAG;~~MAACgC~~,KAAK,EAAEC,MAAM,CAACE;IAAO,~~gBACxBtC~~,KAAA,~~CAAA0B~~,aAAA,~~CAACtB~~,IAAI~~;MACHmC~~,IAAI,~~EAAE7B~~,~~UAAU~~,~~CAACS,QAAQ,CAAE~~;~~MAC3BqB~~,IAAI,EAAE,EAAG;MACTC,cAAc,EAAE;QAAET,eAAe,EAAEd,MAAM,CAACe,UAAU;QAAES,OAAO,EAAE,CAAC;QAAEC,YAAY,EAAE,CAAC;QAAEC,WAAW,EAAE;MAAE;IAAE,EACpG,~~eACF5C~~,KAAA,~~CAAA0B~~,aAAA,~~CAACpB~~,IAAI;~~MACHuC~~,KAAK;MACLC,aAAa,EAAE,QAAS;MACxBC,aAAa,EAAE,CAAE;MACjBxB,KAAK,EAAEQ,OAAO,GAAGR,KAAK,CAACQ,OAAO,CAACiB,OAAO,GAAGzB,KAAK,CAACW,OAAO,CAACc,OAAQ;MAC/Db,KAAK,EAAEC,MAAM,CAACd;IAAK,~~GAElB~~,~~EAAAQ~~,cAAA,GAAAd,KAAK,CAACiC,OAAO,cAAAnB,cAAA,uBAAbA,cAAA,CAAeoB,QAAQ,KAAIlC,KAAK,CAACI,OAAO,CAACE,IAAI,~~CACzC~~,CACH,~~EACLN~~,KAAK,~~CAACmC~~,QAAQ,CACX;EAAA,CACP,CACQ,CACM;AAEvB,CAAC;AAED,~~MAAMf~~,MAAM,~~GAAG7B~~,gBAAgB,CAAC;~~EAC9B8B~~,SAAS,EAAE;~~IACTe~~,QAAQ,EAAE,QAAQ;~~IAClBT~~,YAAY,EAAE;EAChB,CAAC;EACDL,MAAM,EAAE;~~IACNe~~,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;~~EACDlC~~,IAAI,EAAE;~~IACJmC~~,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,~~eAAe1C~~,WAAW"}
1	+ {"version":3,"names":["React","getFileExtension","getFileType","truncate","Box","Icon","PressBox","Text","createStyleSheet","useUIKitTheme","MessageContainer","FileMessage","props","variant","colors","fileType","message","type","name","color","ui","groupChannelMessage","createElement","onPress","onLongPress","_ref","_props$strings","pressed","backgroundColor","background","enabled","style","styles","container","bubble","File","size","containerStyle","padding","borderRadius","marginRight","body3","ellipsizeMode","numberOfLines","textMsg","strings","fileName","mode","maxLen","children","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink"],"sources":["Message.file.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SendbirdFileMessage, getFileExtension, getFileType, truncate } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Icon from '../../components/Icon';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<SendbirdFileMessage>;\n\nconst FileMessage = (props: Props) => {\n const { variant = 'incoming' } = props;\n const { colors } = useUIKitTheme();\n\n const fileType = getFileType(props.message.type \|\| getFileExtension(props.message.name));\n const color = colors.ui.groupChannelMessage[variant];\n\n return (\n <MessageContainer {...props}>\n <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n {({ pressed }) => (\n <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background} style={styles.container}>\n <Box style={styles.bubble}>\n <Icon.File\n fileType={fileType}\n size={24}\n containerStyle={{ backgroundColor: colors.background, padding: 2, borderRadius: 8, marginRight: 8 }}\n />\n <Text\n body3\n ellipsizeMode={'middle'}\n numberOfLines={1}\n color={pressed ? color.pressed.textMsg : color.enabled.textMsg}\n style={styles.name}\n >\n {truncate(props.strings?.fileName \|\| props.message.name, { mode: 'mid', maxLen: 20 })}\n </Text>\n </Box>\n {props.children}\n </Box>\n )}\n </PressBox>\n </MessageContainer>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n overflow: 'hidden',\n borderRadius: 16,\n },\n bubble: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingHorizontal: 12,\n paddingVertical: 6,\n },\n name: {\n flexShrink: 1,\n },\n});\n\nexport default FileMessage;\n"],"mappings":"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"}

package/lib/module/ui/GroupChannelMessage/Message.file.video.js CHANGED Viewed

@@ -1,10 +1,8 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { StyleSheet } from 'react-native';
-import { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';
+import React from 'react';
+import { getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';
 import Box from '../../components/Box';
-import Icon from '../../components/Icon';
-import ImageWithPlaceholder from '../../components/ImageWithPlaceholder';
 import PressBox from '../../components/PressBox';
+import { VideoThumbnail } from '../../components/VideoThumbnail';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import MessageContainer from './MessageContainer';
@@ -15,79 +13,21 @@ const VideoFileMessage = props => {
     variant = 'incoming'
   } = props;
   const {
-    colors,
-    palette,
-    select
+    colors
   } = useUIKitTheme();
-  const uri = getAvailableUriFromFileMessage(props.message);
-  const {
-    thumbnail,
-    loading
-  } = useRetry(() => props.fetchThumbnailFromVideoSource(uri));
+  const uri = getThumbnailUriFromFileMessage(props.message);
   return /*#__PURE__*/React.createElement(MessageContainer, props, /*#__PURE__*/React.createElement(Box, {
     style: styles.container,
     backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
   }, /*#__PURE__*/React.createElement(PressBox, {
     activeOpacity: 0.8,
     onPress: onPress,
-    onLongPress: onLongPress,
-    style: styles.image
-  }, loading ? /*#__PURE__*/React.createElement(Box, {
-    style: StyleSheet.absoluteFill,
-    backgroundColor: select({
-      dark: palette.background400,
-      light: palette.background100
-    })
-  }) : /*#__PURE__*/React.createElement(ImageWithPlaceholder, {
-    source: {
-      uri: thumbnail ?? 'invalid-image'
-    },
-    style: StyleSheet.absoluteFill
-  }), (loading || thumbnail !== null) && /*#__PURE__*/React.createElement(Box, {
-    style: StyleSheet.absoluteFill,
-    alignItems: 'center',
-    justifyContent: 'center'
-  }, /*#__PURE__*/React.createElement(Icon, {
-    icon: 'play',
-    size: 28,
-    color: palette.onBackgroundLight02,
-    containerStyle: [styles.playIcon, {
-      backgroundColor: palette.onBackgroundDark01
-    }]
-  }))), props.children));
-};
-const useRetry = function (fetch) {
-  let retryCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
-  const [state, setState] = useState({
-    thumbnail: null,
-    loading: true
-  });
-  const retryCountRef = useRef(0);
-  const retryTimeoutRef = useRef();
-  const fetchThumbnail = useRef(fetch);
-  fetchThumbnail.current = fetch;
-  useEffect(() => {
-    if (!state.thumbnail) {
-      const reloadReservation = () => {
-        if (retryCountRef.current < retryCount) {
-          retryTimeoutRef.current = setTimeout(() => {
-            retryCountRef.current++;
-            reloadReservation();
-            fetchThumbnail.current().then(result => {
-              setState({
-                loading: false,
-                thumbnail: (result === null || result === void 0 ? void 0 : result.path) ?? null
-              });
-            });
-          }, retryCountRef.current * 5000);
-        }
-      };
-      return reloadReservation();
-    } else {
-      return clearTimeout(retryTimeoutRef.current);
-    }
-  }, [state.thumbnail]);
-  return state;
+    onLongPress: onLongPress
+  }, /*#__PURE__*/React.createElement(VideoThumbnail, {
+    style: styles.image,
+    source: uri,
+    fetchThumbnailFromVideoSource: props.fetchThumbnailFromVideoSource
+  })), props.children));
 };
 const styles = createStyleSheet({
   container: {

package/lib/module/ui/GroupChannelMessage/Message.file.video.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","~~useEffect~~","~~useRef","useState","StyleSheet","getAvailableUriFromFileMessage","~~Box","~~Icon~~","~~ImageWithPlaceholder~~","~~PressBox","~~createStyleSheet","useUIKitTheme","MessageContainer","VideoFileMessage","props","onPress","onLongPress","variant","colors","~~palette","select","~~uri","message","~~thumbnail","loading","useRetry","fetchThumbnailFromVideoSource","~~createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","image","~~absoluteFill","dark","background400","light","background100","~~source","~~alignItems~~","~~justifyContent","icon","size","color","onBackgroundLight02","containerStyle","playIcon","onBackgroundDark01","~~children","fetch","retryCount","arguments","length","undefined","state","setState","retryCountRef","retryTimeoutRef","fetchThumbnail","current","reloadReservation","setTimeout","then","result","path","clearTimeout","borderRadius","overflow","maxWidth","width","height","padding"],"sources":["Message.file.video.tsx"],"sourcesContent":["import React, ~~{ useEffect, useRef, useState }~~ from 'react';\~~nimport { StyleSheet } from 'react-native';\~~n\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport { ~~getAvailableUriFromFileMessage~~ } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ~~Icon~~ from '../../components/~~Icon~~';\nimport ~~ImageWithPlaceholder~~ ~~from~~ ~~'../../components/ImageWithPlaceholder';\nimport~~ ~~PressBox~~ from '../../components/~~PressBox~~';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n SendbirdFileMessage,\n {\n fetchThumbnailFromVideoSource: (uri: string) => Promise<{ path: string } \| null~~>;\n~~ }\n>;\n\nconst VideoFileMessage = (props: Props) => {\n const { onPress, onLongPress, variant = 'incoming' } = props;\n\n const { colors, ~~palette, select~~ } = useUIKitTheme();\n const uri = ~~getAvailableUriFromFileMessage~~(props.message);\n ~~const { thumbnail, loading } = useRetry(() => props.fetchThumbnailFromVideoSource(uri));\n~~\n return (\n <MessageContainer {...props}>\n <Box style={styles.container} backgroundColor={colors.ui.groupChannelMessage[variant].enabled.background}>\n <PressBox activeOpacity={0.8} onPress={onPress} onLongPress={onLongPress} ~~style={styles.image}~~>\n ~~{loading ? (~~\n ~~<Box\n~~ style={~~StyleSheet~~.~~absoluteFill~~}\n ~~backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n~~ ~~/>\n ) : (\n <ImageWithPlaceholder~~ source={{ uri~~: thumbnail ?? 'invalid-image'~~ }~~} style={StyleSheet.absoluteFill} />\n )}~~\n~~\n {(loading \|\| thumbnail !== null) && (\n~~ ~~<Box style~~={~~StyleSheet~~.~~absoluteFill~~} ~~alignItems={'center'} justifyContent={'center'}>\n <Icon~~\n ~~icon={'play'}\n size={28}\n color={palette.onBackgroundLight02}\n containerStyle={[styles.playIcon, { backgroundColor: palette.onBackgroundDark01 }]}\n~~ />\n ~~</Box>\n )}\n~~ </PressBox>\n {props.children}\n </Box>\n </MessageContainer>\n );\n};\n\nconst useRetry = (fetch: () => Promise<{ path: string } \| null>, retryCount = 5) => {\n const [state, setState] = useState({ thumbnail: null as null \| string, loading: true });\n const retryCountRef = useRef(0);\n const retryTimeoutRef = useRef<NodeJS.Timeout>();\n const fetchThumbnail = useRef(fetch);\n fetchThumbnail.current = fetch;\n\n useEffect(() => {\n if (!state.thumbnail) {\n const reloadReservation = () => {\n if (retryCountRef.current < retryCount) {\n retryTimeoutRef.current = setTimeout(() => {\n retryCountRef.current++;\n reloadReservation();\n fetchThumbnail.current().then((result) => {\n setState({ loading: false, thumbnail: result?.path ?? null });\n });\n }, retryCountRef.current * 5000);\n }\n };\n\n return reloadReservation();\n } else {\n return clearTimeout(retryTimeoutRef.current);\n }\n }, [state.thumbnail]);\n\n return state;\n};\nconst styles = createStyleSheet({\n container: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n maxWidth: 240,\n width: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n playIcon: {\n padding: 10,\n borderRadius: 50,\n },\n});\nexport default VideoFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,~~IAAIC,SAAS,EAAEC,~~MAAM,~~EAAEC,QAAQ,QAAQ,~~OAAO;~~AAC1D~~,SAASC,~~UAAU,QAAQ,cAAc;AAGzC,SAASC,~~8BAA8B,QAAQ,uBAAuB;AAEtE,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,~~IAAI~~,MAAM,~~uBAAuB~~;~~AACxC~~,~~OAAOC~~,~~oBAAoB~~,~~MAAM,uCAAuC;AACxE,OAAOC,~~QAAQ,~~MAAM,2BAA2B~~;~~AAChD~~,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,gBAAgB,MAAM,oBAAoB;~~AAUjD~~,MAAMC,gBAAgB,GAAIC,KAAY,IAAK;EACzC,MAAM;IAAEC,OAAO;IAAEC,WAAW;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGH,KAAK;EAE5D,MAAM;IAAEI~~,MAAM~~;~~IAAEC,OAAO;IAAEC;~~EAAO,CAAC,~~GAAGT~~,aAAa,EAAE;~~EACnD~~,~~MAAMU~~,GAAG,~~GAAGhB~~,8BAA8B,~~CAACS~~,KAAK,~~CAACQ~~,OAAO,CAAC;~~EACzD~~,~~MAAM;IAAEC~~,~~SAAS;IAAEC;EAAQ,CAAC,GAAGC,QAAQ,CAAC,MAAMX,KAAK,CAACY,6BAA6B,CAACL,GAAG,CAAC,CAAC;EAEvF,oBACErB,~~KAAA,~~CAAA2B~~,aAAA,~~CAACf~~,gBAAgB,EAAKE,KAAK,~~eACzBd~~,KAAA,~~CAAA2B~~,aAAA,~~CAACrB~~,GAAG;~~IAACsB~~,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,~~EAAEb~~,MAAM,~~CAACc~~,EAAE,CAACC,mBAAmB,~~CAAChB~~,OAAO,CAAC,~~CAACiB~~,OAAO,CAACC;EAAW,~~gBACvGnC~~,KAAA,~~CAAA2B~~,aAAA,~~CAAClB~~,QAAQ;~~IAAC2B~~,aAAa,EAAE,GAAI;~~IAACrB~~,OAAO,EAAEA,OAAQ;IAACC,WAAW,EAAEA~~,WAAY~~;~~IAACY~~,~~KAAK~~,~~EAAEC,MAAM,CAACQ;EAAM,GAC3Fb,OAAO,gBACNxB,~~KAAA,~~CAAA2B~~,aAAA,~~CAACrB~~,~~GAAG~~;~~IACFsB~~,KAAK,~~EAAExB~~,~~UAAU,CAACkC,YAAa;IAC/BP,eAAe,EAAEX,~~MAAM,~~CAAC;MAAEmB~~,~~IAAI,EAAEpB,OAAO,CAACqB,aAAa~~;~~MAAEC~~,~~KAAK,EAAEtB,OAAO,CAACuB;IAAc,CAAC;EAAE,EACvF,gBAEF1C,KAAA,CAAA2B,aAAA,CAACnB,oBAAoB;IAACmC,~~MAAM,~~EAAE;MAAEtB~~,~~GAAG,EAAEE,SAAS,IAAI~~;~~IAAgB~~,~~CAAE;IAACK~~,~~KAAK~~,~~EAAExB,UAAU,CAACkC;EAAa,EACrG,EAEA,CAACd,OAAO,IAAID,SAAS,~~KAAK,~~IAAI,kBAC7BvB,KAAA,CAAA2B,aAAA,CAACrB,GAAG~~;~~IAACsB~~,~~KAAK~~,~~EAAExB~~,~~UAAU~~,~~CAACkC,YAAa;IAACM,UAAU,EAAE,QAAS;IAACC,cAAc,EAAE;EAAS,gBAClF7C,KAAA,CAAA2B,aAAA,CAACpB,IAAI;IACHuC,IAAI,EAAE,MAAO;IACbC,IAAI,EAAE,EAAG;IACTC,~~KAAK,~~EAAE7B~~,~~OAAO,CAAC8B,mBAAoB;IACnCC,cAAc,EAAE,CAACrB,MAAM,CAACsB,~~QAAQ,~~EAAE;MAAEpB,eAAe,EAAEZ,OAAO,CAACiC;IAAmB,CAAC;EAAE,EACnF,CAEL,CACQ,EACVtC,KAAK,CAACuC,QAAQ,~~CACX,CACW;AAEvB,CAAC;AAED,~~MAAM5B~~,~~QAAQ,GAAG,SAAAA,CAAC6B,KAA6C,EAAqB;EAAA,IAAnBC,UAAU,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,CAAC;EAC7E,~~MAAM,~~CAACG~~,KAAK,EAAEC,QAAQ,CAAC,GAAGzD,QAAQ,CAAC;IAAEoB,SAAS,EAAE,IAAqB;IAAEC,OAAO,EAAE;EAAK,CAAC,CAAC;EACvF,MAAMqC,aAAa,GAAG3D,MAAM,CAAC,CAAC,CAAC;EAC/B,MAAM4D,eAAe,GAAG5D,MAAM,EAAkB;EAChD,MAAM6D,cAAc,GAAG7D,MAAM,CAACoD,KAAK,CAAC;EACpCS,cAAc,CAACC,OAAO,GAAGV,KAAK;EAE9BrD,SAAS,CAAC,MAAM;IACd,IAAI,CAAC0D,KAAK,CAACpC,SAAS,EAAE;MACpB,MAAM0C,iBAAiB,GAAGA,CAAA,KAAM;QAC9B,IAAIJ,aAAa,CAACG,OAAO,GAAGT,UAAU,EAAE;UACtCO,eAAe,CAACE,OAAO,GAAGE,UAAU,CAAC,MAAM;YACzCL,aAAa,CAACG,OAAO,EAAE;YACvBC,iBAAiB,EAAE;YACnBF,cAAc,CAACC,OAAO,EAAE,CAACG,IAAI,CAAEC,MAAM,IAAK;cACxCR,QAAQ,CAAC;gBAAEpC,OAAO,EAAE,KAAK;gBAAED,SAAS,EAAE,CAAA6C,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEC,IAAI,KAAI;cAAK,CAAC,CAAC;YAC/D,CAAC,CAAC;UACJ,CAAC,EAAER,aAAa,CAACG,OAAO,GAAG,IAAI,CAAC;QAClC;MACF,CAAC;MAED,OAAOC,iBAAiB,EAAE;IAC5B,CAAC,MAAM;MACL,OAAOK,YAAY,CAACR,eAAe,CAACE,OAAO,CAAC;IAC9C;EACF,CAAC,EAAE,CAACL,KAAK,CAACpC,SAAS,CAAC,CAAC;EAErB,OAAOoC,KAAK;AACd,CAAC;AACD,MAAM9B,MAAM,GAAGnB,gBAAgB,CAAC;~~EAC9BoB~~,SAAS,EAAE;~~IACTyC~~,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;~~EACDnC~~,KAAK,EAAE;~~IACLoC~~,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;~~EACDrB~~,QAAQ,EAAE;~~IACRyB~~,OAAO,EAAE,EAAE;~~IACXL~~,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AACF,~~eAAe1D~~,gBAAgB"}
1	+ {"version":3,"names":["React","getThumbnailUriFromFileMessage","Box","PressBox","VideoThumbnail","createStyleSheet","useUIKitTheme","MessageContainer","VideoFileMessage","props","onPress","onLongPress","variant","colors","uri","message","createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","image","source","fetchThumbnailFromVideoSource","children","borderRadius","overflow","maxWidth","width","height","playIcon","padding"],"sources":["Message.file.video.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport { getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport PressBox from '../../components/PressBox';\nimport { VideoThumbnail } from '../../components/VideoThumbnail';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n SendbirdFileMessage,\n { fetchThumbnailFromVideoSource: (uri: string) => Promise<{ path: string } \| null> }\n>;\n\nconst VideoFileMessage = (props: Props) => {\n const { onPress, onLongPress, variant = 'incoming' } = props;\n\n const { colors } = useUIKitTheme();\n const uri = getThumbnailUriFromFileMessage(props.message);\n\n return (\n <MessageContainer {...props}>\n <Box style={styles.container} backgroundColor={colors.ui.groupChannelMessage[variant].enabled.background}>\n <PressBox activeOpacity={0.8} onPress={onPress} onLongPress={onLongPress}>\n <VideoThumbnail\n style={styles.image}\n source={uri}\n fetchThumbnailFromVideoSource={props.fetchThumbnailFromVideoSource}\n />\n </PressBox>\n {props.children}\n </Box>\n </MessageContainer>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n borderRadius: 16,\n overflow: 'hidden',\n },\n image: {\n maxWidth: 240,\n width: 240,\n height: 160,\n borderRadius: 16,\n overflow: 'hidden',\n },\n playIcon: {\n padding: 10,\n borderRadius: 50,\n },\n});\nexport default VideoFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,SAASC,8BAA8B,QAAQ,uBAAuB;AAEtE,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,QAAQ,MAAM,2BAA2B;AAChD,SAASC,cAAc,QAAQ,iCAAiC;AAChE,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,gBAAgB,MAAM,oBAAoB;AAQjD,MAAMC,gBAAgB,GAAIC,KAAY,IAAK;EACzC,MAAM;IAAEC,OAAO;IAAEC,WAAW;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGH,KAAK;EAE5D,MAAM;IAAEI;EAAO,CAAC,GAAGP,aAAa,EAAE;EAClC,MAAMQ,GAAG,GAAGb,8BAA8B,CAACQ,KAAK,CAACM,OAAO,CAAC;EAEzD,oBACEf,KAAA,CAAAgB,aAAA,CAACT,gBAAgB,EAAKE,KAAK,eACzBT,KAAA,CAAAgB,aAAA,CAACd,GAAG;IAACe,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,EAAEP,MAAM,CAACQ,EAAE,CAACC,mBAAmB,CAACV,OAAO,CAAC,CAACW,OAAO,CAACC;EAAW,gBACvGxB,KAAA,CAAAgB,aAAA,CAACb,QAAQ;IAACsB,aAAa,EAAE,GAAI;IAACf,OAAO,EAAEA,OAAQ;IAACC,WAAW,EAAEA;EAAY,gBACvEX,KAAA,CAAAgB,aAAA,CAACZ,cAAc;IACba,KAAK,EAAEC,MAAM,CAACQ,KAAM;IACpBC,MAAM,EAAEb,GAAI;IACZc,6BAA6B,EAAEnB,KAAK,CAACmB;EAA8B,EACnE,CACO,EACVnB,KAAK,CAACoB,QAAQ,CACX,CACW;AAEvB,CAAC;AAED,MAAMX,MAAM,GAAGb,gBAAgB,CAAC;EAC9Bc,SAAS,EAAE;IACTW,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDL,KAAK,EAAE;IACLM,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDI,QAAQ,EAAE;IACRC,OAAO,EAAE,EAAE;IACXN,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AACF,eAAetB,gBAAgB"}

package/lib/module/ui/GroupChannelMessage/MessageContainer.js CHANGED Viewed

@@ -21,7 +21,8 @@ MessageContainer.Incoming = function MessageContainerIncoming(_ref) {
     groupedWithPrev,
     message,
     onPressAvatar,
-    strings
+    strings,
+    parentMessage
   } = _ref;
   const {
     colors
@@ -41,7 +42,7 @@ MessageContainer.Incoming = function MessageContainerIncoming(_ref) {
     uri: (_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.profileUrl
   }))), /*#__PURE__*/React.createElement(Box, {
     flexShrink: 1
-  }, !groupedWithPrev && /*#__PURE__*/React.createElement(Box, {
+  }, parentMessage, !groupedWithPrev && !message.parentMessage && /*#__PURE__*/React.createElement(Box, {
     marginLeft: 12,
     marginBottom: 4
   }, (message.isFileMessage() || message.isUserMessage()) && /*#__PURE__*/React.createElement(Text, {
@@ -66,13 +67,14 @@ MessageContainer.Outgoing = function MessageContainerOutgoing(_ref2) {
     message,
     groupedWithNext,
     strings,
-    sendingStatus
+    sendingStatus,
+    parentMessage
   } = _ref2;
   const {
     colors
   } = useUIKitTheme();
   const color = colors.ui.groupChannelMessage.outgoing;
-  return /*#__PURE__*/React.createElement(Box, {
+  return /*#__PURE__*/React.createElement(Box, null, parentMessage, /*#__PURE__*/React.createElement(Box, {
     flexDirection: 'row',
     justifyContent: 'flex-end',
     alignItems: 'flex-end'
@@ -89,7 +91,7 @@ MessageContainer.Outgoing = function MessageContainerOutgoing(_ref2) {
     color: color.enabled.textTime
   }, (strings === null || strings === void 0 ? void 0 : strings.sentDate) ?? getMessageTimeFormat(new Date(message.createdAt))))), /*#__PURE__*/React.createElement(Box, {
     style: styles.bubble
-  }, children));
+  }, children)));
 };
 const styles = createStyleSheet({
   bubble: {

package/lib/module/ui/GroupChannelMessage/MessageContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","Pressable","getMessageTimeFormat","Box","Text","createStyleSheet","useUIKitTheme","Avatar","MessageContainer","props","variant","createElement","Incoming","Outgoing","MessageContainerIncoming","_ref","_message$sender","children","groupedWithNext","groupedWithPrev","message","onPressAvatar","strings","colors","color","ui","groupChannelMessage","incoming","flexDirection","justifyContent","alignItems","width","marginRight","isFileMessage","isUserMessage","onPress","size","uri","sender","profileUrl","flexShrink","marginLeft","marginBottom","caption1","enabled","textSenderName","numberOfLines","senderName","nickname","style","styles","bubble","caption4","textTime","sentDate","Date","createdAt","MessageContainerOutgoing","_ref2","sendingStatus","outgoing","maxWidth","overflow"],"sources":["MessageContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable } from 'react-native';\n\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\nimport { getMessageTimeFormat } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<SendbirdMessage>;\n\nconst MessageContainer = (props: Props) => {\n if (props.variant === 'incoming') {\n return <MessageContainer.Incoming {...props} />;\n } else {\n return <MessageContainer.Outgoing {...props} />;\n }\n};\n\nMessageContainer.Incoming = function MessageContainerIncoming({\n children,\n groupedWithNext,\n groupedWithPrev,\n message,\n onPressAvatar,\n strings,\n}: Props) {\n const { colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage.incoming;\n\n return (\n <Box flexDirection={'row'} justifyContent={'flex-start'} alignItems={'flex-end'}>\n <Box width={26} marginRight={12}>\n {(message.isFileMessage() \|\| message.isUserMessage()) && !groupedWithNext && (\n <Pressable onPress={onPressAvatar}>\n <Avatar size={26} uri={message.sender?.profileUrl} />\n </Pressable>\n )}\n </Box>\n <Box flexShrink={1}>\n {!groupedWithPrev && (\n <Box marginLeft={12} marginBottom={4}>\n {(message.isFileMessage() \|\| message.isUserMessage()) && (\n <Text caption1 color={color.enabled.textSenderName} numberOfLines={1}>\n {strings?.senderName ?? message.sender.nickname}\n </Text>\n )}\n </Box>\n )}\n\n <Box flexDirection={'row'} alignItems={'flex-end'}>\n <Box style={styles.bubble}>{children}</Box>\n {!groupedWithNext && (\n <Box marginLeft={4}>\n <Text caption4 color={color.enabled.textTime}>\n {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n </Text>\n </Box>\n )}\n </Box>\n </Box>\n </Box>\n );\n};\n\nMessageContainer.Outgoing = function MessageContainerOutgoing({\n children,\n message,\n groupedWithNext,\n strings,\n sendingStatus,\n}: Props) {\n const { colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage.outgoing;\n\n return (\n <Box flexDirection={'row'} justifyContent={'flex-end'} alignItems={'flex-end'}>\n <Box flexDirection={'row'} alignItems={'flex-end'} justifyContent={'center'}>\n {sendingStatus && <Box marginRight={4}>{sendingStatus}</Box>}\n\n {!groupedWithNext && (\n <Box marginRight={4}>\n <Text caption4 color={color.enabled.textTime}>\n {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n </Text>\n </Box>\n )}\n </Box>\n <Box style={styles.bubble}>{children}</Box>\n </Box>\n );\n};\n\nconst styles = createStyleSheet({\n bubble: {\n maxWidth: 240,\n overflow: 'hidden',\n flexShrink: 1,\n },\n});\n\nexport default MessageContainer;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,QAAQ,cAAc;AAGxC,SAASC,oBAAoB,QAAQ,uBAAuB;AAE5D,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,MAAM,MAAM,WAAW;AAK9B,MAAMC,gBAAgB,GAAIC,KAAY,IAAK;EACzC,IAAIA,KAAK,CAACC,OAAO,KAAK,UAAU,EAAE;IAChC,oBAAOV,KAAA,CAAAW,aAAA,CAACH,gBAAgB,CAACI,QAAQ,EAAKH,KAAK,CAAI;EACjD,CAAC,MAAM;IACL,oBAAOT,KAAA,CAAAW,aAAA,CAACH,gBAAgB,CAACK,QAAQ,EAAKJ,KAAK,CAAI;EACjD;AACF,CAAC;AAEDD,gBAAgB,CAACI,QAAQ,GAAG,SAASE,wBAAwBA,CAAAC,IAAA,~~EAOnD~~;EAAA,IAAAC,eAAA;EAAA,~~IAPoD~~;IAC5DC,QAAQ;IACRC,eAAe;IACfC,eAAe;IACfC,OAAO;IACPC,aAAa;IACbC;EACK,CAAC,~~GAAAP~~,IAAA;EACN,MAAM;~~IAAEQ~~;EAAO,CAAC,~~GAAGjB~~,aAAa,EAAE;EAClC,~~MAAMkB~~,KAAK,GAAGD,MAAM,CAACE,EAAE,CAACC,mBAAmB,CAACC,QAAQ;EAEpD,~~oBACE3B~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACyB~~,aAAa,EAAE,KAAM;IAACC,cAAc,EAAE,YAAa;IAACC,UAAU,EAAE;EAAW,~~gBAC9E9B~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAAC4B~~,KAAK,EAAE,EAAG;IAACC,WAAW,EAAE;EAAG,GAC7B,~~CAACZ~~,OAAO,~~CAACa~~,aAAa,EAAE,~~IAAIb~~,OAAO,~~CAACc~~,aAAa,EAAE,KAAK,~~CAAChB~~,eAAe,iBACvElB,KAAA,CAAAW,aAAA,CAACV,SAAS;~~IAACkC~~,OAAO,~~EAAEd~~;EAAc,gBAChCrB,KAAA,CAAAW,aAAA,CAACJ,MAAM;~~IAAC6B~~,IAAI,EAAE,EAAG;IAACC,GAAG,~~GAAArB~~,eAAA,GAAEI,OAAO,~~CAACkB~~,MAAM,~~cAAAtB~~,eAAA,uBAAdA,eAAA,~~CAAgBuB~~;EAAW,EAAG,CAExD,CACG,~~eACNvC~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACqC~~,UAAU,EAAE;EAAE,~~GAChB~~,~~CAACrB~~,eAAe,~~iBACfnB~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACsC~~,UAAU,EAAE,EAAG;IAACC,YAAY,EAAE;EAAE,GAClC,~~CAACtB~~,OAAO,~~CAACa~~,aAAa,EAAE,~~IAAIb~~,OAAO,~~CAACc~~,aAAa,EAAE,~~kBAClDlC~~,KAAA,CAAAW,aAAA,CAACP,IAAI;~~IAACuC~~,QAAQ;IAACnB,KAAK,EAAEA,KAAK,CAACoB,OAAO,CAACC,cAAe;IAACC,aAAa,EAAE;EAAE,GAClE,~~CAAAxB~~,OAAO,aAAPA,OAAO,uBAAPA,OAAO,~~CAAEyB~~,UAAU,~~KAAI3B~~,OAAO,~~CAACkB~~,MAAM,CAACU,QAAQ,CAElD,CAEJ,~~eAEDhD~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACyB~~,aAAa,EAAE,KAAM;IAACE,UAAU,EAAE;EAAW,~~gBAChD9B~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAAC8C~~,KAAK,EAAEC,MAAM,CAACC;EAAO,~~GAAElC~~,QAAQ,CAAO,EAC1C,CAACC,eAAe,iBACflB,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACsC~~,UAAU,EAAE;EAAE,~~gBACjBzC~~,KAAA,CAAAW,aAAA,CAACP,IAAI;~~IAACgD~~,QAAQ;IAAC5B,KAAK,EAAEA,KAAK,CAACoB,OAAO,CAACS;EAAS,GAC1C,~~CAAA/B~~,OAAO,aAAPA,OAAO,uBAAPA,OAAO,~~CAAEgC~~,QAAQ,~~KAAIpD~~,oBAAoB,CAAC,~~IAAIqD~~,IAAI,~~CAACnC~~,OAAO,~~CAACoC~~,SAAS,CAAC,CAAC,CAClE,CAEV,CACG,CACF,CACF;AAEV,CAAC;~~AAEDhD~~,gBAAgB,CAACK,QAAQ,GAAG,~~SAAS4C~~,wBAAwBA,CAAAC,KAAA,~~EAMnD~~;EAAA,~~IANoD~~;~~IAC5DzC~~,QAAQ;IACRG,OAAO;IACPF,eAAe;IACfI,OAAO;~~IACPqC~~;EACK,CAAC,~~GAAAD~~,KAAA;EACN,MAAM;IAAEnC;EAAO,CAAC,~~GAAGjB~~,aAAa,EAAE;EAClC,~~MAAMkB~~,KAAK,GAAGD,MAAM,CAACE,EAAE,CAACC,mBAAmB,CAACkC,QAAQ;EAEpD,~~oBACE5D~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACyB~~,aAAa,EAAE,KAAM;IAACC,cAAc,EAAE,UAAW;IAACC,UAAU,EAAE;EAAW,~~gBAC5E9B~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAACyB~~,aAAa,EAAE,KAAM;IAACE,UAAU,EAAE,UAAW;IAACD,cAAc,EAAE;EAAS,GACzE8B,aAAa,~~iBAAI3D~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAAC6B~~,WAAW,EAAE;EAAE,GAAE2B,aAAa,CAAO,~~EAE3D~~,~~CAACzC~~,eAAe,iBACflB,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAAC6B~~,WAAW,EAAE;EAAE,~~gBAClBhC~~,KAAA,CAAAW,aAAA,CAACP,IAAI;~~IAACgD~~,QAAQ;IAAC5B,KAAK,EAAEA,KAAK,CAACoB,OAAO,CAACS;EAAS,GAC1C,~~CAAA/B~~,OAAO,aAAPA,OAAO,uBAAPA,OAAO,~~CAAEgC~~,QAAQ,~~KAAIpD~~,oBAAoB,CAAC,~~IAAIqD~~,IAAI,~~CAACnC~~,OAAO,~~CAACoC~~,SAAS,CAAC,CAAC,CAClE,CAEV,CACG,~~eACNxD~~,KAAA,CAAAW,aAAA,CAACR,GAAG;~~IAAC8C~~,KAAK,EAAEC,MAAM,CAACC;EAAO,~~GAAElC~~,QAAQ,CAAO,CACvC;AAEV,CAAC;AAED,~~MAAMiC~~,MAAM,~~GAAG7C~~,gBAAgB,CAAC;~~EAC9B8C~~,MAAM,EAAE;IACNU,QAAQ,EAAE,GAAG;IACbC,QAAQ,EAAE,QAAQ;IAClBtB,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,~~eAAehC~~,gBAAgB"}
1	+ {"version":3,"names":["React","Pressable","getMessageTimeFormat","Box","Text","createStyleSheet","useUIKitTheme","Avatar","MessageContainer","props","variant","createElement","Incoming","Outgoing","MessageContainerIncoming","_ref","_message$sender","children","groupedWithNext","groupedWithPrev","message","onPressAvatar","strings","parentMessage","colors","color","ui","groupChannelMessage","incoming","flexDirection","justifyContent","alignItems","width","marginRight","isFileMessage","isUserMessage","onPress","size","uri","sender","profileUrl","flexShrink","marginLeft","marginBottom","caption1","enabled","textSenderName","numberOfLines","senderName","nickname","style","styles","bubble","caption4","textTime","sentDate","Date","createdAt","MessageContainerOutgoing","_ref2","sendingStatus","outgoing","maxWidth","overflow"],"sources":["MessageContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable } from 'react-native';\n\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\nimport { getMessageTimeFormat } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<SendbirdMessage>;\n\nconst MessageContainer = (props: Props) => {\n if (props.variant === 'incoming') {\n return <MessageContainer.Incoming {...props} />;\n } else {\n return <MessageContainer.Outgoing {...props} />;\n }\n};\n\nMessageContainer.Incoming = function MessageContainerIncoming({\n children,\n groupedWithNext,\n groupedWithPrev,\n message,\n onPressAvatar,\n strings,\n parentMessage,\n}: Props) {\n const { colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage.incoming;\n\n return (\n <Box flexDirection={'row'} justifyContent={'flex-start'} alignItems={'flex-end'}>\n <Box width={26} marginRight={12}>\n {(message.isFileMessage() \|\| message.isUserMessage()) && !groupedWithNext && (\n <Pressable onPress={onPressAvatar}>\n <Avatar size={26} uri={message.sender?.profileUrl} />\n </Pressable>\n )}\n </Box>\n <Box flexShrink={1}>\n {parentMessage}\n {!groupedWithPrev && !message.parentMessage && (\n <Box marginLeft={12} marginBottom={4}>\n {(message.isFileMessage() \|\| message.isUserMessage()) && (\n <Text caption1 color={color.enabled.textSenderName} numberOfLines={1}>\n {strings?.senderName ?? message.sender.nickname}\n </Text>\n )}\n </Box>\n )}\n\n <Box flexDirection={'row'} alignItems={'flex-end'}>\n <Box style={styles.bubble}>{children}</Box>\n {!groupedWithNext && (\n <Box marginLeft={4}>\n <Text caption4 color={color.enabled.textTime}>\n {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n </Text>\n </Box>\n )}\n </Box>\n </Box>\n </Box>\n );\n};\n\nMessageContainer.Outgoing = function MessageContainerOutgoing({\n children,\n message,\n groupedWithNext,\n strings,\n sendingStatus,\n parentMessage,\n}: Props) {\n const { colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage.outgoing;\n\n return (\n <Box>\n {parentMessage}\n <Box flexDirection={'row'} justifyContent={'flex-end'} alignItems={'flex-end'}>\n <Box flexDirection={'row'} alignItems={'flex-end'} justifyContent={'center'}>\n {sendingStatus && <Box marginRight={4}>{sendingStatus}</Box>}\n {!groupedWithNext && (\n <Box marginRight={4}>\n <Text caption4 color={color.enabled.textTime}>\n {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n </Text>\n </Box>\n )}\n </Box>\n <Box style={styles.bubble}>{children}</Box>\n </Box>\n </Box>\n );\n};\n\nconst styles = createStyleSheet({\n bubble: {\n maxWidth: 240,\n overflow: 'hidden',\n flexShrink: 1,\n },\n});\n\nexport default MessageContainer;\n"],"mappings":"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"}

package/lib/module/ui/GroupChannelMessage/MessageOpenGraph.js CHANGED Viewed

@@ -28,7 +28,7 @@ const MessageOpenGraph = _ref => {
     } = _ref2;
     return /*#__PURE__*/React.createElement(Box, {
       backgroundColor: pressed ? color.pressed.background : color.enabled.background
-    }, Boolean(ogMetaData.defaultImage) && /*#__PURE__*/React.createElement(ImageWithPlaceholder, {
+    }, !!ogMetaData.defaultImage && /*#__PURE__*/React.createElement(ImageWithPlaceholder, {
       style: styles.ogImage,
       source: {
         uri: ogMetaData.defaultImage.url
@@ -44,7 +44,7 @@ const MessageOpenGraph = _ref => {
       body2: true,
       color: colors.onBackground01,
       style: styles.ogTitle
-    }, ogMetaData.title), Boolean(ogMetaData.description) && /*#__PURE__*/React.createElement(Text, {
+    }, ogMetaData.title), !!ogMetaData.description && /*#__PURE__*/React.createElement(Text, {
       numberOfLines: 1,
       caption2: true,
       color: colors.onBackground01,

package/lib/module/ui/GroupChannelMessage/MessageOpenGraph.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","Box","ImageWithPlaceholder","PressBox","Text","createStyleSheet","useUIKitTheme","MessageOpenGraph","_ref","onPressURL","onLongPress","ogMetaData","variant","palette","select","colors","color","ui","groupChannelMessage","createElement","activeOpacity","onPress","url","_ref2","pressed","backgroundColor","background","enabled","~~Boolean","~~defaultImage","style","styles","ogImage","source","uri","ogContainer","dark","background400","light","background100","numberOfLines","body2","onBackground01","ogTitle","title","description","caption2","ogDesc","onBackground02","overflow","paddingHorizontal","paddingTop","paddingBottom","maxWidth","width","height","ogUrl","marginBottom","lineHeight"],"sources":["MessageOpenGraph.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdUserMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nconst MessageOpenGraph = ({\n onPressURL,\n onLongPress,\n ogMetaData,\n variant,\n}: {\n ogMetaData: ~~Required~~<SendbirdUserMessage>['ogMetaData'];\n variant: 'outgoing' \| 'incoming';\n onPressURL?: (url: string) => void;\n onLongPress?: () => void;\n}) => {\n const { palette, select, colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage[variant];\n\n return (\n <PressBox\n activeOpacity={0.85}\n onPress={() => typeof ogMetaData?.url === 'string' && onPressURL?.(ogMetaData.url)}\n onLongPress={onLongPress}\n >\n {({ pressed }) => (\n <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background}>\n {~~Boolean(~~ogMetaData.defaultImage) && (\n <ImageWithPlaceholder style={styles.ogImage} source={{ uri: ogMetaData.defaultImage.url }} />\n )}\n\n <Box\n style={styles.ogContainer}\n backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n >\n <Text numberOfLines={3} body2 color={colors.onBackground01} style={styles.ogTitle}>\n {ogMetaData.title}\n </Text>\n {~~Boolean(~~ogMetaData.description) && (\n <Text numberOfLines={1} caption2 color={colors.onBackground01} style={styles.ogDesc}>\n {ogMetaData.description}\n </Text>\n )}\n <Text numberOfLines={1} caption2 color={colors.onBackground02}>\n {ogMetaData.url}\n </Text>\n </Box>\n </Box>\n )}\n </PressBox>\n );\n};\n\nconst styles = createStyleSheet({\n ogContainer: {\n overflow: 'hidden',\n paddingHorizontal: 12,\n paddingTop: 8,\n paddingBottom: 12,\n },\n ogImage: {\n maxWidth: 240,\n width: 240,\n height: 136,\n },\n ogUrl: {\n marginBottom: 4,\n },\n ogTitle: {\n marginBottom: 4,\n },\n ogDesc: {\n lineHeight: 14,\n marginBottom: 8,\n },\n});\n\nexport default MessageOpenGraph;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAIzB,OAAOC,GAAG,MAAM,sBAAsB;AACtC,OAAOC,oBAAoB,MAAM,uCAAuC;AACxE,OAAOC,QAAQ,MAAM,2BAA2B;AAChD,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AAErD,MAAMC,gBAAgB,GAAGC,IAAA,IAUnB;EAAA,IAVoB;IACxBC,UAAU;IACVC,WAAW;IACXC,UAAU;IACVC;EAMF,CAAC,GAAAJ,IAAA;EACC,MAAM;IAAEK,OAAO;IAAEC,MAAM;IAAEC;EAAO,CAAC,GAAGT,aAAa,EAAE;EACnD,MAAMU,KAAK,GAAGD,MAAM,CAACE,EAAE,CAACC,mBAAmB,CAACN,OAAO,CAAC;EAEpD,oBACEZ,KAAA,CAAAmB,aAAA,CAAChB,QAAQ;IACPiB,aAAa,EAAE,IAAK;IACpBC,OAAO,EAAEA,CAAA,KAAM,QAAOV,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEW,GAAG,MAAK,QAAQ,KAAIb,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAGE,UAAU,CAACW,GAAG,CAAC,CAAC;IACnFZ,WAAW,EAAEA;EAAY,GAExBa,KAAA;IAAA,IAAC;MAAEC;IAAQ,CAAC,GAAAD,KAAA;IAAA,oBACXvB,KAAA,CAAAmB,aAAA,CAAClB,GAAG;MAACwB,eAAe,EAAED,OAAO,GAAGR,KAAK,CAACQ,OAAO,CAACE,UAAU,GAAGV,KAAK,CAACW,OAAO,CAACD;IAAW,~~GACjFE~~,~~OAAO~~,~~CAACjB~~,UAAU,~~CAACkB~~,YAAY,~~CAAC~~,~~iBAC/B7B,~~KAAA,CAAAmB,aAAA,CAACjB,oBAAoB;~~MAAC4B~~,KAAK,EAAEC,MAAM,CAACC,OAAQ;MAACC,MAAM,EAAE;QAAEC,GAAG,~~EAAEvB~~,UAAU,~~CAACkB~~,YAAY,~~CAACP~~;MAAI;IAAE,EAC3F,eAEDtB,KAAA,CAAAmB,aAAA,CAAClB,GAAG;~~MACF6B~~,KAAK,EAAEC,MAAM,CAACI,WAAY;~~MAC1BV~~,eAAe,EAAEX,MAAM,CAAC;~~QAAEsB~~,IAAI,~~EAAEvB~~,OAAO,~~CAACwB~~,aAAa;QAAEC,KAAK,~~EAAEzB~~,OAAO,~~CAAC0B~~;MAAc,CAAC;IAAE,~~gBAEvFvC~~,KAAA,CAAAmB,aAAA,CAACf,IAAI;~~MAACoC~~,aAAa,EAAE,CAAE;MAACC,KAAK;~~MAACzB~~,KAAK,EAAED,MAAM,~~CAAC2B~~,cAAe;MAACZ,KAAK,EAAEC,MAAM,CAACY;IAAQ,GAC/~~EhC~~,UAAU,~~CAACiC~~,KAAK,CACZ,~~EACNhB~~,~~OAAO~~,~~CAACjB~~,UAAU,~~CAACkC~~,WAAW,~~CAAC~~,~~iBAC9B7C,~~KAAA,CAAAmB,aAAA,CAACf,IAAI;~~MAACoC~~,aAAa,EAAE,CAAE;MAACM,QAAQ;~~MAAC9B~~,KAAK,EAAED,MAAM,~~CAAC2B~~,cAAe;MAACZ,KAAK,EAAEC,MAAM,CAACgB;IAAO,~~GACjFpC~~,UAAU,~~CAACkC~~,WAAW,CAE1B,~~eACD7C~~,KAAA,CAAAmB,aAAA,CAACf,IAAI;~~MAACoC~~,aAAa,EAAE,CAAE;MAACM,QAAQ;~~MAAC9B~~,KAAK,EAAED,MAAM,~~CAACiC~~;IAAe,~~GAC3DrC~~,UAAU,CAACW,GAAG,CACV,CACH,CACF;EAAA,CACP,CACQ;AAEf,CAAC;AAED,~~MAAMS~~,MAAM,~~GAAG1B~~,gBAAgB,CAAC;~~EAC9B8B~~,WAAW,EAAE;IACXc,QAAQ,EAAE,QAAQ;IAClBC,iBAAiB,EAAE,EAAE;IACrBC,UAAU,EAAE,CAAC;IACbC,aAAa,EAAE;EACjB,CAAC;EACDpB,OAAO,EAAE;IACPqB,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLC,YAAY,EAAE;EAChB,CAAC;EACDd,OAAO,EAAE;IACPc,YAAY,EAAE;EAChB,CAAC;EACDV,MAAM,EAAE;IACNW,UAAU,EAAE,EAAE;IACdD,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAEF,~~eAAelD~~,gBAAgB"}
1	+ {"version":3,"names":["React","Box","ImageWithPlaceholder","PressBox","Text","createStyleSheet","useUIKitTheme","MessageOpenGraph","_ref","onPressURL","onLongPress","ogMetaData","variant","palette","select","colors","color","ui","groupChannelMessage","createElement","activeOpacity","onPress","url","_ref2","pressed","backgroundColor","background","enabled","defaultImage","style","styles","ogImage","source","uri","ogContainer","dark","background400","light","background100","numberOfLines","body2","onBackground01","ogTitle","title","description","caption2","ogDesc","onBackground02","overflow","paddingHorizontal","paddingTop","paddingBottom","maxWidth","width","height","ogUrl","marginBottom","lineHeight"],"sources":["MessageOpenGraph.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdUserMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nconst MessageOpenGraph = ({\n onPressURL,\n onLongPress,\n ogMetaData,\n variant,\n}: {\n ogMetaData: NonNullable<SendbirdUserMessage['ogMetaData']>;\n variant: 'outgoing' \| 'incoming';\n onPressURL?: (url: string) => void;\n onLongPress?: () => void;\n}) => {\n const { palette, select, colors } = useUIKitTheme();\n const color = colors.ui.groupChannelMessage[variant];\n\n return (\n <PressBox\n activeOpacity={0.85}\n onPress={() => typeof ogMetaData?.url === 'string' && onPressURL?.(ogMetaData.url)}\n onLongPress={onLongPress}\n >\n {({ pressed }) => (\n <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background}>\n {!!ogMetaData.defaultImage && (\n <ImageWithPlaceholder style={styles.ogImage} source={{ uri: ogMetaData.defaultImage.url }} />\n )}\n\n <Box\n style={styles.ogContainer}\n backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n >\n <Text numberOfLines={3} body2 color={colors.onBackground01} style={styles.ogTitle}>\n {ogMetaData.title}\n </Text>\n {!!ogMetaData.description && (\n <Text numberOfLines={1} caption2 color={colors.onBackground01} style={styles.ogDesc}>\n {ogMetaData.description}\n </Text>\n )}\n <Text numberOfLines={1} caption2 color={colors.onBackground02}>\n {ogMetaData.url}\n </Text>\n </Box>\n </Box>\n )}\n </PressBox>\n );\n};\n\nconst styles = createStyleSheet({\n ogContainer: {\n overflow: 'hidden',\n paddingHorizontal: 12,\n paddingTop: 8,\n paddingBottom: 12,\n },\n ogImage: {\n maxWidth: 240,\n width: 240,\n height: 136,\n },\n ogUrl: {\n marginBottom: 4,\n },\n ogTitle: {\n marginBottom: 4,\n },\n ogDesc: {\n lineHeight: 14,\n marginBottom: 8,\n },\n});\n\nexport default MessageOpenGraph;\n"],"mappings":"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"}