@sendbird/uikit-react-native-foundation 2.5.0 → 3.0.0-rc.0
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.
- package/README.md +4 -0
- package/lib/commonjs/components/ImageWithPlaceholder/index.js +7 -1
- package/lib/commonjs/components/ImageWithPlaceholder/index.js.map +1 -1
- package/lib/commonjs/components/RegexText/index.js.map +1 -1
- package/lib/commonjs/index.js +8 -8
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/types.js.map +1 -1
- package/lib/commonjs/ui/Avatar/AvatarGroup.js +1 -1
- package/lib/commonjs/ui/Avatar/AvatarGroup.js.map +1 -1
- package/lib/commonjs/ui/GroupChannelMessage/Message.admin.js +37 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.admin.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.image.js +54 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.image.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.js +80 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.video.js +120 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.file.video.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.unknown.js +54 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.unknown.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.user.js +44 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.user.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.user.og.js +59 -0
- package/lib/commonjs/ui/GroupChannelMessage/Message.user.og.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageBubbleWithText.js +74 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageBubbleWithText.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageContainer.js +110 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageContainer.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageOpenGraph.js +91 -0
- package/lib/commonjs/ui/GroupChannelMessage/MessageOpenGraph.js.map +1 -0
- package/lib/commonjs/ui/GroupChannelMessage/index.js +26 -0
- package/lib/commonjs/ui/GroupChannelMessage/index.js.map +1 -0
- package/lib/commonjs/ui/OpenChannelMessage/Message.user.js +1 -1
- package/lib/commonjs/ui/OpenChannelMessage/Message.user.js.map +1 -1
- package/lib/commonjs/ui/OpenChannelMessage/Message.user.og.js +5 -2
- package/lib/commonjs/ui/OpenChannelMessage/Message.user.og.js.map +1 -1
- package/lib/commonjs/ui/OpenChannelMessage/index.js.map +1 -1
- package/lib/module/components/ImageWithPlaceholder/index.js +7 -1
- package/lib/module/components/ImageWithPlaceholder/index.js.map +1 -1
- package/lib/module/components/RegexText/index.js.map +1 -1
- package/lib/module/index.js +2 -2
- package/lib/module/index.js.map +1 -1
- package/lib/module/types.js.map +1 -1
- package/lib/module/ui/Avatar/AvatarGroup.js +1 -1
- package/lib/module/ui/Avatar/AvatarGroup.js.map +1 -1
- package/lib/module/ui/GroupChannelMessage/Message.admin.js +29 -0
- package/lib/module/ui/GroupChannelMessage/Message.admin.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.image.js +46 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.image.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.js +72 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.video.js +110 -0
- package/lib/module/ui/GroupChannelMessage/Message.file.video.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.unknown.js +46 -0
- package/lib/module/ui/GroupChannelMessage/Message.unknown.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.user.js +36 -0
- package/lib/module/ui/GroupChannelMessage/Message.user.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/Message.user.og.js +51 -0
- package/lib/module/ui/GroupChannelMessage/Message.user.og.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/MessageBubbleWithText.js +66 -0
- package/lib/module/ui/GroupChannelMessage/MessageBubbleWithText.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/MessageContainer.js +102 -0
- package/lib/module/ui/GroupChannelMessage/MessageContainer.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/MessageOpenGraph.js +83 -0
- package/lib/module/ui/GroupChannelMessage/MessageOpenGraph.js.map +1 -0
- package/lib/module/ui/GroupChannelMessage/index.js +18 -0
- package/lib/module/ui/GroupChannelMessage/index.js.map +1 -0
- package/lib/module/ui/OpenChannelMessage/Message.user.js +1 -1
- package/lib/module/ui/OpenChannelMessage/Message.user.js.map +1 -1
- package/lib/module/ui/OpenChannelMessage/Message.user.og.js +5 -2
- package/lib/module/ui/OpenChannelMessage/Message.user.og.js.map +1 -1
- package/lib/module/ui/OpenChannelMessage/index.js.map +1 -1
- package/lib/typescript/src/components/RegexText/index.d.ts +2 -2
- package/lib/typescript/src/index.d.ts +4 -2
- package/lib/typescript/src/types.d.ts +1 -9
- package/lib/typescript/src/ui/GroupChannelMessage/Message.admin.d.ts +4 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.file.d.ts +5 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.file.image.d.ts +4 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.file.video.d.ts +9 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.unknown.d.ts +4 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.user.d.ts +9 -0
- package/lib/typescript/src/ui/GroupChannelMessage/Message.user.og.d.ts +9 -0
- package/lib/typescript/src/ui/GroupChannelMessage/MessageBubbleWithText.d.ts +10 -0
- package/lib/typescript/src/ui/GroupChannelMessage/MessageContainer.d.ts +9 -0
- package/lib/typescript/src/ui/GroupChannelMessage/MessageOpenGraph.d.ts +8 -0
- package/lib/typescript/src/ui/GroupChannelMessage/index.d.ts +191 -0
- package/lib/typescript/src/ui/OpenChannelMessage/index.d.ts +7 -7
- package/package.json +5 -6
- package/src/components/ImageWithPlaceholder/index.tsx +3 -2
- package/src/components/RegexText/index.tsx +2 -2
- package/src/index.ts +5 -2
- package/src/types.ts +1 -11
- package/src/ui/Avatar/AvatarGroup.tsx +1 -1
- package/src/ui/GroupChannelMessage/Message.admin.tsx +34 -0
- package/src/ui/GroupChannelMessage/Message.file.image.tsx +45 -0
- package/src/ui/GroupChannelMessage/Message.file.tsx +70 -0
- package/src/ui/GroupChannelMessage/Message.file.video.tsx +106 -0
- package/src/ui/GroupChannelMessage/Message.unknown.tsx +47 -0
- package/src/ui/GroupChannelMessage/Message.user.og.tsx +62 -0
- package/src/ui/GroupChannelMessage/Message.user.tsx +49 -0
- package/src/ui/GroupChannelMessage/MessageBubbleWithText.tsx +80 -0
- package/src/ui/GroupChannelMessage/MessageContainer.tsx +106 -0
- package/src/ui/GroupChannelMessage/MessageOpenGraph.tsx +84 -0
- package/src/ui/GroupChannelMessage/index.ts +48 -0
- package/src/ui/OpenChannelMessage/Message.user.og.tsx +6 -2
- package/src/ui/OpenChannelMessage/Message.user.tsx +1 -1
- package/src/ui/OpenChannelMessage/index.ts +1 -1
- package/lib/commonjs/components/URLParsedText/index.js +0 -46
- package/lib/commonjs/components/URLParsedText/index.js.map +0 -1
- package/lib/module/components/URLParsedText/index.js +0 -38
- package/lib/module/components/URLParsedText/index.js.map +0 -1
- package/lib/typescript/src/components/URLParsedText/index.d.ts +0 -8
- package/src/components/URLParsedText/index.tsx +0 -50
package/README.md
CHANGED
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
A foundational UI kit for building chat-enabled React Native apps.
|
|
4
4
|
|
|
5
|
+
This package is created and published for the dependency of UIKit for React-Native.
|
|
6
|
+
Therefore, we do not guarantee that this package will work in other environments.
|
|
7
|
+
If you use this package outside of UIKit for React-Native and encounter any issues, you will need to handle them on your own.
|
|
8
|
+
|
|
5
9
|
## Installation
|
|
6
10
|
|
|
7
11
|
```sh
|
|
@@ -17,6 +17,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
17
17
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
18
18
|
const useRetry = function (hasError) {
|
|
19
19
|
let retryCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
|
|
20
|
+
// NOTE: Glide(fast-image) will retry automatically on Android
|
|
20
21
|
if (_reactNative.Platform.OS === 'android') return '';
|
|
21
22
|
const forceUpdate = (0, _uikitUtils.useForceUpdate)();
|
|
22
23
|
const retryCountRef = (0, _react.useRef)(1);
|
|
@@ -41,6 +42,8 @@ const useRetry = function (hasError) {
|
|
|
41
42
|
};
|
|
42
43
|
const ImageWithPlaceholder = props => {
|
|
43
44
|
const {
|
|
45
|
+
palette,
|
|
46
|
+
select,
|
|
44
47
|
colors
|
|
45
48
|
} = (0, _useUIKitTheme.default)();
|
|
46
49
|
const [imageNotFound, setImageNotFound] = (0, _react.useState)(false);
|
|
@@ -51,7 +54,10 @@ const ImageWithPlaceholder = props => {
|
|
|
51
54
|
width: props.width,
|
|
52
55
|
height: props.height
|
|
53
56
|
}, props.style],
|
|
54
|
-
backgroundColor:
|
|
57
|
+
backgroundColor: select({
|
|
58
|
+
dark: palette.background400,
|
|
59
|
+
light: palette.background100
|
|
60
|
+
})
|
|
55
61
|
}, /*#__PURE__*/_react.default.createElement(_Image.default, {
|
|
56
62
|
key: key,
|
|
57
63
|
source: props.source,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_uikitUtils","_createStyleSheet","_interopRequireDefault","_useUIKitTheme","_Box","_Icon","_Image","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","useRetry","hasError","retryCount","arguments","length","undefined","Platform","OS","forceUpdate","useForceUpdate","retryCountRef","useRef","retryTimeoutRef","useEffect","reloadReservation","current","setTimeout","clearTimeout","ImageWithPlaceholder","props","colors","useUIKitTheme","imageNotFound","setImageNotFound","useState","createElement","style","overflow","width","height","backgroundColor","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_uikitUtils","_createStyleSheet","_interopRequireDefault","_useUIKitTheme","_Box","_Icon","_Image","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","useRetry","hasError","retryCount","arguments","length","undefined","Platform","OS","forceUpdate","useForceUpdate","retryCountRef","useRef","retryTimeoutRef","useEffect","reloadReservation","current","setTimeout","clearTimeout","ImageWithPlaceholder","props","palette","select","colors","useUIKitTheme","imageNotFound","setImageNotFound","useState","createElement","style","overflow","width","height","backgroundColor","dark","background400","light","background100","source","StyleSheet","absoluteFill","styles","hide","resizeMode","resizeMethod","onError","onLoad","containerStyle","icon","size","color","onBackground02","createStyleSheet","display","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Platform, StyleProp, StyleSheet, ViewStyle } from 'react-native';\n\nimport { useForceUpdate } from '@sendbird/uikit-utils';\n\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Box from '../Box';\nimport Icon from '../Icon';\nimport Image from '../Image';\n\nconst useRetry = (hasError: boolean, retryCount = 5) => {\n // NOTE: Glide(fast-image) will retry automatically on Android\n if (Platform.OS === 'android') return '';\n\n const forceUpdate = useForceUpdate();\n const retryCountRef = useRef(1);\n const retryTimeoutRef = useRef<NodeJS.Timeout>();\n\n useEffect(() => {\n if (hasError) {\n const reloadReservation = () => {\n if (retryCountRef.current < retryCount) {\n retryTimeoutRef.current = setTimeout(() => {\n retryCountRef.current++;\n reloadReservation();\n forceUpdate();\n }, retryCountRef.current * 5000);\n }\n };\n\n return reloadReservation();\n } else {\n return clearTimeout(retryTimeoutRef.current);\n }\n }, [hasError]);\n\n return retryCountRef.current;\n};\n\ntype Props = {\n source: number | { uri: string };\n width?: number | string;\n height?: number | string;\n style?: StyleProp<ViewStyle>;\n};\nconst ImageWithPlaceholder = (props: Props) => {\n const { palette, select, colors } = useUIKitTheme();\n const [imageNotFound, setImageNotFound] = useState(false);\n\n const key = useRetry(imageNotFound);\n return (\n <Box\n style={[{ overflow: 'hidden', width: props.width, height: props.height }, props.style]}\n backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n >\n <Image\n key={key}\n source={props.source}\n style={[StyleSheet.absoluteFill, imageNotFound && styles.hide]}\n resizeMode={'cover'}\n resizeMethod={'resize'}\n onError={() => setImageNotFound(true)}\n onLoad={() => setImageNotFound(false)}\n />\n {imageNotFound && (\n <Icon\n containerStyle={StyleSheet.absoluteFill}\n icon={'thumbnail-none'}\n size={48}\n color={colors.onBackground02}\n />\n )}\n </Box>\n );\n};\n\nconst styles = createStyleSheet({\n hide: {\n display: 'none',\n },\n});\n\nexport default ImageWithPlaceholder;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_uikitUtils","_Text","obj","__esModule","default","RegexText","_ref","children","patterns","props","length","createElement","Fragment","matchedTexts","forEach","_ref2","patterIndex","regex","replacer","matchedTextsTemp","concat","offset","text","index","replaceWithRegex","params","parentProps","keyPrefix","String","splice","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { replaceWithRegex } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../Text';\n\
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_uikitUtils","_Text","obj","__esModule","default","RegexText","_ref","children","patterns","props","length","createElement","Fragment","matchedTexts","forEach","_ref2","patterIndex","regex","replacer","matchedTextsTemp","concat","offset","text","index","replaceWithRegex","params","parentProps","keyPrefix","String","splice","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { replaceWithRegex } from '@sendbird/uikit-utils';\n\nimport Text, { TextProps } from '../Text';\n\nexport interface RegexTextPattern {\n regex: RegExp;\n replacer(params: {\n match: string;\n groups: string[];\n index: number;\n keyPrefix: string;\n parentProps?: TextProps;\n }): string | JSX.Element;\n}\n\ntype Props = { patterns: RegexTextPattern[] } & TextProps;\n\nconst RegexText = ({ children, patterns, ...props }: Props) => {\n if (patterns.length === 0 || typeof children !== 'string') return <>{children}</>;\n\n const matchedTexts: Array<string | JSX.Element> = [children];\n\n patterns.forEach(({ regex, replacer }, patterIndex) => {\n const matchedTextsTemp = matchedTexts.concat();\n let offset = 0;\n matchedTextsTemp.forEach((text, index) => {\n if (typeof text === 'string' && text) {\n const children = replaceWithRegex(\n text,\n regex,\n (params) => replacer({ ...params, parentProps: props, keyPrefix: index + params.keyPrefix }),\n String(patterIndex),\n );\n\n if (children.length > 1) {\n matchedTexts.splice(index + offset, 1, ...children);\n offset += children.length - 1;\n }\n }\n });\n });\n\n return <Text {...props}>{matchedTexts}</Text>;\n};\n\nexport default RegexText;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,WAAA,GAAAD,OAAA;AAEA,IAAAE,KAAA,GAAAH,sBAAA,CAAAC,OAAA;AAA0C,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAe1C,MAAMG,SAAS,GAAGC,IAAA,IAA6C;EAAA,IAA5C;IAAEC,QAAQ;IAAEC,QAAQ;IAAE,GAAGC;EAAa,CAAC,GAAAH,IAAA;EACxD,IAAIE,QAAQ,CAACE,MAAM,KAAK,CAAC,IAAI,OAAOH,QAAQ,KAAK,QAAQ,EAAE,oBAAOV,MAAA,CAAAO,OAAA,CAAAO,aAAA,CAAAd,MAAA,CAAAO,OAAA,CAAAQ,QAAA,QAAGL,QAAQ,CAAI;EAEjF,MAAMM,YAAyC,GAAG,CAACN,QAAQ,CAAC;EAE5DC,QAAQ,CAACM,OAAO,CAAC,CAAAC,KAAA,EAAsBC,WAAW,KAAK;IAAA,IAArC;MAAEC,KAAK;MAAEC;IAAS,CAAC,GAAAH,KAAA;IACnC,MAAMI,gBAAgB,GAAGN,YAAY,CAACO,MAAM,EAAE;IAC9C,IAAIC,MAAM,GAAG,CAAC;IACdF,gBAAgB,CAACL,OAAO,CAAC,CAACQ,IAAI,EAAEC,KAAK,KAAK;MACxC,IAAI,OAAOD,IAAI,KAAK,QAAQ,IAAIA,IAAI,EAAE;QACpC,MAAMf,QAAQ,GAAG,IAAAiB,4BAAgB,EAC/BF,IAAI,EACJL,KAAK,EACJQ,MAAM,IAAKP,QAAQ,CAAC;UAAE,GAAGO,MAAM;UAAEC,WAAW,EAAEjB,KAAK;UAAEkB,SAAS,EAAEJ,KAAK,GAAGE,MAAM,CAACE;QAAU,CAAC,CAAC,EAC5FC,MAAM,CAACZ,WAAW,CAAC,CACpB;QAED,IAAIT,QAAQ,CAACG,MAAM,GAAG,CAAC,EAAE;UACvBG,YAAY,CAACgB,MAAM,CAACN,KAAK,GAAGF,MAAM,EAAE,CAAC,EAAE,GAAGd,QAAQ,CAAC;UACnDc,MAAM,IAAId,QAAQ,CAACG,MAAM,GAAG,CAAC;QAC/B;MACF;IACF,CAAC,CAAC;EACJ,CAAC,CAAC;EAEF,oBAAOb,MAAA,CAAAO,OAAA,CAAAO,aAAA,CAACV,KAAA,CAAAG,OAAI,EAAKK,KAAK,EAAGI,YAAY,CAAQ;AAC/C,CAAC;AAAC,IAAAiB,QAAA,GAEazB,SAAS;AAAA0B,OAAA,CAAA3B,OAAA,GAAA0B,QAAA"}
|
package/lib/commonjs/index.js
CHANGED
|
@@ -69,6 +69,12 @@ Object.defineProperty(exports, "Divider", {
|
|
|
69
69
|
return _Divider.default;
|
|
70
70
|
}
|
|
71
71
|
});
|
|
72
|
+
Object.defineProperty(exports, "GroupChannelMessage", {
|
|
73
|
+
enumerable: true,
|
|
74
|
+
get: function () {
|
|
75
|
+
return _GroupChannelMessage.default;
|
|
76
|
+
}
|
|
77
|
+
});
|
|
72
78
|
Object.defineProperty(exports, "GroupChannelPreview", {
|
|
73
79
|
enumerable: true,
|
|
74
80
|
get: function () {
|
|
@@ -237,12 +243,6 @@ Object.defineProperty(exports, "UIKitThemeProvider", {
|
|
|
237
243
|
return _UIKitThemeProvider.default;
|
|
238
244
|
}
|
|
239
245
|
});
|
|
240
|
-
Object.defineProperty(exports, "URLParsedText", {
|
|
241
|
-
enumerable: true,
|
|
242
|
-
get: function () {
|
|
243
|
-
return _URLParsedText.default;
|
|
244
|
-
}
|
|
245
|
-
});
|
|
246
246
|
Object.defineProperty(exports, "createScaleFactor", {
|
|
247
247
|
enumerable: true,
|
|
248
248
|
get: function () {
|
|
@@ -333,7 +333,6 @@ var _RegexText = _interopRequireDefault(require("./components/RegexText"));
|
|
|
333
333
|
var _Switch = _interopRequireDefault(require("./components/Switch"));
|
|
334
334
|
var _Text = _interopRequireDefault(require("./components/Text"));
|
|
335
335
|
var _TextInput = _interopRequireDefault(require("./components/TextInput"));
|
|
336
|
-
var _URLParsedText = _interopRequireDefault(require("./components/URLParsedText"));
|
|
337
336
|
var _ActionMenu = _interopRequireDefault(require("./ui/ActionMenu"));
|
|
338
337
|
var _Alert = _interopRequireDefault(require("./ui/Alert"));
|
|
339
338
|
var _Avatar = _interopRequireDefault(require("./ui/Avatar"));
|
|
@@ -342,10 +341,11 @@ var _BottomSheet = _interopRequireDefault(require("./ui/BottomSheet"));
|
|
|
342
341
|
var _Button = _interopRequireDefault(require("./ui/Button"));
|
|
343
342
|
var _ChannelFrozenBanner = _interopRequireDefault(require("./ui/ChannelFrozenBanner"));
|
|
344
343
|
var _Dialog = require("./ui/Dialog");
|
|
345
|
-
var _GroupChannelPreview = _interopRequireDefault(require("./ui/GroupChannelPreview"));
|
|
346
344
|
var _Header = _interopRequireDefault(require("./ui/Header"));
|
|
347
345
|
var _LoadingSpinner = _interopRequireDefault(require("./ui/LoadingSpinner"));
|
|
348
346
|
var _MenuBar = _interopRequireDefault(require("./ui/MenuBar"));
|
|
347
|
+
var _GroupChannelMessage = _interopRequireDefault(require("./ui/GroupChannelMessage"));
|
|
348
|
+
var _GroupChannelPreview = _interopRequireDefault(require("./ui/GroupChannelPreview"));
|
|
349
349
|
var _OpenChannelMessage = _interopRequireDefault(require("./ui/OpenChannelMessage"));
|
|
350
350
|
var _OpenChannelPreview = _interopRequireDefault(require("./ui/OpenChannelPreview"));
|
|
351
351
|
var _OutlinedButton = _interopRequireDefault(require("./ui/OutlinedButton"));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_icon","_interopRequireDefault","require","_Box","_Divider","_Icon","_Image","_ImageWithPlaceholder","_Modal","_PressBox","_RegexText","_Switch","_Text","_TextInput","
|
|
1
|
+
{"version":3,"names":["_icon","_interopRequireDefault","require","_Box","_Divider","_Icon","_Image","_ImageWithPlaceholder","_Modal","_PressBox","_RegexText","_Switch","_Text","_TextInput","_ActionMenu","_Alert","_Avatar","_Badge","_BottomSheet","_Button","_ChannelFrozenBanner","_Dialog","_Header","_LoadingSpinner","_MenuBar","_GroupChannelMessage","_GroupChannelPreview","_OpenChannelMessage","_OpenChannelPreview","_OutlinedButton","_Placeholder","_ProfileCard","_Prompt","_Toast","_interopRequireWildcard","_createSelectByColorScheme","_createScaleFactor","_createStyleSheet","_createTypography","_getDefaultHeaderHeight","_HeaderStyleContext","_useHeaderStyle","_createTheme","_DarkUIKitTheme","_LightUIKitTheme","_Palette","_UIKitThemeContext","_UIKitThemeProvider","_useUIKitTheme","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set"],"sources":["index.ts"],"sourcesContent":["/** Assets **/\nexport { default as IconAssets } from './assets/icon';\n\n/** Component **/\nexport { default as Box } from './components/Box';\nexport { default as Divider } from './components/Divider';\nexport { default as Icon } from './components/Icon';\nexport { default as Image } from './components/Image';\nexport { default as ImageWithPlaceholder } from './components/ImageWithPlaceholder';\nexport { default as Modal } from './components/Modal';\nexport { default as PressBox } from './components/PressBox';\nexport { default as RegexText } from './components/RegexText';\nexport type { RegexTextPattern } from './components/RegexText';\nexport { default as Switch } from './components/Switch';\nexport { default as Text } from './components/Text';\nexport { default as TextInput } from './components/TextInput';\n\n/** UI **/\nexport { default as ActionMenu } from './ui/ActionMenu';\nexport { default as Alert } from './ui/Alert';\nexport { default as Avatar } from './ui/Avatar';\nexport { default as Badge } from './ui/Badge';\nexport { default as BottomSheet } from './ui/BottomSheet';\nexport { default as Button } from './ui/Button';\nexport { default as ChannelFrozenBanner } from './ui/ChannelFrozenBanner';\nexport { DialogProvider, useActionMenu, useAlert, usePrompt, useBottomSheet } from './ui/Dialog';\nexport { default as Header } from './ui/Header';\nexport { default as LoadingSpinner } from './ui/LoadingSpinner';\nexport { default as MenuBar } from './ui/MenuBar';\nexport type { MenuBarProps } from './ui/MenuBar';\nexport { default as GroupChannelMessage } from './ui/GroupChannelMessage';\nexport type { GroupChannelMessageProps } from './ui/GroupChannelMessage';\nexport { default as GroupChannelPreview } from './ui/GroupChannelPreview';\n\nexport { default as OpenChannelMessage } from './ui/OpenChannelMessage';\nexport type { OpenChannelMessageProps } from './ui/OpenChannelMessage';\nexport { default as OpenChannelPreview } from './ui/OpenChannelPreview';\nexport { default as OutlinedButton } from './ui/OutlinedButton';\nexport { default as Placeholder } from './ui/Placeholder';\nexport { default as ProfileCard } from './ui/ProfileCard';\nexport { default as Prompt } from './ui/Prompt';\nexport { default as Toast, useToast, ToastProvider } from './ui/Toast';\n\n/** Styles **/\nexport { default as createSelectByColorScheme } from './styles/createSelectByColorScheme';\nexport { default as createScaleFactor } from './styles/createScaleFactor';\nexport { default as createStyleSheet } from './styles/createStyleSheet';\nexport { default as createTypography } from './styles/createTypography';\nexport { default as getDefaultHeaderHeight } from './styles/getDefaultHeaderHeight';\nexport { HeaderStyleContext, HeaderStyleProvider } from './styles/HeaderStyleContext';\nexport { default as useHeaderStyle } from './styles/useHeaderStyle';\n\n/** Theme **/\nexport { default as createTheme } from './theme/createTheme';\nexport { default as DarkUIKitTheme } from './theme/DarkUIKitTheme';\nexport { default as LightUIKitTheme } from './theme/LightUIKitTheme';\nexport { default as Palette } from './theme/Palette';\nexport { default as UIKitThemeContext } from './theme/UIKitThemeContext';\nexport { default as UIKitThemeProvider } from './theme/UIKitThemeProvider';\nexport { default as useUIKitTheme } from './theme/useUIKitTheme';\n\n/** Types **/\nexport type {\n TypoName,\n UIKitTheme,\n UIKitTypography,\n FontAttributes,\n BaseHeaderProps,\n UIKitColorScheme,\n UIKitColors,\n ComponentColorTree,\n UIKitPalette,\n HeaderElement,\n HeaderPartProps,\n ComponentColors,\n Component,\n GetColorTree,\n} from './types';\nexport type { ActionMenuItem } from './ui/ActionMenu';\nexport type { BottomSheetItem } from './ui/BottomSheet';\nexport type { UIKitTypographyOverrides } from './styles/createTypography';\nexport type { HeaderStyleContextType } from './styles/HeaderStyleContext';\n"],"mappings":"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"}
|
|
@@ -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'
|
|
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":""}
|
|
@@ -78,7 +78,7 @@ const getWidthPoint = (idx, total) => {
|
|
|
78
78
|
return 0.5;
|
|
79
79
|
};
|
|
80
80
|
const getTopPoint = (idx, total) => {
|
|
81
|
-
if (total === 2) return
|
|
81
|
+
if (total === 2) return 0;
|
|
82
82
|
if (total === 3 && idx === 0) return -0.025;
|
|
83
83
|
if (total === 3 && idx !== 0) return 0.525;
|
|
84
84
|
if (idx === 0 || idx === 1) return -0.025;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","obj","__esModule","default","MAX","AvatarGroup","_ref","children","containerStyle","size","childAmount","React","Children","count","createElement","View","style","overflow","width","height","borderRadius","backgroundColor","renderAvatars","_React$Children$map","map","child","index","isValidElement","cloneElement","top","getTopPoint","left","getLeftPoint","getWidthPoint","getHeightPoint","innerLeft","getInnerLeft","innerTop","getInnerTop","position","square","slice","_","total","idx","_default","exports"],"sources":["AvatarGroup.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nconst MAX = 4;\n\ntype Props = React.PropsWithChildren<{\n size?: number;\n containerStyle?: StyleProp<ViewStyle>;\n}>;\nconst AvatarGroup = ({ children, containerStyle, size = 56 }: Props) => {\n const childAmount = React.Children.count(children);\n\n if (childAmount === 0) {\n return (\n <View\n style={[\n containerStyle,\n {\n overflow: 'hidden',\n width: size,\n height: size,\n borderRadius: size,\n backgroundColor: 'rgba(120,120,120,0.2)',\n },\n ]}\n />\n );\n }\n\n const renderAvatars = () => {\n return (\n React.Children.map(children, (child, index) => {\n if (index + 1 > MAX) return child;\n if (!React.isValidElement(child)) return child;\n\n if (childAmount === 1) return React.cloneElement(child as ReactElement, { size, containerStyle });\n\n const top = getTopPoint(index, childAmount) * size;\n const left = getLeftPoint(index) * size;\n const width = getWidthPoint(index, childAmount) * size;\n const height = getHeightPoint(index, childAmount) * size;\n const innerLeft = -getInnerLeft(index, childAmount) * size;\n const innerTop = -getInnerTop(childAmount) * size;\n\n return (\n <View style={{ overflow: 'hidden', position: 'absolute', top, left, width, height }}>\n {React.cloneElement(child as ReactElement, {\n size,\n square: true,\n containerStyle: { left: innerLeft, top: innerTop },\n })}\n </View>\n );\n })?.slice(0, 4) ?? []\n );\n };\n\n return (\n <View style={[containerStyle, { overflow: 'hidden', width: size, height: size, borderRadius: size }]}>\n {renderAvatars()}\n </View>\n );\n};\n\nconst getHeightPoint = (_: number, total: number) => {\n if (total === 2) return 1;\n return 0.5;\n};\nconst getWidthPoint = (idx: number, total: number) => {\n if (total === 3 && idx === 0) return 1;\n return 0.5;\n};\nconst getTopPoint = (idx: number, total: number) => {\n if (total === 2) return
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","obj","__esModule","default","MAX","AvatarGroup","_ref","children","containerStyle","size","childAmount","React","Children","count","createElement","View","style","overflow","width","height","borderRadius","backgroundColor","renderAvatars","_React$Children$map","map","child","index","isValidElement","cloneElement","top","getTopPoint","left","getLeftPoint","getWidthPoint","getHeightPoint","innerLeft","getInnerLeft","innerTop","getInnerTop","position","square","slice","_","total","idx","_default","exports"],"sources":["AvatarGroup.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nconst MAX = 4;\n\ntype Props = React.PropsWithChildren<{\n size?: number;\n containerStyle?: StyleProp<ViewStyle>;\n}>;\nconst AvatarGroup = ({ children, containerStyle, size = 56 }: Props) => {\n const childAmount = React.Children.count(children);\n\n if (childAmount === 0) {\n return (\n <View\n style={[\n containerStyle,\n {\n overflow: 'hidden',\n width: size,\n height: size,\n borderRadius: size,\n backgroundColor: 'rgba(120,120,120,0.2)',\n },\n ]}\n />\n );\n }\n\n const renderAvatars = () => {\n return (\n React.Children.map(children, (child, index) => {\n if (index + 1 > MAX) return child;\n if (!React.isValidElement(child)) return child;\n\n if (childAmount === 1) return React.cloneElement(child as ReactElement, { size, containerStyle });\n\n const top = getTopPoint(index, childAmount) * size;\n const left = getLeftPoint(index) * size;\n const width = getWidthPoint(index, childAmount) * size;\n const height = getHeightPoint(index, childAmount) * size;\n const innerLeft = -getInnerLeft(index, childAmount) * size;\n const innerTop = -getInnerTop(childAmount) * size;\n\n return (\n <View style={{ overflow: 'hidden', position: 'absolute', top, left, width, height }}>\n {React.cloneElement(child as ReactElement, {\n size,\n square: true,\n containerStyle: { left: innerLeft, top: innerTop },\n })}\n </View>\n );\n })?.slice(0, 4) ?? []\n );\n };\n\n return (\n <View style={[containerStyle, { overflow: 'hidden', width: size, height: size, borderRadius: size }]}>\n {renderAvatars()}\n </View>\n );\n};\n\nconst getHeightPoint = (_: number, total: number) => {\n if (total === 2) return 1;\n return 0.5;\n};\nconst getWidthPoint = (idx: number, total: number) => {\n if (total === 3 && idx === 0) return 1;\n return 0.5;\n};\nconst getTopPoint = (idx: number, total: number) => {\n if (total === 2) return 0;\n if (total === 3 && idx === 0) return -0.025;\n if (total === 3 && idx !== 0) return 0.525;\n if (idx === 0 || idx === 1) return -0.025;\n return 0.525;\n};\nconst getLeftPoint = (idx: number) => {\n if (idx === 0 || idx === 2) return -0.025;\n return 0.525;\n};\nconst getInnerLeft = (idx: number, total: number) => {\n if (total === 3 && idx === 0) return 0;\n return 0.25;\n};\nconst getInnerTop = (total: number) => {\n if (total === 2) return 0;\n return 0.25;\n};\n\nexport default AvatarGroup;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _Box = _interopRequireDefault(require("../../components/Box"));
|
|
9
|
+
var _Text = _interopRequireDefault(require("../../components/Text"));
|
|
10
|
+
var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
|
|
11
|
+
var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
const AdminMessage = props => {
|
|
14
|
+
const {
|
|
15
|
+
colors
|
|
16
|
+
} = (0, _useUIKitTheme.default)();
|
|
17
|
+
return /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
18
|
+
style: styles.container
|
|
19
|
+
}, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
20
|
+
caption2: true,
|
|
21
|
+
color: colors.onBackground02,
|
|
22
|
+
style: styles.text
|
|
23
|
+
}, props.message.message));
|
|
24
|
+
};
|
|
25
|
+
const styles = (0, _createStyleSheet.default)({
|
|
26
|
+
container: {
|
|
27
|
+
width: 300,
|
|
28
|
+
alignSelf: 'center',
|
|
29
|
+
alignItems: 'center'
|
|
30
|
+
},
|
|
31
|
+
text: {
|
|
32
|
+
textAlign: 'center'
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
var _default = AdminMessage;
|
|
36
|
+
exports.default = _default;
|
|
37
|
+
//# sourceMappingURL=Message.admin.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_Box","_Text","_createStyleSheet","_useUIKitTheme","obj","__esModule","default","AdminMessage","props","colors","useUIKitTheme","createElement","style","styles","container","caption2","color","onBackground02","text","message","createStyleSheet","width","alignSelf","alignItems","textAlign","_default","exports"],"sources":["Message.admin.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdAdminMessage } 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 type { GroupChannelMessageProps } from './index';\n\nconst AdminMessage = (props: GroupChannelMessageProps<SendbirdAdminMessage>) => {\n const { colors } = useUIKitTheme();\n\n return (\n <Box style={styles.container}>\n <Text caption2 color={colors.onBackground02} style={styles.text}>\n {props.message.message}\n </Text>\n </Box>\n );\n};\n\nconst styles = createStyleSheet({\n container: {\n width: 300,\n alignSelf: 'center',\n alignItems: 'center',\n },\n text: {\n textAlign: 'center',\n },\n});\n\nexport default AdminMessage;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,KAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,iBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,cAAA,GAAAL,sBAAA,CAAAC,OAAA;AAAsD,SAAAD,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAGtD,MAAMG,YAAY,GAAIC,KAAqD,IAAK;EAC9E,MAAM;IAAEC;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAElC,oBACEb,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACX,IAAA,CAAAM,OAAG;IAACM,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC3BjB,MAAA,CAAAS,OAAA,CAAAK,aAAA,CAACV,KAAA,CAAAK,OAAI;IAACS,QAAQ;IAACC,KAAK,EAAEP,MAAM,CAACQ,cAAe;IAACL,KAAK,EAAEC,MAAM,CAACK;EAAK,GAC7DV,KAAK,CAACW,OAAO,CAACA,OAAO,CACjB,CACH;AAEV,CAAC;AAED,MAAMN,MAAM,GAAG,IAAAO,yBAAgB,EAAC;EAC9BN,SAAS,EAAE;IACTO,KAAK,EAAE,GAAG;IACVC,SAAS,EAAE,QAAQ;IACnBC,UAAU,EAAE;EACd,CAAC;EACDL,IAAI,EAAE;IACJM,SAAS,EAAE;EACb;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEYlB,YAAY;AAAAmB,OAAA,CAAApB,OAAA,GAAAmB,QAAA"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _uikitUtils = require("@sendbird/uikit-utils");
|
|
9
|
+
var _Box = _interopRequireDefault(require("../../components/Box"));
|
|
10
|
+
var _ImageWithPlaceholder = _interopRequireDefault(require("../../components/ImageWithPlaceholder"));
|
|
11
|
+
var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
|
|
12
|
+
var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
|
|
13
|
+
var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
|
|
14
|
+
var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
|
+
const ImageFileMessage = props => {
|
|
17
|
+
const {
|
|
18
|
+
onPress,
|
|
19
|
+
onLongPress,
|
|
20
|
+
variant = 'incoming'
|
|
21
|
+
} = props;
|
|
22
|
+
const {
|
|
23
|
+
colors
|
|
24
|
+
} = (0, _useUIKitTheme.default)();
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
26
|
+
style: styles.container,
|
|
27
|
+
backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
|
|
28
|
+
}, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
|
|
29
|
+
activeOpacity: 0.8,
|
|
30
|
+
onPress: onPress,
|
|
31
|
+
onLongPress: onLongPress
|
|
32
|
+
}, /*#__PURE__*/_react.default.createElement(_ImageWithPlaceholder.default, {
|
|
33
|
+
source: {
|
|
34
|
+
uri: (0, _uikitUtils.getAvailableUriFromFileMessage)(props.message)
|
|
35
|
+
},
|
|
36
|
+
style: styles.image
|
|
37
|
+
})), props.children));
|
|
38
|
+
};
|
|
39
|
+
const styles = (0, _createStyleSheet.default)({
|
|
40
|
+
container: {
|
|
41
|
+
borderRadius: 16,
|
|
42
|
+
overflow: 'hidden'
|
|
43
|
+
},
|
|
44
|
+
image: {
|
|
45
|
+
maxWidth: 240,
|
|
46
|
+
width: 240,
|
|
47
|
+
height: 160,
|
|
48
|
+
borderRadius: 16,
|
|
49
|
+
overflow: 'hidden'
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
var _default = ImageFileMessage;
|
|
53
|
+
exports.default = _default;
|
|
54
|
+
//# sourceMappingURL=Message.file.image.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_uikitUtils","_Box","_ImageWithPlaceholder","_PressBox","_createStyleSheet","_useUIKitTheme","_MessageContainer","obj","__esModule","default","ImageFileMessage","props","onPress","onLongPress","variant","colors","useUIKitTheme","createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","source","uri","getAvailableUriFromFileMessage","message","image","children","createStyleSheet","borderRadius","overflow","maxWidth","width","height","_default","exports"],"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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAGA,IAAAC,WAAA,GAAAD,OAAA;AAEA,IAAAE,IAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,qBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,SAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,iBAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,cAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,iBAAA,GAAAR,sBAAA,CAAAC,OAAA;AAAkD,SAAAD,uBAAAS,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAGlD,MAAMG,gBAAgB,GAAIC,KAAoD,IAAK;EACjF,MAAM;IAAEC,OAAO;IAAEC,WAAW;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGH,KAAK;EAE5D,MAAM;IAAEI;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAElC,oBACEnB,MAAA,CAAAY,OAAA,CAAAQ,aAAA,CAACX,iBAAA,CAAAG,OAAgB,EAAKE,KAAK,eACzBd,MAAA,CAAAY,OAAA,CAAAQ,aAAA,CAAChB,IAAA,CAAAQ,OAAG;IAACS,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,EAAEN,MAAM,CAACO,EAAE,CAACC,mBAAmB,CAACT,OAAO,CAAC,CAACU,OAAO,CAACC;EAAW,gBACvG5B,MAAA,CAAAY,OAAA,CAAAQ,aAAA,CAACd,SAAA,CAAAM,OAAQ;IAACiB,aAAa,EAAE,GAAI;IAACd,OAAO,EAAEA,OAAQ;IAACC,WAAW,EAAEA;EAAY,gBACvEhB,MAAA,CAAAY,OAAA,CAAAQ,aAAA,CAACf,qBAAA,CAAAO,OAAoB;IAACkB,MAAM,EAAE;MAAEC,GAAG,EAAE,IAAAC,0CAA8B,EAAClB,KAAK,CAACmB,OAAO;IAAE,CAAE;IAACZ,KAAK,EAAEC,MAAM,CAACY;EAAM,EAAG,CACpG,EACVpB,KAAK,CAACqB,QAAQ,CACX,CACW;AAEvB,CAAC;AAED,MAAMb,MAAM,GAAG,IAAAc,yBAAgB,EAAC;EAC9Bb,SAAS,EAAE;IACTc,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDJ,KAAK,EAAE;IACLK,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAAC,IAAAI,QAAA,GAEY7B,gBAAgB;AAAA8B,OAAA,CAAA/B,OAAA,GAAA8B,QAAA"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _uikitUtils = require("@sendbird/uikit-utils");
|
|
9
|
+
var _Box = _interopRequireDefault(require("../../components/Box"));
|
|
10
|
+
var _Icon = _interopRequireDefault(require("../../components/Icon"));
|
|
11
|
+
var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
|
|
12
|
+
var _Text = _interopRequireDefault(require("../../components/Text"));
|
|
13
|
+
var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
|
|
14
|
+
var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
|
|
15
|
+
var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
const iconMapper = {
|
|
18
|
+
audio: 'file-audio',
|
|
19
|
+
image: 'photo',
|
|
20
|
+
video: 'play',
|
|
21
|
+
file: 'file-document'
|
|
22
|
+
};
|
|
23
|
+
const FileMessage = props => {
|
|
24
|
+
const {
|
|
25
|
+
variant = 'incoming'
|
|
26
|
+
} = props;
|
|
27
|
+
const {
|
|
28
|
+
colors
|
|
29
|
+
} = (0, _useUIKitTheme.default)();
|
|
30
|
+
const fileType = (0, _uikitUtils.getFileType)(props.message.type || (0, _uikitUtils.getFileExtension)(props.message.name));
|
|
31
|
+
const color = colors.ui.groupChannelMessage[variant];
|
|
32
|
+
return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
|
|
33
|
+
onPress: props.onPress,
|
|
34
|
+
onLongPress: props.onLongPress
|
|
35
|
+
}, _ref => {
|
|
36
|
+
var _props$strings;
|
|
37
|
+
let {
|
|
38
|
+
pressed
|
|
39
|
+
} = _ref;
|
|
40
|
+
return /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
41
|
+
backgroundColor: pressed ? color.pressed.background : color.enabled.background,
|
|
42
|
+
style: styles.container
|
|
43
|
+
}, /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
44
|
+
style: styles.bubble
|
|
45
|
+
}, /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
46
|
+
icon: iconMapper[fileType],
|
|
47
|
+
size: 24,
|
|
48
|
+
containerStyle: {
|
|
49
|
+
backgroundColor: colors.background,
|
|
50
|
+
padding: 2,
|
|
51
|
+
borderRadius: 8,
|
|
52
|
+
marginRight: 8
|
|
53
|
+
}
|
|
54
|
+
}), /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
55
|
+
body3: true,
|
|
56
|
+
ellipsizeMode: 'middle',
|
|
57
|
+
numberOfLines: 1,
|
|
58
|
+
color: pressed ? color.pressed.textMsg : color.enabled.textMsg,
|
|
59
|
+
style: styles.name
|
|
60
|
+
}, ((_props$strings = props.strings) === null || _props$strings === void 0 ? void 0 : _props$strings.fileName) || props.message.name)), props.children);
|
|
61
|
+
}));
|
|
62
|
+
};
|
|
63
|
+
const styles = (0, _createStyleSheet.default)({
|
|
64
|
+
container: {
|
|
65
|
+
overflow: 'hidden',
|
|
66
|
+
borderRadius: 16
|
|
67
|
+
},
|
|
68
|
+
bubble: {
|
|
69
|
+
flexDirection: 'row',
|
|
70
|
+
alignItems: 'center',
|
|
71
|
+
paddingHorizontal: 12,
|
|
72
|
+
paddingVertical: 6
|
|
73
|
+
},
|
|
74
|
+
name: {
|
|
75
|
+
flexShrink: 1
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
var _default = FileMessage;
|
|
79
|
+
exports.default = _default;
|
|
80
|
+
//# sourceMappingURL=Message.file.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_uikitUtils","_Box","_Icon","_PressBox","_Text","_createStyleSheet","_useUIKitTheme","_MessageContainer","obj","__esModule","default","iconMapper","audio","image","video","file","FileMessage","props","variant","colors","useUIKitTheme","fileType","getFileType","message","type","getFileExtension","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","createStyleSheet","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink","_default","exports"],"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":"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"}
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _uikitUtils = require("@sendbird/uikit-utils");
|
|
10
|
+
var _Box = _interopRequireDefault(require("../../components/Box"));
|
|
11
|
+
var _Icon = _interopRequireDefault(require("../../components/Icon"));
|
|
12
|
+
var _ImageWithPlaceholder = _interopRequireDefault(require("../../components/ImageWithPlaceholder"));
|
|
13
|
+
var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
|
|
14
|
+
var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
|
|
15
|
+
var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
|
|
16
|
+
var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
|
|
17
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
19
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
20
|
+
const VideoFileMessage = props => {
|
|
21
|
+
const {
|
|
22
|
+
onPress,
|
|
23
|
+
onLongPress,
|
|
24
|
+
variant = 'incoming'
|
|
25
|
+
} = props;
|
|
26
|
+
const {
|
|
27
|
+
colors,
|
|
28
|
+
palette,
|
|
29
|
+
select
|
|
30
|
+
} = (0, _useUIKitTheme.default)();
|
|
31
|
+
const uri = (0, _uikitUtils.getAvailableUriFromFileMessage)(props.message);
|
|
32
|
+
const {
|
|
33
|
+
thumbnail,
|
|
34
|
+
loading
|
|
35
|
+
} = useRetry(() => props.fetchThumbnailFromVideoSource(uri));
|
|
36
|
+
return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
37
|
+
style: styles.container,
|
|
38
|
+
backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
|
|
39
|
+
}, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
|
|
40
|
+
activeOpacity: 0.8,
|
|
41
|
+
onPress: onPress,
|
|
42
|
+
onLongPress: onLongPress,
|
|
43
|
+
style: styles.image
|
|
44
|
+
}, loading ? /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
45
|
+
style: _reactNative.StyleSheet.absoluteFill,
|
|
46
|
+
backgroundColor: select({
|
|
47
|
+
dark: palette.background400,
|
|
48
|
+
light: palette.background100
|
|
49
|
+
})
|
|
50
|
+
}) : /*#__PURE__*/_react.default.createElement(_ImageWithPlaceholder.default, {
|
|
51
|
+
source: {
|
|
52
|
+
uri: thumbnail ?? 'invalid-image'
|
|
53
|
+
},
|
|
54
|
+
style: _reactNative.StyleSheet.absoluteFill
|
|
55
|
+
}), (loading || thumbnail !== null) && /*#__PURE__*/_react.default.createElement(_Box.default, {
|
|
56
|
+
style: _reactNative.StyleSheet.absoluteFill,
|
|
57
|
+
alignItems: 'center',
|
|
58
|
+
justifyContent: 'center'
|
|
59
|
+
}, /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
60
|
+
icon: 'play',
|
|
61
|
+
size: 28,
|
|
62
|
+
color: palette.onBackgroundLight02,
|
|
63
|
+
containerStyle: [styles.playIcon, {
|
|
64
|
+
backgroundColor: palette.onBackgroundDark01
|
|
65
|
+
}]
|
|
66
|
+
}))), props.children));
|
|
67
|
+
};
|
|
68
|
+
const useRetry = function (fetch) {
|
|
69
|
+
let retryCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
|
|
70
|
+
const [state, setState] = (0, _react.useState)({
|
|
71
|
+
thumbnail: null,
|
|
72
|
+
loading: true
|
|
73
|
+
});
|
|
74
|
+
const retryCountRef = (0, _react.useRef)(0);
|
|
75
|
+
const retryTimeoutRef = (0, _react.useRef)();
|
|
76
|
+
const fetchThumbnail = (0, _react.useRef)(fetch);
|
|
77
|
+
fetchThumbnail.current = fetch;
|
|
78
|
+
(0, _react.useEffect)(() => {
|
|
79
|
+
if (!state.thumbnail) {
|
|
80
|
+
const reloadReservation = () => {
|
|
81
|
+
if (retryCountRef.current < retryCount) {
|
|
82
|
+
retryTimeoutRef.current = setTimeout(() => {
|
|
83
|
+
retryCountRef.current++;
|
|
84
|
+
reloadReservation();
|
|
85
|
+
fetchThumbnail.current().then(result => {
|
|
86
|
+
setState({
|
|
87
|
+
loading: false,
|
|
88
|
+
thumbnail: (result === null || result === void 0 ? void 0 : result.path) ?? null
|
|
89
|
+
});
|
|
90
|
+
});
|
|
91
|
+
}, retryCountRef.current * 5000);
|
|
92
|
+
}
|
|
93
|
+
};
|
|
94
|
+
return reloadReservation();
|
|
95
|
+
} else {
|
|
96
|
+
return clearTimeout(retryTimeoutRef.current);
|
|
97
|
+
}
|
|
98
|
+
}, [state.thumbnail]);
|
|
99
|
+
return state;
|
|
100
|
+
};
|
|
101
|
+
const styles = (0, _createStyleSheet.default)({
|
|
102
|
+
container: {
|
|
103
|
+
borderRadius: 16,
|
|
104
|
+
overflow: 'hidden'
|
|
105
|
+
},
|
|
106
|
+
image: {
|
|
107
|
+
maxWidth: 240,
|
|
108
|
+
width: 240,
|
|
109
|
+
height: 160,
|
|
110
|
+
borderRadius: 16,
|
|
111
|
+
overflow: 'hidden'
|
|
112
|
+
},
|
|
113
|
+
playIcon: {
|
|
114
|
+
padding: 10,
|
|
115
|
+
borderRadius: 50
|
|
116
|
+
}
|
|
117
|
+
});
|
|
118
|
+
var _default = VideoFileMessage;
|
|
119
|
+
exports.default = _default;
|
|
120
|
+
//# sourceMappingURL=Message.file.video.js.map
|